An AIβpowered clinical documentation tool that helps physicians generate structured medical reports from naturalβlanguage notes. Built with Next.js (App Router), Supabase for auth and persistence, and Tambo AI for LLMβpowered report generation.
Medical Report Generator streamlines documentation for healthcare providers by:
- Accepting clinical notes in natural language
- Using Tambo AI to generate structured reports
- Storing reports securely in Supabase with RowβLevel Security
- Offering a responsive UI with light/dark mode and easy logout
-
π©Ί AIβGenerated Reports
Describe patient findings in plain text and get a formatted medical report. -
π Authentication & RBAC
Login with Supabase Auth; users see only their own reports. -
π Report Management
Save, view, edit, and delete reports with a clean UI. -
π Dark/Light Mode
Toggle theme vianext-themeswithThemeProviderandThemeToggle. -
π‘οΈ Secure Environment
API keys and Supabase credentials are stored securely -
π€ GitHub Ready
.env.exampledocuments required variables.
| Layer | Technology |
|---|---|
| Frontend | Next.js 16 (App Router), React Server Components, Client Components |
| Language | TypeScript |
| Styling | Tailwind CSS |
| UI | Lucide React Icons |
| AI/LLM | Tambo AI SDK (@tambo-ai/react) |
| Backend / Auth | Supabase (Auth, Postgres RLS) |
| Deployment | Vercel |
| Version Control | Git + GitHub |
medical-report-generator/
βββ app/
β βββ auth/
β β βββ login/
β βββ components/
β β βββ ChatInterface.tsx # Main reportβgeneration UI
β β βββ Header.tsx # Header with logo, title, theme toggle, logout
β β βββ SavedReports.tsx # Saved reports list
β β βββ ThemeProvider.tsx # next-themes wrapper
β β βββ ThemeToggle.tsx # Theme switch button
β β βββ TamboWrapper.tsx # Wraps app in TamboProvider
β βββ lib/
β β βββ supabase.ts # Supabase client
β βββ globals.css # Global styles + Tailwind config
β βββ icon.png # App icon / favicon
β βββ layout.tsx # Root layout
β βββ page.tsx # Home/dashboard with auth guard
βββ public/ # Static assets
βββ .env.example # Environment template
βββ .env.local # Local env (ignored)
βββ .gitignore # Excludes .env.local, .next, etc.
βββ next.config.js
βββ tailwind.config.ts
βββ tsconfig.json
- Node.js (v18+ recommended)
- npm / yarn
- Supabase project
- Tambo AI project (API key)
git clone https://github.com/LastCoderPython/Medical-Report-Generator.git
cd Medical-Report-Generatornpm installCreate .env.local (not tracked in Git):
# Supabase
NEXT_PUBLIC_SUPABASE_URL=https://your-supabase-project.supabase.co
NEXT_PUBLIC_SUPABASE_ANON_KEY=your_anon_key
# Tambo AI
NEXT_PUBLIC_TAMBO_API_KEY=your_tambo_api_key
You can copy the template from .env.example:
NEXT_PUBLIC_TAMBO_API_KEY=your_tambo_api_key_here
NEXT_PUBLIC_SUPABASE_URL=your_supabase_url_here
NEXT_PUBLIC_SUPABASE_ANON_KEY=your_supabase_anon_key_here
npm run devOpen http://localhost:3000 in your browser.
Run this in the Supabase SQL Editor to create the reports table:
CREATE TABLE IF NOT EXISTS public.reports (
id UUID DEFAULT gen_random_uuid() PRIMARY KEY,
user_id UUID REFERENCES auth.users(id) ON DELETE CASCADE,
patient_name TEXT NOT NULL,
patient_mrn TEXT,
patient_age INTEGER,
patient_gender TEXT,
report_type TEXT,
report_content TEXT,
diagnosis TEXT,
exam_date DATE,
specialty TEXT,
icd10_codes TEXT[],
created_at TIMESTAMPTZ DEFAULT TIMEZONE('utc'::TEXT, NOW())
);
-- Enable RLS
ALTER TABLE public.reports ENABLE ROW LEVEL SECURITY;
-- Policies
CREATE POLICY "Users can view own reports"
ON public.reports FOR SELECT
USING (auth.uid() = user_id);
CREATE POLICY "Users can create own reports"
ON public.reports FOR INSERT
WITH CHECK (auth.uid() = user_id);
CREATE POLICY "Users can delete own reports"
ON public.reports FOR DELETE
USING (auth.uid() = user_id);This ensures each user only sees and manages their own reports.
git add .
git commit -m "Add complete docs and dark mode / logout"
git push origin main- Go to Vercel β Import project
- Select your GitHub repo
- During import, set the Framework to Next.js
In Project Settings β Environment Variables, add:
| Variable | Value | Environment |
|---|---|---|
NEXT_PUBLIC_SUPABASE_URL |
Your Supabase project URL | All |
NEXT_PUBLIC_SUPABASE_ANON_KEY |
Your Supabase anon key | All |
NEXT_PUBLIC_TAMBO_API_KEY |
Your Tambo API key | All |
Vercel will build and deploy automatically. Visit the generated URL (e.g., https://medical-report-generator.vercel.app).
- Checks
supabase.auth.getUser() - Redirects unauthenticated users to
/auth/login
- Sends user input to Tambo AI
- Receives structured report text
- Lets user save it to Supabase
- Fetches reports scoped to
auth.uid() - Allows view, edit, delete (with RLS enforcing ownership)
next-themesprovides light/dark mode via CSS variablesThemeTogglelives in the header next to the title- All text is black in light mode, light on dark backgrounds
- Clicking the logout button calls
supabase.auth.signOut() - Redirects to
/auth/loginviauseRouter
.env.exampleis public template- Supabase environment variables are never logged
- Prevents unauthorized access to other users' reports
- Leverages Supabase email auth
- No raw secrets in client code
- Vercel enforces HTTPS
- Next.js best practices (App Router, SSR, RSC)
Navigate to the app β log in via Supabase.
- Enter patient details and clinical findings
- Click "Generate" (or equivalent)
- Review AIβgenerated report
- Click "Save" to store the report in Supabase
- The report is linked to your user ID
- View list of saved reports
- Click any report to view details
- Edit or delete as needed
- The reports can be exported as: PDF, .docx
- Click the βοΈ/π button to switch modes
- Click "Logout" to sign out securely
- Security - Switching it to password-less authentication
- Templates β Increase in Preβdefined templates by specialty (Radiology, Cardiology, etc.)
- Multilingual Support β Generate reports in regional languages
- Voice Input β Speechβtoβtext for clinical notes
- Collaboration β Share reports with team members with fineβgrained permissions
- Audit Logs β Track who edited what and when
MIT License β free to use, modify, and distribute for personal and commercial projects.
Made with β€οΈ for healthcare professionals and developers alike.