insforge 0.3.2 → 1.2.10

package/frontend/src/features/database/page/TriggersPage.tsx

@@ -0,0 +1,242 @@
+import { useMemo, useState, useEffect } from 'react';
+import RefreshIcon from '@/assets/icons/refresh.svg?react';
+import {
+  Button,
+  ConvertedValue,
+  DataGrid,
+  type DataGridColumn,
+  type DataGridRowType,
+  EmptyState,
+  SearchInput,
+  Tooltip,
+  TooltipContent,
+  TooltipProvider,
+  TooltipTrigger,
+} from '@/components';
+import { useFullMetadata } from '../hooks/useFullMetadata';
+import type { ExportDatabaseResponse, ExportDatabaseJsonData } from '@insforge/shared-schemas';
+import { isSystemTable } from '../constants';
+import {
+  DataUpdatePayload,
+  DataUpdateResourceType,
+  ServerEvents,
+  SocketMessage,
+  useSocket,
+} from '@/lib/contexts/SocketContext';
+
+interface TriggerRow extends DataGridRowType {
+  id: string;
+  tableName: string;
+  triggerName: string;
+  actionTiming: string;
+  eventManipulation: string;
+  actionStatement: string;
+  [key: string]: ConvertedValue | { [key: string]: string }[];
+}
+
+function parseTriggersFromMetadata(metadata: ExportDatabaseResponse | undefined): TriggerRow[] {
+  if (!metadata || metadata.format !== 'json' || typeof metadata.data === 'string') {
+    return [];
+  }
+
+  const data = metadata.data as ExportDatabaseJsonData;
+  const triggers: TriggerRow[] = [];
+
+  Object.entries(data.tables).forEach(([tableName, tableData]) => {
+    if (isSystemTable(tableName)) {
+      return;
+    }
+
+    tableData.triggers.forEach((trigger) => {
+      triggers.push({
+        id: `${tableName}_${trigger.triggerName}`,
+        tableName,
+        triggerName: trigger.triggerName,
+        actionTiming: trigger.actionTiming,
+        eventManipulation: trigger.eventManipulation,
+        actionStatement: trigger.actionStatement,
+      });
+    });
+  });
+
+  return triggers;
+}
+
+export default function TriggersPage() {
+  const [searchQuery, setSearchQuery] = useState('');
+  const [isRefreshing, setIsRefreshing] = useState(false);
+  const { data: metadata, isLoading, error, refetch } = useFullMetadata(true);
+
+  const { socket, isConnected } = useSocket();
+
+  const allTriggers = useMemo(() => parseTriggersFromMetadata(metadata), [metadata]);
+
+  useEffect(() => {
+    if (!socket || !isConnected) {
+      return;
+    }
+
+    const handleDataUpdate = (message: SocketMessage<DataUpdatePayload>) => {
+      if (message.payload?.resource === DataUpdateResourceType.DATABASE) {
+        void refetch();
+      }
+    };
+
+    socket.on(ServerEvents.DATA_UPDATE, handleDataUpdate);
+
+    return () => {
+      socket.off(ServerEvents.DATA_UPDATE, handleDataUpdate);
+    };
+  }, [socket, isConnected, refetch]);
+
+  const filteredTriggers = useMemo(() => {
+    if (!searchQuery.trim()) {
+      return allTriggers;
+    }
+
+    const query = searchQuery.toLowerCase();
+    return allTriggers.filter(
+      (trigger) =>
+        trigger.triggerName.toLowerCase().includes(query) ||
+        trigger.tableName.toLowerCase().includes(query)
+    );
+  }, [allTriggers, searchQuery]);
+
+  const handleRefresh = async () => {
+    setIsRefreshing(true);
+    try {
+      setSearchQuery('');
+      await refetch();
+    } finally {
+      setIsRefreshing(false);
+    }
+  };
+
+  const columns: DataGridColumn<TriggerRow>[] = useMemo(
+    () => [
+      {
+        key: 'tableName',
+        name: 'Table',
+        width: 'minmax(180px, 1.5fr)',
+        resizable: true,
+        sortable: true,
+      },
+      {
+        key: 'triggerName',
+        name: 'Name',
+        width: 'minmax(200px, 2fr)',
+        resizable: true,
+        sortable: true,
+      },
+      {
+        key: 'actionTiming',
+        name: 'Timing',
+        width: 'minmax(100px, 1fr)',
+        resizable: true,
+        sortable: true,
+        renderCell: ({ row }) => {
+          const timing = row.actionTiming.toUpperCase();
+          return (
+            <span className="inline-flex items-center px-2 py-0.5 rounded text-xs font-medium bg-gray-100 text-gray-800 dark:bg-gray-700 dark:text-gray-300">
+              {timing}
+            </span>
+          );
+        },
+      },
+      {
+        key: 'eventManipulation',
+        name: 'Event',
+        width: 'minmax(100px, 1fr)',
+        resizable: true,
+        sortable: true,
+        renderCell: ({ row }) => {
+          const event = row.eventManipulation.toUpperCase();
+          return (
+            <span className="inline-flex items-center px-2 py-0.5 rounded text-xs font-medium bg-gray-100 text-gray-800 dark:bg-gray-700 dark:text-gray-300">
+              {event}
+            </span>
+          );
+        },
+      },
+      {
+        key: 'actionStatement',
+        name: 'Statement',
+        width: 'minmax(300px, 3fr)',
+        resizable: true,
+      },
+    ],
+    []
+  );
+
+  if (error) {
+    return (
+      <div className="flex-1 flex items-center justify-center">
+        <EmptyState
+          title="Failed to load triggers"
+          description={error instanceof Error ? error.message : 'An error occurred'}
+        />
+      </div>
+    );
+  }
+
+  return (
+    <div className="flex flex-col gap-4 h-full p-4 bg-bg-gray dark:bg-neutral-800">
+      <div className="flex items-center gap-3">
+        <h1 className="text-xl font-normal text-zinc-950 dark:text-white">Database Triggers</h1>
+
+        {/* Separator */}
+        <div className="h-6 w-px bg-gray-200 dark:bg-neutral-700" />
+
+        {/* Refresh button */}
+        <TooltipProvider>
+          <Tooltip>
+            <TooltipTrigger asChild>
+              <Button
+                variant="ghost"
+                size="icon"
+                className="p-1 h-9 w-9"
+                onClick={() => void handleRefresh()}
+                disabled={isRefreshing}
+              >
+                <RefreshIcon className="h-5 w-5 text-zinc-400 dark:text-neutral-400" />
+              </Button>
+            </TooltipTrigger>
+            <TooltipContent side="bottom" align="center">
+              <p>{isRefreshing ? 'Refreshing...' : 'Refresh'}</p>
+            </TooltipContent>
+          </Tooltip>
+        </TooltipProvider>
+      </div>
+
+      <SearchInput
+        value={searchQuery}
+        onChange={setSearchQuery}
+        placeholder="Search for a trigger"
+        className="w-64"
+      />
+
+      {isLoading ? (
+        <div className="flex-1 flex items-center justify-center">
+          <EmptyState title="Loading triggers..." description="Please wait" />
+        </div>
+      ) : (
+        <div className="flex-1 overflow-hidden">
+          <DataGrid
+            data={filteredTriggers}
+            columns={columns}
+            showSelection={false}
+            showPagination={false}
+            noPadding={true}
+            className="h-full"
+            isRefreshing={isRefreshing}
+            emptyState={
+              <div className="text-sm text-zinc-500 dark:text-zinc-400">
+                {searchQuery ? 'No triggers match your search criteria' : 'No triggers found'}
+              </div>
+            }
+          />
+        </div>
+      )}
+    </div>
+  );
+}

