# sameer10237/herbal architecture

> Architecture diagram of the GitHub repository sameer10237/herbal, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-11-13). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/sameer10237/herbal
- Repository: https://github.com/sameer10237/herbal

## Overview

AKATSUKI is a marketing, product-education, and lightweight e-commerce site for Ayurvedic hair oils. The homepage guides visitors through product discovery and education, a personalized quiz or bottle rail, and cart checkout via WhatsApp; referral sharing, reviews, and newsletter signup are additional branches. The sampled code establishes cart and product-detail interactions, while the README documents the rail physics and other capabilities. Some section and integration internals were not sampled, so uncertain connections are omitted or marked dashed.

Main entry points: [`lib/cart-context.tsx`](https://github.com/sameer10237/herbal/blob/main/lib/cart-context.tsx) (Cart State), [`app/page.tsx`](https://github.com/sameer10237/herbal/blob/main/app/page.tsx) (Homepage), [`components/rail/detail-view.tsx`](https://github.com/sameer10237/herbal/blob/main/components/rail/detail-view.tsx) (Product Detail), [`components/sections/quiz.tsx`](https://github.com/sameer10237/herbal/blob/main/components/sections/quiz.tsx) (Product Quiz)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_experience["Site Experience"]
  node_homepage["Homepage<br/>[page.tsx]"]
  node_education["Education Sections"]
  node_social["Reviews and Referral"]
  node_newsletter["Newsletter Signup<br/>[newsletter.tsx]"]
  node_site_shell["Navigation and Footer"]
  node_whatsapp_action["WhatsApp Action<br/>[whatsapp-fab.tsx]"]
end

subgraph group_discovery["Product Discovery"]
  node_quiz["Product Quiz<br/>[quiz.tsx]"]
  node_quiz_rules["Quiz Matching<br/>[quiz.ts]"]
  node_rail["Bottle Rail<br/>[bottle-rail.tsx]"]
  node_rail_physics["Jiggle Engine"]
  node_product_detail["Product Detail<br/>[detail-view.tsx]"]
  node_modal_content["Detail Content<br/>[header.tsx]"]
end

subgraph group_commerce["Shopping and Checkout"]
  node_cart_state["Cart State<br/>[cart-context.tsx]"]
  node_cart_drawer["Cart Drawer<br/>[cart-drawer.tsx]"]
  node_checkout["WhatsApp Checkout<br/>[cart-context.tsx]"]
end

subgraph group_shared["Product and Shared Logic"]
  node_products["Product Catalog<br/>[products.ts]"]
  node_product_info["Product Details Data<br/>[product-detail.ts]"]
  node_site_config["Site Configuration<br/>[site.ts]"]
  node_referral["Referral Logic<br/>[referral.ts]"]
  node_promotions["Promotion Config<br/>[promo-config.ts]"]
  node_bottle_image["Bottle Rendering<br/>[bottle-image.tsx]"]
  node_dialog["Dialog Primitive<br/>[dialog.tsx]"]
  node_drawer["Drawer Primitive<br/>[drawer.tsx]"]
end

node_visitor(("Visitor"))

node_visitor -->|"visits"| node_homepage
node_homepage -->|"renders"| node_site_shell
node_homepage -->|"renders"| node_education
node_homepage -->|"renders"| node_social
node_homepage -->|"renders"| node_newsletter
node_homepage -->|"renders"| node_quiz
node_homepage -->|"includes"| node_rail
node_quiz -->|"matches answers"| node_quiz_rules
node_quiz -->|"adds selection"| node_cart_state
node_quiz -->|"renders result"| node_bottle_image
node_quiz -->|"uses jiggle"| node_rail_physics
node_rail -.->|"animates bottles"| node_rail_physics
node_product_detail -->|"renders"| node_modal_content
node_product_detail -->|"adds item"| node_cart_state
node_product_detail -->|"uses dialog"| node_dialog
node_product_detail -->|"reads prices"| node_products
node_product_detail -->|"reads details"| node_product_info
node_cart_state -->|"reads product prices"| node_products
node_cart_state -->|"captures referral"| node_referral
node_cart_state -->|"reads checkout config"| node_site_config
node_cart_state -->|"builds checkout URL"| node_checkout
node_cart_drawer -->|"reads and updates"| node_cart_state
node_cart_drawer -->|"uses drawer"| node_drawer
node_site_shell -->|"shows cart badge"| node_cart_state
node_whatsapp_action -->|"reads checkout state"| node_cart_state
node_social -->|"reads content"| node_site_config
node_social -->|"uses referral"| node_referral
node_bottle_image -->|"reads product image"| node_products

click node_homepage "https://github.com/sameer10237/herbal/blob/main/app/page.tsx"
click node_education "https://github.com/sameer10237/herbal/tree/main/components/sections"
click node_social "https://github.com/sameer10237/herbal/tree/main/components/sections"
click node_newsletter "https://github.com/sameer10237/herbal/blob/main/components/sections/newsletter.tsx"
click node_site_shell "https://github.com/sameer10237/herbal/tree/main/components/layout"
click node_whatsapp_action "https://github.com/sameer10237/herbal/blob/main/components/layout/whatsapp-fab.tsx"
click node_quiz "https://github.com/sameer10237/herbal/blob/main/components/sections/quiz.tsx"
click node_quiz_rules "https://github.com/sameer10237/herbal/blob/main/lib/quiz.ts"
click node_rail "https://github.com/sameer10237/herbal/blob/main/components/rail/bottle-rail.tsx"
click node_rail_physics "https://github.com/sameer10237/herbal/blob/main/lib/physics/use-jiggle-engine.ts"
click node_product_detail "https://github.com/sameer10237/herbal/blob/main/components/rail/detail-view.tsx"
click node_modal_content "https://github.com/sameer10237/herbal/blob/main/components/product-modal/header.tsx"
click node_cart_state "https://github.com/sameer10237/herbal/blob/main/lib/cart-context.tsx"
click node_cart_drawer "https://github.com/sameer10237/herbal/blob/main/components/cart/cart-drawer.tsx"
click node_checkout "https://github.com/sameer10237/herbal/blob/main/lib/cart-context.tsx"
click node_products "https://github.com/sameer10237/herbal/blob/main/lib/products.ts"
click node_product_info "https://github.com/sameer10237/herbal/blob/main/lib/product-detail.ts"
click node_site_config "https://github.com/sameer10237/herbal/blob/main/lib/site.ts"
click node_referral "https://github.com/sameer10237/herbal/blob/main/lib/referral.ts"
click node_promotions "https://github.com/sameer10237/herbal/blob/main/lib/promo-config.ts"
click node_bottle_image "https://github.com/sameer10237/herbal/blob/main/components/bottle-image.tsx"
click node_dialog "https://github.com/sameer10237/herbal/blob/main/components/ui/dialog.tsx"
click node_drawer "https://github.com/sameer10237/herbal/blob/main/components/ui/drawer.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_homepage,node_education,node_social,node_newsletter,node_site_shell,node_whatsapp_action toneBlue
class node_quiz,node_quiz_rules,node_rail,node_rail_physics,node_product_detail,node_modal_content toneAmber
class node_cart_state,node_cart_drawer,node_checkout toneMint
class node_products,node_product_info,node_site_config,node_referral,node_promotions,node_bottle_image,node_dialog,node_drawer toneRose
class node_visitor toneIndigo
```

## Components

### Site Experience

- [Homepage](https://github.com/sameer10237/herbal/blob/main/app/page.tsx): `app/page.tsx`
- [Education Sections](https://github.com/sameer10237/herbal/tree/main/components/sections): `components/sections`
- [Reviews and Referral](https://github.com/sameer10237/herbal/tree/main/components/sections): `components/sections`
- [Newsletter Signup](https://github.com/sameer10237/herbal/blob/main/components/sections/newsletter.tsx): `components/sections/newsletter.tsx`
- [Navigation and Footer](https://github.com/sameer10237/herbal/tree/main/components/layout): `components/layout`
- [WhatsApp Action](https://github.com/sameer10237/herbal/blob/main/components/layout/whatsapp-fab.tsx): `components/layout/whatsapp-fab.tsx`

### Product Discovery

- [Product Quiz](https://github.com/sameer10237/herbal/blob/main/components/sections/quiz.tsx): `components/sections/quiz.tsx`
- [Quiz Matching](https://github.com/sameer10237/herbal/blob/main/lib/quiz.ts): `lib/quiz.ts`
- [Bottle Rail](https://github.com/sameer10237/herbal/blob/main/components/rail/bottle-rail.tsx): `components/rail/bottle-rail.tsx`
- [Jiggle Engine](https://github.com/sameer10237/herbal/blob/main/lib/physics/use-jiggle-engine.ts): `lib/physics/use-jiggle-engine.ts`
- [Product Detail](https://github.com/sameer10237/herbal/blob/main/components/rail/detail-view.tsx): `components/rail/detail-view.tsx`
- [Detail Content](https://github.com/sameer10237/herbal/blob/main/components/product-modal/header.tsx): `components/product-modal/header.tsx`

### Shopping and Checkout

- [Cart State](https://github.com/sameer10237/herbal/blob/main/lib/cart-context.tsx): `lib/cart-context.tsx`
- [Cart Drawer](https://github.com/sameer10237/herbal/blob/main/components/cart/cart-drawer.tsx): `components/cart/cart-drawer.tsx`
- [WhatsApp Checkout](https://github.com/sameer10237/herbal/blob/main/lib/cart-context.tsx): `lib/cart-context.tsx`

### Product and Shared Logic

- [Product Catalog](https://github.com/sameer10237/herbal/blob/main/lib/products.ts): `lib/products.ts`
- [Product Details Data](https://github.com/sameer10237/herbal/blob/main/lib/product-detail.ts): `lib/product-detail.ts`
- [Site Configuration](https://github.com/sameer10237/herbal/blob/main/lib/site.ts): `lib/site.ts`
- [Referral Logic](https://github.com/sameer10237/herbal/blob/main/lib/referral.ts): `lib/referral.ts`
- [Promotion Config](https://github.com/sameer10237/herbal/blob/main/lib/promo-config.ts): `lib/promo-config.ts`
- [Bottle Rendering](https://github.com/sameer10237/herbal/blob/main/components/bottle-image.tsx): `components/bottle-image.tsx`
- [Dialog Primitive](https://github.com/sameer10237/herbal/blob/main/components/ui/dialog.tsx): `components/ui/dialog.tsx`
- [Drawer Primitive](https://github.com/sameer10237/herbal/blob/main/components/ui/drawer.tsx): `components/ui/drawer.tsx`

### Other components

- **Visitor**

## Connections

- Visitor → Homepage: visits (evidence: `app/page.tsx`)
- Homepage → Navigation and Footer: renders (evidence: `app/page.tsx`)
- Homepage → Education Sections: renders (evidence: `app/page.tsx`)
- Homepage → Reviews and Referral: renders (evidence: `app/page.tsx`)
- Homepage → Newsletter Signup: renders (evidence: `app/page.tsx`)
- Homepage → Product Quiz: renders (evidence: `app/page.tsx`)
- Homepage → Bottle Rail: includes (evidence: `app/page.tsx`)
- Product Quiz → Quiz Matching: matches answers (evidence: `components/sections/quiz.tsx`)
- Product Quiz → Cart State: adds selection (evidence: `components/sections/quiz.tsx`)
- Product Quiz → Bottle Rendering: renders result (evidence: `components/sections/quiz.tsx`)
- Product Quiz → Jiggle Engine: uses jiggle (evidence: `components/sections/quiz.tsx`)
- Bottle Rail → Jiggle Engine: animates bottles
- Product Detail → Detail Content: renders (evidence: `components/rail/detail-view.tsx`)
- Product Detail → Cart State: adds item (evidence: `components/rail/detail-view.tsx`)
- Product Detail → Dialog Primitive: uses dialog (evidence: `components/rail/detail-view.tsx`)
- Product Detail → Product Catalog: reads prices (evidence: `components/rail/detail-view.tsx`)
- Product Detail → Product Details Data: reads details
- Cart State → Product Catalog: reads product prices (evidence: `lib/cart-context.tsx`)
- Cart State → Referral Logic: captures referral (evidence: `lib/cart-context.tsx`)
- Cart State → Site Configuration: reads checkout config (evidence: `lib/cart-context.tsx`)
- Cart State → WhatsApp Checkout: builds checkout URL (evidence: `lib/cart-context.tsx`)
- Cart Drawer → Cart State: reads and updates (evidence: `components/cart/cart-drawer.tsx`)
- Cart Drawer → Drawer Primitive: uses drawer (evidence: `components/cart/cart-drawer.tsx`)
- Navigation and Footer → Cart State: shows cart badge (evidence: `components/layout/navbar.tsx`)
- WhatsApp Action → Cart State: reads checkout state (evidence: `components/layout/whatsapp-fab.tsx`)
- Reviews and Referral → Site Configuration: reads content (evidence: `components/sections/reviews.tsx`)
- Reviews and Referral → Referral Logic: uses referral (evidence: `components/sections/share-the-shelf.tsx`)
- Bottle Rendering → Product Catalog: reads product image (evidence: `components/bottle-image.tsx`)