# joa111/houseofnoodles architecture

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

- Interactive diagram: https://gitdiagram.com/joa111/houseofnoodles
- Repository: https://github.com/joa111/houseofnoodles

## Overview

This is a House of Noodles order-management frontend built with React and Supabase. Staff sign in, view and update orders, and create or edit orders; administrators additionally manage the menu and can export order data. Orders can be viewed as invoices and shared or downloaded as PDFs. The excerpts show the routed screens and service calls; some export behavior and backend details are not sampled, so those relationships are not expanded beyond the visible wiring.

Main entry points: [`src/App.js`](https://github.com/joa111/houseofnoodles/blob/main/src/App.js) (App routing), [`src/services/supabaseService.js`](https://github.com/joa111/houseofnoodles/blob/main/src/services/supabaseService.js) (Supabase service), [`src/pages/OrderList.js`](https://github.com/joa111/houseofnoodles/blob/main/src/pages/OrderList.js) (Order list), [`src/pages/Login.js`](https://github.com/joa111/houseofnoodles/blob/main/src/pages/Login.js) (Sign in)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_access["Access and routing"]
  node_app["App routing<br/>[App.js]"]
  node_login["Sign in<br/>[Login.js]"]
end

subgraph group_orders["Order workflows"]
  node_order_list["Order list<br/>[OrderList.js]"]
  node_order_editor["Order editor<br/>[AddOrder.js]"]
  node_invoice["Invoice view<br/>[InvoiceModal.js]"]
end

subgraph group_admin["Administration"]
  node_export["Export options<br/>[ExportModal.js]"]
  node_menu["Menu management<br/>[MenuManagement.js]"]
end

subgraph group_data["Data access"]
  node_service["Supabase service<br/>[supabaseService.js]"]
  node_client["Supabase client<br/>[supabase.js]"]
  node_backend[("Supabase backend")]
end

node_staff(("Staff user"))

node_staff -->|"signs in"| node_login
node_app -->|"routes to"| node_login
node_app -->|"routes to"| node_order_list
node_app -->|"routes to"| node_order_editor
node_app -->|"admin route"| node_menu
node_login -->|"uses auth"| node_app
node_app -->|"uses client"| node_client
node_order_list -->|"loads and updates"| node_service
node_order_list -->|"opens invoice"| node_invoice
node_order_list -->|"opens export"| node_export
node_order_editor -->|"loads and saves"| node_service
node_menu -->|"manages menu"| node_service
node_invoice -->|"loads invoice"| node_service
node_service -->|"uses client"| node_client
node_service -->|"queries data"| node_backend
node_app -->|"auth and roles"| node_backend

click node_app "https://github.com/joa111/houseofnoodles/blob/main/src/App.js"
click node_login "https://github.com/joa111/houseofnoodles/blob/main/src/pages/Login.js"
click node_order_list "https://github.com/joa111/houseofnoodles/blob/main/src/pages/OrderList.js"
click node_order_editor "https://github.com/joa111/houseofnoodles/blob/main/src/pages/AddOrder.js"
click node_invoice "https://github.com/joa111/houseofnoodles/blob/main/src/pages/InvoiceModal.js"
click node_export "https://github.com/joa111/houseofnoodles/blob/main/src/components/ExportModal.js"
click node_menu "https://github.com/joa111/houseofnoodles/blob/main/src/pages/MenuManagement.js"
click node_service "https://github.com/joa111/houseofnoodles/blob/main/src/services/supabaseService.js"
click node_client "https://github.com/joa111/houseofnoodles/blob/main/src/supabase.js"

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_app,node_login,node_staff toneBlue
class node_order_list,node_order_editor,node_invoice toneAmber
class node_export,node_menu toneMint
class node_service,node_client,node_backend toneRose
```

## Components

### Access and routing

- [App routing](https://github.com/joa111/houseofnoodles/blob/main/src/App.js): `src/App.js`
- [Sign in](https://github.com/joa111/houseofnoodles/blob/main/src/pages/Login.js): `src/pages/Login.js`

### Order workflows

- [Order list](https://github.com/joa111/houseofnoodles/blob/main/src/pages/OrderList.js): `src/pages/OrderList.js`
- [Order editor](https://github.com/joa111/houseofnoodles/blob/main/src/pages/AddOrder.js): `src/pages/AddOrder.js`
- [Invoice view](https://github.com/joa111/houseofnoodles/blob/main/src/pages/InvoiceModal.js): `src/pages/InvoiceModal.js`

### Administration

- [Export options](https://github.com/joa111/houseofnoodles/blob/main/src/components/ExportModal.js): `src/components/ExportModal.js`
- [Menu management](https://github.com/joa111/houseofnoodles/blob/main/src/pages/MenuManagement.js): `src/pages/MenuManagement.js`

### Data access

- [Supabase service](https://github.com/joa111/houseofnoodles/blob/main/src/services/supabaseService.js): `src/services/supabaseService.js`
- [Supabase client](https://github.com/joa111/houseofnoodles/blob/main/src/supabase.js): `src/supabase.js`
- **Supabase backend**

### Other components

- **Staff user**

## Connections

- Staff user → Sign in: signs in (evidence: `src/pages/Login.js`)
- App routing → Sign in: routes to (evidence: `src/App.js`)
- App routing → Order list: routes to (evidence: `src/App.js`)
- App routing → Order editor: routes to (evidence: `src/App.js`)
- App routing → Menu management: admin route (evidence: `src/App.js`)
- Sign in → App routing: uses auth (evidence: `src/pages/Login.js`)
- App routing → Supabase client: uses client (evidence: `src/App.js`)
- Order list → Supabase service: loads and updates (evidence: `src/pages/OrderList.js`)
- Order list → Invoice view: opens invoice (evidence: `src/pages/OrderList.js`)
- Order list → Export options: opens export (evidence: `src/pages/OrderList.js`)
- Order editor → Supabase service: loads and saves (evidence: `src/pages/AddOrder.js`)
- Menu management → Supabase service: manages menu (evidence: `src/pages/MenuManagement.js`)
- Invoice view → Supabase service: loads invoice (evidence: `src/pages/InvoiceModal.js`)
- Supabase service → Supabase client: uses client (evidence: `src/services/supabaseService.js`)
- Supabase service → Supabase backend: queries data (evidence: `src/services/supabaseService.js`)
- App routing → Supabase backend: auth and roles (evidence: `src/App.js`)