fix: strip demo graph prefix for display and fix schema table names

api/routes/graphs.py

@@ -50,7 +50,17 @@ async def list_graphs(request: Request):
     Requires authentication.
     """
     graphs = await list_databases(request.state.user_id, GENERAL_PREFIX)
-    return JSONResponse(content=graphs)
+
+    result = []
+    for graph_id in graphs:
+        is_demo = bool(GENERAL_PREFIX and graph_id.startswith(GENERAL_PREFIX))
+        if is_demo:
+            display_name = graph_id[len(GENERAL_PREFIX):]
+        else:
+            display_name = graph_id
+        result.append({"id": graph_id, "name": display_name, "is_demo": is_demo})
+
+    return JSONResponse(content=result)
 
 
 @graphs_router.get(

app/src/components/chat/ChatInterface.tsx

@@ -522,8 +522,8 @@ const ChatInterface = ({
       {/* Bottom Section with Suggestions and Input */}
       <div className="border-t border-border bg-background">
         <div className="p-6">
-          {/* Suggestion Cards - Only show for DEMO_CRM database */}
-          {(selectedGraph?.id === 'DEMO_CRM' || selectedGraph?.name === 'DEMO_CRM') && (
+          {/* Suggestion Cards - Only show for demo databases */}
+          {selectedGraph?.is_demo && (
             <SuggestionCards
               suggestions={suggestions}
               onSelect={handleSuggestionSelect}

app/src/components/schema/SchemaViewer.tsx

@@ -287,7 +287,7 @@ const SchemaViewer = ({ isOpen, onClose, onWidthChange, sidebarWidth = 64 }: Sch
       ctx.textAlign = 'center';
       ctx.textBaseline = 'middle';
       ctx.fillText(
-        node.displayName[1],
+        schemaNode.name,
         node.x || 0,
         (node.y || 0) - nodeHeight / 2 + headerHeight / 2 + padding / 2
       );

app/src/pages/Index.tsx

@@ -181,8 +181,8 @@ const Index = () => {
     event.stopPropagation(); // Prevent dropdown from closing/selecting
 
     // Check if this is a demo database
-    const isDemo = graphId.startsWith('general_');
-    
+    const isDemo = graphs.find(g => g.id === graphId)?.is_demo || false;
+
     if (isRefreshingSchema) return;
     // Show the delete confirmation modal
     setDatabaseToDelete({ id: graphId, name: graphName, isDemo });
@@ -532,7 +532,7 @@ const Index = () => {
               <p className="text-xs text-muted-foreground">Graph-Powered Text-to-SQL</p>
               {selectedGraph ? (
                 <Badge variant="default" className="bg-green-600 hover:bg-green-700 text-xs px-2 py-0.5 flex-shrink-0">
-                  {selectedGraph.name === 'DEMO_CRM' ? 'CRM' : selectedGraph.name}
+                  {selectedGraph.name}
                 </Badge>
               ) : (
                 <Badge variant="secondary" className="bg-yellow-600 hover:bg-yellow-700 text-xs px-2 py-0.5 flex-shrink-0">
@@ -570,7 +570,7 @@ const Index = () => {
                 </DropdownMenuTrigger>
                 <DropdownMenuContent className="bg-card border-border text-foreground">
                   {graphs.map((graph) => {
-                    const isDemo = graph.id.startsWith('general_');
+                    const isDemo = graph.is_demo || false;
                     return (
                       <DropdownMenuItem
                         key={graph.id}

app/src/types/api.ts

@@ -20,8 +20,9 @@ export interface Graph {
   id: string;
   name: string;
   description?: string;
-  created_at: string;
-  updated_at: string;
+  created_at?: string;
+  updated_at?: string;
+  is_demo?: boolean;
   table_count?: number;
   schema?: any;
 }