package/frontend/src/features/database/services/advance.service.ts

@@ -0,0 +1,66 @@
+import { apiClient } from '@/lib/api/client';
+import type { ExportDatabaseRequest, ExportDatabaseResponse } from '@insforge/shared-schemas';
+
+export interface RawSQLRequest {
+  query: string;
+  params?: unknown[];
+}
+
+export interface RawSQLResponse {
+  rows?: unknown[];
+  rowCount?: number;
+  fields?: Array<{ name: string; dataTypeID: number }>;
+  success?: boolean;
+  data?: unknown[];
+  error?: string;
+  message?: string;
+}
+
+export class AdvanceService {
+  /**
+   * Execute raw SQL query with strict sanitization.
+   * Requires admin privileges.
+   *
+   * @param query - SQL query to execute
+   * @param params - Optional query parameters
+   * @returns Response with query results
+   */
+  async runRawSQL(query: string, params: unknown[] = []): Promise<RawSQLResponse> {
+    const body: RawSQLRequest = { query, params };
+
+    return apiClient.request('/database/advance/rawsql', {
+      method: 'POST',
+      headers: apiClient.withAccessToken({
+        'Content-Type': 'application/json',
+      }),
+      body: JSON.stringify(body),
+    });
+  }
+
+  /**
+   * Get full database metadata including schema, functions, triggers, etc.
+   * Requires admin privileges.
+   *
+   * @returns Response with complete database metadata in JSON format
+   */
+  async getDatabaseFullMetadata(): Promise<ExportDatabaseResponse> {
+    const body: ExportDatabaseRequest = {
+      format: 'json',
+      includeData: false,
+      includeFunctions: true,
+      includeSequences: false,
+      includeViews: false,
+      rowLimit: 1000,
+    };
+
+    return apiClient.request('/database/advance/export', {
+      method: 'POST',
+      headers: apiClient.withAccessToken({
+        'Content-Type': 'application/json',
+      }),
+      body: JSON.stringify(body),
+    });
+  }
+}
+
+export const advanceService = new AdvanceService();

