mirror of https://github.com/temetro/temetro.git synced 2026-08-30 20:39:06 +00:00

Files

T

Khalid Abdi 929bec8f31 feat: AI-added records save with placeholders + "Added by AI" provenance

Stop blocking AI imports/proposals on missing non-critical fields. Records
the chat agent drafts now save with safe placeholders, auto-generated file
numbers, and a source="ai" marker that surfaces an "Added by AI" badge so a
clinician can review/edit them later.

Backend:
- add `source` (manual|ai) column to patients/appointments/prescriptions
  (migration 0014) + canonical types, services, validation schemas
- relax patient/appointment validation: empty file number allowed, demographic
  + type/provider/initials fall back to placeholders (initials derived from name)
- patients.generateFileNumber() auto-assigns an MRN when one is missing
- proposeAppointment accepts a name when no file number resolves; AI commits +
  /api/ai/import stamp source="ai"

Frontend:
- `source` on Appointment/Patient/Prescription types; AI commits send source="ai"
- reusable <AiBadge> shown on the Patients table/detail and prescriptions list

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

2026-06-14 19:27:17 +03:00

3.9 KiB

Raw Blame History

coss Sidebar

When to use

Persistent app shell navigation and grouped links.
Collapsible/structured side navigation for dashboard layouts.

Install

npx shadcn@latest add @coss/sidebar

Manual deps from docs:

npm install @base-ui/react

Canonical imports

import {
  Sidebar,
  SidebarContent,
  SidebarFooter,
  SidebarGroup,
  SidebarGroupAction,
  SidebarGroupContent,
  SidebarGroupLabel,
  SidebarHeader,
  SidebarInset,
  SidebarMenu,
  SidebarMenuButton,
  SidebarMenuItem,
  SidebarProvider,
  SidebarRail,
  SidebarSeparator,
  SidebarTrigger,
  useSidebar,
} from "@/components/ui/sidebar"

Minimal pattern

<SidebarProvider>
  <Sidebar>
    <SidebarHeader>Workspace</SidebarHeader>
    <SidebarContent>
      <SidebarGroup>
        <SidebarGroupLabel>Navigation</SidebarGroupLabel>
        <SidebarGroupContent>
          <SidebarMenu>
            <SidebarMenuItem>
              <SidebarMenuButton>Dashboard</SidebarMenuButton>
            </SidebarMenuItem>
          </SidebarMenu>
        </SidebarGroupContent>
      </SidebarGroup>
    </SidebarContent>
  </Sidebar>
  <SidebarInset>{/* Main page content */}</SidebarInset>
</SidebarProvider>

Patterns from coss particles

Key patterns

Sidebar with grouped navigation and footer:

<SidebarProvider>
  <Sidebar>
    <SidebarHeader>
      <h2 className="text-lg font-semibold">App Name</h2>
    </SidebarHeader>
    <SidebarContent>
      <SidebarGroup>
        <SidebarGroupLabel>Main</SidebarGroupLabel>
        <SidebarGroupContent>
          <SidebarMenu>
            <SidebarMenuItem>
              <SidebarMenuButton render={<a href="/dashboard" />}>
                Dashboard
              </SidebarMenuButton>
            </SidebarMenuItem>
            <SidebarMenuItem>
              <SidebarMenuButton render={<a href="/projects" />}>
                Projects
              </SidebarMenuButton>
            </SidebarMenuItem>
          </SidebarMenu>
        </SidebarGroupContent>
      </SidebarGroup>
    </SidebarContent>
    <SidebarFooter>
      <SidebarMenu>
        <SidebarMenuItem>
          <SidebarMenuButton>Settings</SidebarMenuButton>
        </SidebarMenuItem>
      </SidebarMenu>
    </SidebarFooter>
    <SidebarRail />
  </Sidebar>
  <SidebarInset>{/* Page content */}</SidebarInset>
</SidebarProvider>

Key composition rules:

Wrap app with SidebarProvider at the layout level.
Use SidebarContent (not "SidebarPanel") as the scrollable body between header/footer. It uses ScrollArea with fill so flex children (e.g. mt-auto footers) can pin to the bottom.
Navigation items use SidebarMenu > SidebarMenuItem > SidebarMenuButton.
For link items, use render composition: <SidebarMenuButton render={<a href="..." />}>. Do not use asChild -- sidebar follows the same render pattern as all other coss primitives.
Use SidebarTrigger for the collapse/expand toggle.
Use SidebarInset for the main content area next to the sidebar.
SidebarRail adds a slim hover-to-expand rail in collapsed state.

More examples

See p-toolbar-1, p-breadcrumb-1, p-tabs-1, p-menu-1 for related app-shell patterns.

Common pitfalls

Using non-existent parts like "SidebarPanel" or "SidebarItem" -- the correct names are SidebarContent and SidebarMenuItem.
Forgetting SidebarProvider wrapper, which manages collapse state and mobile responsiveness.
Skipping the SidebarMenu > SidebarMenuItem > SidebarMenuButton hierarchy for nav items.
Missing responsive collapse strategy for narrow/mobile layouts.
Replacing SidebarContent's scroll area with a raw ScrollArea without fill when the body uses mt-auto to pin footers—use fill (see scroll-area primitive docs).

Useful particle references

sidebar-specific particles: no dedicated p-sidebar-* family currently.
app-shell references: p-toolbar-1, p-breadcrumb-1, p-tabs-1, p-menu-1

3.9 KiB Raw Blame History