# gino156/next.js-pos-inventory-system architecture

> Architecture diagram of the GitHub repository gino156/next.js-pos-inventory-system, 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/gino156/next.js-pos-inventory-system
- Repository: https://github.com/gino156/next.js-pos-inventory-system

## Overview

This is a small-business POS and inventory app. Staff sign in, work with store-scoped products, build a cart, complete a sale, and can review sales and print receipts or summaries. Product and reporting pages provide separate inventory-management and sales-analysis workflows. Supabase supplies authentication and persistent store data; the README also documents image storage and multi-store isolation. Some features are documented but their implementation was not sampled, so those links are marked optional or omitted.

Main entry points: [`src/lib/supabase/client.ts`](https://github.com/gino156/next.js-pos-inventory-system/blob/main/src/lib/supabase/client.ts) (Supabase client), [`src/app/page.tsx`](https://github.com/gino156/next.js-pos-inventory-system/blob/main/src/app/page.tsx) (POS page), [`src/components/pos/PosInterface.tsx`](https://github.com/gino156/next.js-pos-inventory-system/blob/main/src/components/pos/PosInterface.tsx) (POS interface), [`src/app/products/page.tsx`](https://github.com/gino156/next.js-pos-inventory-system/blob/main/src/app/products/page.tsx) (Product management)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_access["Access & Navigation"]
  node_login["Sign in<br/>[page.tsx]"]
  node_navbar["Store navigation<br/>[Navbar.tsx]"]
  node_onboard["Store onboarding<br/>[page.tsx]"]
  node_onboardapi["Onboarding API<br/>[route.ts]"]
end

subgraph group_sales["Point of Sale"]
  node_pospage["POS page<br/>[page.tsx]"]
  node_posinterface["POS interface<br/>[PosInterface.tsx]"]
  node_checkout["Checkout dialog<br/>[CheckoutModal.tsx]"]
  node_receipt["Receipt printing<br/>[ReceiptModal.tsx]"]
end

subgraph group_inventory["Inventory"]
  node_products["Product management<br/>[page.tsx]"]
end

subgraph group_reporting["Sales Reporting"]
  node_dashboard["Sales dashboard<br/>[page.tsx]"]
  node_dashboardview["Dashboard view<br/>[DashboardView.tsx]"]
  node_summary["Sales summary"]
end

node_staff(("Store staff"))
node_supabaseclient["Supabase client<br/>[client.ts]"]
node_supabase[("Supabase services")]
node_storage[("Supabase Storage")]

node_staff -->|"signs in"| node_login
node_login -->|"authenticates via"| node_supabaseclient
node_login -->|"uses auth"| node_supabase
node_staff -->|"rings up sale"| node_pospage
node_pospage -->|"queries and writes"| node_supabaseclient
node_pospage -->|"records sale"| node_supabase
node_pospage -->|"shows receipt"| node_receipt
node_staff -->|"uses POS"| node_posinterface
node_posinterface -->|"renders"| node_checkout
node_posinterface -->|"queries and writes"| node_supabaseclient
node_posinterface -->|"processes sale"| node_supabase
node_staff -->|"manages catalog"| node_products
node_products -->|"queries and updates"| node_supabaseclient
node_products -->|"stores products"| node_supabase
node_products -.->|"uploads images"| node_storage
node_staff -->|"reviews sales"| node_dashboard
node_dashboard -->|"queries sales"| node_supabaseclient
node_dashboard -->|"opens summary"| node_summary
node_summary -->|"fetches transactions"| node_supabaseclient
node_dashboardview -->|"queries data"| node_supabaseclient
node_navbar -->|"checks session"| node_supabaseclient
node_navbar -->|"uses auth and store data"| node_supabase

click node_login "https://github.com/gino156/next.js-pos-inventory-system/blob/main/src/app/login/page.tsx"
click node_navbar "https://github.com/gino156/next.js-pos-inventory-system/blob/main/src/components/Navbar.tsx"
click node_pospage "https://github.com/gino156/next.js-pos-inventory-system/blob/main/src/app/page.tsx"
click node_posinterface "https://github.com/gino156/next.js-pos-inventory-system/blob/main/src/components/pos/PosInterface.tsx"
click node_checkout "https://github.com/gino156/next.js-pos-inventory-system/blob/main/src/components/pos/CheckoutModal.tsx"
click node_receipt "https://github.com/gino156/next.js-pos-inventory-system/blob/main/src/components/ReceiptModal.tsx"
click node_products "https://github.com/gino156/next.js-pos-inventory-system/blob/main/src/app/products/page.tsx"
click node_dashboard "https://github.com/gino156/next.js-pos-inventory-system/blob/main/src/app/dashboard/page.tsx"
click node_dashboardview "https://github.com/gino156/next.js-pos-inventory-system/blob/main/src/components/dashboard/DashboardView.tsx"
click node_summary "https://github.com/gino156/next.js-pos-inventory-system/blob/main/src/components/SalesSummaryModal.tsx"
click node_supabaseclient "https://github.com/gino156/next.js-pos-inventory-system/blob/main/src/lib/supabase/client.ts"
click node_onboard "https://github.com/gino156/next.js-pos-inventory-system/blob/main/src/app/admin/onboard/page.tsx"
click node_onboardapi "https://github.com/gino156/next.js-pos-inventory-system/blob/main/src/app/api/admin/onboard/route.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_login,node_navbar,node_onboard,node_onboardapi,node_supabaseclient toneBlue
class node_pospage,node_posinterface,node_checkout,node_receipt,node_supabase,node_storage toneAmber
class node_products toneMint
class node_dashboard,node_dashboardview,node_summary toneRose
class node_staff toneIndigo
```

## Components

### Access & Navigation

- [Sign in](https://github.com/gino156/next.js-pos-inventory-system/blob/main/src/app/login/page.tsx): `src/app/login/page.tsx`
- [Store navigation](https://github.com/gino156/next.js-pos-inventory-system/blob/main/src/components/Navbar.tsx): `src/components/Navbar.tsx`
- [Store onboarding](https://github.com/gino156/next.js-pos-inventory-system/blob/main/src/app/admin/onboard/page.tsx): `src/app/admin/onboard/page.tsx`
- [Onboarding API](https://github.com/gino156/next.js-pos-inventory-system/blob/main/src/app/api/admin/onboard/route.ts): `src/app/api/admin/onboard/route.ts`

### Point of Sale

- [POS page](https://github.com/gino156/next.js-pos-inventory-system/blob/main/src/app/page.tsx): `src/app/page.tsx`
- [POS interface](https://github.com/gino156/next.js-pos-inventory-system/blob/main/src/components/pos/PosInterface.tsx): `src/components/pos/PosInterface.tsx`
- [Checkout dialog](https://github.com/gino156/next.js-pos-inventory-system/blob/main/src/components/pos/CheckoutModal.tsx): `src/components/pos/CheckoutModal.tsx`
- [Receipt printing](https://github.com/gino156/next.js-pos-inventory-system/blob/main/src/components/ReceiptModal.tsx): `src/components/ReceiptModal.tsx`

### Inventory

- [Product management](https://github.com/gino156/next.js-pos-inventory-system/blob/main/src/app/products/page.tsx): `src/app/products/page.tsx`

### Sales Reporting

- [Sales dashboard](https://github.com/gino156/next.js-pos-inventory-system/blob/main/src/app/dashboard/page.tsx): `src/app/dashboard/page.tsx`
- [Dashboard view](https://github.com/gino156/next.js-pos-inventory-system/blob/main/src/components/dashboard/DashboardView.tsx): `src/components/dashboard/DashboardView.tsx`
- [Sales summary](https://github.com/gino156/next.js-pos-inventory-system/blob/main/src/components/SalesSummaryModal.tsx): `src/components/SalesSummaryModal.tsx`

### Other components

- **Store staff**
- [Supabase client](https://github.com/gino156/next.js-pos-inventory-system/blob/main/src/lib/supabase/client.ts): `src/lib/supabase/client.ts`
- **Supabase services**
- **Supabase Storage**

## Connections

- Store staff → Sign in: signs in (evidence: `src/app/login/page.tsx`)
- Sign in → Supabase client: authenticates via (evidence: `src/app/login/page.tsx`)
- Sign in → Supabase services: uses auth (evidence: `README.md`)
- Store staff → POS page: rings up sale (evidence: `README.md`)
- POS page → Supabase client: queries and writes (evidence: `src/app/page.tsx`)
- POS page → Supabase services: records sale (evidence: `src/app/page.tsx`)
- POS page → Receipt printing: shows receipt (evidence: `src/app/page.tsx`)
- Store staff → POS interface: uses POS (evidence: `README.md`)
- POS interface → Checkout dialog: renders (evidence: `src/components/pos/PosInterface.tsx`)
- POS interface → Supabase client: queries and writes (evidence: `src/components/pos/PosInterface.tsx`)
- POS interface → Supabase services: processes sale (evidence: `src/components/pos/PosInterface.tsx`)
- Store staff → Product management: manages catalog (evidence: `README.md`)
- Product management → Supabase client: queries and updates (evidence: `src/app/products/page.tsx`)
- Product management → Supabase services: stores products (evidence: `README.md`)
- Product management → Supabase Storage: uploads images (evidence: `README.md`)
- Store staff → Sales dashboard: reviews sales (evidence: `README.md`)
- Sales dashboard → Supabase client: queries sales (evidence: `src/app/dashboard/page.tsx`)
- Sales dashboard → Sales summary: opens summary (evidence: `src/app/dashboard/page.tsx`)
- Sales summary → Supabase client: fetches transactions (evidence: `src/components/SalesSummaryModal.tsx`)
- Dashboard view → Supabase client: queries data (evidence: `src/components/dashboard/DashboardView.tsx`)
- Store navigation → Supabase client: checks session (evidence: `src/components/Navbar.tsx`)
- Store navigation → Supabase services: uses auth and store data (evidence: `src/components/Navbar.tsx`)