# natbabi/evergreen architecture

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

- Interactive diagram: https://gitdiagram.com/natbabi/evergreen
- Repository: https://github.com/natbabi/evergreen

## Overview

Evergreen Ethiopia is a bilingual nursery storefront for discovering highland-acclimatized plants and contacting horticulturists rather than completing an automated checkout. Visitors browse the landing page or searchable, filterable catalog, inspect specimen details, then send an inquiry to confirm availability and delivery. Care guidance, consultation paths, TikTok community content, theme and language preferences support that journey. The graph combines README-documented capabilities with source-index references and shown imports; unsampled runtime wiring is not assumed.

Main entry points: [`src/app/page.tsx`](https://github.com/natbabi/evergreen/blob/main/src/app/page.tsx) (Landing page), [`src/app/plants/page.tsx`](https://github.com/natbabi/evergreen/blob/main/src/app/plants/page.tsx) (Plant catalog), [`src/app/plants/[slug]/PlantDetailClient.tsx`](https://github.com/natbabi/evergreen/blob/main/src/app/plants/%5Bslug%5D/PlantDetailClient.tsx) (Specimen details), [`src/components/PlantFinderSection.tsx`](https://github.com/natbabi/evergreen/blob/main/src/components/PlantFinderSection.tsx) (Plant finder)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_browse["Plant Discovery"]
  node_home["Landing page<br/>[page.tsx]"]
  node_catalog["Plant catalog<br/>[page.tsx]"]
  node_detail["Specimen details"]
  node_plantdata["Plant content<br/>[content.ts]"]
  node_finder["Plant finder"]
  node_filter["Catalog filters<br/>[PlantFilterBar.tsx]"]
  node_card["Plant cards<br/>[PlantCard.tsx]"]
end

subgraph group_guidance["Care &amp; Community"]
  node_care["Highland care guide<br/>[CareAccordions.tsx]"]
  node_journey["Ordering steps"]
  node_paths["Consultation paths"]
  node_community["TikTok spotlight"]
end

subgraph group_inquiry["Inquiries &amp; Contact"]
  node_inquiry_state["Inquiry state<br/>[InquiryContext.tsx]"]
  node_inquiry_sheet["Inquiry sheet<br/>[InquirySheet.tsx]"]
  node_whatsapp(("WhatsApp"))
  node_telegram(("Telegram"))
  node_phone(("Phone contact"))
end

subgraph group_shared["Shared Experience"]
  node_language["Language preferences"]
  node_content["Bilingual content<br/>[content.ts]"]
  node_theme["Theme preferences<br/>[ThemeContext.tsx]"]
  node_navigation["Floating navigation<br/>[FloatingNav.tsx]"]
  node_mobilebar["Mobile contact bar"]
  node_footer["Contact footer<br/>[WordmarkFooter.tsx]"]
end

node_visitor(("Visitor"))

node_visitor -->|"opens"| node_home
node_visitor -->|"browses"| node_catalog
node_catalog -->|"reads plants"| node_plantdata
node_catalog -->|"renders"| node_card
node_catalog -->|"uses filter IDs"| node_filter
node_visitor -->|"opens specimen"| node_detail
node_detail -->|"reads specimen"| node_plantdata
node_home -->|"renders"| node_finder
node_home -->|"renders"| node_care
node_home -->|"renders"| node_journey
node_home -->|"renders"| node_paths
node_home -->|"renders"| node_community
node_finder -->|"reads plants"| node_plantdata
node_finder -->|"renders"| node_card
node_finder -->|"renders"| node_filter
node_visitor -->|"starts inquiry"| node_inquiry_state
node_inquiry_state -->|"provides state"| node_inquiry_sheet
node_inquiry_sheet -->|"prefills request"| node_whatsapp
node_inquiry_sheet -->|"offers contact"| node_telegram
node_inquiry_sheet -->|"offers calls"| node_phone
node_community -->|"links inquiries"| node_whatsapp
node_home -->|"renders"| node_navigation
node_home -->|"renders"| node_mobilebar
node_home -->|"renders"| node_footer
node_detail -->|"renders"| node_footer
node_detail -->|"renders"| node_mobilebar
node_language -->|"selects translation"| node_content
node_visitor -->|"changes appearance"| node_theme
node_visitor -->|"switches language"| node_language

click node_home "https://github.com/natbabi/evergreen/blob/main/src/app/page.tsx"
click node_catalog "https://github.com/natbabi/evergreen/blob/main/src/app/plants/page.tsx"
click node_detail "https://github.com/natbabi/evergreen/blob/main/src/app/plants/%5Bslug%5D/PlantDetailClient.tsx"
click node_plantdata "https://github.com/natbabi/evergreen/blob/main/src/data/content.ts"
click node_finder "https://github.com/natbabi/evergreen/blob/main/src/components/PlantFinderSection.tsx"
click node_filter "https://github.com/natbabi/evergreen/blob/main/src/components/PlantFilterBar.tsx"
click node_card "https://github.com/natbabi/evergreen/blob/main/src/components/PlantCard.tsx"
click node_care "https://github.com/natbabi/evergreen/blob/main/src/components/CareAccordions.tsx"
click node_journey "https://github.com/natbabi/evergreen/blob/main/src/components/FourStepsProcess.tsx"
click node_paths "https://github.com/natbabi/evergreen/blob/main/src/components/ThreePathsCards.tsx"
click node_community "https://github.com/natbabi/evergreen/blob/main/src/components/TikTokAudiencePanel.tsx"
click node_inquiry_state "https://github.com/natbabi/evergreen/blob/main/src/context/InquiryContext.tsx"
click node_inquiry_sheet "https://github.com/natbabi/evergreen/blob/main/src/components/InquirySheet.tsx"
click node_language "https://github.com/natbabi/evergreen/blob/main/src/context/LanguageContext.tsx"
click node_content "https://github.com/natbabi/evergreen/blob/main/src/data/content.ts"
click node_theme "https://github.com/natbabi/evergreen/blob/main/src/context/ThemeContext.tsx"
click node_navigation "https://github.com/natbabi/evergreen/blob/main/src/components/FloatingNav.tsx"
click node_mobilebar "https://github.com/natbabi/evergreen/blob/main/src/components/StickyMobileBar.tsx"
click node_footer "https://github.com/natbabi/evergreen/blob/main/src/components/WordmarkFooter.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_catalog,node_detail,node_plantdata,node_finder,node_filter,node_card toneBlue
class node_care,node_journey,node_paths,node_community toneAmber
class node_inquiry_state,node_inquiry_sheet,node_whatsapp,node_telegram,node_phone toneMint
class node_language,node_content,node_theme,node_navigation,node_mobilebar,node_footer toneRose
class node_visitor toneIndigo
```

## Components

### Plant Discovery

- [Landing page](https://github.com/natbabi/evergreen/blob/main/src/app/page.tsx): `src/app/page.tsx`
- [Plant catalog](https://github.com/natbabi/evergreen/blob/main/src/app/plants/page.tsx): `src/app/plants/page.tsx`
- [Specimen details](https://github.com/natbabi/evergreen/blob/main/src/app/plants/%5Bslug%5D/PlantDetailClient.tsx): `src/app/plants/[slug]/PlantDetailClient.tsx`
- [Plant content](https://github.com/natbabi/evergreen/blob/main/src/data/content.ts): `src/data/content.ts`
- [Plant finder](https://github.com/natbabi/evergreen/blob/main/src/components/PlantFinderSection.tsx): `src/components/PlantFinderSection.tsx`
- [Catalog filters](https://github.com/natbabi/evergreen/blob/main/src/components/PlantFilterBar.tsx): `src/components/PlantFilterBar.tsx`
- [Plant cards](https://github.com/natbabi/evergreen/blob/main/src/components/PlantCard.tsx): `src/components/PlantCard.tsx`

### Care & Community

- [Highland care guide](https://github.com/natbabi/evergreen/blob/main/src/components/CareAccordions.tsx): `src/components/CareAccordions.tsx`
- [Ordering steps](https://github.com/natbabi/evergreen/blob/main/src/components/FourStepsProcess.tsx): `src/components/FourStepsProcess.tsx`
- [Consultation paths](https://github.com/natbabi/evergreen/blob/main/src/components/ThreePathsCards.tsx): `src/components/ThreePathsCards.tsx`
- [TikTok spotlight](https://github.com/natbabi/evergreen/blob/main/src/components/TikTokAudiencePanel.tsx): `src/components/TikTokAudiencePanel.tsx`

### Inquiries & Contact

- [Inquiry state](https://github.com/natbabi/evergreen/blob/main/src/context/InquiryContext.tsx): `src/context/InquiryContext.tsx`
- [Inquiry sheet](https://github.com/natbabi/evergreen/blob/main/src/components/InquirySheet.tsx): `src/components/InquirySheet.tsx`
- **WhatsApp**
- **Telegram**
- **Phone contact**

### Shared Experience

- [Language preferences](https://github.com/natbabi/evergreen/blob/main/src/context/LanguageContext.tsx): `src/context/LanguageContext.tsx`
- [Bilingual content](https://github.com/natbabi/evergreen/blob/main/src/data/content.ts): `src/data/content.ts`
- [Theme preferences](https://github.com/natbabi/evergreen/blob/main/src/context/ThemeContext.tsx): `src/context/ThemeContext.tsx`
- [Floating navigation](https://github.com/natbabi/evergreen/blob/main/src/components/FloatingNav.tsx): `src/components/FloatingNav.tsx`
- [Mobile contact bar](https://github.com/natbabi/evergreen/blob/main/src/components/StickyMobileBar.tsx): `src/components/StickyMobileBar.tsx`
- [Contact footer](https://github.com/natbabi/evergreen/blob/main/src/components/WordmarkFooter.tsx): `src/components/WordmarkFooter.tsx`

### Other components

- **Visitor**

## Connections

- Visitor → Landing page: opens (evidence: `README.md`)
- Visitor → Plant catalog: browses (evidence: `README.md`)
- Plant catalog → Plant content: reads plants (evidence: `src/app/plants/page.tsx`)
- Plant catalog → Plant cards: renders (evidence: `src/app/plants/page.tsx`)
- Plant catalog → Catalog filters: uses filter IDs (evidence: `src/app/plants/page.tsx`)
- Visitor → Specimen details: opens specimen (evidence: `README.md`)
- Specimen details → Plant content: reads specimen (evidence: `src/app/plants/[slug]/page.tsx`)
- Landing page → Plant finder: renders (evidence: `src/app/page.tsx`)
- Landing page → Highland care guide: renders (evidence: `src/app/page.tsx`)
- Landing page → Ordering steps: renders (evidence: `src/app/page.tsx`)
- Landing page → Consultation paths: renders (evidence: `src/app/page.tsx`)
- Landing page → TikTok spotlight: renders (evidence: `src/app/page.tsx`)
- Plant finder → Plant content: reads plants (evidence: `src/components/PlantFinderSection.tsx`)
- Plant finder → Plant cards: renders (evidence: `src/components/PlantFinderSection.tsx`)
- Plant finder → Catalog filters: renders (evidence: `src/components/PlantFinderSection.tsx`)
- Visitor → Inquiry state: starts inquiry (evidence: `README.md`)
- Inquiry state → Inquiry sheet: provides state (evidence: `src/components/InquirySheet.tsx`)
- Inquiry sheet → WhatsApp: prefills request (evidence: `README.md`)
- Inquiry sheet → Telegram: offers contact (evidence: `README.md`)
- Inquiry sheet → Phone contact: offers calls (evidence: `src/components/InquirySheet.tsx`)
- TikTok spotlight → WhatsApp: links inquiries (evidence: `src/components/TikTokAudiencePanel.tsx`)
- Landing page → Floating navigation: renders (evidence: `src/app/page.tsx`)
- Landing page → Mobile contact bar: renders (evidence: `src/app/page.tsx`)
- Landing page → Contact footer: renders (evidence: `src/app/page.tsx`)
- Specimen details → Contact footer: renders (evidence: `src/app/plants/[slug]/PlantDetailClient.tsx`)
- Specimen details → Mobile contact bar: renders (evidence: `src/app/plants/[slug]/PlantDetailClient.tsx`)
- Language preferences → Bilingual content: selects translation (evidence: `src/context/LanguageContext.tsx`)
- Visitor → Theme preferences: changes appearance (evidence: `README.md`)
- Visitor → Language preferences: switches language (evidence: `README.md`)