Feat/workflows

apps/mesh/package.json

@@ -55,6 +55,7 @@
     "@decocms/vite-plugin": "workspace:*",
     "@hookform/resolvers": "^5.2.2",
     "@modelcontextprotocol/sdk": "1.20.2",
+    "@monaco-editor/react": "^4.7.0",
     "@opentelemetry/api": "^1.9.0",
     "@opentelemetry/exporter-prometheus": "^0.208.0",
     "@opentelemetry/exporter-trace-otlp-proto": "^0.207.0",
@@ -77,6 +78,11 @@
     "@tanstack/react-query": "^5.90.11",
     "@tanstack/react-router": "^1.139.7",
     "@tanstack/react-router-devtools": "^1.139.7",
+    "@tiptap/extension-mention": "^3.13.0",
+    "@tiptap/pm": "^3.13.0",
+    "@tiptap/react": "^3.13.0",
+    "@tiptap/starter-kit": "^3.13.0",
+    "@tiptap/suggestion": "^3.13.0",
     "@types/bun": "^1.3.1",
     "@types/pg": "^8.15.6",
     "@types/react": "^19.2.2",
@@ -98,6 +104,8 @@
     "hono": "^4.10.7",
     "idb-keyval": "^6.2.2",
     "input-otp": "^1.4.2",
+    "lucide-react": "^0.468.0",
+    "prettier": "^3.4.2",
     "jose": "^6.0.11",
     "nanoid": "^5.1.6",
     "pg": "^8.16.3",
@@ -114,7 +122,8 @@
     "vite-tsconfig-paths": "^5.1.4",
     "zod": "^3.25.76",
     "zod-from-json-schema": "0.0.5",
-    "zod-to-json-schema": "3.25.0"
+    "zod-to-json-schema": "3.25.0",
+    "zustand": "^5.0.9"
   },
   "module": "src/index.ts",
   "keywords": [

apps/mesh/src/auth/index.ts

@@ -224,6 +224,9 @@ const plugins = [
         ],
       },
     },
+    rateLimit: {
+      enabled: false,
+    },
   }),
 
   // Admin plugin for system-level super-admins

apps/mesh/src/storage/event-bus.ts

