Skip to content

LastCoderPython/Medical-Report-Generator

Repository files navigation

πŸ₯ Medical Report Generator

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.

Next.js Supabase Tambo AI TypeScript


πŸš€ Overview

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

✨ Key Features

  • 🩺 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 via next-themes with ThemeProvider and ThemeToggle.

  • πŸ›‘οΈ Secure Environment
    API keys and Supabase credentials are stored securely

  • πŸ“€ GitHub Ready
    .env.example documents required variables.


πŸ› οΈ Tech Stack

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

πŸ“¦ Project Structure (Simplified)

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

βš™οΈ Setup & Local Development

1. Prerequisites

  • Node.js (v18+ recommended)
  • npm / yarn
  • Supabase project
  • Tambo AI project (API key)

2. Clone the repo

git clone https://github.com/LastCoderPython/Medical-Report-Generator.git
cd Medical-Report-Generator

3. Install dependencies

npm install

4. Environment variables

Create .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

5. Run the dev server

npm run dev

Open http://localhost:3000 in your browser.


πŸ”§ Database Setup (Supabase)

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.


πŸš€ Deployment (Vercel)

1. Push to GitHub

git add .
git commit -m "Add complete docs and dark mode / logout"
git push origin main

2. Import project in Vercel

  • Go to Vercel β†’ Import project
  • Select your GitHub repo
  • During import, set the Framework to Next.js

3. Add environment variables

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

4. Deploy

Vercel will build and deploy automatically. Visit the generated URL (e.g., https://medical-report-generator.vercel.app).


🧩 How It Works

Auth Guard (page.tsx)

  • Checks supabase.auth.getUser()
  • Redirects unauthenticated users to /auth/login

Report Generation (ChatInterface)

  • Sends user input to Tambo AI
  • Receives structured report text
  • Lets user save it to Supabase

Saved Reports (SavedReports.tsx)

  • Fetches reports scoped to auth.uid()
  • Allows view, edit, delete (with RLS enforcing ownership)

Theme & UI (Header, ThemeToggle)

  • next-themes provides light/dark mode via CSS variables
  • ThemeToggle lives in the header next to the title
  • All text is black in light mode, light on dark backgrounds

Logout (Header)

  • Clicking the logout button calls supabase.auth.signOut()
  • Redirects to /auth/login via useRouter

πŸ”’ Security & Best Practices

Sensitive Data Protection

  • .env.example is public template
  • Supabase environment variables are never logged

Row‑Level Security (RLS)

  • Prevents unauthorized access to other users' reports

Authentication

  • Leverages Supabase email auth
  • No raw secrets in client code

HTTPS & Modern Practices

  • Vercel enforces HTTPS
  • Next.js best practices (App Router, SSR, RSC)

πŸ“ Usage Flow

Signup / Login

Navigate to the app β†’ log in via Supabase.

Generate Report

  1. Enter patient details and clinical findings
  2. Click "Generate" (or equivalent)
  3. Review AI‑generated report

Save Report

  1. Click "Save" to store the report in Supabase
  2. The report is linked to your user ID

Manage Reports

  • View list of saved reports
  • Click any report to view details
  • Edit or delete as needed

Export Reports

  • The reports can be exported as: PDF, .docx

Toggle Theme / Logout

  • Click the β˜€οΈ/πŸŒ™ button to switch modes
  • Click "Logout" to sign out securely

πŸ“ˆ Future Enhancements

  • 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

πŸ“„ License

MIT License – free to use, modify, and distribute for personal and commercial projects.


Made with ❀️ for healthcare professionals and developers alike.

⚠️ Use responsibly and always verify AI‑generated content in real clinical settings.

About

Project using Tamboo AI for wemakedevs hackathon

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages