# akshatsinghnayal/sih-project-2025 architecture

> Architecture diagram of the GitHub repository akshatsinghnayal/sih-project-2025, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-06-15). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/akshatsinghnayal/sih-project-2025
- Repository: https://github.com/akshatsinghnayal/sih-project-2025

## Overview

1. **Repository shape**
   - This is a two-part monorepo: a **React/TypeScript frontend** in `SIH-Chat-Bot/` and an **optional Node/Express backend** in `server/`.
   - The frontend can talk to Gemini directly in dev mode, or route through the backend for production-style streaming.

2. **Primary product boundary**
   - The app is a **student mental-wellness chatbot**: anonymous chat, supportive AI responses, and no heavy user profile system.
   - The architecture is intentionally simple around a single core loop: user message in, Gemini response out, with optional persistence.

3. **Frontend application shell**
   - `SIH-Chat-Bot/App.tsx`, `index.tsx`, and `index.html` form the app entry path.
   - `App.tsx` likely decides between authentication and chat experience, while global styling is handled by `index.css` plus Tailwind CDN usage noted in the README.
   - `vite.config.ts` and `tsconfig.json` indicate a Vite-built SPA.

4. **UI composition**
   - The chat UI is split into focused components:
     - `components/Auth.tsx` for login/signup
     - `components/ChatView.tsx` for the main conversation area
     - `components/ChatWindow.tsx` for message rendering and input handling
     - `components/Sidebar.tsx` for session/history/navigation controls
   - `components/icons/` holds local SVG-style UI assets, suggesting the app avoids a separate icon library.

5. **State and auth boundary**
   - `context/AuthContext.tsx` and `hooks/useAuth.ts` define the app’s auth layer.
   - The README says auth is **mocked with localStorage**, so authentication is a client-side state boundary rather than a real identity service.
   - This makes auth lightweight and keeps the mental-wellness experience anonymous.

6. **Chat data flow in the frontend**
   - The chat experience is centered on stateful UI components feeding message data through service calls and rendering responses back into the conversation pane.
   - `types.ts` and `constants.ts` likely define shared message/session shapes and prompt/UI constants, keeping chat logic consistent across components.

7. **AI integration layer**
   - `services/geminiService.ts` is the direct integration point for Google Gemini.
   - `services/apiService.ts` likely abstracts whether requests go to the local Gemini client path or the backend API, based on environment flags such as `VITE_USE_REMOTE_API`.
   - This creates a clean split between UI logic and model-provider communication.

8. **Streaming response architecture**
   - The README highlights **Server-Sent Events (SSE)** and real-time streaming.
   - In browser-only mode, streaming may be handled directly from the client SDK; in backend mode, the Express server acts as the streaming relay so the frontend can progressively render token/character updates.
   - This is the key interactive boundary in the system: input is immediate, output is incremental.

9. **Backend responsibilities**
   - `server/index.js` is the Express entry point, with `server/db.js` for MongoDB connection and `server/models.js` for persistence schemas.
   - The backend is described as optional, so it is not the single source of truth for the product; it mainly supports **production-safe streaming** and **optional chat persistence**.
   - `server/.env.example` suggests the backend is configured around `GEMINI_API_KEY` and optionally `MONGODB_URI`.

10. **Persistence layer**
   - MongoDB is explicitly optional, which means chat history storage is not required for core operation.
   - If enabled, the data boundary sits entirely in the backend via Mongoose models, keeping the frontend anonymous and lightweight.

11. **Deployment/runtime boundaries**
   - `render.yaml` and `DEPLOY-RENDER.md` indicate the project is designed for deployment on Render.
   - `SIH-Chat-Bot/public/_redirects` suggests SPA routing support for static hosting.
   - The repo therefore supports two runtime topologies: static frontend only, or frontend plus backend API service.

12. **Implementation themes that matter architecturally**
   - The app is built to be **privacy-preserving**, **responsive**, and **emotionally safe** rather than feature-heavy.
   - Markdown rendering and the calming UI are presentation concerns; the meaningful architectural concerns are the split between client/UI, Gemini integration, streaming transport, and optional persistence.