@@ -1002,7 +1002,7 @@ class KyselyEventBusStorage implements EventBusStorage {
           organization_id: organizationId,
           connection_id: connectionId,
           event_type: desiredSub.eventType,
-          publisher: desiredSub.publisher ?? null,
+          publisher: connectionId ?? desiredSub.publisher ?? null,
           filter: desiredSub.filter ?? null,
           enabled: 1,
           created_at: now,

apps/mesh/src/tools/database/index.ts

@@ -9,6 +9,76 @@ const QueryResult = z.object({
   success: z.boolean().optional(),
 });
 
+/**
+ * Safely escape and quote SQL values
+ * This is still not as safe as parameterized queries, but better than raw replacement
+ */
+function escapeSqlValue(value: any): string {
+  if (value === null || value === undefined) {
+    return "NULL";
+  }
+
+  if (typeof value === "number") {
+    return String(value);
+  }
+
+  if (typeof value === "boolean") {
+    return value ? "TRUE" : "FALSE";
+  }
+
+  if (typeof value === "string") {
+    // Escape single quotes by doubling them (SQL standard)
+    // and wrap in quotes
+    return `'${value.replace(/'/g, "''")}'`;
+  }
+
+  if (value instanceof Date) {
+    return `'${value.toISOString()}'`;
+  }
+
+  // For arrays, objects, etc - serialize to JSON string
+  return `'${JSON.stringify(value).replace(/'/g, "''")}'`;
+}
+
+/**
+ * Replace ALL placeholders (?, $1, $2, etc.) with escaped values
+ *
+ * IMPORTANT: We find all placeholder positions FIRST, then replace from end to start.
+ * This prevents ? characters inside interpolated values from being treated as placeholders.
+ */
+function interpolateParams(sql: string, params: any[]): string {
+  // First, handle $1, $2, etc. style placeholders (unambiguous)
+  let result = sql;
+  for (let i = params.length; i >= 1; i--) {
+    const placeholder = `$${i}`;
+    if (result.includes(placeholder)) {
+      result = result.replaceAll(placeholder, escapeSqlValue(params[i - 1]));
+    }
+  }
+
+  // For ? placeholders, find all positions FIRST, then replace from end to start
+  // This prevents ? inside interpolated values from being matched
+  const questionMarkPositions: number[] = [];
+  for (let i = 0; i < result.length; i++) {
+    if (result[i] === "?") {
+      questionMarkPositions.push(i);
+    }
+  }
+
+  // Replace from end to start so positions don't shift
+  for (
+    let i = Math.min(questionMarkPositions.length, params.length) - 1;
+    i >= 0;
+    i--
+  ) {
+    const pos = questionMarkPositions[i];
+    const escaped = escapeSqlValue(params[i]);
+    result = result.slice(0, pos!) + escaped + result.slice(pos! + 1);
+  }
+
+  return result;
+}
+
 export type QueryResult = z.infer<typeof QueryResult>;
 
 const DatatabasesRunSqlInputSchema = z.object({
@@ -136,14 +206,13 @@ export const DATABASES_RUN_SQL = defineTool({
   description: "Run a SQL query against the database",
 
   inputSchema: DatatabasesRunSqlInputSchema,
-  outputSchema: z.lazy(() =>
-    z.object({
-      result: z.array(QueryResult),
-    }),
-  ),
+  outputSchema: z.object({
+    result: z.array(QueryResult),
+  }),
   handler: async (input, ctx) => {
     requireAuth(ctx);
     await ctx.access.check();
+    const sqlQuery = interpolateParams(input.sql, input.params || []);
 
     if (!ctx.connectionId) {
       throw new Error("Connection context required for database access");
@@ -152,15 +221,6 @@ export const DATABASES_RUN_SQL = defineTool({
     const schemaName = getSchemaName(ctx.connectionId);
     const roleName = getRoleName(ctx.connectionId);
 
-    let sqlQuery = input.sql;
-    for (let i = 0; i < (input.params?.length ?? 0); i++) {
-      const param = input.params?.[i];
-      sqlQuery = sqlQuery.replace(
-        `?`,
-        typeof param === "string" ? `'${param}'` : `${param}`,
-      );
-    }
-
     const result = await executeWithIsolation(
       ctx.db,
       schemaName,

apps/mesh/src/web/components/details/layout.tsx

@@ -1,75 +1,82 @@
 import { Button } from "@deco/ui/components/button.tsx";
 import { ArrowLeft } from "@untitledui/icons";
-import { type ReactNode, useEffect, useState } from "react";
+import { createContext, type ReactNode, useContext, useState } from "react";
 import { createPortal } from "react-dom";
 
-const TABS_PORTAL_ID = "view-details-tabs-portal";
-const ACTIONS_PORTAL_ID = "view-details-actions-portal";
-
-interface PortalProps {
-  children: ReactNode;
+interface ViewLayoutContextValue {
+  tabsEl: HTMLDivElement | null;
+  actionsEl: HTMLDivElement | null;
 }
 
-function usePortal(id: string) {
-  const [element, setElement] = useState<HTMLElement | null>(null);
+const ViewLayoutContext = createContext<ViewLayoutContextValue | null>(null);
 
-  // oxlint-disable-next-line ban-use-effect/ban-use-effect
-  useEffect(() => {
-    setElement(document.getElementById(id));
-  }, [id]);
-
-  return element;
+interface PortalProps {
+  children: ReactNode;
+  icon?: string;
+  title?: string;
 }
 
 export function ViewTabs({ children }: PortalProps) {
-  const target = usePortal(TABS_PORTAL_ID);
-  if (!target) return null;
-  return createPortal(children, target);
+  const ctx = useContext(ViewLayoutContext);
+  if (!ctx?.tabsEl) return null;
+  return createPortal(children, ctx.tabsEl);
 }
 
 export function ViewActions({ children }: PortalProps) {
-  const target = usePortal(ACTIONS_PORTAL_ID);
-  if (!target) return null;
-  return createPortal(children, target);
+  const ctx = useContext(ViewLayoutContext);
+  if (!ctx?.actionsEl) return null;
+  return createPortal(children, ctx.actionsEl);
 }
 
 interface ViewLayoutProps {
   children: ReactNode;
   onBack: () => void;
+  title?: string;
 }
 
-export function ViewLayout({ children, onBack }: ViewLayoutProps) {
+export function ViewLayout({ children, onBack, title }: ViewLayoutProps) {
+  const [tabsEl, setTabsEl] = useState<HTMLDivElement | null>(null);
+  const [actionsEl, setActionsEl] = useState<HTMLDivElement | null>(null);
+
   return (
-    <div className="flex flex-col h-full bg-background">
-      {/* Header */}
-      <div className="flex items-center h-12 border-b border-border shrink-0">
-        {/* Back Button */}
-        <div className="flex h-full px-2 border-r items-center">
-          <Button
-            variant="ghost"
-            size="icon"
-            className="items-center size-8 text-muted-foreground"
-            onClick={onBack}
-          >
-            <ArrowLeft />
-          </Button>
-        </div>
+    <ViewLayoutContext value={{ tabsEl, actionsEl }}>
+      <div className="flex flex-col h-full bg-background">
+        {/* Header */}
+        <div className="flex items-center h-12 border-b border-border shrink-0">
+          {/* Back Button */}
+          <div className="flex h-full px-2 border-r items-center">
+            <Button
+              variant="ghost"
+              size="icon"
+              className="items-center size-8 text-muted-foreground"
+              onClick={onBack}
+            >
+              <ArrowLeft />
+            </Button>
+          </div>
+
+          {title && (
+            <div className="flex items-center gap-2 px-2">
+              <p className="text-sm font-medium">{title}</p>
+            </div>
+          )}
 
-        {/* Tabs and Actions */}
-        <div className="flex justify-between px-4 items-center gap-4 flex-1">
-          {/* Tabs Slot */}
-          <div id={TABS_PORTAL_ID} className="flex items-center gap-2" />
+          {/* Tabs and Actions */}
+          <div className="flex justify-between px-4 items-center gap-4 flex-1">
+            {/* Tabs Slot */}
+            <div ref={setTabsEl} className="flex items-center gap-2" />
 
-          {/* Actions Slot */}
-          <div
-            id={ACTIONS_PORTAL_ID}
-            className="flex items-center gap-2 ml-auto"
-          />
+            {/* Actions Slot */}
+            <div
+              ref={setActionsEl}
+              className="flex items-center gap-2 ml-auto"
+            />
+          </div>
         </div>
-      </div>
 
-      {/* Main Content */}
-      <div className="flex-1 overflow-auto">{children}</div>
-    </div>
+        {/* Main Content */}
+        <div className="flex-1 overflow-auto">{children}</div>
+      </div>
+    </ViewLayoutContext>
   );
 }