insforge 1.3.0 → 1.4.8

package/frontend/src/features/functions/hooks/useFunctions.ts

@@ -1,12 +1,13 @@
 import { useState, useCallback, useMemo } from 'react';
 import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query';
-import { functionService, type EdgeFunction } from '../services/function.service';
+import { functionService } from '../services/function.service';
+import { FunctionSchema } from '@insforge/shared-schemas';
 import { useToast } from '@/lib/hooks/useToast';
 
 export function useFunctions() {
   const queryClient = useQueryClient();
   const { showToast } = useToast();
-  const [selectedFunction, setSelectedFunction] = useState<EdgeFunction | null>(null);
+  const [selectedFunction, setSelectedFunction] = useState<FunctionSchema | null>(null);
 
   // Query to fetch all functions
   const {
@@ -26,7 +27,7 @@ export function useFunctions() {
 
   // Function to fetch and set selected function details
   const selectFunction = useCallback(
-    async (func: EdgeFunction) => {
+    async (func: FunctionSchema) => {
       try {
         const data = await functionService.getFunctionBySlug(func.slug);
         setSelectedFunction(data);
@@ -97,7 +98,7 @@ export function useFunctions() {
 
     // Helpers
     getFunctionBySlug: useCallback(
-      (slug: string): EdgeFunction | undefined => {
+      (slug: string): FunctionSchema | undefined => {
         return displayFunctions.find((func) => func.slug === slug);
       },
       [displayFunctions]

package/frontend/src/features/functions/hooks/useSecrets.ts

@@ -1,10 +1,7 @@
 import { useState, useCallback } from 'react';
 import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query';
-import {
-  secretService,
-  type Secret,
-  type CreateSecretInput,
-} from '@/features/functions/services/secret.service';
+import { secretService } from '@/features/functions/services/secret.service';
+import type { SecretSchema, CreateSecretRequest } from '@insforge/shared-schemas';
 import { useToast } from '@/lib/hooks/useToast';
 import { useConfirm } from '@/lib/hooks/useConfirm';
 
@@ -27,11 +24,11 @@ export function useSecrets() {
   });
 
   // Filter out inactive secrets
-  const secrets = allSecrets.filter((secret: Secret) => secret.isActive);
+  const secrets = allSecrets.filter((secret: SecretSchema) => secret.isActive);
 
   // Create secret mutation
   const createSecretMutation = useMutation({
-    mutationFn: (input: CreateSecretInput) => secretService.createSecret(input),
+    mutationFn: (input: CreateSecretRequest) => secretService.createSecret(input),
     onSuccess: () => {
       void queryClient.invalidateQueries({ queryKey: ['secrets'] });
       showToast('Secret created successfully', 'success');
@@ -80,7 +77,7 @@ export function useSecrets() {
 
   // Delete secret with confirmation
   const deleteSecret = useCallback(
-    async (secret: Secret) => {
+    async (secret: SecretSchema) => {
       if (secret.isReserved) {
         showToast('Cannot delete reserved secrets', 'error');
         return false;
@@ -108,7 +105,7 @@ export function useSecrets() {
   );
 
   // Filter secrets based on search query
-  const filteredSecrets = secrets.filter((secret: Secret) =>
+  const filteredSecrets = secrets.filter((secret: SecretSchema) =>
     secret.key.toLowerCase().includes(searchQuery.toLowerCase())
   );
 

package/frontend/src/features/functions/pages/SecretsPage.tsx

@@ -1,118 +1,118 @@
-import { useState } from 'react';
-import { Button, Input, Skeleton, SearchInput, ConfirmDialog } from '@/components';
-import { SecretRow } from '../components/SecretRow';
-import SecretEmptyState from '../components/SecretEmptyState';
-import { useSecrets } from '@/features/functions/hooks/useSecrets';
-
-export default function SecretsPage() {
-  const [newSecretKey, setNewSecretKey] = useState('');
-  const [newSecretValue, setNewSecretValue] = useState('');
-
-  const {
-    filteredSecrets,
-    searchQuery,
-    setSearchQuery,
-    isLoading: loading,
-    createSecret,
-    deleteSecret,
-    confirmDialogProps,
-  } = useSecrets();
-
-  const handleSaveNewSecret = async () => {
-    const success = await createSecret(newSecretKey, newSecretValue);
-    if (success) {
-      setNewSecretKey('');
-      setNewSecretValue('');
-    }
-  };
-
-  return (
-    <div className="h-full flex flex-col overflow-hidden">
-      <div className="flex flex-col gap-6 p-4">
-        {/* Header */}
-        <p className="h-7 text-xl text-zinc-950 dark:text-white">Secrets</p>
-
-        {/* Add New Secret Portal */}
-        <div className="bg-white dark:bg-[#333333] rounded-[8px]">
-          <div className="p-6 border-b border-gray-200 dark:border-neutral-700">
-            <p className="text-base text-zinc-950 dark:text-white">Add New Secret</p>
-          </div>
-          <div className="p-6 flex gap-6 items-end">
-            <div className="flex-1">
-              <label className="block text-sm text-zinc-950 dark:text-neutral-50 mb-2">Key</label>
-              <Input
-                placeholder="e.g CLIENT_KEY"
-                value={newSecretKey}
-                onChange={(e) => setNewSecretKey(e.target.value)}
-                className="shadow-none w-full dark:bg-neutral-900 dark:text-white dark:placeholder:text-neutral-400 dark:border-neutral-700"
-              />
-            </div>
-            <div className="flex-1">
-              <label className="block text-sm text-zinc-950 dark:text-neutral-50 mb-2">Value</label>
-              <Input
-                placeholder="e.g 1234567890"
-                type="text"
-                value={newSecretValue}
-                onChange={(e) => setNewSecretValue(e.target.value)}
-                className="shadow-none w-full dark:bg-neutral-900 dark:text-white dark:placeholder:text-neutral-400 dark:border-neutral-700"
-              />
-            </div>
-            <Button
-              onClick={() => void handleSaveNewSecret()}
-              className="bg-black hover:bg-zinc-800 dark:bg-emerald-300 dark:hover:bg-emerald-400 dark:text-black text-white px-3 py-2 w-20 h-9 rounded"
-              disabled={!newSecretKey.trim() || !newSecretValue.trim()}
-            >
-              Save
-            </Button>
-          </div>
-        </div>
-
-        {/* Search Bar */}
-        <SearchInput
-          placeholder="Search secret"
-          value={searchQuery}
-          onChange={setSearchQuery}
-          className="max-w-70 dark:bg-neutral-900 dark:border-neutral-700"
-        />
-
-        {/* Secrets Table Header */}
-        <div className="grid grid-cols-12 px-3 text-sm text-muted-foreground dark:text-neutral-400">
-          <div className="col-span-8 py-1 px-3">Name</div>
-          {/* <div className="col-span-5 py-1 px-3">Digest</div> */}
-          <div className="col-span-3 py-1 px-3">Updated at</div>
-          <div className="col-span-1 py-1 px-3" />
-        </div>
-      </div>
-
-      {/* Scrollable Table Body */}
-      <div className="flex-1 min-h-0 overflow-y-auto px-4 pb-4">
-        <div className="flex flex-col gap-2">
-          {loading ? (
-            <>
-              {[...Array(4)].map((_, i) => (
-                <Skeleton key={i} className="h-14 rounded-[8px] cols-span-full" />
-              ))}
-            </>
-          ) : filteredSecrets.length >= 1 ? (
-            <>
-              {filteredSecrets.map((secret) => (
-                <SecretRow
-                  key={secret.id}
-                  secret={secret}
-                  onDelete={() => void deleteSecret(secret)}
-                  className="cols-span-full"
-                />
-              ))}
-            </>
-          ) : (
-            <div className="cols-span-full">
-              <SecretEmptyState searchQuery={searchQuery} />
-            </div>
-          )}
-        </div>
-      </div>
-
-      <ConfirmDialog {...confirmDialogProps} />
-    </div>
-  );
-}
+import { useState } from 'react';
+import { Button, Input, Skeleton, SearchInput, ConfirmDialog } from '@/components';
+import { SecretRow } from '../components/SecretRow';
+import SecretEmptyState from '../components/SecretEmptyState';
+import { useSecrets } from '@/features/functions/hooks/useSecrets';
+
+export default function SecretsPage() {
+  const [newSecretKey, setNewSecretKey] = useState('');
+  const [newSecretValue, setNewSecretValue] = useState('');
+
+  const {
+    filteredSecrets,
+    searchQuery,
+    setSearchQuery,
+    isLoading: loading,
+    createSecret,
+    deleteSecret,
+    confirmDialogProps,
+  } = useSecrets();
+
+  const handleSaveNewSecret = async () => {
+    const success = await createSecret(newSecretKey, newSecretValue);
+    if (success) {
+      setNewSecretKey('');
+      setNewSecretValue('');
+    }
+  };
+
+  return (
+    <div className="h-full flex flex-col overflow-hidden">
+      <div className="flex flex-col gap-6 p-4">
+        {/* Header */}
+        <p className="h-7 text-xl text-zinc-950 dark:text-white">Secrets</p>
+
+        {/* Add New Secret Portal */}
+        <div className="bg-white dark:bg-[#333333] rounded-[8px]">
+          <div className="p-6 border-b border-gray-200 dark:border-neutral-700">
+            <p className="text-base text-zinc-950 dark:text-white">Add New Secret</p>
+          </div>
+          <div className="p-6 flex gap-6 items-end">
+            <div className="flex-1">
+              <label className="block text-sm text-zinc-950 dark:text-neutral-50 mb-2">Key</label>
+              <Input
+                placeholder="e.g CLIENT_KEY"
+                value={newSecretKey}
+                onChange={(e) => setNewSecretKey(e.target.value)}
+                className="shadow-none w-full dark:bg-neutral-900 dark:text-white dark:placeholder:text-neutral-400 dark:border-neutral-700"
+              />
+            </div>
+            <div className="flex-1">
+              <label className="block text-sm text-zinc-950 dark:text-neutral-50 mb-2">Value</label>
+              <Input
+                placeholder="e.g 1234567890"
+                type="text"
+                value={newSecretValue}
+                onChange={(e) => setNewSecretValue(e.target.value)}
+                className="shadow-none w-full dark:bg-neutral-900 dark:text-white dark:placeholder:text-neutral-400 dark:border-neutral-700"
+              />
+            </div>
+            <Button
+              onClick={() => void handleSaveNewSecret()}
+              className="bg-black hover:bg-zinc-800 dark:bg-emerald-300 dark:hover:bg-emerald-400 dark:text-black text-white px-3 py-2 w-20 h-9 rounded"
+              disabled={!newSecretKey.trim() || !newSecretValue.trim()}
+            >
+              Save
+            </Button>
+          </div>
+        </div>
+
+        {/* Search Bar */}
+        <SearchInput
+          placeholder="Search secret"
+          value={searchQuery}
+          onChange={setSearchQuery}
+          className="max-w-70 dark:bg-neutral-900 dark:border-neutral-700"
+        />
+
+        {/* Secrets Table Header */}
+        <div className="grid grid-cols-12 px-3 text-sm text-muted-foreground dark:text-neutral-400">
+          <div className="col-span-8 py-1 px-3">Name</div>
+          {/* <div className="col-span-5 py-1 px-3">Digest</div> */}
+          <div className="col-span-3 py-1 px-3">Updated at</div>
+          <div className="col-span-1 py-1 px-3" />
+        </div>
+      </div>
+
+      {/* Scrollable Table Body */}
+      <div className="flex-1 min-h-0 overflow-y-auto px-4 pb-4">
+        <div className="flex flex-col gap-2">
+          {loading ? (
+            <>
+              {[...Array(4)].map((_, i) => (
+                <Skeleton key={i} className="h-14 rounded-[8px] cols-span-full" />
+              ))}
+            </>
+          ) : filteredSecrets.length >= 1 ? (
+            <>
+              {filteredSecrets.map((secret) => (
+                <SecretRow
+                  key={secret.id}
+                  secret={secret}
+                  onDelete={() => void deleteSecret(secret)}
+                  className="cols-span-full"
+                />
+              ))}
+            </>
+          ) : (
+            <div className="cols-span-full">
+              <SecretEmptyState searchQuery={searchQuery} />
+            </div>
+          )}
+        </div>
+      </div>
+
+      <ConfirmDialog {...confirmDialogProps} />
+    </div>
+  );
+}

package/frontend/src/features/functions/services/function.service.ts

@@ -1,40 +1,23 @@
 import { apiClient } from '@/lib/api/client';
-
-export interface EdgeFunction {
-  id: string;
-  slug: string;
-  name: string;
-  description?: string;
-  code?: string;
-  status: 'draft' | 'active' | 'error';
-  created_at: string;
-  updated_at: string;
-  deployed_at?: string;
-}
-
-export interface FunctionsResponse {
-  functions: EdgeFunction[];
-  runtime: {
-    status: 'running' | 'unavailable';
-  };
-}
+import { FunctionSchema, ListFunctionsResponse } from '@insforge/shared-schemas';
 
 export class FunctionService {
-  async listFunctions(): Promise<FunctionsResponse> {
-    const data = await apiClient.request('/functions', {
+  async listFunctions(): Promise<ListFunctionsResponse> {
+    const response: ListFunctionsResponse = await apiClient.request('/functions', {
       headers: apiClient.withAccessToken(),
     });
 
     return {
-      functions: Array.isArray(data.functions) ? data.functions : [],
-      runtime: data.runtime || { status: 'unavailable' },
+      functions: Array.isArray(response.functions) ? response.functions : [],
+      runtime: response.runtime || { status: 'unavailable' },
     };
   }
 
-  async getFunctionBySlug(slug: string): Promise<EdgeFunction> {
-    return apiClient.request(`/functions/${slug}`, {
+  async getFunctionBySlug(slug: string): Promise<FunctionSchema> {
+    const response: FunctionSchema = await apiClient.request(`/functions/${slug}`, {
       headers: apiClient.withAccessToken(),
     });
+    return response;
   }
 
   async deleteFunction(slug: string): Promise<void> {

package/frontend/src/features/functions/services/secret.service.ts

@@ -1,56 +1,38 @@
 import { apiClient } from '@/lib/api/client';
-
-export interface Secret {
-  id: string;
-  key: string;
-  isActive: boolean;
-  isReserved: boolean;
-  lastUsedAt: string | null;
-  expiresAt: string | null;
-  createdAt: string;
-  updatedAt: string;
-}
-
-export interface CreateSecretInput {
-  key: string;
-  value: string;
-}
-
-export interface SecretsListResponse {
-  secrets: Secret[];
-}
-
-export interface SecretValueResponse {
-  key: string;
-  value: string;
-}
+import {
+  SecretSchema,
+  CreateSecretRequest,
+  CreateSecretResponse,
+  ListSecretsResponse,
+  DeleteSecretResponse,
+} from '@insforge/shared-schemas';
 
 export class SecretService {
-  async listSecrets(): Promise<Secret[]> {
+  async listSecrets(): Promise<SecretSchema[]> {
     const data = (await apiClient.request('/secrets', {
       headers: apiClient.withAccessToken(),
-    })) as SecretsListResponse;
-    return data.secrets || [];
+    })) as ListSecretsResponse;
+    return data.secrets as SecretSchema[];
   }
 
-  async createSecret(
-    input: CreateSecretInput
-  ): Promise<{ success: boolean; message: string; id?: string }> {
-    return apiClient.request('/secrets', {
+  async createSecret(input: CreateSecretRequest): Promise<CreateSecretResponse> {
+    const response: CreateSecretResponse = await apiClient.request('/secrets', {
       method: 'POST',
-      headers: {
-        'Content-Type': 'application/json',
-        ...apiClient.withAccessToken(),
-      },
+      headers: apiClient.withAccessToken(),
       body: JSON.stringify(input),
     });
+    return response;
   }
 
-  async deleteSecret(key: string): Promise<{ success: boolean; message: string }> {
-    return apiClient.request(`/secrets/${encodeURIComponent(key)}`, {
-      method: 'DELETE',
-      headers: apiClient.withAccessToken(),
-    });
+  async deleteSecret(key: string): Promise<DeleteSecretResponse> {
+    const response: DeleteSecretResponse = await apiClient.request(
+      `/secrets/${encodeURIComponent(key)}`,
+      {
+        method: 'DELETE',
+        headers: apiClient.withAccessToken(),
+      }
+    );
+    return response;
   }
 }