# anusaini-12/flyrank-ai-capstone architecture

> Architecture diagram of the GitHub repository anusaini-12/flyrank-ai-capstone, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-09-25). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/anusaini-12/flyrank-ai-capstone
- Repository: https://github.com/anusaini-12/flyrank-ai-capstone

## Overview

FlyRank AI is a conversational shopping assistant: a shopper describes needs, the chat route runs a streaming tool-calling model, product search returns real listings, and the home page derives shortlist cards and comparisons from chat results. The README documents additional saved and health routes, an interactive shader hero, a 3D product configurator, accessible component demos, and a motion-button demo. Those branches are included, but their implementation details are not inferred beyond the supplied excerpts.

Main entry points: [`app/api/chat/route.ts`](https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/app/api/chat/route.ts) (Chat API), [`app/page.tsx`](https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/app/page.tsx) (Chat and board), [`app/playground/page.tsx`](https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/app/playground/page.tsx) (Accessible demos), [`components/chat/ChatPanel.tsx`](https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/components/chat/ChatPanel.tsx) (Chat panel)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_shopping["Shopping experience"]
  node_home["Chat and board<br/>[page.tsx]"]
  node_chatpanel["Chat panel<br/>[ChatPanel.tsx]"]
  node_budget["Budget filter<br/>[BudgetFilter.tsx]"]
  node_saved["Saved products<br/>[page.tsx]"]
  node_productcard["Product card"]
end

subgraph group_agent["AI and search"]
  node_chatapi["Chat API<br/>[route.ts]"]
  node_aiconfig["Model config<br/>[ai-config.ts]"]
  node_searchtool["Product search tool<br/>[search-products.ts]"]
end

subgraph group_operations["App operations"]
  node_ratelimit["Rate limiter<br/>[rate-limit.ts]"]
  node_healthpage["Health page<br/>[page.tsx]"]
  node_healthapi["Health API<br/>[route.ts]"]
  node_navigation["Primary navigation<br/>[PrimaryNav.tsx]"]
end

subgraph group_interactive["Interactive demos"]
  node_shader["Shader hero<br/>[ShaderPlane.tsx]"]
  node_shaderpage["Shader route<br/>[page.tsx]"]
  node_scene["3D configurator<br/>[Scene.tsx]"]
  node_viewerpage["3D viewer route<br/>[page.tsx]"]
  node_modelasset["Headphones model<br/>[headphones.glb]"]
end

subgraph group_components["Reusable components"]
  node_playground["Accessible demos<br/>[page.tsx]"]
  node_disclosure["Disclosure<br/>[Disclosure.tsx]"]
  node_modal["Modal<br/>[Modal.tsx]"]
  node_tabs["Tabs<br/>[Tabs.tsx]"]
  node_motiondemo["Motion button demo<br/>[page.tsx]"]
end

node_shopper(("Shopper"))
node_gemini{{"Google Gemini"}}
node_serpapi{{"SerpApi Shopping"}}
node_redis[("Upstash Redis")]

node_shopper -->|"describes needs"| node_home
node_home -->|"renders chat"| node_chatpanel
node_home -->|"renders filter"| node_budget
node_budget -->|"submits criteria"| node_home
node_chatpanel -->|"sends messages"| node_chatapi
node_chatapi -->|"checks limit"| node_ratelimit
node_ratelimit -->|"checks quota"| node_redis
node_chatapi -->|"uses prompt and model"| node_aiconfig
node_aiconfig -->|"configures model"| node_gemini
node_chatapi -->|"streams response"| node_gemini
node_chatapi -->|"offers tool"| node_searchtool
node_searchtool -.->|"searches listings"| node_serpapi
node_chatapi -->|"streams chat results"| node_home
node_chatpanel -->|"renders tool results"| node_productcard
node_home -->|"renders board cards"| node_productcard
node_shopper -->|"opens saved items"| node_saved
node_shopper -->|"opens health"| node_healthpage
node_healthpage -->|"requests status"| node_healthapi
node_shopper -->|"uses navigation"| node_navigation
node_shopper -->|"opens shader demo"| node_shaderpage
node_shaderpage -->|"renders scene"| node_shader
node_shopper -->|"opens 3D viewer"| node_viewerpage
node_viewerpage -->|"renders configurator"| node_scene
node_scene -->|"loads model"| node_modelasset
node_shopper -->|"opens component demos"| node_playground
node_playground -->|"renders demo"| node_disclosure
node_playground -->|"renders demo"| node_modal
node_playground -->|"renders demo"| node_tabs
node_shopper -->|"opens button demo"| node_motiondemo

click node_home "https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/app/page.tsx"
click node_chatpanel "https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/components/chat/ChatPanel.tsx"
click node_budget "https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/components/filters/BudgetFilter.tsx"
click node_saved "https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/app/(shop)/saved/page.tsx"
click node_chatapi "https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/app/api/chat/route.ts"
click node_aiconfig "https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/lib/ai-config.ts"
click node_searchtool "https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/lib/tools/search-products.ts"
click node_productcard "https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/components/chat/ToolProductCard.tsx"
click node_ratelimit "https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/lib/rate-limit.ts"
click node_healthpage "https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/app/(shop)/health/page.tsx"
click node_healthapi "https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/app/api/health/route.ts"
click node_navigation "https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/app/components/PrimaryNav.tsx"
click node_shader "https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/app/shader-hero/ShaderPlane.tsx"
click node_shaderpage "https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/app/shader-hero/page.tsx"
click node_scene "https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/app/3d-viewer/Scene.tsx"
click node_viewerpage "https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/app/3d-viewer/page.tsx"
click node_modelasset "https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/public/models/headphones.glb"
click node_playground "https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/app/playground/page.tsx"
click node_disclosure "https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/app/playground/disclosure/Disclosure.tsx"
click node_modal "https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/app/playground/modal/Modal.tsx"
click node_tabs "https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/app/playground/tabs/Tabs.tsx"
click node_motiondemo "https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/app/demo/page.tsx"

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_home,node_chatpanel,node_budget,node_saved,node_productcard toneBlue
class node_chatapi,node_aiconfig,node_searchtool,node_redis toneAmber
class node_ratelimit,node_healthpage,node_healthapi,node_navigation,node_serpapi toneMint
class node_shader,node_shaderpage,node_scene,node_viewerpage,node_modelasset toneRose
class node_playground,node_disclosure,node_modal,node_tabs,node_motiondemo,node_shopper,node_gemini toneIndigo
```

## Components

### Shopping experience

- [Chat and board](https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/app/page.tsx): `app/page.tsx`
- [Chat panel](https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/components/chat/ChatPanel.tsx): `components/chat/ChatPanel.tsx`
- [Budget filter](https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/components/filters/BudgetFilter.tsx): `components/filters/BudgetFilter.tsx`
- [Saved products](https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/app/(shop)/saved/page.tsx): `app/(shop)/saved/page.tsx`
- [Product card](https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/components/chat/ToolProductCard.tsx): `components/chat/ToolProductCard.tsx`

### AI and search

- [Chat API](https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/app/api/chat/route.ts): `app/api/chat/route.ts`
- [Model config](https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/lib/ai-config.ts): `lib/ai-config.ts`
- [Product search tool](https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/lib/tools/search-products.ts): `lib/tools/search-products.ts`

### App operations

- [Rate limiter](https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/lib/rate-limit.ts): `lib/rate-limit.ts`
- [Health page](https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/app/(shop)/health/page.tsx): `app/(shop)/health/page.tsx`
- [Health API](https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/app/api/health/route.ts): `app/api/health/route.ts`
- [Primary navigation](https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/app/components/PrimaryNav.tsx): `app/components/PrimaryNav.tsx`

### Interactive demos

- [Shader hero](https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/app/shader-hero/ShaderPlane.tsx): `app/shader-hero/ShaderPlane.tsx`
- [Shader route](https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/app/shader-hero/page.tsx): `app/shader-hero/page.tsx`
- [3D configurator](https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/app/3d-viewer/Scene.tsx): `app/3d-viewer/Scene.tsx`
- [3D viewer route](https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/app/3d-viewer/page.tsx): `app/3d-viewer/page.tsx`
- [Headphones model](https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/public/models/headphones.glb): `public/models/headphones.glb`

### Reusable components

- [Accessible demos](https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/app/playground/page.tsx): `app/playground/page.tsx`
- [Disclosure](https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/app/playground/disclosure/Disclosure.tsx): `app/playground/disclosure/Disclosure.tsx`
- [Modal](https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/app/playground/modal/Modal.tsx): `app/playground/modal/Modal.tsx`
- [Tabs](https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/app/playground/tabs/Tabs.tsx): `app/playground/tabs/Tabs.tsx`
- [Motion button demo](https://github.com/anusaini-12/flyrank-ai-capstone/blob/main/app/demo/page.tsx): `app/demo/page.tsx`

### Other components

- **Shopper**
- **Google Gemini**
- **SerpApi Shopping**
- **Upstash Redis**

## Connections

- Shopper → Chat and board: describes needs
- Chat and board → Chat panel: renders chat
- Chat and board → Budget filter: renders filter
- Budget filter → Chat and board: submits criteria
- Chat panel → Chat API: sends messages
- Chat API → Rate limiter: checks limit
- Rate limiter → Upstash Redis: checks quota
- Chat API → Model config: uses prompt and model
- Model config → Google Gemini: configures model
- Chat API → Google Gemini: streams response
- Chat API → Product search tool: offers tool
- Product search tool → SerpApi Shopping: searches listings
- Chat API → Chat and board: streams chat results
- Chat panel → Product card: renders tool results
- Chat and board → Product card: renders board cards
- Shopper → Saved products: opens saved items
- Shopper → Health page: opens health
- Health page → Health API: requests status
- Shopper → Primary navigation: uses navigation
- Shopper → Shader route: opens shader demo
- Shader route → Shader hero: renders scene
- Shopper → 3D viewer route: opens 3D viewer
- 3D viewer route → 3D configurator: renders configurator
- 3D configurator → Headphones model: loads model
- Shopper → Accessible demos: opens component demos
- Accessible demos → Disclosure: renders demo
- Accessible demos → Modal: renders demo
- Accessible demos → Tabs: renders demo
- Shopper → Motion button demo: opens button demo
