pediatric-ai-scribe-v3/client
Daniel 43e8611b24 feat(client): port Bedside sub-nav shell (15 pills linked to legacy)
First Bedside commit. Delivers the /app/bedside page with the full
15-pill sub-nav in the same order + labels as the vanilla app, and
switches the sidebar Bedside link to available.

client/src/pages/Bedside.tsx
  Single-file shell. PILLS array is the single source of truth for
  pill ID / label / icon / summary, ordered to match
  public/components/bedside.html (neonatal, airway, cardiac,
  respiratory, ventilation, seizure, sepsis, anaphylaxis, sedation,
  agitation, antiemetics, antimicrobials, burns, toxicology, trauma).
  Clicking a pill flips useState<active>, and LegacyPanel renders a
  summary of that module + a button to open the legacy Bedside tab.

What is intentionally NOT in this commit
  Each pill's actual clinical dosing panel stays in vanilla for now.
  Those panels encode weight-based dosing, syndrome-keyed
  antimicrobials, and PALS / ALS formulas — exactly the class of
  content the migration checkpoint memory flags as must-not-be-
  "simplified" by an LLM. They belong in per-module commits that
  land alongside the calculators port (APLS + Best Guess weight,
  Fenton 2013 LMS, AAP 2022 bilirubin, Rosner BP splines) where
  test vectors can verify byte-for-byte parity with the vanilla
  output.

  The top-level age → weight estimator also waits on calculators —
  it calls window._PED_MATH.estimateWeightFromAgeMonths in the
  vanilla module, which is defined in public/js/calculators.js.

e2e/tests/bedside-react.spec.js — three smoke tests
  All 15 pills render by data-testid, clicking a pill swaps the
  panel, and the legacy-viewer link is present. The pill-order list
  is hard-coded in the spec so re-ordering or dropping a pill trips
  a loud failure.

Client tsc -b + vite build clean. Bundle 456.71 kB / 130.53 kB gz.
2026-04-23 23:59:34 +02:00
..
public feat(client): day 6 — scaffold React 19 + Vite + Tailwind v4 + shadcn/ui 2026-04-23 21:58:37 +02:00
src feat(client): port Bedside sub-nav shell (15 pills linked to legacy) 2026-04-23 23:59:34 +02:00
.gitignore feat(client): day 6 — scaffold React 19 + Vite + Tailwind v4 + shadcn/ui 2026-04-23 21:58:37 +02:00
components.json feat(client): day 6 — scaffold React 19 + Vite + Tailwind v4 + shadcn/ui 2026-04-23 21:58:37 +02:00
eslint.config.js feat(client): day 6 — scaffold React 19 + Vite + Tailwind v4 + shadcn/ui 2026-04-23 21:58:37 +02:00
index.html feat(client): day 6 — scaffold React 19 + Vite + Tailwind v4 + shadcn/ui 2026-04-23 21:58:37 +02:00
package-lock.json feat: day 7 — first tab ported to React (Extensions) + Express serves /app/* 2026-04-23 22:09:04 +02:00
package.json feat: day 7 — first tab ported to React (Extensions) + Express serves /app/* 2026-04-23 22:09:04 +02:00
README.md feat(client): day 6 — scaffold React 19 + Vite + Tailwind v4 + shadcn/ui 2026-04-23 21:58:37 +02:00
tsconfig.app.json feat: day 7 — first tab ported to React (Extensions) + Express serves /app/* 2026-04-23 22:09:04 +02:00
tsconfig.json feat(client): day 6 — scaffold React 19 + Vite + Tailwind v4 + shadcn/ui 2026-04-23 21:58:37 +02:00
tsconfig.node.json feat(client): day 6 — scaffold React 19 + Vite + Tailwind v4 + shadcn/ui 2026-04-23 21:58:37 +02:00
vite.config.ts feat(client): day 6 — scaffold React 19 + Vite + Tailwind v4 + shadcn/ui 2026-04-23 21:58:37 +02:00

React + TypeScript + Vite

This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.

Currently, two official plugins are available:

React Compiler

The React Compiler is not enabled on this template because of its impact on dev & build performances. To add it, see this documentation.

Expanding the ESLint configuration

If you are developing a production application, we recommend updating the configuration to enable type-aware lint rules:

export default defineConfig([
  globalIgnores(['dist']),
  {
    files: ['**/*.{ts,tsx}'],
    extends: [
      // Other configs...

      // Remove tseslint.configs.recommended and replace with this
      tseslint.configs.recommendedTypeChecked,
      // Alternatively, use this for stricter rules
      tseslint.configs.strictTypeChecked,
      // Optionally, add this for stylistic rules
      tseslint.configs.stylisticTypeChecked,

      // Other configs...
    ],
    languageOptions: {
      parserOptions: {
        project: ['./tsconfig.node.json', './tsconfig.app.json'],
        tsconfigRootDir: import.meta.dirname,
      },
      // other options...
    },
  },
])

You can also install eslint-plugin-react-x and eslint-plugin-react-dom for React-specific lint rules:

// eslint.config.js
import reactX from 'eslint-plugin-react-x'
import reactDom from 'eslint-plugin-react-dom'

export default defineConfig([
  globalIgnores(['dist']),
  {
    files: ['**/*.{ts,tsx}'],
    extends: [
      // Other configs...
      // Enable lint rules for React
      reactX.configs['recommended-typescript'],
      // Enable lint rules for React DOM
      reactDom.configs.recommended,
    ],
    languageOptions: {
      parserOptions: {
        project: ['./tsconfig.node.json', './tsconfig.app.json'],
        tsconfigRootDir: import.meta.dirname,
      },
      // other options...
    },
  },
])