Symptom Text Analyzer

AI-powered symptom analyzer that uses LLM intelligence to provide fast, conversational, and accessible health insights through a modern React and Flask-based platform.

Comment

Inspiration

What it does

How we built it

Challenges we ran into

Accomplishments that we're proud of

What we learned# symptom-analyzer

Overview

symptom-analyzer is a web application that takes free-form symptom text from a user and returns a structured health report (including severity, symptoms list, and advice broken into sections). It consists of:

  • A Flask backend API (served from backend/) that exposes endpoints such as GET /, GET /health, and POST /analyze (registered via the routes.analyze blueprint).
  • A React + Vite frontend (under frontend/) that collects input, calls the backend, and renders results with styled components.

The backend also reports on the availability/config of an external LLM service (Groq), which the frontend can surface indirectly (e.g., “LLM status” on the index route).

Key Features

  • Symptom text input in the UI with disabled/loading states while analysis runs.
  • Backend API:
    • GET / index endpoint that returns service metadata plus Groq availability/config status.
    • GET /health health check including Groq availability.
    • POST /analyze endpoint (wired from routes.analyze) for producing analysis output.
  • Structured result rendering on the frontend:
    • Severity badge (MILD, MODERATE, HIGH)
    • Symptoms list (with fallback when none are detected)
    • Metric tiles for score (“Urgency score”) and risk_level.
    • Report sections parsed from a generated report text
  • Report parsing utilities:
    • Frontend parses markdown-style sections using ## headers
    • Filters out sections whose title contains “disclaimer”
    • Handles plain text input by returning a single “Health report” section
  • Emergency risk alert in the UI:
    • If result.risk_level === "emergency", the app prompts the user to call emergency services.

Tech Stack

Backend

  • Flask — web server and API framework
  • flask-cors — enables CORS for configured origins
  • python-dotenv — loads environment variables from a .env file
  • requests — used for outbound HTTP calls (e.g., to LLM providers / external services)

Frontend

  • React (Vite + ES Modules build)
  • Vite — development server and bundler
  • TailwindCSS (via PostCSS/autoprefixer) — styling
  • UI components for report rendering, badges, loader, input, and cards
  • API client abstraction for backend communication

Project Architecture

Entry points & app bootstrapping

  • Top-level app.py

    • Sets default environment variables related to Flask routing:
    • SERVER_NAME
    • PREFERRED_URL_SCHEME
    • APPLICATION_ROOT
    • Ensures backend/ is available on sys.path
    • Dynamically loads backend/app.py and extracts:
    • app
    • application
    • Exposes these for external imports (__all__)

  • backend/app.py

    • Provides create_app() which builds and configures the Flask application:
    • Loads configuration from environment variables with a prefix
    • Enables CORS for configured origins
    • Registers the routes.analyze blueprint (adds /analyze)
    • Adds:
      • GET / index endpoint with metadata + Groq status (availability, whether key is set, model name)
      • GET /health health check including Groq availability
    • Instantiates the app (app and application)
    • Adds a test request context so url_for calls work outside a live request
    • When executed directly, prints a startup message and runs Flask on:
    • 127.0.0.1:5000 in debug mode

Frontend flow (from input to rendered report)

  • frontend/src/pages/Home.jsx

    • Renders the “Symptom Text Analyzer” page
    • Wires InputBox submission to the useAnalyze hook
    • Shows Loader while requests are in-flight
    • Displays error messages when analysis fails
    • Renders ResultCard when the analysis result is available
    • Checks for "emergency" risk and displays an emergency alert

  • frontend/src/hooks/useAnalyze.js

    • Manages result, loading, and error state
    • Provides:
    • analyze(text) → calls the API client and stores the response
    • reset() → clears result/error

  • API client: frontend/src/services/api.js

    • API_BASE from VITE_API_URL (default http://127.0.0.1:5000)
    • analyzeText(text):
    • POST to ${API_BASE}/analyze with JSON body { text }
    • parses JSON response
    • throws on request/HTTP errors
    • fetchOllamaStatus():
    • GET /ollama/status (returns parsed JSON on success, otherwise null)
    • Note: availability errors are handled gracefully

  • Result rendering

    • ResultCard.jsx
    • Displays severity, symptoms, urgency score, and risk level
    • Parses data.llm_advice using parseReportSections.
    • Renders each section using ReportSectionCard.
    • parseReport.js
    • Splits markdown report text by ## headers
    • Extracts title/body until next header
    • Removes (Educational — Not a Prescription) from titles
    • Filters out sections containing "disclaimer"
    • Returns [] for empty input and a default “Health report” section for plain text
    • ReportSectionCard.jsx
    • Chooses visual theme based on section title.
    • Formats bullet-like text as <ul>, otherwise as paragraphs
    • Adjusts width/layout for certain titles (e.g., “summary”, “disclaimer”)
    • Supporting components:
    • SeverityBadge.jsx (maps severity to label and Tailwind classes)
    • InputBox.jsx (textarea + submit button, disabled while loading)
    • Loader.jsx (loading animation/message)

Installation / Usage (Placeholder)

Exact commands are not provided by the file summaries. Use the following placeholders as a starting point.

Backend

  1. Navigate to backend/.
  2. Install dependencies from backend/requirements.txt.
  3. Configure environment variables (optionally via .env)
  4. Start the backend (via the repository’s entry app.py / or running backend/app.py)

Frontend

  1. Navigate to frontend/.
  2. Install dependencies (npm install or equivalent)
  3. Set VITE_API_URL if your backend is not at http://127.0.0.1:5000
  4. Run in development mode (npm run dev)
  5. Build/preview when needed (npm run build, npm run preview)

Environment Variables (Inferred Placeholder)

The backend uses environment variables for Flask routing and LLM/provider configuration. The entry points mention (at least) these routing defaults:

  • SERVER_NAME
  • PREFERRED_URL_SCHEME
  • APPLICATION_ROOT

The frontend uses:

  • VITE_API_URL (defaulting to http://127.0.0.1:5000)

The backend also reports Groq configuration on GET / and GET /health, indicating Groq-related environment variables exist (exact names are not included in the provided summaries).

Endpoints Summary (Inferred)

  • GET /

    • Service metadata + Groq status (availability, key set, model name)

  • GET /health

    • Health check including Groq availability

  • POST /analyze

    • Accepts symptom text (frontend sends { text })
    • Returns analysis data consumed by ResultCard.
    • Expected fields (inferred from UI usage):
    • severity
    • symptoms
    • score
    • risk_level
    • llm_advice (used for section parsing)

This README was generated with PresentMe. View the full presentation here.

What's next for Symptom Text Analyzer

Built With

Share this project:

Updates