# bsitcmu-26-27/ui-ux-design-java-booth architecture

> Architecture diagram of the GitHub repository bsitcmu-26-27/ui-ux-design-java-booth, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-09-26). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/bsitcmu-26-27/ui-ux-design-java-booth
- Repository: https://github.com/bsitcmu-26-27/ui-ux-design-java-booth

## Overview

This is a student-facing digital Freedom Wall: visitors browse and create anonymous or named posts, while administrators review and manage submissions. The sampled provider shows API-backed post loading, submission, reactions, and deletion, with browser storage helpers; route and component names support the other wall, canvas, booth, and admin surfaces. Some feature wiring is not shown in the excerpts, so those links are limited to what the tree and sampled code support.

Main entry points: [`src/components/freedom-wall/wall-provider.tsx`](https://github.com/bsitcmu-26-27/ui-ux-design-java-booth/blob/main/src/components/freedom-wall/wall-provider.tsx) (Wall state), [`src/routes/index.tsx`](https://github.com/bsitcmu-26-27/ui-ux-design-java-booth/blob/main/src/routes/index.tsx) (Home page), [`src/components/freedom-wall/post-composer.tsx`](https://github.com/bsitcmu-26-27/ui-ux-design-java-booth/blob/main/src/components/freedom-wall/post-composer.tsx) (Post composer), [`src/routes/admin.tsx`](https://github.com/bsitcmu-26-27/ui-ux-design-java-booth/blob/main/src/routes/admin.tsx) (Admin route)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_app["App shell"]
  node_root["Root shell"]
  node_router["Router setup<br/>[router.tsx]"]
end

subgraph group_community["Community wall"]
  node_home["Home page<br/>[index.tsx]"]
  node_wallroute["Wall route<br/>[wall.tsx]"]
  node_wallbrowser["Wall browser<br/>[wall-browser.tsx]"]
  node_canvasroute["Canvas route<br/>[canvas.tsx]"]
  node_canvas["Canvas board<br/>[canvas-board.tsx]"]
  node_booth["Booth route<br/>[booth.tsx]"]
  node_about["About route<br/>[about.tsx]"]
  node_composer["Post composer<br/>[post-composer.tsx]"]
  node_note["Note card<br/>[note-card.tsx]"]
end

subgraph group_moderation["Admin and moderation"]
  node_adminroute["Admin route<br/>[admin.tsx]"]
  node_adminpanel["Admin panel<br/>[admin-panel.tsx]"]
end

subgraph group_services["Data and integrations"]
  node_provider["Wall state<br/>[wall-provider.tsx]"]
  node_domain["Post model<br/>[freedom-wall.ts]"]
  node_localstore[("Browser storage")]
  node_auth["Admin credentials<br/>[admin-auth.ts]"]
end

node_visitor(("Visitor"))
node_administrator(("Administrator"))
node_api{{"Wall API"}}
node_captcha{{"Turnstile"}}

node_visitor -->|"opens"| node_router
node_router -->|"renders"| node_root
node_root -->|"routes"| node_home
node_root -->|"routes"| node_wallroute
node_root -->|"routes"| node_canvasroute
node_root -->|"routes"| node_booth
node_root -->|"routes"| node_about
node_root -->|"routes"| node_adminroute
node_root -->|"provides state"| node_provider
node_wallroute -->|"renders"| node_wallbrowser
node_canvasroute -->|"renders"| node_canvas
node_home -->|"renders posts"| node_note
node_home -->|"reads posts"| node_provider
node_wallbrowser -->|"uses wall state"| node_provider
node_canvas -->|"uses wall state"| node_provider
node_root -->|"renders"| node_composer
node_composer -->|"submits post"| node_provider
node_composer -.->|"verifies submission"| node_captcha
node_adminroute -->|"renders"| node_adminpanel
node_administrator -->|"opens"| node_adminroute
node_adminpanel -->|"uses wall state"| node_provider
node_provider -->|"fetches and mutates posts"| node_api
node_provider -->|"reads and writes"| node_localstore
node_provider -->|"uses post types"| node_domain
node_provider -->|"gets admin key"| node_auth

click node_router "https://github.com/bsitcmu-26-27/ui-ux-design-java-booth/blob/main/src/router.tsx"
click node_home "https://github.com/bsitcmu-26-27/ui-ux-design-java-booth/blob/main/src/routes/index.tsx"
click node_wallroute "https://github.com/bsitcmu-26-27/ui-ux-design-java-booth/blob/main/src/routes/wall.tsx"
click node_wallbrowser "https://github.com/bsitcmu-26-27/ui-ux-design-java-booth/blob/main/src/components/freedom-wall/wall-browser.tsx"
click node_canvasroute "https://github.com/bsitcmu-26-27/ui-ux-design-java-booth/blob/main/src/routes/canvas.tsx"
click node_canvas "https://github.com/bsitcmu-26-27/ui-ux-design-java-booth/blob/main/src/components/freedom-wall/canvas-board.tsx"
click node_booth "https://github.com/bsitcmu-26-27/ui-ux-design-java-booth/blob/main/src/routes/booth.tsx"
click node_about "https://github.com/bsitcmu-26-27/ui-ux-design-java-booth/blob/main/src/routes/about.tsx"
click node_composer "https://github.com/bsitcmu-26-27/ui-ux-design-java-booth/blob/main/src/components/freedom-wall/post-composer.tsx"
click node_note "https://github.com/bsitcmu-26-27/ui-ux-design-java-booth/blob/main/src/components/freedom-wall/note-card.tsx"
click node_adminroute "https://github.com/bsitcmu-26-27/ui-ux-design-java-booth/blob/main/src/routes/admin.tsx"
click node_adminpanel "https://github.com/bsitcmu-26-27/ui-ux-design-java-booth/blob/main/src/components/freedom-wall/admin-panel.tsx"
click node_provider "https://github.com/bsitcmu-26-27/ui-ux-design-java-booth/blob/main/src/components/freedom-wall/wall-provider.tsx"
click node_domain "https://github.com/bsitcmu-26-27/ui-ux-design-java-booth/blob/main/src/lib/freedom-wall.ts"
click node_auth "https://github.com/bsitcmu-26-27/ui-ux-design-java-booth/blob/main/src/lib/admin-auth.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_root,node_router toneBlue
class node_home,node_wallroute,node_wallbrowser,node_canvasroute,node_canvas,node_booth,node_about,node_composer,node_note toneAmber
class node_adminroute,node_adminpanel,node_api toneMint
class node_provider,node_domain,node_localstore,node_auth toneRose
class node_visitor,node_administrator,node_captcha toneIndigo
```

## Components

### App shell

- **Root shell**
- [Router setup](https://github.com/bsitcmu-26-27/ui-ux-design-java-booth/blob/main/src/router.tsx): `src/router.tsx`

### Community wall

- [Home page](https://github.com/bsitcmu-26-27/ui-ux-design-java-booth/blob/main/src/routes/index.tsx): `src/routes/index.tsx`
- [Wall route](https://github.com/bsitcmu-26-27/ui-ux-design-java-booth/blob/main/src/routes/wall.tsx): `src/routes/wall.tsx`
- [Wall browser](https://github.com/bsitcmu-26-27/ui-ux-design-java-booth/blob/main/src/components/freedom-wall/wall-browser.tsx): `src/components/freedom-wall/wall-browser.tsx`
- [Canvas route](https://github.com/bsitcmu-26-27/ui-ux-design-java-booth/blob/main/src/routes/canvas.tsx): `src/routes/canvas.tsx`
- [Canvas board](https://github.com/bsitcmu-26-27/ui-ux-design-java-booth/blob/main/src/components/freedom-wall/canvas-board.tsx): `src/components/freedom-wall/canvas-board.tsx`
- [Booth route](https://github.com/bsitcmu-26-27/ui-ux-design-java-booth/blob/main/src/routes/booth.tsx): `src/routes/booth.tsx`
- [About route](https://github.com/bsitcmu-26-27/ui-ux-design-java-booth/blob/main/src/routes/about.tsx): `src/routes/about.tsx`
- [Post composer](https://github.com/bsitcmu-26-27/ui-ux-design-java-booth/blob/main/src/components/freedom-wall/post-composer.tsx): `src/components/freedom-wall/post-composer.tsx`
- [Note card](https://github.com/bsitcmu-26-27/ui-ux-design-java-booth/blob/main/src/components/freedom-wall/note-card.tsx): `src/components/freedom-wall/note-card.tsx`

### Admin and moderation

- [Admin route](https://github.com/bsitcmu-26-27/ui-ux-design-java-booth/blob/main/src/routes/admin.tsx): `src/routes/admin.tsx`
- [Admin panel](https://github.com/bsitcmu-26-27/ui-ux-design-java-booth/blob/main/src/components/freedom-wall/admin-panel.tsx): `src/components/freedom-wall/admin-panel.tsx`

### Data and integrations

- [Wall state](https://github.com/bsitcmu-26-27/ui-ux-design-java-booth/blob/main/src/components/freedom-wall/wall-provider.tsx): `src/components/freedom-wall/wall-provider.tsx`
- [Post model](https://github.com/bsitcmu-26-27/ui-ux-design-java-booth/blob/main/src/lib/freedom-wall.ts): `src/lib/freedom-wall.ts`
- **Browser storage**
- [Admin credentials](https://github.com/bsitcmu-26-27/ui-ux-design-java-booth/blob/main/src/lib/admin-auth.ts): `src/lib/admin-auth.ts`

### Other components

- **Visitor**
- **Administrator**
- **Wall API**
- **Turnstile**

## Connections

- Visitor → Router setup: opens
- Router setup → Root shell: renders
- Root shell → Home page: routes
- Root shell → Wall route: routes
- Root shell → Canvas route: routes
- Root shell → Booth route: routes
- Root shell → About route: routes
- Root shell → Admin route: routes
- Root shell → Wall state: provides state
- Wall route → Wall browser: renders
- Canvas route → Canvas board: renders
- Home page → Note card: renders posts
- Home page → Wall state: reads posts
- Wall browser → Wall state: uses wall state
- Canvas board → Wall state: uses wall state
- Root shell → Post composer: renders
- Post composer → Wall state: submits post
- Post composer → Turnstile: verifies submission
- Admin route → Admin panel: renders
- Administrator → Admin route: opens
- Admin panel → Wall state: uses wall state
- Wall state → Wall API: fetches and mutates posts
- Wall state → Browser storage: reads and writes
- Wall state → Post model: uses post types
- Wall state → Admin credentials: gets admin key