DT-94: Add tooling system for custom data processing on DB operations #94

api/routes.ts

@@ -6,6 +6,8 @@ import {
   DeploymentDef,
   DeploymentsCollection,
   ProjectsCollection,
+  SQLToolDef,
+  SQLToolsCollection,
   TeamDef,
   TeamsCollection,
   UserDef,
@@ -238,6 +240,54 @@ const defs = {
     output: BOOL('Indicates if the project was deleted'),
     description: 'Delete a project by ID',
   }),
+  'GET/api/project/tools': route({
+    authorize: withUserSession,
+    fn: (_ctx, { project }) => {
+      const tools = SQLToolsCollection.filter((t) => t.projectId === project)
+      return tools
+    },
+    input: OBJ({ project: STR('The ID of the project') }),
+    output: ARR(SQLToolDef, 'List of SQL tools'),
+    description: 'Get SQL tools for a project',
+  }),
+  'POST/api/project/tool': route({
+    authorize: withAdminSession,
+    fn: (_ctx, input) => {
+      const toolId = crypto.randomUUID()
+      const tool = { ...input, toolId }
+      SQLToolsCollection.insert(tool)
+      return tool
+    },
+    input: OBJ({
+      projectId: STR('The ID of the project'),
+      name: STR('The name of the tool'),
+      targetTables: ARR(
+        STR('Target table names or *'),
+        'List of target tables',
+      ),
+      targetColumns: ARR(
+        STR('Target column names or *'),
+        'List of target columns',
+      ),
+      triggerEvent: LIST(['BEFORE', 'AFTER'], 'Trigger event: BEFORE or AFTER'),
+      code: STR('The JS function body'),
+      enabled: BOOL('Is the tool enabled?'),
+    }),
+    output: SQLToolDef,
+    description: 'Create a new SQL tool',
+  }),
+  'DELETE/api/project/tool': route({
+    authorize: withAdminSession,
+    fn: (_ctx, { id }) => {
+      const tool = SQLToolsCollection.get(id)
+      if (!tool) throw respond.NotFound({ message: 'Tool not found' })
+      SQLToolsCollection.delete(id)
+      return true
+    },
+    input: OBJ({ id: STR('The ID of the tool') }),
+    output: BOOL('Indicates if the tool was deleted'),
+    description: 'Delete a SQL tool',
+  }),
   'GET/api/project/deployments': route({
     authorize: withUserSession,
     fn: (_ctx, { project }) => {

api/schema.ts

@@ -2,6 +2,7 @@ import {
   ARR,
   type Asserted,
   BOOL,
+  LIST,
   NUM,
   OBJ,
   optional,
@@ -92,3 +93,20 @@ export const DatabaseSchemasCollection = await createCollection<
   DatabaseSchema,
   'deploymentUrl'
 >({ name: 'db_schemas', primaryKey: 'deploymentUrl' })
+
+export const SQLToolDef = OBJ({
+  toolId: STR('The unique identifier for the tool'),
+  projectId: STR('The ID of the project this tool belongs to'),
+  name: STR('The name of the tool'),
+  targetTables: ARR(STR('Target table names or *'), 'List of target tables'),
+  targetColumns: ARR(STR('Target column names or *'), 'List of target columns'),
+  triggerEvent: LIST(['BEFORE', 'AFTER'], 'Trigger event: BEFORE or AFTER'),
+  code: STR('The JS function body'),
+  enabled: BOOL('Is the tool enabled?'),
+}, 'The SQL tool definition')
+export type SQLTool = Asserted<typeof SQLToolDef>
+
+export const SQLToolsCollection = await createCollection<SQLTool, 'toolId'>({
+  name: 'sql_tools',
+  primaryKey: 'toolId',
+})

web/components/Dialog.tsx

@@ -44,10 +44,12 @@ export const Dialog = ({
   )
 }
 
-export const DialogModal = ({ children, ...props }: DialogProps) => {
+export const DialogModal = (
+  { children, boxClass, ...props }: DialogProps & { boxClass?: string },
+) => {
   return (
     <Dialog class='modal' {...props}>
-      <div class='modal-box w-auto'>
+      <div class={`modal-box ${boxClass || 'w-auto'}`}>
         <form method='dialog'>
           <button
             type='submit'

web/lib/navigation.tsx

@@ -0,0 +1,18 @@
+import { HardDrive, ListTodo, Wrench } from 'lucide-preact'
+import { SidebarItem } from '../components/SideBar.tsx'
+import { DeploymentPage } from '../pages/DeploymentPage.tsx'
+import { ToolsPage } from '../pages/ToolsPage.tsx'
+
+export const sidebarItems: Record<string, SidebarItem> = {
+  'deployment': {
+    icon: HardDrive,
+    label: 'Deployment',
+    component: DeploymentPage,
+  },
+  'tools': {
+    icon: Wrench,
+    label: 'Tools',
+    component: ToolsPage,
+  },
+  'tasks': { icon: ListTodo, label: 'Tasks', component: DeploymentPage },
+} as const

web/lib/shared.tsx

@@ -1,7 +1,4 @@
-import { HardDrive, ListTodo } from 'lucide-preact'
 import { api } from './api.ts'
-import { DeploymentPage } from '../pages/DeploymentPage.tsx'
-import { SidebarItem } from '../components/SideBar.tsx'
 import { url } from '@01edu/signal-router'
 import { Signal } from '@preact/signals'
 
@@ -13,16 +10,6 @@ export type QueryHistoryItem = {
   rows?: number
 }
 
-// Sidebar items for project page
-export const sidebarItems: Record<string, SidebarItem> = {
-  'deployment': {
-    icon: HardDrive,
-    label: 'Deployment',
-    component: DeploymentPage,
-  },
-  'tasks': { icon: ListTodo, label: 'Tasks', component: DeploymentPage },
-} as const
-
 // API signal for deployment queries
 export const querier = api['GET/api/deployment/query'].signal()
 

web/pages/DeploymentPage.tsx

@@ -36,8 +36,8 @@ import {
   querier,
   queriesHistory,
   runQuery,
-  sidebarItems,
 } from '../lib/shared.tsx'
+import { sidebarItems } from '../lib/navigation.tsx'
 
 type AnyRecord = Record<string, unknown>
 // API signals for schema and table data

web/pages/ProjectPage.tsx

@@ -3,7 +3,8 @@ import { navigate, url } from '@01edu/signal-router'
 import { Sidebar } from '../components/SideBar.tsx'
 import { user } from '../lib/session.ts'
 import { SettingsPage } from './SettingsPage.tsx'
-import { deployments, project, sidebarItems } from '../lib/shared.tsx'
+import { deployments, project } from '../lib/shared.tsx'
+import { sidebarItems } from '../lib/navigation.tsx'
 
 effect(() => {
   const path = url.path