mirror of
https://github.com/temetro/temetro.git
synced 2026-09-02 05:47:55 +00:00
Khalid Abdi
929bec8f31
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>
82 lines
2.7 KiB
Markdown
82 lines
2.7 KiB
Markdown
# coss Table
|
|
|
|
## When to use
|
|
|
|
- Structured tabular datasets.
|
|
- Sortable/filterable row and column displays.
|
|
|
|
## Install
|
|
|
|
```bash
|
|
npx shadcn@latest add @coss/table
|
|
```
|
|
|
|
Manual deps from docs:
|
|
|
|
```bash
|
|
# No extra runtime dependency required for basic table usage.
|
|
# For interactive data tables, add TanStack Table:
|
|
npm install @tanstack/react-table
|
|
```
|
|
|
|
## Canonical imports
|
|
|
|
```tsx
|
|
import {
|
|
Table,
|
|
TableBody,
|
|
TableCaption,
|
|
TableCell,
|
|
TableFooter,
|
|
TableHead,
|
|
TableHeader,
|
|
TableRow,
|
|
} from "@/components/ui/table"
|
|
```
|
|
|
|
## Minimal pattern
|
|
|
|
```tsx
|
|
<Table>
|
|
<TableHeader>
|
|
<TableRow>
|
|
<TableHead>Name</TableHead>
|
|
</TableRow>
|
|
</TableHeader>
|
|
<TableBody>
|
|
<TableRow>
|
|
<TableCell>Ada Lovelace</TableCell>
|
|
</TableRow>
|
|
</TableBody>
|
|
</Table>
|
|
```
|
|
|
|
## Patterns from coss particles
|
|
|
|
- **Semantic baseline**: start with `TableHeader`/`TableBody`/`TableRow`/`TableHead`/`TableCell`, then add `TableCaption` and `TableFooter` as needed.
|
|
- **Card variant**: set `variant="card"` on `Table` for rounded, card-like rows and separated borders (`p-table-5`). Combine with `Frame` for app-surface framing (`p-table-2`), with `CardFrame` for static tables in a card shell (`p-table-7`), or with TanStack inside `CardFrame` for selection (`p-table-6`) or sorting and pagination (`p-table-8`).
|
|
- **Status-rich rows**: combine `Badge` and decorative dots/icons for state columns while keeping text primary.
|
|
- **Interactive data grids**: pair coss table parts with TanStack Table (`flexRender`, row models, selection state) for sorting/pagination/selection.
|
|
- **No-results state**: always render an explicit empty-state row with `colSpan` matching visible columns.
|
|
- **Fixed layout control**: use `className="table-fixed"` and column width styles when predictable column sizing is required.
|
|
|
|
## Common pitfalls
|
|
|
|
- Assuming `Table` itself provides sorting/filter/pagination state; these come from your data layer (for example TanStack Table).
|
|
- Mixing header/body cell semantics (`TableHead` in body rows or `TableCell` in headers).
|
|
- Forgetting to align `colSpan` with actual visible columns in footer/empty rows.
|
|
- Using table patterns where card/list layouts are more suitable on small screens without responsive handling.
|
|
- Omitting `aria-label` for row-selection checkboxes in interactive tables.
|
|
|
|
## Useful particle references
|
|
|
|
- basic semantic table with caption/footer: `p-table-1`
|
|
- `Frame` + card variant: `p-table-2`
|
|
- TanStack + checkboxes + `Frame`: `p-table-3`
|
|
- TanStack sorting + pagination + `Frame`: `p-table-4`
|
|
- card variant only (no shell): `p-table-5`
|
|
- `CardFrame` + static table: `p-table-7`
|
|
- `CardFrame` + TanStack + checkboxes: `p-table-6`
|
|
- `CardFrame` + TanStack + sort + pagination: `p-table-8`
|
|
|