Family History Medical App

A Next.js-based medical family history intake application that collects patient and family health data through a multi-step wizard, generates genograms (family medical history diagrams), and delivers results to healthcare providers.

Tech Stack

Core Framework

• Next.js 15.5.2 (App Router)
• React 19.2.3
• TypeScript 5.x
• Tailwind CSS 4.x

Key Libraries

• Form Management: React Hook Form 7.71.1 + Zod 4.3.6 validation
• Data Fetching: TanStack Query 5.90.21
• UI Components: Radix UI + shadcn/ui (Button, Card, Command, Dialog, Input, Label)
• Icons: Lucide React 0.574.0
• Utilities: clsx, tailwind-merge, class-variance-authority

Deployment

• Target Platform: Cloudflare Workers (via @opennextjs/cloudflare)
• Tooling: Wrangler 4.72.0

Getting Started

Prerequisites

• Node.js 20+
• npm/yarn/pnpm

Installation

npm install

Environment Setup

Copy .env.example to .env.local and configure required environment variables (unverified — confirm with team for specific variables needed).

Development

npm run dev

Open http://localhost:3000 to access the application.

Build & Deployment

Standard Next.js build:

npm run build
npm run start

Cloudflare deployment:

npm run cf:build      # Build for Cloudflare Workers
npm run cf:preview    # Preview locally
npm run cf:deploy     # Deploy to Cloudflare
npm run cf:upload     # Upload to Cloudflare

Linting

npm run lint

Application Architecture

Multi-Step Wizard Flow

The application guides users through a structured family history intake process:

1. Personal Information (personal-info-step) — Patient demographics
2. Children (children-step) — Offspring health history
3. Siblings (siblings-step) — Patient's siblings
4. Mother's Siblings (mother-siblings-step) — Maternal aunts/uncles
5. Father's Siblings (father-siblings-step) — Paternal aunts/uncles
6. Person/Pair Steps (person-step, person-pair-step) — Individual relative data entry
7. Delivery (delivery-step) — Healthcare provider selection and result delivery
8. Summary (summary-step) — Review, analysis, and recommendations

Core Modules

Form Management (lib/form/)

• Form state management
• Validation schemas
• Multi-step navigation

Genogram Generation (lib/genogram/)

• Family tree data structure
• Medical history mapping
• Visualization logic (unverified — confirm visualization implementation)

Taxonomy (lib/taxonomy/)

• Cancer type classification
• Comorbidity taxonomy
• Disease categorization

Delivery (lib/delivery/)

• Healthcare provider integration
• Result transmission
• Delivery confirmation

Persistence (lib/persistence/)

• Form state saving
• Session management
• Data recovery

Internationalization (lib/i18n/)

• Multi-language support
• Locale management (locales available — confirm which languages supported)

API Endpoints

Public Routes

• GET /health — Health check endpoint
• GET /metrics — Application metrics (unverified — confirm metrics scope)
• GET /readme — README documentation endpoint

Application APIs

• POST /api/submit-genogram — Submit completed family history genogram
• POST /api/delivery/hcp — Deliver results to healthcare provider
• GET /api/validate-provider — Validate healthcare provider credentials
• GET /api/taxonomy/cancers — Retrieve cancer taxonomy data
• GET /api/genograms/comorbidity-taxonomy — Fetch comorbidity classification

Key Features

Cancer History Collection

• Specialized cancer type selection via searchable combobox
• Age at diagnosis tracking
• Multiple cancer diagnoses per individual
• Life status tracking (living/deceased)

Family Structure Mapping

• Three-generation pedigree (grandparents, parents, siblings, children)
• Gender-specific relative grouping
• Relationship validation

Summary & Analysis

• Diagnosis aggregation across family members
• Matched case identification (unverified — confirm matching algorithm)
• Clinical recommendations generation (unverified — confirm recommendation engine)
• Findings visualization
• Disclaimer notices for clinical use

Healthcare Provider Delivery

• Provider validation workflow
• Secure result transmission
• Delivery success confirmation

UI Components

Built with shadcn/ui and Radix UI primitives:

• Forms: Input, Label, Command (combobox)
• Layout: Card, Dialog
• Interactive: Button (with variants)
• Custom: Cancer Type Combobox, Relative Cards, Gender Segments

Development Notes

• Uses App Router architecture (Next.js 15+)
• Strict TypeScript configuration enabled
• Path aliasing configured (@/* maps to project root)
• Target: ES2017 for Cloudflare Workers compatibility
• React 19 with strict mode

Project Status

(unverified — confirm current roadmap and production status with team)

---

Developed by Wellysa | Repository: Wellysa/family-history-medical-app