@rebasepro/studio 0.0.1-canary.09e5ec5

package/dist/SQLEditor-CkVx9vgr.js

@@ -0,0 +1,1792 @@
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
+import { c } from "react-compiler-runtime";
+import { useTranslation, ErrorView, useRebaseContext, useStudioSideEntityController, useSnackbarController, useStudioCollectionRegistry, ConfirmationDialog, IconForView } from "@rebasepro/core";
+import { useState, useRef, useCallback, useEffect } from "react";
+import { createPortal } from "react-dom";
+import { CircularProgress, Typography, IconButton, iconSize, cls, defaultBorderMixin, Menu, MenuItem, Button, Tabs, Tab, Collapse, ResizablePanels, Tooltip, Dialog, DialogTitle, DialogContent, TextField, DialogActions, VirtualTable } from "@rebasepro/ui";
+import { RefreshCwIcon, CopyIcon, MoreVerticalIcon, Trash2Icon, TerminalIcon, XIcon, PlusIcon, MenuIcon, DatabaseIcon, PlayIcon, PencilIcon } from "lucide-react";
+import { M as MonacoEditor } from "./MonacoEditor-CMYEjiRf.js";
+import { parseFirst } from "pgsql-ast-parser";
+import { toSnakeCase } from "@rebasepro/utils";
+const SchemaBrowser = ({
+  onTableClick,
+  schemas,
+  isSchemaLoading,
+  schemaError,
+  onRetrySchema
+}) => {
+  const [expandedSchemas, setExpandedSchemas] = useState({
+    public: true
+  });
+  const [expandedTables, setExpandedTables] = useState({});
+  const {
+    t
+  } = useTranslation();
+  if (isSchemaLoading) return /* @__PURE__ */ jsx("div", { className: "p-4 flex justify-center", children: /* @__PURE__ */ jsx(CircularProgress, { size: "small" }) });
+  if (schemaError) return /* @__PURE__ */ jsx("div", { className: "p-2", children: /* @__PURE__ */ jsx(ErrorView, { error: schemaError, onRetry: onRetrySchema }) });
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col h-full overflow-hidden", children: [
+    /* @__PURE__ */ jsxs("div", { className: cls("flex items-center justify-between px-3 py-2 border-b bg-surface-50 dark:bg-surface-900 min-h-[48px]", defaultBorderMixin), children: [
+      /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "font-bold uppercase tracking-wider text-text-disabled dark:text-text-disabled-dark", children: t("studio_schema_tables") }),
+      /* @__PURE__ */ jsx(IconButton, { size: "small", onClick: onRetrySchema, title: "Refresh schema", children: /* @__PURE__ */ jsx(RefreshCwIcon, { size: iconSize.smallest }) })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "flex-grow overflow-y-auto no-scrollbar p-1", children: Object.keys(schemas).length === 0 ? /* @__PURE__ */ jsx("div", { className: "p-4 text-center", children: /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "text-text-disabled dark:text-text-disabled-dark italic", children: t("studio_schema_no_tables") }) }) : Object.entries(schemas).map(([schemaName, tables]) => /* @__PURE__ */ jsxs("div", { className: "mb-2", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center p-1 cursor-pointer hover:bg-surface-100 dark:hover:bg-surface-950 rounded transition-colors", onClick: () => setExpandedSchemas((prev) => ({
+        ...prev,
+        [schemaName]: !prev[schemaName]
+      })), children: [
+        /* @__PURE__ */ jsx("svg", { className: cls("w-3 h-3 mr-1 transition-transform", expandedSchemas[schemaName] ? "rotate-90" : ""), fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ jsx("path", { d: "M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z" }) }),
+        /* @__PURE__ */ jsx(Typography, { variant: "body2", className: "text-text-primary dark:text-text-primary-dark font-medium text-xs truncate flex-grow", children: schemaName })
+      ] }),
+      expandedSchemas[schemaName] && /* @__PURE__ */ jsx("div", { className: "ml-3 mt-1 space-y-1", children: tables.map((table) => /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center p-1 cursor-pointer hover:bg-surface-100 dark:hover:bg-surface-950 rounded transition-colors group relative", onClick: () => setExpandedTables((prev_0) => ({
+          ...prev_0,
+          [`${schemaName}.${table.tableName}`]: !prev_0[`${schemaName}.${table.tableName}`]
+        })), children: [
+          /* @__PURE__ */ jsx("svg", { className: cls("w-3 h-3 mr-1 transition-transform shrink-0", expandedTables[`${schemaName}.${table.tableName}`] ? "rotate-90" : ""), fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ jsx("path", { d: "M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z" }) }),
+          /* @__PURE__ */ jsx("svg", { className: "w-3.5 h-3.5 mr-1 shrink-0 text-text-disabled dark:text-text-disabled-dark", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M3 10h18M3 14h18m-9-4v8m-7 0h14a2 2 0 002-2V8a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z" }) }),
+          /* @__PURE__ */ jsx(Typography, { variant: "body2", className: "text-text-secondary dark:text-text-secondary-dark text-xs truncate flex-1 min-w-0", children: table.tableName }),
+          /* @__PURE__ */ jsxs("div", { className: "flex opacity-0 group-hover:opacity-100 focus-within:opacity-100 absolute right-1 items-center bg-surface-100 dark:bg-surface-950 px-1 gap-1 rounded transition-opacity", children: [
+            /* @__PURE__ */ jsx(IconButton, { size: "smallest", className: "transition-colors text-text-secondary hover:text-text-primary pointer-events-auto", onClick: (e) => {
+              e.stopPropagation();
+              navigator.clipboard.writeText(table.tableName);
+            }, title: "CopyIcon table name", children: /* @__PURE__ */ jsx(CopyIcon, { size: iconSize.smallest }) }),
+            /* @__PURE__ */ jsxs(Menu, { trigger: /* @__PURE__ */ jsx(IconButton, { size: "smallest", className: "transition-colors text-text-secondary hover:text-text-primary pointer-events-auto", onClick: (e_0) => e_0.stopPropagation(), title: "Generate SQL templates", children: /* @__PURE__ */ jsx(MoreVerticalIcon, { size: iconSize.smallest }) }), children: [
+              /* @__PURE__ */ jsx(MenuItem, { dense: true, className: "text-xs", onClick: (e_1) => {
+                e_1.stopPropagation();
+                onTableClick?.(`SELECT * FROM ${schemaName !== "public" ? `${schemaName}.` : ""}${table.tableName} LIMIT 100;`);
+              }, children: "SELECT (Top 100)" }),
+              /* @__PURE__ */ jsx(MenuItem, { dense: true, className: "text-xs", onClick: (e_2) => {
+                e_2.stopPropagation();
+                onTableClick?.(`SELECT 
+  ${table.columns.map((c2) => c2.name).join(",\n  ")}
+FROM ${schemaName !== "public" ? `${schemaName}.` : ""}${table.tableName};`);
+              }, children: "SELECT (All columns)" }),
+              /* @__PURE__ */ jsx(MenuItem, { dense: true, className: "text-xs", onClick: (e_3) => {
+                e_3.stopPropagation();
+                onTableClick?.(`INSERT INTO ${schemaName !== "public" ? `${schemaName}.` : ""}${table.tableName} (
+  ${table.columns.map((c_0) => c_0.name).join(",\n  ")}
+) VALUES (
+  ${table.columns.map(() => "?").join(",\n  ")}
+);`);
+              }, children: "INSERT statement" }),
+              /* @__PURE__ */ jsx(MenuItem, { dense: true, className: "text-xs", onClick: (e_4) => {
+                e_4.stopPropagation();
+                onTableClick?.(`UPDATE ${schemaName !== "public" ? `${schemaName}.` : ""}${table.tableName} 
+SET 
+  ${table.columns.map((c_1) => `${c_1.name} = ?`).join(",\n  ")}
+WHERE id = ?;`);
+              }, children: "UPDATE statement" })
+            ] }),
+            /* @__PURE__ */ jsx(Button, { variant: "text", size: "small", className: "text-[10px] text-primary uppercase min-h-0 py-0.5 px-1 font-medium ml-1 flex-shrink-0 leading-none h-[22px]", onClick: (e_5) => {
+              e_5.stopPropagation();
+              onTableClick?.(`SELECT * FROM ${schemaName !== "public" ? `${schemaName}.` : ""}${table.tableName} LIMIT 100;`);
+            }, children: "SELECT" })
+          ] })
+        ] }),
+        expandedTables[`${schemaName}.${table.tableName}`] && /* @__PURE__ */ jsx("div", { className: cls("ml-5 mt-1 space-y-0.5 border-l", defaultBorderMixin), children: table.columns.map((col) => /* @__PURE__ */ jsxs("div", { className: "flex items-center p-1 group pl-2 hover:bg-surface-50 dark:hover:bg-surface-950 rounded-r relative min-h-[28px]", children: [
+          /* @__PURE__ */ jsx("svg", { className: "w-3 h-3 mr-1.5 text-text-disabled dark:text-text-disabled-dark shrink-0", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1.5, d: "M9 4.5v15m6-15v15m-10.5-1.5h15c.621 0 1.125-.504 1.125-1.125V5.625c0-.621-.504-1.125-1.125-1.125h-15c-.621 0-1.125.504-1.125 1.125v12.75c0 .621.504 1.125 1.125 1.125Z" }) }),
+          /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "text-text-primary dark:text-text-primary-dark text-[11px] truncate flex-grow mr-2", children: col.name }),
+          /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "text-text-disabled dark:text-text-disabled-dark text-[9px] truncate mr-1 uppercase shrink-0", title: col.dataType, children: col.dataType }),
+          /* @__PURE__ */ jsx(IconButton, { size: "smallest", className: "opacity-0 group-hover:opacity-100 absolute right-1 bg-surface-50 dark:bg-surface-950 transition-colors pointer-events-auto", onClick: (e_6) => {
+            e_6.stopPropagation();
+            navigator.clipboard.writeText(col.name);
+          }, title: "CopyIcon column name", children: /* @__PURE__ */ jsx(CopyIcon, { size: iconSize.smallest }) })
+        ] }, col.name)) })
+      ] }, table.tableName)) })
+    ] }, schemaName)) })
+  ] });
+};
+const SQLEditorSidebar = ({
+  onSelectSnippet,
+  onTableClick,
+  snippets,
+  history,
+  onDeleteSnippet,
+  schemas,
+  isSchemaLoading,
+  schemaError,
+  onRetrySchema
+}) => {
+  const [activeTab, setActiveTab] = useState("schema");
+  const {
+    t
+  } = useTranslation();
+  return /* @__PURE__ */ jsxs("div", { className: cls("flex flex-col h-full w-full bg-white dark:bg-surface-950 border-r", defaultBorderMixin), children: [
+    /* @__PURE__ */ jsxs(Tabs, { value: activeTab, onValueChange: (v) => setActiveTab(v), variant: "boxy", className: "border-b border-surface-200 dark:border-surface-950", children: [
+      /* @__PURE__ */ jsx(Tab, { value: "schema", children: t("studio_sql_sidebar_schema") }),
+      /* @__PURE__ */ jsx(Tab, { value: "snippets", children: t("studio_sql_sidebar_snippets") }),
+      /* @__PURE__ */ jsx(Tab, { value: "history", children: t("studio_sql_sidebar_history") })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "flex-grow overflow-hidden relative", children: [
+      activeTab === "schema" && /* @__PURE__ */ jsx(SchemaBrowser, { onTableClick, schemas, isSchemaLoading, schemaError, onRetrySchema }),
+      activeTab === "snippets" && (() => {
+        const favorites = snippets.filter((s) => s.isFavorite);
+        const others = snippets.filter((s_0) => !s_0.isFavorite);
+        return /* @__PURE__ */ jsxs("div", { className: "flex flex-col h-full", children: [
+          /* @__PURE__ */ jsx("div", { className: cls("flex items-center justify-between px-3 py-2 border-b bg-surface-50 dark:bg-surface-900 min-h-[48px]", defaultBorderMixin), children: /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "font-bold uppercase tracking-wider text-text-disabled dark:text-text-disabled-dark", children: t("studio_sql_sidebar_snippets") }) }),
+          /* @__PURE__ */ jsx("div", { className: "flex-grow overflow-y-auto p-2 space-y-2 no-scrollbar", children: snippets.length === 0 ? /* @__PURE__ */ jsx("div", { className: "p-4 text-center", children: /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "text-text-disabled dark:text-text-disabled-dark", children: t("studio_sql_sidebar_no_snippets") }) }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+            favorites.length > 0 && /* @__PURE__ */ jsxs("div", { className: "mb-4", children: [
+              /* @__PURE__ */ jsxs(Typography, { variant: "caption", className: "text-[10px] font-bold uppercase tracking-wider text-text-disabled dark:text-text-disabled-dark mb-2 px-1 flex items-center", children: [
+                /* @__PURE__ */ jsx("svg", { className: "w-3 h-3 mr-1 text-red-500", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ jsx("path", { fillRule: "evenodd", d: "M3.172 5.172a4 4 0 015.656 0L10 6.343l1.172-1.171a4 4 0 115.656 5.656L10 17.657l-6.828-6.829a4 4 0 010-5.656z", clipRule: "evenodd" }) }),
+                "Favorites"
+              ] }),
+              /* @__PURE__ */ jsx("div", { className: "space-y-2", children: favorites.map((snippet) => /* @__PURE__ */ jsxs("div", { className: cls("group p-2 rounded border hover:border-surface-400 dark:hover:border-surface-600 bg-white dark:bg-surface-900 transition-all cursor-pointer relative", defaultBorderMixin), onClick: () => onSelectSnippet(snippet.sql), children: [
+                /* @__PURE__ */ jsx(Typography, { variant: "body2", className: "text-text-primary dark:text-text-primary-dark font-medium text-[13px] truncate pr-6", children: snippet.name }),
+                /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "text-text-secondary dark:text-text-secondary-dark text-[10px] block mt-1 truncate", children: snippet.sql }),
+                /* @__PURE__ */ jsx(IconButton, { size: "smallest", className: "absolute right-1 top-1 opacity-0 group-hover:opacity-100 text-text-disabled hover:text-red-500 transition-opacity", onClick: (e) => {
+                  e.stopPropagation();
+                  onDeleteSnippet(snippet.id);
+                }, children: /* @__PURE__ */ jsx(Trash2Icon, { size: iconSize.smallest }) })
+              ] }, snippet.id)) })
+            ] }),
+            others.length > 0 && /* @__PURE__ */ jsxs("div", { children: [
+              favorites.length > 0 && /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "text-[10px] font-bold uppercase tracking-wider text-text-disabled dark:text-text-disabled-dark mb-2 px-1 mt-4", children: "Others" }),
+              /* @__PURE__ */ jsx("div", { className: "space-y-2", children: others.map((snippet_0) => /* @__PURE__ */ jsxs("div", { className: cls("group p-2 rounded border hover:border-surface-400 dark:hover:border-surface-600 bg-white dark:bg-surface-900 transition-all cursor-pointer relative", defaultBorderMixin), onClick: () => onSelectSnippet(snippet_0.sql), children: [
+                /* @__PURE__ */ jsx(Typography, { variant: "body2", className: "text-text-primary dark:text-text-primary-dark font-medium text-[13px] truncate pr-6", children: snippet_0.name }),
+                /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "text-text-secondary dark:text-text-secondary-dark text-[10px] block mt-1 truncate", children: snippet_0.sql }),
+                /* @__PURE__ */ jsx(IconButton, { size: "smallest", className: "absolute right-1 top-1 opacity-0 group-hover:opacity-100 text-text-disabled hover:text-red-500 transition-opacity", onClick: (e_0) => {
+                  e_0.stopPropagation();
+                  onDeleteSnippet(snippet_0.id);
+                }, children: /* @__PURE__ */ jsx(Trash2Icon, { size: iconSize.smallest }) })
+              ] }, snippet_0.id)) })
+            ] })
+          ] }) })
+        ] });
+      })(),
+      activeTab === "history" && /* @__PURE__ */ jsxs("div", { className: "flex flex-col h-full", children: [
+        /* @__PURE__ */ jsx("div", { className: cls("flex items-center justify-between px-3 py-2 border-b bg-surface-50 dark:bg-surface-900 min-h-[48px]", defaultBorderMixin), children: /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "font-bold uppercase tracking-wider text-text-disabled dark:text-text-disabled-dark", children: t("studio_sql_sidebar_history") }) }),
+        /* @__PURE__ */ jsx("div", { className: "flex-grow overflow-y-auto p-1 space-y-1 no-scrollbar", children: history.length === 0 ? /* @__PURE__ */ jsx("div", { className: "p-4 text-center", children: /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "text-text-disabled dark:text-text-disabled-dark", children: t("studio_sql_sidebar_no_history") }) }) : [...history].reverse().map((sql, i) => /* @__PURE__ */ jsxs("div", { className: "p-2 py-1.5 rounded hover:bg-surface-100 dark:hover:bg-surface-950 cursor-pointer group transition-colors flex items-start", onClick: () => onSelectSnippet(sql), children: [
+          /* @__PURE__ */ jsx("svg", { className: "w-3 h-3 mt-1 mr-2 text-text-disabled dark:text-text-disabled-dark group-hover:text-primary transition-colors flex-shrink-0", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z" }) }),
+          /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "text-text-secondary dark:text-text-secondary-dark group-hover:text-text-primary dark:group-hover:text-text-primary-dark text-[11px] line-clamp-2 leading-tight flex-grow", children: sql })
+        ] }, i)) })
+      ] })
+    ] })
+  ] });
+};
+function extractTablesFromQuery(sqlString) {
+  try {
+    const ast = parseFirst(sqlString);
+    if (ast.type !== "select") return [];
+    const tables = [];
+    const processFrom = (fromItems) => {
+      for (const item of fromItems) {
+        if (item.type === "table" && item.name) {
+          tables.push({
+            name: item.name.name,
+            alias: item.name.alias
+          });
+        }
+        if (item.type === "join") {
+          if (item.left) processFrom([item.left]);
+          if (item.right) processFrom([item.right]);
+        }
+      }
+    };
+    if (ast.from) {
+      processFrom(ast.from);
+    }
+    return tables;
+  } catch {
+    return [];
+  }
+}
+function resolveQueryCollections(sqlString, schemas, collections, resultColumns) {
+  const tables = extractTablesFromQuery(sqlString);
+  if (tables.length === 0) return [];
+  const selectColumns = [];
+  try {
+    const ast = parseFirst(sqlString);
+    if (ast.type === "select" && ast.columns) {
+      for (const col of ast.columns) {
+        if (col.expr?.type === "ref") {
+          selectColumns.push({
+            table: col.expr.table?.name,
+            column: col.expr.name,
+            alias: col.alias?.name
+          });
+        }
+      }
+    }
+  } catch {
+  }
+  const results = [];
+  for (const table of tables) {
+    const matched = collections.find((c2) => {
+      const tableName = c2.table || toSnakeCase(c2.slug);
+      return tableName === table.name;
+    });
+    if (!matched) continue;
+    const tableColumns = [];
+    for (const schemaEntries of Object.values(schemas)) {
+      const tableInfo = schemaEntries.find((t) => t.tableName === table.name);
+      if (tableInfo) {
+        tableColumns.push(...tableInfo.columns.map((c2) => c2.name));
+        break;
+      }
+    }
+    let pkColumn;
+    const tableRef = table.alias || table.name;
+    const idSelectCol = selectColumns.find((sc) => sc.column === "id" && (!sc.table || sc.table === tableRef || sc.table === table.name));
+    if (idSelectCol) {
+      pkColumn = idSelectCol.alias || idSelectCol.column;
+    }
+    if (!pkColumn && resultColumns) {
+      if (resultColumns.includes("id")) {
+        pkColumn = "id";
+      }
+    }
+    if (!pkColumn && tableColumns.includes("id")) {
+      pkColumn = "id";
+    }
+    results.push({
+      tableName: table.name,
+      tableAlias: table.alias,
+      collection: matched,
+      columns: tableColumns,
+      pkColumn
+    });
+  }
+  return results;
+}
+function determineTableAndPK(sqlString, columnKey, schemas) {
+  try {
+    const tables = extractTablesFromQuery(sqlString);
+    const ast = parseFirst(sqlString);
+    if (ast.type !== "select") {
+      return {
+        error: "Inline editing is only supported for SELECT queries."
+      };
+    }
+    if (tables.length === 0) {
+      return {
+        error: "Could not find any tables in the query."
+      };
+    }
+    const selectColumns = [];
+    if (ast.columns) {
+      for (const col of ast.columns) {
+        if (col.expr?.type === "ref") {
+          selectColumns.push({
+            table: col.expr.table?.name,
+            column: col.expr.name,
+            alias: col.alias?.name
+          });
+        }
+      }
+    }
+    const resolvedColumn = selectColumns.find((sc) => sc.alias === columnKey || !sc.alias && sc.column === columnKey);
+    const actualDbColumnName = resolvedColumn?.column ?? columnKey;
+    const columnTableRef = resolvedColumn?.table;
+    let resolvedTableName = null;
+    if (tables.length === 1) {
+      resolvedTableName = tables[0].name;
+    } else {
+      if (columnTableRef) {
+        const matchedTable = tables.find((t) => t.alias === columnTableRef || t.name === columnTableRef);
+        if (matchedTable) {
+          resolvedTableName = matchedTable.name;
+        }
+      }
+      if (!resolvedTableName) {
+        const matchedTables = tables.filter((t) => {
+          for (const schema of Object.values(schemas)) {
+            const tableInfo = schema.find((ti) => ti.tableName === t.name);
+            if (tableInfo && tableInfo.columns.some((c2) => c2.name === actualDbColumnName)) {
+              return true;
+            }
+          }
+          return false;
+        });
+        if (matchedTables.length === 1) {
+          resolvedTableName = matchedTables[0].name;
+        } else if (matchedTables.length > 1) {
+          return {
+            error: `Ambiguous column "${columnKey}": Found in multiple queried tables.`
+          };
+        } else {
+          return {
+            error: `Could not find column "${columnKey}" in the queried tables.`
+          };
+        }
+      }
+    }
+    if (!resolvedTableName) {
+      return {
+        error: "Could not resolve the target table."
+      };
+    }
+    let pkDbColumns = [];
+    for (const schema of Object.values(schemas)) {
+      const tableInfo = schema.find((t) => t.tableName === resolvedTableName);
+      if (tableInfo) {
+        pkDbColumns = tableInfo.columns.filter((c2) => c2.isPrimaryKey).map((c2) => c2.name);
+        break;
+      }
+    }
+    if (pkDbColumns.length === 0) {
+      return {
+        error: `Table "${resolvedTableName}" has no primary key defined.`
+      };
+    }
+    const tableEntry = tables.find((t) => t.name === resolvedTableName);
+    const tableAlias = tableEntry?.alias;
+    const primaryKeys = pkDbColumns.map((dbCol) => {
+      const selectCol = selectColumns.find((sc) => sc.column === dbCol && (!sc.table || sc.table === (tableAlias || resolvedTableName)));
+      return {
+        dbColumn: dbCol,
+        resultColumn: selectCol?.alias || selectCol?.column || dbCol
+      };
+    });
+    return {
+      tableName: resolvedTableName,
+      primaryKeys
+    };
+  } catch (e) {
+    console.warn("Failed to parse SQL AST:", e);
+    const message = e instanceof Error ? e.message : String(e);
+    return {
+      error: `Could not safely parse query for inline editing: ${message}`
+    };
+  }
+}
+const ExplainVisualizer = (t0) => {
+  const $ = c(77);
+  const {
+    plan,
+    isRoot: t1
+  } = t0;
+  const isRoot = t1 === void 0 ? true : t1;
+  const [expanded, setExpanded] = useState(true);
+  const hasChildren = plan.Plans && plan.Plans.length > 0;
+  const cost = plan["Total Cost"];
+  let costColor = "text-green-500 dark:text-green-400";
+  if (cost > 1e3) {
+    costColor = "text-red-500 dark:text-red-400";
+  } else {
+    if (cost > 100) {
+      costColor = "text-orange-500 dark:text-orange-400";
+    }
+  }
+  const t2 = isRoot ? "p-4" : "pl-6 mt-2 relative";
+  let t3;
+  if ($[0] !== t2) {
+    t3 = cls("flex flex-col", t2);
+    $[0] = t2;
+    $[1] = t3;
+  } else {
+    t3 = $[1];
+  }
+  let t4;
+  if ($[2] !== isRoot) {
+    t4 = !isRoot && /* @__PURE__ */ jsx("div", { className: "absolute left-2.5 top-0 bottom-0 w-px bg-surface-200 dark:bg-surface-950 -z-10" });
+    $[2] = isRoot;
+    $[3] = t4;
+  } else {
+    t4 = $[3];
+  }
+  let t5;
+  if ($[4] !== isRoot) {
+    t5 = !isRoot && /* @__PURE__ */ jsx("div", { className: "absolute left-2.5 top-5 w-3 h-px bg-surface-200 dark:bg-surface-950 -z-10" });
+    $[4] = isRoot;
+    $[5] = t5;
+  } else {
+    t5 = $[5];
+  }
+  let t6;
+  let t7;
+  if ($[6] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t6 = cls("border rounded-md bg-white dark:bg-surface-900 text-text-primary dark:text-text-primary-dark shadow-xs relative z-10 w-[420px] max-w-full", defaultBorderMixin);
+    t7 = cls("px-4 py-3 flex justify-between items-center cursor-pointer select-none");
+    $[6] = t6;
+    $[7] = t7;
+  } else {
+    t6 = $[6];
+    t7 = $[7];
+  }
+  let t8;
+  if ($[8] !== expanded) {
+    t8 = () => setExpanded(!expanded);
+    $[8] = expanded;
+    $[9] = t8;
+  } else {
+    t8 = $[9];
+  }
+  let t9;
+  if ($[10] !== expanded || $[11] !== hasChildren) {
+    t9 = hasChildren ? /* @__PURE__ */ jsx("svg", { className: cls("w-4 h-4 text-text-secondary transition-transform", !expanded ? "-rotate-90" : ""), fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M19 9l-7 7-7-7" }) }) : /* @__PURE__ */ jsx("div", { className: "w-4 h-4" });
+    $[10] = expanded;
+    $[11] = hasChildren;
+    $[12] = t9;
+  } else {
+    t9 = $[12];
+  }
+  const t10 = plan["Node Type"];
+  let t11;
+  if ($[13] !== t10) {
+    t11 = /* @__PURE__ */ jsx(Typography, { variant: "body1", className: "flex items-center", children: t10 });
+    $[13] = t10;
+    $[14] = t11;
+  } else {
+    t11 = $[14];
+  }
+  let t12;
+  if ($[15] !== plan) {
+    t12 = plan["Relation Name"] && /* @__PURE__ */ jsxs("span", { className: "font-mono text-[11px] text-text-secondary dark:text-text-secondary-dark px-2 py-0.5 rounded bg-surface-200 dark:bg-surface-950 ml-2", children: [
+      "on ",
+      plan["Relation Name"],
+      " ",
+      plan.Alias && plan.Alias !== plan["Relation Name"] ? `(${plan.Alias})` : ""
+    ] });
+    $[15] = plan;
+    $[16] = t12;
+  } else {
+    t12 = $[16];
+  }
+  let t13;
+  if ($[17] !== t11 || $[18] !== t12 || $[19] !== t9) {
+    t13 = /* @__PURE__ */ jsxs("div", { className: "flex items-center space-x-2", children: [
+      t9,
+      t11,
+      t12
+    ] });
+    $[17] = t11;
+    $[18] = t12;
+    $[19] = t9;
+    $[20] = t13;
+  } else {
+    t13 = $[20];
+  }
+  let t14;
+  if ($[21] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t14 = /* @__PURE__ */ jsx("span", { className: "text-[10px] uppercase text-text-disabled dark:text-text-disabled-dark font-semibold tracking-wide leading-tight mb-0.5", children: "Cost" });
+    $[21] = t14;
+  } else {
+    t14 = $[21];
+  }
+  let t15;
+  if ($[22] !== costColor) {
+    t15 = cls("font-mono font-medium text-[13px] leading-none", costColor);
+    $[22] = costColor;
+    $[23] = t15;
+  } else {
+    t15 = $[23];
+  }
+  let t16;
+  if ($[24] !== cost) {
+    t16 = cost.toFixed(2);
+    $[24] = cost;
+    $[25] = t16;
+  } else {
+    t16 = $[25];
+  }
+  let t17;
+  if ($[26] !== t15 || $[27] !== t16) {
+    t17 = /* @__PURE__ */ jsxs("div", { className: "flex flex-col text-right", children: [
+      t14,
+      /* @__PURE__ */ jsx("span", { className: t15, children: t16 })
+    ] });
+    $[26] = t15;
+    $[27] = t16;
+    $[28] = t17;
+  } else {
+    t17 = $[28];
+  }
+  let t18;
+  if ($[29] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t18 = /* @__PURE__ */ jsx("span", { className: "text-[10px] uppercase text-text-disabled dark:text-text-disabled-dark font-semibold tracking-wide leading-tight mb-0.5", children: "Rows" });
+    $[29] = t18;
+  } else {
+    t18 = $[29];
+  }
+  const t19 = plan["Plan Rows"];
+  let t20;
+  if ($[30] !== t19) {
+    t20 = /* @__PURE__ */ jsxs("div", { className: "flex flex-col text-right", children: [
+      t18,
+      /* @__PURE__ */ jsx("span", { className: "font-mono text-[13px] text-text-secondary dark:text-text-secondary-dark leading-none", children: t19 })
+    ] });
+    $[30] = t19;
+    $[31] = t20;
+  } else {
+    t20 = $[31];
+  }
+  let t21;
+  if ($[32] !== t17 || $[33] !== t20) {
+    t21 = /* @__PURE__ */ jsxs("div", { className: "flex space-x-6 items-center", children: [
+      t17,
+      t20
+    ] });
+    $[32] = t17;
+    $[33] = t20;
+    $[34] = t21;
+  } else {
+    t21 = $[34];
+  }
+  let t22;
+  if ($[35] !== t13 || $[36] !== t21 || $[37] !== t8) {
+    t22 = /* @__PURE__ */ jsxs("div", { className: t7, onClick: t8, children: [
+      t13,
+      t21
+    ] });
+    $[35] = t13;
+    $[36] = t21;
+    $[37] = t8;
+    $[38] = t22;
+  } else {
+    t22 = $[38];
+  }
+  let t23;
+  if ($[39] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t23 = /* @__PURE__ */ jsx("span", { className: "text-text-disabled dark:text-text-disabled-dark", children: "Startup Cost:" });
+    $[39] = t23;
+  } else {
+    t23 = $[39];
+  }
+  const t24 = plan["Startup Cost"];
+  let t25;
+  if ($[40] !== t24) {
+    t25 = t24.toFixed(2);
+    $[40] = t24;
+    $[41] = t25;
+  } else {
+    t25 = $[41];
+  }
+  let t26;
+  if ($[42] !== t25) {
+    t26 = /* @__PURE__ */ jsxs("div", { className: "flex items-center space-x-2", children: [
+      t23,
+      /* @__PURE__ */ jsx("span", { className: "font-mono font-medium", children: t25 })
+    ] });
+    $[42] = t25;
+    $[43] = t26;
+  } else {
+    t26 = $[43];
+  }
+  let t27;
+  if ($[44] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t27 = /* @__PURE__ */ jsx("span", { className: "text-text-disabled dark:text-text-disabled-dark", children: "Width:" });
+    $[44] = t27;
+  } else {
+    t27 = $[44];
+  }
+  const t28 = plan["Plan Width"];
+  let t29;
+  if ($[45] !== t28) {
+    t29 = /* @__PURE__ */ jsxs("div", { className: "flex items-center space-x-2", children: [
+      t27,
+      /* @__PURE__ */ jsxs("span", { className: "font-mono font-medium", children: [
+        t28,
+        " bytes"
+      ] })
+    ] });
+    $[45] = t28;
+    $[46] = t29;
+  } else {
+    t29 = $[46];
+  }
+  let t30;
+  if ($[47] !== t26 || $[48] !== t29) {
+    t30 = /* @__PURE__ */ jsxs("div", { className: "flex items-center space-x-6", children: [
+      t26,
+      t29
+    ] });
+    $[47] = t26;
+    $[48] = t29;
+    $[49] = t30;
+  } else {
+    t30 = $[49];
+  }
+  let t31;
+  if ($[50] !== plan.Filter) {
+    t31 = plan.Filter && /* @__PURE__ */ jsxs("div", { className: "mt-1", children: [
+      /* @__PURE__ */ jsx("span", { className: "text-text-disabled dark:text-text-disabled-dark block mb-1", children: "Filter:" }),
+      /* @__PURE__ */ jsx("code", { className: "block w-full p-2 bg-surface-50 dark:bg-surface-950 border dark:border-surface-950 rounded font-mono text-[12px] truncate", children: plan.Filter })
+    ] });
+    $[50] = plan.Filter;
+    $[51] = t31;
+  } else {
+    t31 = $[51];
+  }
+  let t32;
+  if ($[52] !== plan) {
+    t32 = plan["Index Cond"] && /* @__PURE__ */ jsxs("div", { className: "mt-1", children: [
+      /* @__PURE__ */ jsx("span", { className: "text-text-disabled dark:text-text-disabled-dark block mb-1", children: "Index Cond:" }),
+      /* @__PURE__ */ jsx("code", { className: "block w-full p-2 bg-surface-50 dark:bg-surface-950 border dark:border-surface-950 rounded font-mono text-[12px] truncate", children: plan["Index Cond"] })
+    ] });
+    $[52] = plan;
+    $[53] = t32;
+  } else {
+    t32 = $[53];
+  }
+  let t33;
+  if ($[54] !== plan) {
+    t33 = plan["Hash Cond"] && /* @__PURE__ */ jsxs("div", { className: "mt-1", children: [
+      /* @__PURE__ */ jsx("span", { className: "text-text-disabled dark:text-text-disabled-dark block mb-1", children: "Hash Cond:" }),
+      /* @__PURE__ */ jsx("code", { className: "block w-full p-2 bg-surface-50 dark:bg-surface-950 border dark:border-surface-950 rounded font-mono text-[12px] truncate", children: plan["Hash Cond"] })
+    ] });
+    $[54] = plan;
+    $[55] = t33;
+  } else {
+    t33 = $[55];
+  }
+  let t34;
+  if ($[56] !== t30 || $[57] !== t31 || $[58] !== t32 || $[59] !== t33) {
+    t34 = /* @__PURE__ */ jsxs("div", { className: "px-4 py-3 border-t border-surface-200 dark:border-surface-950 text-[13px] flex flex-col gap-2", children: [
+      t30,
+      t31,
+      t32,
+      t33
+    ] });
+    $[56] = t30;
+    $[57] = t31;
+    $[58] = t32;
+    $[59] = t33;
+    $[60] = t34;
+  } else {
+    t34 = $[60];
+  }
+  let t35;
+  if ($[61] !== expanded || $[62] !== t34) {
+    t35 = /* @__PURE__ */ jsx(Collapse, { in: expanded, children: t34 });
+    $[61] = expanded;
+    $[62] = t34;
+    $[63] = t35;
+  } else {
+    t35 = $[63];
+  }
+  let t36;
+  if ($[64] !== t22 || $[65] !== t35) {
+    t36 = /* @__PURE__ */ jsxs("div", { className: t6, children: [
+      t22,
+      t35
+    ] });
+    $[64] = t22;
+    $[65] = t35;
+    $[66] = t36;
+  } else {
+    t36 = $[66];
+  }
+  let t37;
+  if ($[67] !== expanded || $[68] !== hasChildren || $[69] !== plan.Plans) {
+    t37 = expanded && hasChildren && /* @__PURE__ */ jsx("div", { className: "flex flex-col space-y-2 mt-[-4px]", children: plan.Plans.map(_temp) });
+    $[67] = expanded;
+    $[68] = hasChildren;
+    $[69] = plan.Plans;
+    $[70] = t37;
+  } else {
+    t37 = $[70];
+  }
+  let t38;
+  if ($[71] !== t3 || $[72] !== t36 || $[73] !== t37 || $[74] !== t4 || $[75] !== t5) {
+    t38 = /* @__PURE__ */ jsxs("div", { className: t3, children: [
+      t4,
+      t5,
+      t36,
+      t37
+    ] });
+    $[71] = t3;
+    $[72] = t36;
+    $[73] = t37;
+    $[74] = t4;
+    $[75] = t5;
+    $[76] = t38;
+  } else {
+    t38 = $[76];
+  }
+  return t38;
+};
+function _temp(childPlan, idx) {
+  return /* @__PURE__ */ jsx(ExplainVisualizer, { plan: childPlan, isRoot: false }, idx);
+}
+let VirtualTableInput = null;
+try {
+  const cms = require("@rebasepro/admin");
+  VirtualTableInput = cms.VirtualTableInput;
+} catch {
+}
+const STORAGE_KEY_TABS = "rebase_sql_tabs";
+const STORAGE_KEY_ACTIVE_TAB = "rebase_sql_active_tab";
+const FixedEditorOverlay = (t0) => {
+  const $ = c(29);
+  const {
+    displayValue,
+    onSave,
+    onCancel
+  } = t0;
+  const [rect, setRect] = useState(null);
+  let t1;
+  if ($[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t1 = {
+      width: 1e3,
+      height: 1e3
+    };
+    $[0] = t1;
+  } else {
+    t1 = $[0];
+  }
+  const [windowSize, setWindowSize] = useState(t1);
+  const anchorRef = useRef(null);
+  let t2;
+  let t3;
+  if ($[1] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t2 = () => {
+      if (anchorRef.current && anchorRef.current.parentElement) {
+        setRect(anchorRef.current.parentElement.getBoundingClientRect());
+      }
+      if (typeof window !== "undefined") {
+        setWindowSize({
+          width: window.innerWidth,
+          height: window.innerHeight
+        });
+        const handleResize = () => setWindowSize({
+          width: window.innerWidth,
+          height: window.innerHeight
+        });
+        window.addEventListener("resize", handleResize);
+        return () => window.removeEventListener("resize", handleResize);
+      }
+    };
+    t3 = [];
+    $[1] = t2;
+    $[2] = t3;
+  } else {
+    t2 = $[1];
+    t3 = $[2];
+  }
+  useEffect(t2, t3);
+  if (!rect) {
+    let t42;
+    if ($[3] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+      t42 = /* @__PURE__ */ jsx("div", { ref: anchorRef, className: "w-full h-full min-h-[20px]" });
+      $[3] = t42;
+    } else {
+      t42 = $[3];
+    }
+    return t42;
+  }
+  let top = rect.top - 2;
+  let left = rect.left - 2;
+  const minWidth = Math.max(rect.width + 4, 250);
+  const minHeight = rect.height + 4;
+  if (left + minWidth > windowSize.width) {
+    left = Math.max(10, windowSize.width - minWidth - 10);
+  }
+  const maxAvailableHeight = Math.max(50, windowSize.height - top - 10);
+  const resolvedMaxHeight = Math.min(300, maxAvailableHeight);
+  if (top + minHeight > windowSize.height) {
+    top = Math.max(10, windowSize.height - minHeight - 10);
+  }
+  const t4 = top;
+  const t5 = left;
+  const t6 = Math.min(400, windowSize.width - left - 10);
+  let t7;
+  if ($[4] !== left || $[5] !== minHeight || $[6] !== minWidth || $[7] !== t6 || $[8] !== top) {
+    t7 = {
+      top: t4,
+      left: t5,
+      minWidth,
+      minHeight,
+      maxWidth: t6
+    };
+    $[4] = left;
+    $[5] = minHeight;
+    $[6] = minWidth;
+    $[7] = t6;
+    $[8] = top;
+    $[9] = t7;
+  } else {
+    t7 = $[9];
+  }
+  let t8;
+  if ($[10] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t8 = {
+      minHeight: "32px"
+    };
+    $[10] = t8;
+  } else {
+    t8 = $[10];
+  }
+  let t10;
+  let t9;
+  if ($[11] !== resolvedMaxHeight) {
+    t9 = (e) => {
+      const val = e.target.value;
+      e.target.value = "";
+      e.target.value = val;
+      e.target.style.height = "auto";
+      e.target.style.height = `${Math.min(e.target.scrollHeight, resolvedMaxHeight)}px`;
+    };
+    t10 = (e_0) => {
+      e_0.target.style.height = "auto";
+      e_0.target.style.height = `${Math.min(e_0.target.scrollHeight, resolvedMaxHeight)}px`;
+    };
+    $[11] = resolvedMaxHeight;
+    $[12] = t10;
+    $[13] = t9;
+  } else {
+    t10 = $[12];
+    t9 = $[13];
+  }
+  let t11;
+  let t12;
+  if ($[14] !== onCancel || $[15] !== onSave) {
+    t11 = (e_1) => {
+      onSave(e_1.target.value || null);
+      onCancel();
+    };
+    t12 = (e_2) => {
+      if (e_2.key === "Enter" && !e_2.shiftKey) {
+        e_2.preventDefault();
+        onSave(e_2.currentTarget.value || null);
+        onCancel();
+      }
+      if (e_2.key === "Escape") {
+        onCancel();
+      }
+    };
+    $[14] = onCancel;
+    $[15] = onSave;
+    $[16] = t11;
+    $[17] = t12;
+  } else {
+    t11 = $[16];
+    t12 = $[17];
+  }
+  let t13;
+  if ($[18] !== displayValue || $[19] !== t10 || $[20] !== t11 || $[21] !== t12 || $[22] !== t9) {
+    t13 = /* @__PURE__ */ jsx("textarea", { className: "w-full h-full bg-transparent outline-none border-none ring-0 font-mono text-[13px] text-text-primary dark:text-text-primary-dark px-4 py-1.5 resize-none overflow-y-auto", defaultValue: displayValue, autoFocus: true, style: t8, onFocus: t9, onChange: t10, onBlur: t11, onKeyDown: t12 });
+    $[18] = displayValue;
+    $[19] = t10;
+    $[20] = t11;
+    $[21] = t12;
+    $[22] = t9;
+    $[23] = t13;
+  } else {
+    t13 = $[23];
+  }
+  let t14;
+  if ($[24] !== t13 || $[25] !== t7) {
+    t14 = createPortal(/* @__PURE__ */ jsx("div", { className: "fixed z-[9999] bg-surface-50 dark:bg-surface-900 border-2 border-primary dark:border-primary-dark shadow-xl flex flex-col", style: t7, children: t13 }), document.body);
+    $[24] = t13;
+    $[25] = t7;
+    $[26] = t14;
+  } else {
+    t14 = $[26];
+  }
+  let t15;
+  if ($[27] !== t14) {
+    t15 = /* @__PURE__ */ jsx("div", { ref: anchorRef, className: "w-full h-full min-h-[20px]", children: t14 });
+    $[27] = t14;
+    $[28] = t15;
+  } else {
+    t15 = $[28];
+  }
+  return t15;
+};
+const SQLEditor = () => {
+  const {
+    databaseAdmin
+  } = useRebaseContext();
+  const sideEntityController = useStudioSideEntityController();
+  const snackbarController = useSnackbarController();
+  const collectionRegistry = useStudioCollectionRegistry();
+  const {
+    t
+  } = useTranslation();
+  const [schemas, setSchemas] = useState({});
+  const [isSchemaLoading, setIsSchemaLoading] = useState(true);
+  const schemaFetchedRef = useRef(false);
+  const [schemaError, setSchemaError] = useState(null);
+  const [selectedDatabase, setSelectedDatabase] = useState(() => {
+    return localStorage.getItem("rebase_sql_selected_db") || void 0;
+  });
+  const [selectedRole, setSelectedRole] = useState(() => {
+    return localStorage.getItem("rebase_sql_selected_role") || void 0;
+  });
+  const [availableDatabases, setAvailableDatabases] = useState([]);
+  const [availableRoles, setAvailableRoles] = useState([]);
+  const [isLoadingConfig, setIsLoadingConfig] = useState(true);
+  const [connectionConfigError, setConnectionConfigError] = useState(null);
+  const [tabs, setTabs] = useState(() => {
+    const saved = localStorage.getItem(STORAGE_KEY_TABS);
+    if (saved) {
+      const parsed = JSON.parse(saved);
+      return parsed.map((t_0) => ({
+        ...t_0,
+        results: null,
+        loading: false,
+        error: null,
+        execTime: null,
+        lastExecutedSql: null
+      }));
+    }
+    return [{
+      id: "1",
+      name: "Query 1",
+      sql: "SELECT * FROM ",
+      database: localStorage.getItem("rebase_sql_selected_db") || void 0,
+      role: localStorage.getItem("rebase_sql_selected_role") || void 0,
+      results: null,
+      loading: false,
+      error: null,
+      execTime: null,
+      lastExecutedSql: null
+    }];
+  });
+  const [activeTabId, setActiveTabId] = useState(() => {
+    return localStorage.getItem(STORAGE_KEY_ACTIVE_TAB) || "1";
+  });
+  const activeTab = tabs.find((t_1) => t_1.id === activeTabId) || tabs[0];
+  const updateActiveTab = useCallback((update) => {
+    setTabs((prev) => prev.map((t_2) => t_2.id === activeTabId ? {
+      ...t_2,
+      ...update
+    } : t_2));
+  }, [activeTabId]);
+  const sql = activeTab.sql;
+  const results = activeTab.results;
+  const loading = activeTab.loading;
+  const error = activeTab.error;
+  const execTime = activeTab.execTime;
+  const setSql = (newSql) => updateActiveTab({
+    sql: newSql
+  });
+  useEffect(() => {
+    let mounted = true;
+    const fetchConnectionConfig = async () => {
+      if (!databaseAdmin?.fetchAvailableDatabases || !databaseAdmin?.fetchAvailableRoles) {
+        setConnectionConfigError(t("studio_sql_sql_not_supported"));
+        setIsLoadingConfig(false);
+        return;
+      }
+      try {
+        const [dbs, roles, currentDbFromApi] = await Promise.all([databaseAdmin.fetchAvailableDatabases(), databaseAdmin.fetchAvailableRoles(), typeof databaseAdmin?.fetchCurrentDatabase === "function" ? databaseAdmin.fetchCurrentDatabase() : Promise.resolve(void 0)]);
+        if (mounted) {
+          setAvailableDatabases(dbs);
+          setAvailableRoles(roles);
+          const loadedDb = localStorage.getItem("rebase_sql_selected_db") || void 0;
+          const loadedRole = localStorage.getItem("rebase_sql_selected_role") || void 0;
+          const initialActiveTabId = localStorage.getItem(STORAGE_KEY_ACTIVE_TAB) || "1";
+          let initialTabs = [];
+          try {
+            const savedTabs = localStorage.getItem(STORAGE_KEY_TABS);
+            if (savedTabs) initialTabs = JSON.parse(savedTabs);
+          } catch (e) {
+          }
+          const currentActiveTab = initialTabs.find((t_3) => t_3.id === initialActiveTabId);
+          let actualDb = currentActiveTab?.database || loadedDb;
+          if (actualDb && !dbs.includes(actualDb)) actualDb = void 0;
+          if (!actualDb && dbs.length > 0) {
+            actualDb = currentDbFromApi && dbs.includes(currentDbFromApi) ? currentDbFromApi : dbs[0];
+          }
+          if (actualDb) {
+            setSelectedDatabase(actualDb);
+            localStorage.setItem("rebase_sql_selected_db", actualDb);
+            setTabs((prev_0) => prev_0.map((t_4) => t_4.id === initialActiveTabId && !t_4.database ? {
+              ...t_4,
+              database: actualDb
+            } : t_4));
+          }
+          let actualRole = currentActiveTab?.role || loadedRole;
+          if (actualRole && !roles.includes(actualRole)) actualRole = void 0;
+          if (!actualRole && roles.length > 0) {
+            actualRole = roles.includes("postgres") ? "postgres" : roles[0];
+          }
+          if (actualRole) {
+            setSelectedRole(actualRole);
+            localStorage.setItem("rebase_sql_selected_role", actualRole);
+            setTabs((prev_1) => prev_1.map((t_5) => t_5.id === initialActiveTabId && !t_5.role ? {
+              ...t_5,
+              role: actualRole
+            } : t_5));
+          }
+        }
+      } catch (err) {
+        console.error("Failed to fetch databases or roles:", err);
+        if (mounted) {
+          const message = err instanceof Error ? err.message : String(err);
+          setConnectionConfigError(t("studio_sql_fetch_error", {
+            message
+          }));
+        }
+      } finally {
+        if (mounted) {
+          setIsLoadingConfig(false);
+        }
+      }
+    };
+    fetchConnectionConfig();
+    return () => {
+      mounted = false;
+    };
+  }, [databaseAdmin]);
+  const handleDatabaseChange = (db, tabId) => {
+    setSelectedDatabase(db);
+    localStorage.setItem("rebase_sql_selected_db", db);
+    setTabs((prev_2) => prev_2.map((t_6) => t_6.id === activeTabId ? {
+      ...t_6,
+      database: db
+    } : t_6));
+    schemaFetchedRef.current = false;
+  };
+  const handleRoleChange = (role, tabId_0) => {
+    setSelectedRole(role);
+    localStorage.setItem("rebase_sql_selected_role", role);
+    setTabs((prev_3) => prev_3.map((t_7) => t_7.id === activeTabId ? {
+      ...t_7,
+      role
+    } : t_7));
+  };
+  const handleTabChange = useCallback((newTabId) => {
+    setActiveTabId(newTabId);
+    const newTab = tabs.find((t_8) => t_8.id === newTabId);
+    if (newTab) {
+      if (newTab.database && newTab.database !== selectedDatabase) {
+        setSelectedDatabase(newTab.database);
+        localStorage.setItem("rebase_sql_selected_db", newTab.database);
+        schemaFetchedRef.current = false;
+      } else if (!newTab.database && selectedDatabase) {
+        setTabs((prev_4) => prev_4.map((t_9) => t_9.id === newTabId ? {
+          ...t_9,
+          database: selectedDatabase
+        } : t_9));
+      }
+      if (newTab.role && newTab.role !== selectedRole) {
+        setSelectedRole(newTab.role);
+        localStorage.setItem("rebase_sql_selected_role", newTab.role);
+      } else if (!newTab.role && selectedRole) {
+        setTabs((prev_5) => prev_5.map((t_10) => t_10.id === newTabId ? {
+          ...t_10,
+          role: selectedRole
+        } : t_10));
+      }
+    }
+  }, [tabs, selectedDatabase, selectedRole]);
+  const fetchSchema = useCallback(async () => {
+    if (!databaseAdmin?.executeSql) {
+      setSchemaError(t("studio_sql_sql_not_supported"));
+      setIsSchemaLoading(false);
+      return;
+    }
+    setIsSchemaLoading(true);
+    setSchemaError(null);
+    try {
+      const sql_0 = `
+                SELECT 
+                    c.table_schema as schema, 
+                    c.table_name as "table", 
+                    c.column_name as "column",
+                    c.data_type as "data_type",
+                    CASE WHEN kcu.column_name IS NOT NULL THEN true ELSE false END as "is_pk"
+                FROM 
+                    information_schema.columns c
+                LEFT JOIN information_schema.table_constraints tc
+                    ON tc.table_schema = c.table_schema 
+                    AND tc.table_name = c.table_name 
+                    AND tc.constraint_type = 'PRIMARY KEY'
+                LEFT JOIN information_schema.key_column_usage kcu
+                    ON kcu.constraint_name = tc.constraint_name
+                    AND kcu.table_schema = tc.table_schema
+                    AND kcu.table_name = tc.table_name
+                    AND kcu.column_name = c.column_name
+                WHERE 
+                    c.table_schema NOT IN ('information_schema', 'pg_catalog')
+                ORDER BY 
+                    c.table_schema, c.table_name, c.ordinal_position;
+            `;
+      const result = await databaseAdmin.executeSql(sql_0, {
+        database: selectedDatabase
+      });
+      const processGrouped = (data) => {
+        const grouped = data.reduce((acc, curr) => {
+          const schema = curr.schema || curr.SCHEMA || curr.table_schema || "public";
+          const table = curr.table || curr.TABLE || curr.table_name;
+          const column = curr.column || curr.COLUMN || curr.column_name;
+          const dataType = curr.data_type || curr.DATA_TYPE || "";
+          const isPrimaryKey = curr.is_pk === true || curr.is_pk === "true";
+          if (!acc[schema]) acc[schema] = [];
+          let tableInfo = acc[schema].find((t_11) => t_11.tableName === table);
+          if (!tableInfo) {
+            tableInfo = {
+              schemaName: schema,
+              tableName: table,
+              columns: []
+            };
+            acc[schema].push(tableInfo);
+          }
+          tableInfo.columns.push({
+            name: column,
+            dataType,
+            isPrimaryKey
+          });
+          return acc;
+        }, {});
+        setSchemas(grouped);
+      };
+      if (!result || !Array.isArray(result)) {
+        if (result && typeof result === "object" && "rows" in result && Array.isArray(result.rows)) {
+          processGrouped(result.rows);
+        } else {
+          setSchemaError(t("studio_sql_unexpected_format", {
+            type: typeof result
+          }));
+          setSchemas({});
+        }
+      } else if (result.length === 0) {
+        setSchemas({});
+        setSchemaError(t("studio_sql_no_tables"));
+      } else {
+        processGrouped(result);
+      }
+      schemaFetchedRef.current = true;
+    } catch (e_0) {
+      console.error("Schema fetch error:", e_0);
+      const message_0 = e_0 instanceof Error ? e_0.message : String(e_0);
+      setSchemaError(t("studio_sql_schema_fetch_error", {
+        message: message_0
+      }));
+    } finally {
+      setIsSchemaLoading(false);
+    }
+  }, [databaseAdmin, selectedDatabase]);
+  useEffect(() => {
+    if (!isLoadingConfig && !schemaFetchedRef.current) {
+      fetchSchema();
+    }
+  }, [fetchSchema, isLoadingConfig, selectedDatabase]);
+  const [autoLimit, setAutoLimit] = useState(true);
+  const [isConfirmDialogOpen, setIsConfirmDialogOpen] = useState(false);
+  const [pendingAction, setPendingAction] = useState(null);
+  const [editingCell, setEditingCell] = useState(null);
+  const handleDoubleClick = useCallback((rowIndex, columnKey, initialValue, rowData) => {
+    if (!activeTab.lastExecutedSql) {
+      snackbarController.open({
+        type: "error",
+        message: t("studio_sql_cannot_edit_missing_query")
+      });
+      return;
+    }
+    const resolution = determineTableAndPK(activeTab.lastExecutedSql, columnKey, schemas);
+    if (resolution.error || !resolution.primaryKeys || resolution.primaryKeys.length === 0) {
+      snackbarController.open({
+        type: "error",
+        message: resolution.error || t("studio_sql_cannot_resolve_table")
+      });
+      return;
+    }
+    const missingPKs = resolution.primaryKeys.filter((pk) => rowData[pk.resultColumn] === void 0 || rowData[pk.resultColumn] === null);
+    if (missingPKs.length > 0) {
+      snackbarController.open({
+        type: "error",
+        message: t("studio_sql_missing_pk", {
+          columns: missingPKs.map((pk_0) => `"${pk_0.resultColumn}"`).join(", ")
+        })
+      });
+      return;
+    }
+    setEditingCell({
+      rowIndex,
+      columnKey,
+      initialValue
+    });
+  }, [activeTab.lastExecutedSql, schemas, snackbarController]);
+  const handleCellSave = useCallback(async (newValue, rowData_0, columnKey_0, rowIndex_0) => {
+    if (!editingCell || !activeTab.lastExecutedSql) return;
+    setEditingCell(null);
+    if (newValue === editingCell.initialValue) return;
+    const resolution_0 = determineTableAndPK(activeTab.lastExecutedSql, columnKey_0, schemas);
+    if (resolution_0.error || !resolution_0.tableName || !resolution_0.primaryKeys || resolution_0.primaryKeys.length === 0) {
+      snackbarController.open({
+        type: "error",
+        message: resolution_0.error || "Resolution failed."
+      });
+      return;
+    }
+    const tableName = resolution_0.tableName;
+    const formatValue = (val) => {
+      if (val === null || val === void 0) return "NULL";
+      if (typeof val === "number") return val;
+      if (typeof val === "boolean") return val ? "TRUE" : "FALSE";
+      return `'${String(val).replace(/'/g, "''")}'`;
+    };
+    const resolveDbColumnName = (resultColKey) => {
+      try {
+        const ast = parseFirst(activeTab.lastExecutedSql);
+        if (ast.type === "select" && ast.columns) {
+          for (const col of ast.columns) {
+            if (col.expr?.type === "ref") {
+              const alias = col.alias?.name;
+              const colName = col.expr.name;
+              if (alias === resultColKey || !alias && colName === resultColKey) {
+                return colName;
+              }
+            }
+          }
+        }
+      } catch {
+      }
+      return resultColKey;
+    };
+    const dbColumnName = resolveDbColumnName(columnKey_0);
+    const whereConditions = resolution_0.primaryKeys.map((pk_1) => `"${pk_1.dbColumn}" = ${formatValue(rowData_0[pk_1.resultColumn])}`).join(" AND ");
+    const updateSql = `UPDATE "${tableName}" SET "${dbColumnName}" = ${formatValue(newValue)} WHERE ${whereConditions};`;
+    try {
+      if (databaseAdmin?.executeSql) {
+        await databaseAdmin.executeSql(updateSql, {
+          database: selectedDatabase,
+          role: selectedRole
+        });
+        const newResults_0 = [...activeTab.results || []];
+        if (newResults_0[rowIndex_0]) {
+          newResults_0[rowIndex_0] = {
+            ...newResults_0[rowIndex_0],
+            [columnKey_0]: newValue
+          };
+        }
+        updateActiveTab({
+          results: newResults_0
+        });
+        snackbarController.open({
+          type: "success",
+          message: t("studio_sql_row_updated")
+        });
+      }
+    } catch (e_1) {
+      snackbarController.open({
+        type: "error",
+        message: t("studio_sql_update_failed", {
+          message: e_1 instanceof Error ? e_1.message : String(e_1)
+        })
+      });
+    }
+  }, [editingCell, schemas, activeTab.lastExecutedSql, activeTab.results, databaseAdmin, updateActiveTab, snackbarController, selectedDatabase, selectedRole]);
+  const [columnWidths, setColumnWidths] = useState(() => {
+    const saved_0 = localStorage.getItem("rebase_sql_column_widths");
+    return saved_0 ? JSON.parse(saved_0) : {};
+  });
+  const [snippets, setSnippets] = useState([]);
+  const [history, setHistory] = useState([]);
+  const [isSaveDialogOpen, setIsSaveDialogOpen] = useState(false);
+  const [newSnippetName, setNewSnippetName] = useState("");
+  useEffect(() => {
+    const savedSnippets = localStorage.getItem("rebase_sql_snippets");
+    if (savedSnippets) setSnippets(JSON.parse(savedSnippets));
+    const savedHistory = localStorage.getItem("rebase_sql_history");
+    if (savedHistory) setHistory(JSON.parse(savedHistory));
+  }, []);
+  useEffect(() => {
+    const sanitizedTabs = tabs.map((t_12) => ({
+      id: t_12.id,
+      name: t_12.name,
+      sql: t_12.sql,
+      database: t_12.database,
+      role: t_12.role
+    }));
+    localStorage.setItem(STORAGE_KEY_TABS, JSON.stringify(sanitizedTabs));
+  }, [tabs]);
+  useEffect(() => {
+    localStorage.setItem(STORAGE_KEY_ACTIVE_TAB, activeTabId);
+  }, [activeTabId]);
+  const saveSnippets = (newSnippets) => {
+    setSnippets(newSnippets);
+    localStorage.setItem("rebase_sql_snippets", JSON.stringify(newSnippets));
+  };
+  const saveHistory = (newHistory) => {
+    setHistory(newHistory);
+    localStorage.setItem("rebase_sql_history", JSON.stringify(newHistory.slice(-50)));
+  };
+  const handleDeleteSnippet = (id) => {
+    saveSnippets(snippets.filter((s) => s.id !== id));
+  };
+  const handleAddTab = () => {
+    const newId = Math.random().toString(36).substring(2, 9);
+    let maxNumber = 0;
+    tabs.forEach((tab) => {
+      const match = tab.name.match(/^Query (\d+)$/);
+      if (match) {
+        const num = parseInt(match[1], 10);
+        if (num > maxNumber) maxNumber = num;
+      }
+    });
+    const name = `Query ${maxNumber + 1}`;
+    setTabs((prev_6) => [...prev_6, {
+      id: newId,
+      name,
+      sql: "SELECT * FROM ",
+      database: selectedDatabase,
+      role: selectedRole,
+      results: null,
+      loading: false,
+      error: null,
+      execTime: null,
+      lastExecutedSql: null
+    }]);
+    setActiveTabId(newId);
+  };
+  const handleCloseTab = (id_0, e_2) => {
+    e_2.stopPropagation();
+    if (tabs.length === 1) return;
+    const tabIndex = tabs.findIndex((t_13) => t_13.id === id_0);
+    const newTabs = tabs.filter((t_14) => t_14.id !== id_0);
+    setTabs(newTabs);
+    if (activeTabId === id_0) {
+      const nextIndex = Math.min(tabIndex, newTabs.length - 1);
+      if (newTabs[nextIndex]) {
+        setActiveTabId(newTabs[nextIndex].id);
+      }
+    }
+  };
+  const handleColumnResize = useCallback(({
+    key,
+    width
+  }) => {
+    setColumnWidths((prev_7) => {
+      const newWidths = {
+        ...prev_7,
+        [activeTab.sql]: {
+          ...prev_7[activeTab.sql] || {},
+          [key]: width
+        }
+      };
+      localStorage.setItem("rebase_sql_column_widths", JSON.stringify(newWidths));
+      return newWidths;
+    });
+  }, [activeTab.sql]);
+  const handlePrettify = () => {
+    const formatted = activeTab.sql.replace(/\s+/g, " ").replace(/\s?,\s?/g, ", ").replace(/\s?=\s?/g, " = ").trim();
+    setSql(formatted);
+  };
+  const handleExplain = async () => {
+    const explainSql = `EXPLAIN (FORMAT JSON, ANALYZE) ${activeTab.sql}`;
+    updateActiveTab({
+      loading: true,
+      error: null,
+      results: null
+    });
+    const start = performance.now();
+    try {
+      if (databaseAdmin?.executeSql) {
+        const result_0 = await databaseAdmin.executeSql(explainSql, {
+          database: selectedDatabase,
+          role: selectedRole
+        });
+        updateActiveTab({
+          results: result_0,
+          execTime: Math.round(performance.now() - start)
+        });
+      }
+    } catch (e_3) {
+      const message_1 = e_3 instanceof Error ? e_3.message : String(e_3);
+      updateActiveTab({
+        error: message_1 || t("studio_sql_error_explaining")
+      });
+    } finally {
+      updateActiveTab({
+        loading: false
+      });
+    }
+  };
+  const executeRun = useCallback(async (sqlOverride) => {
+    let sqlToRun = sqlOverride || activeTab.sql;
+    const upperSql = sqlToRun.toUpperCase();
+    const isAggregate = /\b(COUNT|SUM|AVG|MIN|MAX)\s*\(/i.test(sqlToRun);
+    const isExplain = /\bEXPLAIN\b/i.test(sqlToRun);
+    if (autoLimit && upperSql.includes("SELECT") && !upperSql.includes("LIMIT") && !isAggregate && !isExplain) {
+      sqlToRun = sqlToRun.trim().replace(/;$/, "");
+      sqlToRun = `${sqlToRun} LIMIT 1000;`;
+    }
+    updateActiveTab({
+      loading: true,
+      error: null,
+      results: null
+    });
+    const start_0 = performance.now();
+    try {
+      if (databaseAdmin?.executeSql) {
+        const result_1 = await databaseAdmin.executeSql(sqlToRun, {
+          database: selectedDatabase,
+          role: selectedRole
+        });
+        updateActiveTab({
+          results: result_1,
+          execTime: Math.round(performance.now() - start_0),
+          lastExecutedSql: sqlToRun
+        });
+        if (history[history.length - 1] !== activeTab.sql) {
+          saveHistory([...history, activeTab.sql]);
+        }
+      } else {
+        updateActiveTab({
+          error: t("studio_sql_execution_not_supported")
+        });
+      }
+    } catch (e_4) {
+      const message_2 = e_4 instanceof Error ? e_4.message : String(e_4);
+      updateActiveTab({
+        error: message_2 || t("studio_sql_error_executing")
+      });
+    } finally {
+      updateActiveTab({
+        loading: false
+      });
+    }
+  }, [activeTab.sql, autoLimit, databaseAdmin, history, updateActiveTab]);
+  const handleRun = useCallback(async (selectedText) => {
+    const sqlTarget = selectedText || activeTab.sql;
+    if (!sqlTarget.trim()) return;
+    const destructiveKeywords = ["DELETE", "DROP", "TRUNCATE", "UPDATE"];
+    const hasDestructive = destructiveKeywords.some((kw) => sqlTarget.toUpperCase().includes(kw));
+    const hasWhere = sqlTarget.toUpperCase().includes("WHERE");
+    if (hasDestructive && (!hasWhere || sqlTarget.toUpperCase().includes("DROP") || sqlTarget.toUpperCase().includes("TRUNCATE"))) {
+      setPendingAction(() => () => executeRun(selectedText));
+      setIsConfirmDialogOpen(true);
+      return;
+    }
+    executeRun(selectedText);
+  }, [activeTab.sql, executeRun]);
+  useEffect(() => {
+    const handleKeyDown = (e_5) => {
+      if ((e_5.metaKey || e_5.ctrlKey) && e_5.key === "Enter") {
+        const activeElement = document.activeElement;
+        const isInput = activeElement?.tagName === "INPUT" || activeElement?.tagName === "TEXTAREA";
+        const isMonaco = activeElement?.className?.includes("monaco-mouse-cursor-text");
+        if (!isMonaco && !isInput) {
+          e_5.preventDefault();
+          handleRun();
+        }
+      }
+    };
+    window.addEventListener("keydown", handleKeyDown);
+    return () => window.removeEventListener("keydown", handleKeyDown);
+  }, [handleRun]);
+  const handleSaveSnippet = () => {
+    if (!newSnippetName.trim() || !sql.trim()) return;
+    const newSnippet = {
+      id: Math.random().toString(36).substring(2, 9),
+      name: newSnippetName,
+      sql,
+      createdAt: Date.now()
+    };
+    saveSnippets([...snippets, newSnippet]);
+    setNewSnippetName("");
+    setIsSaveDialogOpen(false);
+    snackbarController.open({
+      type: "success",
+      message: t("studio_sql_snippet_saved", {
+        name: newSnippetName
+      })
+    });
+  };
+  const handleExportCSV = () => {
+    if (!results || results.length === 0) return;
+    const headers = Object.keys(results[0]).join(",");
+    const rows = results.map((row) => Object.values(row).map((val_0) => {
+      const str = String(val_0);
+      return str.includes(",") ? `"${str}"` : str;
+    }).join(","));
+    const csv = [headers, ...rows].join("\n");
+    const blob = new Blob([csv], {
+      type: "text/csv"
+    });
+    const url = window.URL.createObjectURL(blob);
+    const a = document.createElement("a");
+    a.href = url;
+    a.download = `query_results_${(/* @__PURE__ */ new Date()).toISOString().slice(0, 19)}.csv`;
+    a.click();
+    window.URL.revokeObjectURL(url);
+  };
+  const handleExportJSON = () => {
+    if (!results || results.length === 0) return;
+    const json = JSON.stringify(results, null, 2);
+    const blob_0 = new Blob([json], {
+      type: "application/json"
+    });
+    const url_0 = window.URL.createObjectURL(blob_0);
+    const a_0 = document.createElement("a");
+    a_0.href = url_0;
+    a_0.download = `query_results_${(/* @__PURE__ */ new Date()).toISOString().slice(0, 19)}.json`;
+    a_0.click();
+    window.URL.revokeObjectURL(url_0);
+  };
+  const handleExportMarkdown = () => {
+    if (!results || results.length === 0) return;
+    const headers_0 = Object.keys(results[0]);
+    const headerRow = `| ${headers_0.join(" | ")} |`;
+    const dividerRow = `| ${headers_0.map(() => "---").join(" | ")} |`;
+    const dataRows = results.map((row_0) => `| ${headers_0.map((header) => {
+      const val_1 = row_0[header];
+      if (val_1 === null) return "null";
+      if (val_1 === void 0) return "";
+      return String(val_1).replace(/\|/g, "\\|").replace(/\n/g, " ");
+    }).join(" | ")} |`);
+    const markdown = [headerRow, dividerRow, ...dataRows].join("\n");
+    navigator.clipboard.writeText(markdown).then(() => {
+      snackbarController.open({
+        type: "success",
+        message: t("studio_sql_markdown_copied")
+      });
+    }).catch(() => {
+      snackbarController.open({
+        type: "error",
+        message: t("studio_sql_markdown_copy_failed")
+      });
+    });
+  };
+  const renderResults = () => {
+    if (loading) {
+      return /* @__PURE__ */ jsx("div", { className: "flex-grow flex items-center justify-center", children: /* @__PURE__ */ jsxs("div", { className: "text-center", children: [
+        /* @__PURE__ */ jsx(CircularProgress, { size: "medium" }),
+        /* @__PURE__ */ jsx(Typography, { variant: "body2", className: "mt-4 text-text-secondary dark:text-text-secondary-dark font-mono tracking-tight animate-pulse", children: t("studio_sql_executing_query") })
+      ] }) });
+    }
+    if (error) {
+      return /* @__PURE__ */ jsx("div", { className: "flex-grow flex items-center justify-center p-6 overflow-auto", children: /* @__PURE__ */ jsx(ErrorView, { title: t("studio_sql_query_error"), error }) });
+    }
+    if (!results) {
+      return /* @__PURE__ */ jsx("div", { className: "flex-grow flex items-center justify-center text-text-disabled dark:text-text-disabled-dark", children: /* @__PURE__ */ jsxs("div", { className: "text-center", children: [
+        /* @__PURE__ */ jsx("svg", { className: "w-12 h-12 mx-auto mb-4 opacity-50", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1, d: "M4 7v10c0 2.21 3.582 4 8 4s8-1.79 8-4V7M4 7c0 2.21 3.582 4 8 4s8-1.79 8-4M4 7c0-2.21 3.582-4 8-4s8 1.79 8 4m0 5c0 2.21-3.582 4-8 4s-8-1.79-8-4" }) }),
+        /* @__PURE__ */ jsx(Typography, { variant: "body2", children: t("studio_sql_run_query_placeholder") })
+      ] }) });
+    }
+    if (results.length === 1 && results[0]["QUERY PLAN"] && Array.isArray(results[0]["QUERY PLAN"])) {
+      try {
+        const plan = results[0]["QUERY PLAN"][0].Plan;
+        if (plan) {
+          return /* @__PURE__ */ jsxs("div", { className: "flex-grow overflow-auto p-4 bg-surface-50 dark:bg-surface-900 flex flex-col items-start", children: [
+            /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "font-bold text-text-secondary mb-4 tracking-wider uppercase", children: t("studio_sql_visual_execution_plan") }),
+            /* @__PURE__ */ jsx("div", { className: "pb-12", children: /* @__PURE__ */ jsx(ExplainVisualizer, { plan }) })
+          ] });
+        }
+      } catch (e_6) {
+        console.warn("Failed to parse EXPLAIN JSON output:", e_6);
+      }
+    }
+    if (results.length === 0) {
+      return /* @__PURE__ */ jsxs("div", { className: "flex-grow p-6 flex flex-col items-center justify-center", children: [
+        /* @__PURE__ */ jsx(Typography, { variant: "body2", className: "text-text-secondary dark:text-text-secondary-dark font-mono border-b border-surface-200 dark:border-surface-950 pb-2 mb-2", children: t("studio_sql_success") }),
+        /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "text-text-disabled dark:text-text-disabled-dark", children: t("studio_sql_no_results") })
+      ] });
+    }
+    const savedWidths = columnWidths[activeTab.sql] || {};
+    const resultColumnKeys = Object.keys(results[0]);
+    const matchedCollections = (() => {
+      if (!activeTab.lastExecutedSql || !collectionRegistry.collections) return [];
+      try {
+        return resolveQueryCollections(activeTab.lastExecutedSql, schemas, collectionRegistry.collections, resultColumnKeys);
+      } catch {
+        return [];
+      }
+    })();
+    const actionableCollections = matchedCollections.filter((mc) => mc.pkColumn && resultColumnKeys.includes(mc.pkColumn));
+    const getRowEntityActions = (rowData_1) => {
+      if (!rowData_1) return [];
+      return actionableCollections.filter((mc_0) => rowData_1[mc_0.pkColumn] != null).map((mc_1) => ({
+        collection: mc_1,
+        entityId: rowData_1[mc_1.pkColumn]
+      }));
+    };
+    const dataColumns = resultColumnKeys.map((key_0) => ({
+      key: key_0,
+      title: key_0,
+      width: savedWidths[key_0] ?? 150,
+      sortable: false,
+      resizable: true
+    }));
+    const columns = actionableCollections.length > 0 ? [{
+      key: "__cms_action__",
+      title: "",
+      width: 36,
+      sortable: false,
+      resizable: false
+    }, ...dataColumns] : dataColumns;
+    return /* @__PURE__ */ jsxs("div", { className: "flex-grow flex flex-col overflow-hidden min-h-0", children: [
+      actionableCollections.length > 0 && /* @__PURE__ */ jsxs("div", { className: cls("px-4 py-1.5 border-b flex items-center gap-2 shrink-0 bg-surface-50 dark:bg-surface-900", defaultBorderMixin), children: [
+        /* @__PURE__ */ jsx(Tooltip, { title: t("studio_sql_cms_collections_tooltip"), children: /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "text-[10px] font-bold uppercase tracking-widest text-text-disabled dark:text-text-disabled-dark mr-1 shrink-0 cursor-help", children: t("studio_sql_cms") }) }),
+        /* @__PURE__ */ jsx("div", { className: "flex items-center gap-1.5 overflow-x-auto no-scrollbar", children: actionableCollections.map((mc_2) => /* @__PURE__ */ jsx(Tooltip, { title: `Table "${mc_2.tableName}" → ${mc_2.collection.name} (PK: ${mc_2.pkColumn})`, children: /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-1 px-2 py-0.5 rounded-full text-[11px] font-medium bg-primary/10 dark:bg-primary-dark/15 text-primary dark:text-primary-dark whitespace-nowrap border border-primary/20 dark:border-primary-dark/20", children: [
+          typeof mc_2.collection.icon === "string" && /* @__PURE__ */ jsx(IconForView, { collectionOrView: mc_2.collection, className: "text-[12px]" }),
+          mc_2.collection.name
+        ] }) }, mc_2.tableName)) })
+      ] }),
+      /* @__PURE__ */ jsx("div", { className: "flex-grow relative h-full min-h-0 min-w-0", children: /* @__PURE__ */ jsx(VirtualTable, { data: results, columns, rowHeight: 32, headerHeight: 32, extraData: editingCell, onColumnResizeEnd: handleColumnResize, cellRenderer: ({
+        rowData: rowData_2,
+        column: column_0,
+        rowIndex: rowIndex_1
+      }) => {
+        if (column_0.key === "__cms_action__") {
+          const rowActions = getRowEntityActions(rowData_2);
+          if (rowActions.length === 0) {
+            return /* @__PURE__ */ jsx("div", { className: "h-full w-full" });
+          }
+          if (rowActions.length === 1) {
+            const ra = rowActions[0];
+            return /* @__PURE__ */ jsx("div", { className: "h-full flex items-center justify-center", children: /* @__PURE__ */ jsx(Tooltip, { title: t("studio_sql_edit_entity", {
+              name: ra.collection.collection.name,
+              id: String(ra.entityId)
+            }), children: /* @__PURE__ */ jsx(IconButton, { size: "small", className: "text-surface-400 dark:text-surface-500 hover:text-surface-600 dark:hover:text-surface-300 transition-colors", onClick: (e_7) => {
+              e_7.stopPropagation();
+              sideEntityController?.open({
+                path: ra.collection.collection.slug,
+                entityId: ra.entityId,
+                collection: ra.collection.collection,
+                updateUrl: false
+              });
+            }, children: /* @__PURE__ */ jsx(PencilIcon, { size: iconSize.smallest }) }) }) });
+          }
+          return /* @__PURE__ */ jsx("div", { className: "h-full flex items-center justify-center", children: /* @__PURE__ */ jsx(Menu, { trigger: /* @__PURE__ */ jsx(IconButton, { size: "small", className: "text-surface-400 dark:text-surface-500 hover:text-surface-600 dark:hover:text-surface-300 transition-colors", onClick: (e_8) => e_8.stopPropagation(), children: /* @__PURE__ */ jsx(MoreVerticalIcon, { size: iconSize.smallest }) }), children: rowActions.map((ra_0) => /* @__PURE__ */ jsx(MenuItem, { dense: true, onClick: () => {
+            sideEntityController?.open({
+              path: ra_0.collection.collection.slug,
+              entityId: ra_0.entityId,
+              collection: ra_0.collection.collection,
+              updateUrl: false
+            });
+          }, children: t("studio_sql_edit_entity", {
+            name: ra_0.collection.collection.name,
+            id: String(ra_0.entityId)
+          }) }, ra_0.collection.tableName)) }) });
+        }
+        const isEditing = editingCell?.rowIndex === rowIndex_1 && editingCell?.columnKey === column_0.key;
+        const value = rowData_2 ? rowData_2[column_0.key] : null;
+        const displayValue = typeof value === "object" && value !== null ? JSON.stringify(value) : String(value ?? "");
+        if (isEditing) {
+          return /* @__PURE__ */ jsx(FixedEditorOverlay, { displayValue, onSave: (val_2) => handleCellSave(val_2, rowData_2, column_0.key, rowIndex_1), onCancel: () => setEditingCell(null) });
+        }
+        return /* @__PURE__ */ jsx("div", { className: "px-4 py-1.5 h-full flex items-center whitespace-nowrap text-[13px] text-text-primary dark:text-text-primary-dark font-mono cursor-text group/cell", onDoubleClick: () => handleDoubleClick(rowIndex_1, column_0.key, displayValue, rowData_2), children: /* @__PURE__ */ jsx("div", { className: "truncate flex-grow", title: displayValue, children: displayValue === "" ? /* @__PURE__ */ jsx("span", { className: "text-text-disabled dark:text-text-disabled-dark italic text-[11px]", children: "NULL" }) : displayValue }) });
+      } }) }),
+      /* @__PURE__ */ jsxs("div", { className: cls("p-2 px-4 border-t bg-surface-50 dark:bg-surface-900 flex justify-between items-center shrink-0", defaultBorderMixin), children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex space-x-4", children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center text-[11px]", children: [
+            /* @__PURE__ */ jsx("span", { className: "font-bold text-text-disabled dark:text-text-disabled-dark mr-2 uppercase tracking-tighter", children: t("studio_sql_rows") }),
+            /* @__PURE__ */ jsx("span", { className: "font-mono text-text-secondary dark:text-text-secondary-dark", children: results.length })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center text-[11px]", children: [
+            /* @__PURE__ */ jsx("span", { className: "font-bold text-text-disabled dark:text-text-disabled-dark mr-2 uppercase tracking-tighter", children: t("studio_sql_time") }),
+            /* @__PURE__ */ jsxs("span", { className: "font-mono text-text-secondary dark:text-text-secondary-dark", children: [
+              execTime,
+              "ms"
+            ] })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "flex gap-2 overflow-x-auto no-scrollbar items-center px-2", children: [
+          /* @__PURE__ */ jsx(Button, { size: "small", variant: "text", className: "text-[10px] uppercase font-bold text-text-secondary dark:text-text-secondary-dark whitespace-nowrap", onClick: handleExportMarkdown, children: t("studio_sql_copy_markdown") }),
+          /* @__PURE__ */ jsx(Button, { size: "small", variant: "text", className: "text-[10px] uppercase font-bold text-text-secondary dark:text-text-secondary-dark whitespace-nowrap", onClick: handleExportJSON, children: t("studio_sql_export_json") }),
+          /* @__PURE__ */ jsx(Button, { size: "small", variant: "text", className: "text-[10px] uppercase font-bold text-text-secondary dark:text-text-secondary-dark whitespace-nowrap", onClick: handleExportCSV, children: t("studio_sql_export_csv") })
+        ] })
+      ] })
+    ] });
+  };
+  const [sidebarSize, setSidebarSize] = useState(() => {
+    try {
+      const saved_1 = localStorage.getItem("rebase_sql_editor_sidebar_size");
+      return saved_1 !== null ? parseFloat(saved_1) : 20;
+    } catch (e_9) {
+      return 20;
+    }
+  });
+  const [editorHeight, setEditorHeight] = useState(() => {
+    try {
+      const saved_2 = localStorage.getItem("rebase_sql_editor_height");
+      return saved_2 !== null ? parseFloat(saved_2) : 50;
+    } catch (e_10) {
+      return 50;
+    }
+  });
+  useEffect(() => {
+    try {
+      localStorage.setItem("rebase_sql_editor_sidebar_size", sidebarSize.toString());
+    } catch (e_11) {
+    }
+  }, [sidebarSize]);
+  useEffect(() => {
+    try {
+      localStorage.setItem("rebase_sql_editor_height", editorHeight.toString());
+    } catch (e_12) {
+    }
+  }, [editorHeight]);
+  const activeSnippet = snippets.find((s_0) => s_0.sql === activeTab.sql);
+  const isFavorite = activeSnippet?.isFavorite || false;
+  return /* @__PURE__ */ jsxs("div", { className: "flex h-full w-full bg-white dark:bg-surface-950 overflow-hidden text-text-primary dark:text-text-primary-dark", children: [
+    /* @__PURE__ */ jsx(ResizablePanels, { orientation: "horizontal", panelSizePercent: sidebarSize, onPanelSizeChange: setSidebarSize, minPanelSizePx: 220, firstPanel: /* @__PURE__ */ jsx(SQLEditorSidebar, { snippets, history, onSelectSnippet: setSql, onTableClick: setSql, onDeleteSnippet: handleDeleteSnippet, schemas, isSchemaLoading, schemaError, onRetrySchema: fetchSchema }), secondPanel: /* @__PURE__ */ jsxs("div", { className: "flex-grow flex flex-col min-w-0 h-full w-full", children: [
+      /* @__PURE__ */ jsxs("div", { className: cls("flex items-center justify-between pr-2 border-b bg-white dark:bg-surface-950", defaultBorderMixin), children: [
+        /* @__PURE__ */ jsx("div", { className: "flex items-center flex-grow overflow-hidden mr-4", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center no-scrollbar overflow-x-auto min-w-0", children: [
+          /* @__PURE__ */ jsx(Tabs, { value: activeTabId, onValueChange: handleTabChange, variant: "boxy", className: "w-[unset] flex-shrink-0", innerClassName: "bg-white dark:bg-surface-950", children: tabs.map((tab_0) => /* @__PURE__ */ jsxs(Tab, { value: tab_0.id, className: "flex items-center justify-between group max-w-[200px]", children: [
+            /* @__PURE__ */ jsx(TerminalIcon, { size: iconSize.smallest, className: "text-blue-500 mr-1.5 flex-shrink-0" }),
+            /* @__PURE__ */ jsx("span", { className: "truncate", children: tab_0.name }),
+            tabs.length > 1 && /* @__PURE__ */ jsx(IconButton, { size: "smallest", onClick: (e_13) => handleCloseTab(tab_0.id, e_13), className: "ml-1 !p-0.5 opacity-0 group-hover:opacity-100 hover:text-red-500 transition-opacity", children: /* @__PURE__ */ jsx(XIcon, { size: iconSize.smallest }) })
+          ] }, tab_0.id)) }),
+          /* @__PURE__ */ jsx(IconButton, { size: "small", onClick: handleAddTab, className: "ml-2 flex-shrink-0", children: /* @__PURE__ */ jsx(PlusIcon, { size: iconSize.smallest }) })
+        ] }) }),
+        /* @__PURE__ */ jsxs("div", { className: "flex shrink-0 items-center justify-end pr-2 gap-1.5", children: [
+          /* @__PURE__ */ jsx(Tooltip, { title: t("studio_sql_format_sql"), children: /* @__PURE__ */ jsx(IconButton, { size: "small", onClick: handlePrettify, className: "text-text-secondary hover:text-text-primary transition-colors", children: /* @__PURE__ */ jsx(MenuIcon, { size: iconSize.smallest }) }) }),
+          /* @__PURE__ */ jsx(Button, { variant: "text", size: "small", onClick: handleExplain, disabled: loading, children: t("studio_sql_explain") }),
+          /* @__PURE__ */ jsx("div", { className: "h-4 w-px bg-surface-200 dark:bg-surface-950 mx-1" }),
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center space-x-2 px-2 cursor-pointer", onClick: () => setAutoLimit(!autoLimit), children: [
+            /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "text-[11px] text-text-secondary cursor-pointer select-none", children: t("studio_sql_limit_1000") }),
+            /* @__PURE__ */ jsx("input", { type: "checkbox", checked: autoLimit, onChange: (e_14) => setAutoLimit(e_14.target.checked), onClick: (e_15) => e_15.stopPropagation(), className: "w-3.5 h-3.5 rounded border-surface-300 text-primary focus:ring-primary cursor-pointer" })
+          ] }),
+          /* @__PURE__ */ jsx("div", { className: "h-4 w-px bg-surface-200 dark:bg-surface-950 mx-1" }),
+          /* @__PURE__ */ jsx(Tooltip, { title: isFavorite ? t("studio_sql_remove_from_favorites") : t("studio_sql_add_to_favorites"), children: /* @__PURE__ */ jsx(IconButton, { size: "small", onClick: () => {
+            if (!activeSnippet) {
+              snackbarController.open({
+                type: "info",
+                message: t("studio_sql_save_first_to_favorite")
+              });
+              return;
+            }
+            saveSnippets(snippets.map((s_1) => s_1.id === activeSnippet.id ? {
+              ...s_1,
+              isFavorite: !s_1.isFavorite
+            } : s_1));
+          }, children: /* @__PURE__ */ jsx("svg", { className: `w-4 h-4 ${isFavorite ? "text-red-500 fill-current" : "text-text-disabled dark:text-text-disabled-dark hover:text-text-primary"}`, fill: isFavorite ? "currentColor" : "none", stroke: "currentColor", strokeWidth: 2, viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M4.318 6.318a4.5 4.5 0 000 6.364L12 20.364l7.682-7.682a4.5 4.5 0 00-6.364-6.364L12 7.636l-1.318-1.318a4.5 4.5 0 00-6.364 0z" }) }) }) }),
+          /* @__PURE__ */ jsx(Button, { variant: "text", size: "small", onClick: () => setIsSaveDialogOpen(true), children: t("studio_sql_save") }),
+          /* @__PURE__ */ jsx("div", { className: "h-4 w-px bg-surface-200 dark:bg-surface-950 mx-1" }),
+          /* @__PURE__ */ jsx(Menu, { trigger: /* @__PURE__ */ jsxs(Button, { size: "small", variant: "outlined", className: "text-text-secondary dark:text-text-secondary-dark font-medium mr-2", children: [
+            /* @__PURE__ */ jsx(DatabaseIcon, { size: iconSize.small, className: "mr-1.5 text-text-disabled dark:text-text-disabled-dark" }),
+            /* @__PURE__ */ jsx("span", { className: "max-w-[80px] truncate", children: isLoadingConfig ? "..." : selectedDatabase || t("studio_sql_select_db") })
+          ] }), children: /* @__PURE__ */ jsxs("div", { className: "max-h-64 overflow-y-auto", children: [
+            /* @__PURE__ */ jsx("div", { className: "px-3 py-1.5 border-b border-surface-200 dark:border-surface-950 mb-1", children: /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "font-bold uppercase tracking-wider text-[9px] text-text-disabled dark:text-text-disabled-dark", children: t("studio_sql_database") }) }),
+            isLoadingConfig ? /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center p-4", children: /* @__PURE__ */ jsx(CircularProgress, { size: "small" }) }) : connectionConfigError ? /* @__PURE__ */ jsx("div", { className: "px-3 py-2 text-xs text-red-500 dark:text-red-400 max-w-[200px] break-words", children: connectionConfigError }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+              availableDatabases.map((db_0) => /* @__PURE__ */ jsx(MenuItem, { dense: true, onClick: () => handleDatabaseChange(db_0), className: cls("text-xs", selectedDatabase === db_0 && "text-primary dark:text-primary-dark"), children: db_0 }, db_0)),
+              /* @__PURE__ */ jsx("div", { className: "px-3 py-1.5 border-y border-surface-200 dark:border-surface-950 mb-1 mt-1", children: /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "font-bold uppercase tracking-wider text-[9px] text-text-disabled dark:text-text-disabled-dark", children: t("studio_sql_role") }) }),
+              availableRoles.map((role_0) => /* @__PURE__ */ jsxs(MenuItem, { dense: true, onClick: () => handleRoleChange(role_0), className: cls("text-xs", selectedRole === role_0 && "text-primary dark:text-primary-dark"), children: [
+                role_0,
+                role_0 === "postgres" ? " " + t("studio_sql_admin") : ""
+              ] }, role_0))
+            ] })
+          ] }) }),
+          /* @__PURE__ */ jsxs(Button, { onClick: () => handleRun(), disabled: loading, size: "small", color: "primary", children: [
+            loading ? /* @__PURE__ */ jsx(CircularProgress, { size: "smallest", className: "mr-2" }) : /* @__PURE__ */ jsx(PlayIcon, { size: iconSize.smallest, className: "mr-2" }),
+            t("studio_sql_run")
+          ] })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsx(ResizablePanels, { orientation: "vertical", panelSizePercent: editorHeight, onPanelSizeChange: setEditorHeight, minPanelSizePx: 100, firstPanel: /* @__PURE__ */ jsx("div", { className: "h-full w-full relative flex flex-col min-h-0", children: /* @__PURE__ */ jsx(MonacoEditor, { value: sql, onChange: (v) => setSql(v || ""), onRun: handleRun, schemas }) }), secondPanel: /* @__PURE__ */ jsxs("div", { className: "h-full w-full flex flex-col bg-surface-50 dark:bg-surface-950 overflow-hidden min-h-0", children: [
+        /* @__PURE__ */ jsx("div", { className: cls("p-2 px-4 bg-surface-100 dark:bg-surface-900 border-b shrink-0 flex items-center", defaultBorderMixin), children: /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "font-bold text-text-disabled dark:text-text-disabled-dark uppercase tracking-widest text-[10px]", children: t("studio_sql_query_results") }) }),
+        /* @__PURE__ */ jsx("div", { className: "flex-grow flex flex-col min-h-0 overflow-hidden", children: renderResults() })
+      ] }) })
+    ] }) }),
+    /* @__PURE__ */ jsxs(Dialog, { open: isSaveDialogOpen, onOpenChange: setIsSaveDialogOpen, children: [
+      /* @__PURE__ */ jsx(DialogTitle, { children: t("studio_sql_save_snippet") }),
+      /* @__PURE__ */ jsx(DialogContent, { children: /* @__PURE__ */ jsxs("div", { className: "py-4 flex flex-col gap-4", children: [
+        /* @__PURE__ */ jsx(TextField, { label: t("studio_sql_snippet_name"), autoFocus: true, placeholder: t("studio_sql_snippet_name_placeholder"), value: newSnippetName, onChange: (e_16) => setNewSnippetName(e_16.target.value), onKeyDown: (e_17) => {
+          if (e_17.key === "Enter") {
+            e_17.preventDefault();
+            handleSaveSnippet();
+          }
+        } }),
+        /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "text-text-disabled dark:text-text-disabled-dark block", children: t("studio_sql_snippet_saved_local") })
+      ] }) }),
+      /* @__PURE__ */ jsxs(DialogActions, { children: [
+        /* @__PURE__ */ jsx(Button, { variant: "text", onClick: () => setIsSaveDialogOpen(false), children: t("studio_sql_cancel") }),
+        /* @__PURE__ */ jsx(Button, { onClick: handleSaveSnippet, color: "primary", disabled: !newSnippetName.trim(), children: t("studio_sql_save") })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx(ConfirmationDialog, { open: isConfirmDialogOpen, onCancel: () => setIsConfirmDialogOpen(false), title: t("studio_sql_dangerous_operation"), body: t("studio_sql_dangerous_operation_body"), onAccept: () => {
+      if (pendingAction) pendingAction();
+      setIsConfirmDialogOpen(false);
+    } })
+  ] });
+};
+export {
+  SQLEditor
+};
+//# sourceMappingURL=SQLEditor-CkVx9vgr.js.map