feat: UI/UX improvements and unified schema selector

backend/backend/core/models/project_details.py

@@ -102,7 +102,7 @@ def delete(self, *args, **kwargs):
     project_path = models.CharField(max_length=100)
     profile_path = models.CharField(max_length=100)
 
-    project_schema = models.CharField(max_length=20, blank=True, null=True)
+    project_schema = models.CharField(max_length=1024, blank=True, null=True)
     # User specific access control fields
     created_by = models.JSONField(default=dict)
     created_at = models.DateTimeField(auto_now_add=True)

frontend/src/base/components/project-list/ProjectListCard.css

@@ -9,6 +9,7 @@
   background-color: var(--project-detail-bg);
   position: relative;
   overflow: hidden;
+  cursor: pointer;
 }
 
 .project-list-card-wrapper:hover {
@@ -171,7 +172,7 @@
 
 /* ---------- body ---------- */
 .project-list-card-clickable-content {
-  cursor: pointer;
+  /* clickable via parent wrapper */
 }
 
 .project-list-card-detail-section {

frontend/src/base/components/project-list/ProjectListCard.jsx

@@ -89,6 +89,10 @@ function ProjectListCard({
         } ${isDeleting ? "project-list-card--deleting" : ""} ${
           selectionMode || isSelected ? "project-list-card--selection-mode" : ""
         }`}
+        role="button"
+        tabIndex={0}
+        onClick={handleCardClick}
+        onKeyDown={(e) => e.key === "Enter" && handleCardClick()}
       >
         {/* deleting overlay */}
         {isDeleting && (
@@ -167,14 +171,8 @@ function ProjectListCard({
           )}
         </div>
 
-        {/* ---------- body (clickable) ---------- */}
-        <div
-          className="project-list-card-clickable-content"
-          role="button"
-          tabIndex={0}
-          onClick={handleCardClick}
-          onKeyDown={(e) => e.key === "Enter" && handleCardClick()}
-        >
+        {/* ---------- body ---------- */}
+        <div className="project-list-card-clickable-content">
           {/* description */}
           <div className="project-list-card-detail-section project-list-card-desc-section">
             <Typography.Paragraph

frontend/src/ide/chat-ai/ChatAI.css

@@ -440,6 +440,30 @@
 .chat-ai-info-chip-clickable {
   cursor: pointer;
 }
+.chat-ai-info-chip:has(.chat-ai-schema-select) {
+  padding: 3px 4px 3px 10px;
+}
+.chat-ai-schema-select {
+  max-width: 180px;
+}
+.chat-ai-schema-select.ant-select {
+  height: 16px !important;
+}
+.chat-ai-schema-select .ant-select-selector {
+  padding: 0 !important;
+  height: 16px !important;
+  min-height: unset !important;
+}
+.chat-ai-schema-select .ant-select-selection-item {
+  font-size: 10px !important;
+  line-height: 16px !important;
+  padding-inline-end: 14px !important;
+}
+.chat-ai-schema-select .ant-select-arrow {
+  font-size: 8px !important;
+  right: 0;
+  inset-block-start: 50%;
+}
 .chat-ai-info-chip-error {
   background-color: var(--ant-color-error-bg);
   border-color: var(--ant-color-error-border);

frontend/src/ide/chat-ai/PromptActions.jsx

@@ -1,5 +1,13 @@
-import { memo, useEffect, useMemo } from "react";
-import { Space, Typography, Select, Switch, Segmented, Tooltip } from "antd";
+import { memo, useCallback, useEffect, useMemo } from "react";
+import {
+  Space,
+  Typography,
+  Select,
+  Switch,
+  Segmented,
+  Tooltip,
+  message,
+} from "antd";
 import {
   ConsoleSqlOutlined,
   DatabaseOutlined,
@@ -8,13 +16,15 @@ import {
   WalletOutlined,
 } from "@ant-design/icons";
 import PropTypes from "prop-types";
+import Cookies from "js-cookie";
 
 import { CHAT_INTENTS } from "./helper";
 import CircularTokenDisplay from "./CircularTokenDisplay";
-import InfoChip from "./InfoChip";
 import { useTokenStore } from "../../store/token-store";
 import { useSessionStore } from "../../store/session-store";
 import { useProjectStore } from "../../store/project-store";
+import { orgStore } from "../../store/org-store";
+import { useAxiosPrivate } from "../../service/axios-service";
 
 // Define hidden intents and a fixed order array
 const HIDDEN_CHAT_INTENTS = ["AUTO", "NOTA", "INFO"];
@@ -53,6 +63,39 @@ const PromptActions = memo(function PromptActions({
   const { tokenBalance, isLoading: isTokenLoading } = useTokenStore();
   const isCloud = useSessionStore((state) => state.sessionDetails?.is_cloud);
   const currentSchema = useProjectStore((state) => state.currentSchema);
+  const setCurrentSchema = useProjectStore((state) => state.setCurrentSchema);
+  const schemaList = useProjectStore((state) => state.schemaList);
+  const projectId = useProjectStore((state) => state.projectId);
+  const { selectedOrgId } = orgStore();
+  const axios = useAxiosPrivate();
+
+  const schemaOptions = useMemo(
+    () => schemaList.map((s) => ({ label: s, value: s })),
+    [schemaList]
+  );
+
+  const handleSchemaChange = useCallback(
+    (value) => {
+      const csrfToken = Cookies.get("csrftoken");
+      axios({
+        url: `/api/v1/visitran/${
+          selectedOrgId || "default_org"
+        }/project/${projectId}/set_schema`,
+        method: "POST",
+        data: { schema_name: value },
+        headers: { "X-CSRFToken": csrfToken },
+      })
+        .then(() => {
+          setCurrentSchema(value);
+          message.success("Schema updated successfully");
+        })
+        .catch((error) => {
+          console.error(error);
+          message.error("Failed to update schema");
+        });
+    },
+    [axios, selectedOrgId, projectId, setCurrentSchema]
+  );
 
   const llmOptions = useMemo(
     () =>
@@ -169,13 +212,22 @@ const PromptActions = memo(function PromptActions({
           </a>
         )}
 
-        {/* Schema indicator */}
-        {currentSchema && (
-          <InfoChip
-            icon={<DatabaseOutlined className="chat-ai-info-chip-icon" />}
-            text={currentSchema}
-            tooltipTitle="All new models generated will be created inside this schema. To modify it, click the settings icon from the left explorer."
-          />
+        {/* Schema selector */}
+        {schemaList.length > 0 && (
+          <div className="chat-ai-info-chip chat-ai-info-chip-clickable">
+            <DatabaseOutlined className="chat-ai-info-chip-icon" />
+            <Select
+              size="small"
+              variant="borderless"
+              showSearch
+              placeholder="Schema"
+              value={currentSchema || undefined}
+              onChange={handleSchemaChange}
+              options={schemaOptions}
+              popupMatchSelectWidth={false}
+              className="chat-ai-schema-select"
+            />
+          </div>
         )}
       </Space>