# henryivwighre/nana architecture

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

- Interactive diagram: https://gitdiagram.com/henryivwighre/nana
- Repository: https://github.com/henryivwighre/nana
- Video tour (about a minute): https://gitdiagram.com/henryivwighre/nana/video

## Overview

Nana is a bedtime-story setup app: users authenticate, reach a dashboard of children, voices, and recent stories, then can add, edit, or delete child profiles that personalize stories. The sampled runtime implements authentication and child-profile management; voices and stories appear as dashboard sections and links, but their implementation is not present in the supplied tree. Supabase is used for authentication and persisted profile/dashboard data. The graph reflects only relationships supported by the excerpts or source index.

Main entry points: [`src/lib/supabase/server.ts`](https://github.com/henryivwighre/nana/blob/main/src/lib/supabase/server.ts) (Server Client), [`src/app/dashboard/children/new/page.tsx`](https://github.com/henryivwighre/nana/blob/main/src/app/dashboard/children/new/page.tsx) (New Child Page), [`src/app/dashboard/children/[id]/page.tsx`](https://github.com/henryivwighre/nana/blob/main/src/app/dashboard/children/%5Bid%5D/page.tsx) (Edit Child Page), [`src/app/login/page.tsx`](https://github.com/henryivwighre/nana/blob/main/src/app/login/page.tsx) (Login and Signup Pages)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_auth["Authentication"]
  node_auth_pages["Login and Signup Pages<br/>[page.tsx]"]
  node_login_form["Login Form<br/>[login-form.tsx]"]
  node_signup_form["Signup Form<br/>[signup-form.tsx]"]
  node_auth_actions["Auth Actions<br/>[actions.ts]"]
end

subgraph group_dashboard["Dashboard"]
  node_site_header["Site Header<br/>[site-header.tsx]"]
  node_dashboard_page["Dashboard Page<br/>[page.tsx]"]
  node_dashboard_data["Dashboard Data Query<br/>[dashboard.ts]"]
  node_home["Home Route<br/>[page.tsx]"]
end

subgraph group_children["Child Profiles"]
  node_child_create_page["New Child Page<br/>[page.tsx]"]
  node_child_edit_page["Edit Child Page<br/>[page.tsx]"]
  node_child_form["Child Form<br/>[child-form.tsx]"]
  node_child_actions["Child Actions<br/>[actions.ts]"]
end

subgraph group_infra["Supabase Access"]
  node_server_client["Server Client<br/>[server.ts]"]
  node_browser_client["Browser Client<br/>[client.ts]"]
end

node_user(("User"))
node_supabase[("Supabase")]

node_user -->|"opens"| node_auth_pages
node_auth_pages -->|"checks session"| node_server_client
node_auth_pages -->|"renders"| node_login_form
node_auth_pages -->|"renders"| node_signup_form
node_login_form -->|"creates client"| node_browser_client
node_signup_form -->|"creates client"| node_browser_client
node_site_header -->|"submits sign-out"| node_auth_actions
node_user -->|"opens"| node_dashboard_page
node_dashboard_page -->|"loads data"| node_dashboard_data
node_dashboard_page -->|"renders"| node_site_header
node_dashboard_data -->|"creates client"| node_server_client
node_user -->|"opens"| node_child_create_page
node_child_create_page -->|"checks session"| node_server_client
node_child_create_page -->|"renders"| node_site_header
node_child_create_page -->|"renders"| node_child_form
node_child_create_page -->|"passes create action"| node_child_actions
node_user -->|"opens"| node_child_edit_page
node_child_edit_page -->|"creates client"| node_server_client
node_child_edit_page -->|"renders"| node_site_header
node_child_edit_page -->|"renders"| node_child_form
node_child_edit_page -->|"binds actions"| node_child_actions
node_child_form -->|"invokes passed action"| node_child_actions
node_child_actions -->|"creates client"| node_server_client
node_server_client -.->|"connects"| node_supabase
node_browser_client -.->|"connects"| node_supabase
node_home -->|"uses"| node_server_client

click node_auth_pages "https://github.com/henryivwighre/nana/blob/main/src/app/login/page.tsx"
click node_login_form "https://github.com/henryivwighre/nana/blob/main/src/app/login/login-form.tsx"
click node_signup_form "https://github.com/henryivwighre/nana/blob/main/src/app/signup/signup-form.tsx"
click node_auth_actions "https://github.com/henryivwighre/nana/blob/main/src/app/auth/actions.ts"
click node_site_header "https://github.com/henryivwighre/nana/blob/main/src/components/site-header.tsx"
click node_dashboard_page "https://github.com/henryivwighre/nana/blob/main/src/app/dashboard/page.tsx"
click node_dashboard_data "https://github.com/henryivwighre/nana/blob/main/src/lib/db/dashboard.ts"
click node_child_create_page "https://github.com/henryivwighre/nana/blob/main/src/app/dashboard/children/new/page.tsx"
click node_child_edit_page "https://github.com/henryivwighre/nana/blob/main/src/app/dashboard/children/%5Bid%5D/page.tsx"
click node_child_form "https://github.com/henryivwighre/nana/blob/main/src/app/dashboard/children/child-form.tsx"
click node_child_actions "https://github.com/henryivwighre/nana/blob/main/src/app/dashboard/children/actions.ts"
click node_server_client "https://github.com/henryivwighre/nana/blob/main/src/lib/supabase/server.ts"
click node_browser_client "https://github.com/henryivwighre/nana/blob/main/src/lib/supabase/client.ts"
click node_home "https://github.com/henryivwighre/nana/blob/main/src/app/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_auth_pages,node_login_form,node_signup_form,node_auth_actions,node_user toneBlue
class node_site_header,node_dashboard_page,node_dashboard_data,node_home,node_supabase toneAmber
class node_child_create_page,node_child_edit_page,node_child_form,node_child_actions toneMint
class node_server_client,node_browser_client toneRose
```

## Components

### Authentication

- [Login and Signup Pages](https://github.com/henryivwighre/nana/blob/main/src/app/login/page.tsx): `src/app/login/page.tsx`
- [Login Form](https://github.com/henryivwighre/nana/blob/main/src/app/login/login-form.tsx): `src/app/login/login-form.tsx`
- [Signup Form](https://github.com/henryivwighre/nana/blob/main/src/app/signup/signup-form.tsx): `src/app/signup/signup-form.tsx`
- [Auth Actions](https://github.com/henryivwighre/nana/blob/main/src/app/auth/actions.ts): `src/app/auth/actions.ts`

### Dashboard

- [Site Header](https://github.com/henryivwighre/nana/blob/main/src/components/site-header.tsx): `src/components/site-header.tsx`
- [Dashboard Page](https://github.com/henryivwighre/nana/blob/main/src/app/dashboard/page.tsx): `src/app/dashboard/page.tsx`
- [Dashboard Data Query](https://github.com/henryivwighre/nana/blob/main/src/lib/db/dashboard.ts): `src/lib/db/dashboard.ts`
- [Home Route](https://github.com/henryivwighre/nana/blob/main/src/app/page.tsx): `src/app/page.tsx`

### Child Profiles

- [New Child Page](https://github.com/henryivwighre/nana/blob/main/src/app/dashboard/children/new/page.tsx): `src/app/dashboard/children/new/page.tsx`
- [Edit Child Page](https://github.com/henryivwighre/nana/blob/main/src/app/dashboard/children/%5Bid%5D/page.tsx): `src/app/dashboard/children/[id]/page.tsx`
- [Child Form](https://github.com/henryivwighre/nana/blob/main/src/app/dashboard/children/child-form.tsx): `src/app/dashboard/children/child-form.tsx`
- [Child Actions](https://github.com/henryivwighre/nana/blob/main/src/app/dashboard/children/actions.ts): `src/app/dashboard/children/actions.ts`

### Supabase Access

- [Server Client](https://github.com/henryivwighre/nana/blob/main/src/lib/supabase/server.ts): `src/lib/supabase/server.ts`
- [Browser Client](https://github.com/henryivwighre/nana/blob/main/src/lib/supabase/client.ts): `src/lib/supabase/client.ts`

### Other components

- **User**
- **Supabase**

## Connections

- User → Login and Signup Pages: opens (evidence: `src/app/login/page.tsx`)
- Login and Signup Pages → Server Client: checks session (evidence: `src/app/login/page.tsx`)
- Login and Signup Pages → Login Form: renders (evidence: `src/app/login/page.tsx`)
- Login and Signup Pages → Signup Form: renders
- Login Form → Browser Client: creates client (evidence: `src/app/login/login-form.tsx`)
- Signup Form → Browser Client: creates client (evidence: `src/app/signup/signup-form.tsx`)
- Site Header → Auth Actions: submits sign-out (evidence: `src/components/site-header.tsx`)
- User → Dashboard Page: opens (evidence: `src/app/dashboard/page.tsx`)
- Dashboard Page → Dashboard Data Query: loads data (evidence: `src/app/dashboard/page.tsx`)
- Dashboard Page → Site Header: renders (evidence: `src/app/dashboard/page.tsx`)
- Dashboard Data Query → Server Client: creates client (evidence: `src/lib/db/dashboard.ts`)
- User → New Child Page: opens (evidence: `src/app/dashboard/children/new/page.tsx`)
- New Child Page → Server Client: checks session (evidence: `src/app/dashboard/children/new/page.tsx`)
- New Child Page → Site Header: renders (evidence: `src/app/dashboard/children/new/page.tsx`)
- New Child Page → Child Form: renders (evidence: `src/app/dashboard/children/new/page.tsx`)
- New Child Page → Child Actions: passes create action (evidence: `src/app/dashboard/children/new/page.tsx`)
- User → Edit Child Page: opens (evidence: `src/app/dashboard/children/[id]/page.tsx`)
- Edit Child Page → Server Client: creates client (evidence: `src/app/dashboard/children/[id]/page.tsx`)
- Edit Child Page → Site Header: renders (evidence: `src/app/dashboard/children/[id]/page.tsx`)
- Edit Child Page → Child Form: renders (evidence: `src/app/dashboard/children/[id]/page.tsx`)
- Edit Child Page → Child Actions: binds actions (evidence: `src/app/dashboard/children/[id]/page.tsx`)
- Child Form → Child Actions: invokes passed action (evidence: `src/app/dashboard/children/child-form.tsx`)
- Child Actions → Server Client: creates client (evidence: `src/app/dashboard/children/actions.ts`)
- Server Client → Supabase: connects
- Browser Client → Supabase: connects
- Home Route → Server Client: uses (evidence: `src/app/page.tsx`)