Main entry points: [`server/index.js`](https://github.com/akshatsinghnayal/sih-project-2025/blob/main/server/index.js) (Express API), [`SIH-Chat-Bot/App.tsx`](https://github.com/akshatsinghnayal/sih-project-2025/blob/main/SIH-Chat-Bot/App.tsx) (App shell), [`SIH-Chat-Bot/components/ChatWindow.tsx`](https://github.com/akshatsinghnayal/sih-project-2025/blob/main/SIH-Chat-Bot/components/ChatWindow.tsx) (Chat window), [`SIH-Chat-Bot/components/ChatView.tsx`](https://github.com/akshatsinghnayal/sih-project-2025/blob/main/SIH-Chat-Bot/components/ChatView.tsx) (Chat view)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_frontend["Frontend app"]
  node_entry["App shell<br/>react entry<br/>[App.tsx]"]
  node_bootstrap["Boot files<br/>spa entry<br/>[index.tsx]"]
  node_styles["Global styles<br/>ui styling<br/>[index.css]"]
  node_auth_ui["Auth screen<br/>auth ui<br/>[Auth.tsx]"]
  node_chat_view["Chat view<br/>conversation ui<br/>[ChatView.tsx]"]
  node_chat_window["Chat window<br/>message stream ui<br/>[ChatWindow.tsx]"]
  node_sidebar["Sidebar<br/>session nav<br/>[Sidebar.tsx]"]
  node_auth_ctx["Auth context<br/>client auth state<br/>[AuthContext.tsx]"]
  node_auth_hook["useAuth<br/>auth hook<br/>[useAuth.ts]"]
  node_api_service["API service<br/>transport adapter<br/>[apiService.ts]"]
  node_gemini_service["Gemini client<br/>model client<br/>[geminiService.ts]"]
  node_chat_types["Chat types<br/>shared models<br/>[types.ts]"]
  node_chat_constants["Constants<br/>shared config<br/>[constants.ts]"]
end

subgraph group_backend["Backend service"]
  node_server_entry["Express API<br/>node service<br/>[index.js]"]
  node_db[("MongoDB<br/>database connection<br/>[db.js]")]
  node_models["Mongoose models<br/>persistence schema<br/>[models.js]"]
end

subgraph group_deploy["Deployment"]
  node_render_cfg["Render config<br/>deploy config<br/>[render.yaml]"]
  node_redirects["SPA redirects<br/>static hosting config"]
end

node_bootstrap -->|"loads"| node_entry
node_styles -->|"styles"| node_entry
node_entry -->|"shows"| node_auth_ui
node_entry -->|"shows"| node_chat_view
node_auth_ui -->|"uses"| node_auth_ctx
node_auth_ctx -->|"exposes"| node_auth_hook
node_chat_view -->|"contains"| node_chat_window
node_chat_view -->|"contains"| node_sidebar
node_chat_window -->|"shapes"| node_chat_types
node_chat_window -->|"configures"| node_chat_constants
node_chat_window -->|"sends"| node_api_service
node_api_service -->|"directs"| node_gemini_service
node_api_service -->|"routes to"| node_server_entry
node_server_entry -->|"connects"| node_db
node_server_entry -->|"uses"| node_models
node_server_entry -->|"relays"| node_gemini_service
node_render_cfg -->|"deploys"| node_server_entry
node_render_cfg -->|"deploys"| node_entry
node_redirects -->|"supports"| node_bootstrap

click node_entry "https://github.com/akshatsinghnayal/sih-project-2025/blob/main/SIH-Chat-Bot/App.tsx"
click node_bootstrap "https://github.com/akshatsinghnayal/sih-project-2025/blob/main/SIH-Chat-Bot/index.tsx"
click node_styles "https://github.com/akshatsinghnayal/sih-project-2025/blob/main/SIH-Chat-Bot/index.css"
click node_auth_ui "https://github.com/akshatsinghnayal/sih-project-2025/blob/main/SIH-Chat-Bot/components/Auth.tsx"
click node_chat_view "https://github.com/akshatsinghnayal/sih-project-2025/blob/main/SIH-Chat-Bot/components/ChatView.tsx"
click node_chat_window "https://github.com/akshatsinghnayal/sih-project-2025/blob/main/SIH-Chat-Bot/components/ChatWindow.tsx"
click node_sidebar "https://github.com/akshatsinghnayal/sih-project-2025/blob/main/SIH-Chat-Bot/components/Sidebar.tsx"
click node_auth_ctx "https://github.com/akshatsinghnayal/sih-project-2025/blob/main/SIH-Chat-Bot/context/AuthContext.tsx"
click node_auth_hook "https://github.com/akshatsinghnayal/sih-project-2025/blob/main/SIH-Chat-Bot/hooks/useAuth.ts"
click node_api_service "https://github.com/akshatsinghnayal/sih-project-2025/blob/main/SIH-Chat-Bot/services/apiService.ts"
click node_gemini_service "https://github.com/akshatsinghnayal/sih-project-2025/blob/main/SIH-Chat-Bot/services/geminiService.ts"
click node_chat_types "https://github.com/akshatsinghnayal/sih-project-2025/blob/main/SIH-Chat-Bot/types.ts"
click node_chat_constants "https://github.com/akshatsinghnayal/sih-project-2025/blob/main/SIH-Chat-Bot/constants.ts"
click node_server_entry "https://github.com/akshatsinghnayal/sih-project-2025/blob/main/server/index.js"
click node_db "https://github.com/akshatsinghnayal/sih-project-2025/blob/main/server/db.js"
click node_models "https://github.com/akshatsinghnayal/sih-project-2025/blob/main/server/models.js"
click node_render_cfg "https://github.com/akshatsinghnayal/sih-project-2025/blob/main/render.yaml"
click node_redirects "https://github.com/akshatsinghnayal/sih-project-2025/tree/main/SIH-Chat-Bot/public/_redirects"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_entry,node_bootstrap,node_styles,node_auth_ui,node_chat_view,node_chat_window,node_sidebar,node_auth_ctx,node_auth_hook,node_api_service,node_gemini_service,node_chat_types,node_chat_constants toneBlue
class node_server_entry,node_db,node_models toneAmber
class node_render_cfg,node_redirects toneMint
```

## Components

### Frontend app

React/Vite client for chat, auth, and streaming UI.

- [App shell](https://github.com/akshatsinghnayal/sih-project-2025/blob/main/SIH-Chat-Bot/App.tsx): react entry · Top-level client bootstrap and route selection. · `SIH-Chat-Bot/App.tsx`
- [Boot files](https://github.com/akshatsinghnayal/sih-project-2025/blob/main/SIH-Chat-Bot/index.tsx): spa entry · HTML and TS entrypoints that start the Vite app. · `SIH-Chat-Bot/index.tsx`
- [Global styles](https://github.com/akshatsinghnayal/sih-project-2025/blob/main/SIH-Chat-Bot/index.css): ui styling · Shared visual styling for the client shell. · `SIH-Chat-Bot/index.css`
- [Auth screen](https://github.com/akshatsinghnayal/sih-project-2025/blob/main/SIH-Chat-Bot/components/Auth.tsx): auth ui · Login/signup experience for the lightweight client-side auth flow. · `SIH-Chat-Bot/components/Auth.tsx`
- [Chat view](https://github.com/akshatsinghnayal/sih-project-2025/blob/main/SIH-Chat-Bot/components/ChatView.tsx): conversation ui · Main chat page composition and layout. · `SIH-Chat-Bot/components/ChatView.tsx`
- [Chat window](https://github.com/akshatsinghnayal/sih-project-2025/blob/main/SIH-Chat-Bot/components/ChatWindow.tsx): message stream ui · Renders messages and handles sending user input. · `SIH-Chat-Bot/components/ChatWindow.tsx`
- [Sidebar](https://github.com/akshatsinghnayal/sih-project-2025/blob/main/SIH-Chat-Bot/components/Sidebar.tsx): session nav · History, session, and navigation controls. · `SIH-Chat-Bot/components/Sidebar.tsx`
- [Auth context](https://github.com/akshatsinghnayal/sih-project-2025/blob/main/SIH-Chat-Bot/context/AuthContext.tsx): client auth state · Client-side authentication state boundary backed by local storage. · `SIH-Chat-Bot/context/AuthContext.tsx`
- [useAuth](https://github.com/akshatsinghnayal/sih-project-2025/blob/main/SIH-Chat-Bot/hooks/useAuth.ts): auth hook · Hook for consuming auth state in components. · `SIH-Chat-Bot/hooks/useAuth.ts`
- [API service](https://github.com/akshatsinghnayal/sih-project-2025/blob/main/SIH-Chat-Bot/services/apiService.ts): transport adapter · Chooses local Gemini access or remote backend API. · `SIH-Chat-Bot/services/apiService.ts`
- [Gemini client](https://github.com/akshatsinghnayal/sih-project-2025/blob/main/SIH-Chat-Bot/services/geminiService.ts): model client · Direct integration with Google Gemini from the browser path. · `SIH-Chat-Bot/services/geminiService.ts`
- [Chat types](https://github.com/akshatsinghnayal/sih-project-2025/blob/main/SIH-Chat-Bot/types.ts): shared models · Message and session shapes shared across the client. · `SIH-Chat-Bot/types.ts`
- [Constants](https://github.com/akshatsinghnayal/sih-project-2025/blob/main/SIH-Chat-Bot/constants.ts): shared config · Prompt, UI, and chat behavior constants. · `SIH-Chat-Bot/constants.ts`

### Backend service

Optional Express API for streaming relay and persistence.

- [Express API](https://github.com/akshatsinghnayal/sih-project-2025/blob/main/server/index.js): node service · Optional backend entry point for streaming and API handling. · `server/index.js`
- [MongoDB](https://github.com/akshatsinghnayal/sih-project-2025/blob/main/server/db.js): database connection · Optional persistence connection used by the backend. · `server/db.js`
- [Mongoose models](https://github.com/akshatsinghnayal/sih-project-2025/blob/main/server/models.js): persistence schema · Backend schemas for stored chat data. · `server/models.js`

### Deployment

Static hosting and Render deployment configuration.

- [Render config](https://github.com/akshatsinghnayal/sih-project-2025/blob/main/render.yaml): deploy config · Deployment definition for the service split. · `render.yaml`
- [SPA redirects](https://github.com/akshatsinghnayal/sih-project-2025/tree/main/SIH-Chat-Bot/public/_redirects): static hosting config · Client-side routing support for static hosting. · `SIH-Chat-Bot/public/_redirects`

## Connections

- Boot files → App shell: loads · Vite entry bootstraps the React app shell.
- Global styles → App shell: styles · Global CSS supports the app shell and views.
- App shell → Auth screen: shows · App shell can route into the auth experience.
- App shell → Chat view: shows · App shell can route into the main chat experience.
- Auth screen → Auth context: uses · Auth UI reads and updates client auth state.
- Auth context → useAuth: exposes · Context is consumed through a dedicated hook.
- Chat view → Chat window: contains · Conversation layout centers on the chat window.
- Chat view → Sidebar: contains · Sidebar provides session and navigation controls.
- Chat window → Chat types: shapes · Message rendering and input use shared data types.
- Chat window → Constants: configures · UI and prompt behavior are driven by constants.
- Chat window → API service: sends · User messages are sent through the service layer.
- API service → Gemini client: directs · Service adapter can call Gemini directly in client mode.
- API service → Express API: routes to · Service adapter can call the backend in remote mode.
- Express API → MongoDB: connects · Backend can open a MongoDB connection when enabled.
- Express API → Mongoose models: uses · Optional persistence goes through backend schemas.
- Express API → Gemini client: relays · Backend can forward streaming model requests.
- Render config → Express API: deploys · Render config describes the backend runtime.
- Render config → App shell: deploys · Render config also supports the frontend runtime.
- SPA redirects → Boot files: supports · Static hosting redirects enable SPA navigation.