package/frontend/src/features/database/services/{database.service.ts → record.service.ts}

@@ -1,61 +1,18 @@
 import { ConvertedValue } from '@/components/datagrid/datagridTypes';
 import { apiClient } from '@/lib/api/client';
-import {
-  ColumnSchema,
-  GetTableSchemaResponse,
-  CreateTableRequest,
-  UpdateTableSchemaResponse,
-  UpdateTableSchemaRequest,
-} from '@insforge/shared-schemas';
-
-export class DatabaseService {
-  // Table operations
-  async listTables(): Promise<string[]> {
-    const data = await apiClient.request('/database/tables', {
-      headers: apiClient.withAccessToken(),
-    });
-    // data is already unwrapped by request method and should be an array
-    return Array.isArray(data) ? data : [];
-  }
-
-  getTableSchema(tableName: string): Promise<GetTableSchemaResponse> {
-    return apiClient.request(`/database/tables/${tableName}/schema`, {
-      headers: apiClient.withAccessToken(),
-    });
-  }
-
-  createTable(tableName: string, columns: ColumnSchema[]) {
-    const body: CreateTableRequest = { tableName: tableName, columns, rlsEnabled: true };
-    return apiClient.request('/database/tables', {
-      method: 'POST',
-      headers: apiClient.withAccessToken({
-        'Content-Type': 'application/json',
-      }),
-      body: JSON.stringify(body),
-    });
-  }
-
-  deleteTable(tableName: string) {
-    return apiClient.request(`/database/tables/${tableName}`, {
-      method: 'DELETE',
-      headers: apiClient.withAccessToken(),
-    });
-  }
-
-  updateTableSchema(
-    tableName: string,
-    operations: UpdateTableSchemaRequest
-  ): Promise<UpdateTableSchemaResponse | void> {
-    return apiClient.request(`/database/tables/${tableName}/schema`, {
-      method: 'PATCH',
-      headers: apiClient.withAccessToken({
-        'Content-Type': 'application/json',
-      }),
-      body: JSON.stringify(operations),
-    });
-  }
+import { ColumnSchema } from '@insforge/shared-schemas';
+import { tableService } from './table.service';
+
+export interface CSVImportResponse {
+  success: boolean;
+  message?: string;
+  data?: {
+    rowCount: number;
+  };
+  error?: string; // For backend error messages
+}
 
-  // Record operations
+export class RecordService {
   /**
    * Data fetching method with built-in search, sorting, and pagination for UI components.
    *
@@ -82,7 +39,7 @@ export class DatabaseService {
       const searchValue = searchQuery.trim();
 
       // Get table schema to identify text columns
-      const schema = await this.getTableSchema(tableName);
+      const schema = await tableService.getTableSchema(tableName);
       const textColumns = schema.columns
         .filter((col: ColumnSchema) => {
           const type = col.type.toLowerCase();
@@ -90,7 +47,7 @@ export class DatabaseService {
         })
         .map((col: ColumnSchema) => col.columnName);
 
-      if (textColumns.length > 0) {
+      if (textColumns.length) {
         // Create PostgREST OR filter for text columns
         const orFilters = textColumns
           .map((column: string) => `${column}.ilike.*${searchValue}*`)
@@ -100,7 +57,7 @@ export class DatabaseService {
     }
 
     // Add sorting if provided - PostgREST uses "order" parameter
-    if (sortColumns && sortColumns.length > 0) {
+    if (sortColumns && sortColumns.length) {
       const orderParam = sortColumns
         .map((col) => `${col.columnKey}.${col.direction.toLowerCase()}`)
         .join(',');
@@ -136,7 +93,7 @@ export class DatabaseService {
     const response = await this.getRecords(tableName, queryParams);
 
     // Return the first record if found, or null if not found
-    if (response.records && response.records.length > 0) {
+    if (response.records && response.records.length) {
       return response.records[0];
     }
     return null;
@@ -195,8 +152,13 @@ export class DatabaseService {
     return this.createRecords(table, [data]);
   }
 
-  updateRecord(table: string, id: string, data: { [key: string]: ConvertedValue }) {
-    return apiClient.request(`/database/records/${table}?id=eq.${id}`, {
+  updateRecord(
+    table: string,
+    pkColumn: string,
+    pkValue: string,
+    data: { [key: string]: ConvertedValue }
+  ) {
+    return apiClient.request(`/database/records/${table}?${pkColumn}=eq.${pkValue}`, {
       method: 'PATCH',
       headers: apiClient.withAccessToken({
         'Content-Type': 'application/json',
@@ -205,12 +167,53 @@ export class DatabaseService {
     });
   }
 
-  deleteRecord(table: string, id: string) {
-    return apiClient.request(`/database/records/${table}?id=eq.${id}`, {
+  // PostgREST supports bulk deletes via in.() filter
+  deleteRecords(table: string, pkColumn: string, pkValues: string[]) {
+    if (!pkValues.length) {
+      return Promise.resolve();
+    }
+    const pkFilter = `in.(${pkValues.join(',')})`;
+    return apiClient.request(`/database/records/${table}?${pkColumn}=${pkFilter}`, {
       method: 'DELETE',
       headers: apiClient.withAccessToken(),
     });
   }
+
+  validateCSVFile(file: File): { valid: boolean; error?: string } {
+    if (file.type !== 'text/csv' && !file.name.endsWith('.csv')) {
+      return { valid: false, error: 'Invalid file type. Please upload a CSV file.' };
+    }
+    const maxSizeInBytes = 50 * 1024 * 1024;
+    if (file.size > maxSizeInBytes) {
+      return { valid: false, error: `File size exceeds the limit of ${maxSizeInBytes} bytes.` };
+    }
+    return { valid: true };
+  }
+
+  async importCSV(tableName: string, file: File): Promise<CSVImportResponse> {
+    const validation = this.validateCSVFile(file);
+    if (!validation.valid) {
+      throw new Error(validation.error || 'Invalid CSV file.');
+    }
+
+    const formData = new FormData();
+    formData.append('file', file);
+    formData.append('table', tableName);
+
+    const response = await apiClient.request(`/database/advance/bulk-upsert`, {
+      method: 'POST',
+      headers: apiClient.withAccessToken(),
+      body: formData,
+    });
+    return {
+      success: response.success,
+      message: response.message,
+      data: {
+        rowCount: response.rowsAffected,
+      },
+      error: response.error,
+    };
+  }
 }
 
-export const databaseService = new DatabaseService();
+export const recordService = new RecordService();

package/frontend/src/features/database/services/table.service.ts

@@ -0,0 +1,64 @@
+import { apiClient } from '@/lib/api/client';
+import {
+  ColumnSchema,
+  GetTableSchemaResponse,
+  CreateTableRequest,
+  UpdateTableSchemaResponse,
+  UpdateTableSchemaRequest,
+} from '@insforge/shared-schemas';
+
+export class TableService {
+  async listTables(): Promise<string[]> {
+    const data = await apiClient.request('/database/tables', {
+      headers: apiClient.withAccessToken(),
+    });
+    // data is already unwrapped by request method and should be an array
+    // Filter out the 'users' table
+    return Array.isArray(data) ? data.filter((table) => table !== 'users') : [];
+  }
+
+  getAllTableSchemas(): Promise<GetTableSchemaResponse[]> {
+    return apiClient.request('/database/tables/schemas', {
+      headers: apiClient.withAccessToken(),
+    });
+  }
+
+  getTableSchema(tableName: string): Promise<GetTableSchemaResponse> {
+    return apiClient.request(`/database/tables/${tableName}/schema`, {
+      headers: apiClient.withAccessToken(),
+    });
+  }
+
+  createTable(tableName: string, columns: ColumnSchema[]) {
+    const body: CreateTableRequest = { tableName: tableName, columns, rlsEnabled: true };
+    return apiClient.request('/database/tables', {
+      method: 'POST',
+      headers: apiClient.withAccessToken({
+        'Content-Type': 'application/json',
+      }),
+      body: JSON.stringify(body),
+    });
+  }
+
+  deleteTable(tableName: string) {
+    return apiClient.request(`/database/tables/${tableName}`, {
+      method: 'DELETE',
+      headers: apiClient.withAccessToken(),
+    });
+  }
+
+  updateTableSchema(
+    tableName: string,
+    operations: UpdateTableSchemaRequest
+  ): Promise<UpdateTableSchemaResponse | void> {
+    return apiClient.request(`/database/tables/${tableName}/schema`, {
+      method: 'PATCH',
+      headers: apiClient.withAccessToken({
+        'Content-Type': 'application/json',
+      }),
+      body: JSON.stringify(operations),
+    });
+  }
+}
+
+export const tableService = new TableService();