# scottbrandon-rgb/harrison-faith-devotionals architecture

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

- Interactive diagram: https://gitdiagram.com/scottbrandon-rgb/harrison-faith-devotionals
- Repository: https://github.com/scottbrandon-rgb/harrison-faith-devotionals

## Overview

This is a weekly devotional web application: a visitor enters the React app, navigates the week or a series, and reads individual devotional days. The sampled app also shows theme switching and sharing. The tree includes separate Netlify reaction and social-preview handlers, but their callers and storage relationships are not shown, so they remain independent in the graph. The app’s data module is referenced in App.tsx but is absent from the supplied tree; UI relationships are limited to imports documented in the source index or excerpts.

Main entry points: [`src/lib/utils.ts`](https://github.com/scottbrandon-rgb/harrison-faith-devotionals/blob/main/src/lib/utils.ts) (Class utilities), [`src/main.tsx`](https://github.com/scottbrandon-rgb/harrison-faith-devotionals/blob/main/src/main.tsx) (React entry), [`src/components/ui/toast.tsx`](https://github.com/scottbrandon-rgb/harrison-faith-devotionals/blob/main/src/components/ui/toast.tsx) (Toast UI), [`src/components/ui/calendar.tsx`](https://github.com/scottbrandon-rgb/harrison-faith-devotionals/blob/main/src/components/ui/calendar.tsx) (Calendar)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_app["Devotional app"]
  node_entry["React entry<br/>[main.tsx]"]
  node_devotional["Devotional experience<br/>[App.tsx]"]
end

subgraph group_netlify["Netlify features"]
  node_og["OG image handler<br/>[og-image.ts]"]
  node_social["Social metadata<br/>[social-meta.ts]"]
  node_reactions["Reaction endpoint<br/>[reactions.mts]"]
  node_reaction_report["Reaction report"]
end

subgraph group_ui["UI components"]
  node_button["Button<br/>[button.tsx]"]
  node_calendar["Calendar<br/>[calendar.tsx]"]
  node_context_menu["Context menu<br/>[context-menu.tsx]"]
  node_dropdown["Dropdown menu<br/>[dropdown-menu.tsx]"]
  node_menubar["Menubar<br/>[menubar.tsx]"]
  node_toast["Toast UI<br/>[toast.tsx]"]
  node_toggle["Toggle<br/>[toggle.tsx]"]
end

subgraph group_internal["Shared UI state"]
  node_toast_hook["Toast state hook<br/>[use-toast.ts]"]
  node_utils["Class utilities<br/>[utils.ts]"]
end

node_visitor(("Visitor"))

node_visitor -->|"opens"| node_entry
node_entry -->|"renders"| node_devotional
node_calendar -->|"uses variants"| node_button
node_context_menu -->|"merges classes"| node_utils
node_dropdown -->|"merges classes"| node_utils
node_menubar -->|"merges classes"| node_utils
node_toast -->|"merges classes"| node_utils
node_toast_hook -->|"uses types"| node_toast
node_toggle -->|"merges classes"| node_utils

click node_entry "https://github.com/scottbrandon-rgb/harrison-faith-devotionals/blob/main/src/main.tsx"
click node_devotional "https://github.com/scottbrandon-rgb/harrison-faith-devotionals/blob/main/src/App.tsx"
click node_og "https://github.com/scottbrandon-rgb/harrison-faith-devotionals/blob/main/netlify/edge-functions/og-image.ts"
click node_social "https://github.com/scottbrandon-rgb/harrison-faith-devotionals/blob/main/netlify/edge-functions/social-meta.ts"
click node_reactions "https://github.com/scottbrandon-rgb/harrison-faith-devotionals/blob/main/netlify/functions/reactions.mts"
click node_reaction_report "https://github.com/scottbrandon-rgb/harrison-faith-devotionals/blob/main/netlify/functions/reactions-report.mts"
click node_button "https://github.com/scottbrandon-rgb/harrison-faith-devotionals/blob/main/src/components/ui/button.tsx"
click node_calendar "https://github.com/scottbrandon-rgb/harrison-faith-devotionals/blob/main/src/components/ui/calendar.tsx"
click node_context_menu "https://github.com/scottbrandon-rgb/harrison-faith-devotionals/blob/main/src/components/ui/context-menu.tsx"
click node_dropdown "https://github.com/scottbrandon-rgb/harrison-faith-devotionals/blob/main/src/components/ui/dropdown-menu.tsx"
click node_menubar "https://github.com/scottbrandon-rgb/harrison-faith-devotionals/blob/main/src/components/ui/menubar.tsx"
click node_toast "https://github.com/scottbrandon-rgb/harrison-faith-devotionals/blob/main/src/components/ui/toast.tsx"
click node_toggle "https://github.com/scottbrandon-rgb/harrison-faith-devotionals/blob/main/src/components/ui/toggle.tsx"
click node_toast_hook "https://github.com/scottbrandon-rgb/harrison-faith-devotionals/blob/main/src/hooks/use-toast.ts"
click node_utils "https://github.com/scottbrandon-rgb/harrison-faith-devotionals/blob/main/src/lib/utils.ts"

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_devotional toneBlue
class node_og,node_social,node_reactions,node_reaction_report toneAmber
class node_button,node_calendar,node_context_menu,node_dropdown,node_menubar,node_toast,node_toggle toneMint
class node_toast_hook,node_utils toneRose
class node_visitor toneIndigo
```

## Components

### Devotional app

- [React entry](https://github.com/scottbrandon-rgb/harrison-faith-devotionals/blob/main/src/main.tsx): `src/main.tsx`
- [Devotional experience](https://github.com/scottbrandon-rgb/harrison-faith-devotionals/blob/main/src/App.tsx): `src/App.tsx`

### Netlify features

- [OG image handler](https://github.com/scottbrandon-rgb/harrison-faith-devotionals/blob/main/netlify/edge-functions/og-image.ts): `netlify/edge-functions/og-image.ts`
- [Social metadata](https://github.com/scottbrandon-rgb/harrison-faith-devotionals/blob/main/netlify/edge-functions/social-meta.ts): `netlify/edge-functions/social-meta.ts`
- [Reaction endpoint](https://github.com/scottbrandon-rgb/harrison-faith-devotionals/blob/main/netlify/functions/reactions.mts): `netlify/functions/reactions.mts`
- [Reaction report](https://github.com/scottbrandon-rgb/harrison-faith-devotionals/blob/main/netlify/functions/reactions-report.mts): `netlify/functions/reactions-report.mts`

### UI components

- [Button](https://github.com/scottbrandon-rgb/harrison-faith-devotionals/blob/main/src/components/ui/button.tsx): `src/components/ui/button.tsx`
- [Calendar](https://github.com/scottbrandon-rgb/harrison-faith-devotionals/blob/main/src/components/ui/calendar.tsx): `src/components/ui/calendar.tsx`
- [Context menu](https://github.com/scottbrandon-rgb/harrison-faith-devotionals/blob/main/src/components/ui/context-menu.tsx): `src/components/ui/context-menu.tsx`
- [Dropdown menu](https://github.com/scottbrandon-rgb/harrison-faith-devotionals/blob/main/src/components/ui/dropdown-menu.tsx): `src/components/ui/dropdown-menu.tsx`
- [Menubar](https://github.com/scottbrandon-rgb/harrison-faith-devotionals/blob/main/src/components/ui/menubar.tsx): `src/components/ui/menubar.tsx`
- [Toast UI](https://github.com/scottbrandon-rgb/harrison-faith-devotionals/blob/main/src/components/ui/toast.tsx): `src/components/ui/toast.tsx`
- [Toggle](https://github.com/scottbrandon-rgb/harrison-faith-devotionals/blob/main/src/components/ui/toggle.tsx): `src/components/ui/toggle.tsx`

### Shared UI state

- [Toast state hook](https://github.com/scottbrandon-rgb/harrison-faith-devotionals/blob/main/src/hooks/use-toast.ts): `src/hooks/use-toast.ts`
- [Class utilities](https://github.com/scottbrandon-rgb/harrison-faith-devotionals/blob/main/src/lib/utils.ts): `src/lib/utils.ts`

### Other components

- **Visitor**

## Connections

- Visitor → React entry: opens
- React entry → Devotional experience: renders (evidence: `src/main.tsx`)
- Calendar → Button: uses variants (evidence: `src/components/ui/calendar.tsx`)
- Context menu → Class utilities: merges classes (evidence: `src/components/ui/context-menu.tsx`)
- Dropdown menu → Class utilities: merges classes (evidence: `src/components/ui/dropdown-menu.tsx`)
- Menubar → Class utilities: merges classes (evidence: `src/components/ui/menubar.tsx`)
- Toast UI → Class utilities: merges classes (evidence: `src/components/ui/toast.tsx`)
- Toast state hook → Toast UI: uses types (evidence: `src/hooks/use-toast.ts`)
- Toggle → Class utilities: merges classes (evidence: `src/components/ui/toggle.tsx`)