Docs/API Connect

API Connect

Replace the mock data with your own API one module at a time. Each module has one provider that every screen goes through.

Where data enters

ModuleSeed dataCall your API in
Customerslib/data/customers.tsCustomersProvider
Contractslib/data/records.tsContractsProvider
Messages, notes, taskslib/data/comms.tsCommsProvider
Workflowslib/data/workflows.tsWorkflowsProvider
Settingslib/data/admin.tsAdminProvider
Sign-inlib/auth.tssignIn, sendCode, createAccount

Example: customers

Load records in the route's Server Component and pass them to the provider, then send edits from the provider's actions:

components/providers/customers-provider.tsx
const updateProfile = useCallback(async (id: number, patch: Partial<CustomerProfile>) => {
  setProfiles((p) => ({ ...p, [id]: { ...p[id], ...patch } })) // optimistic
  await fetch(`/api/customers/${id}`, {
    method: "PATCH",
    headers: { "Content-Type": "application/json" },
    body: JSON.stringify(patch),
  })
}, [])

Agent replies

Agents answer from createAssistantReply() in src/lib/chat.ts. Point it at a Route Handler that streams from your model provider, and the chat UI, tools and attachments keep working.

Keep API keys on the server. Call your model from a Route Handler, never from the browser.