# zainshah3464/vestior-store architecture

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

- Interactive diagram: https://gitdiagram.com/zainshah3464/vestior-store
- Repository: https://github.com/zainshah3464/vestior-store

## Overview

VESTIOR is a single-vendor men’s fashion storefront with customer shopping, checkout and order tracking, plus an administrative dashboard for catalog, orders and users. The main customer flow is product discovery and detail selection, local cart management, COD checkout, then order tracking; admins manage products and update order status. Supabase supplies authentication, database, storage and realtime capabilities. The graph uses README-described capabilities where route implementations were not sampled; those edges indicate documented integrations, not inspected call sites.

Main entry points: [`src/app/(main)/page.tsx`](https://github.com/zainshah3464/vestior-store/blob/main/src/app/(main)/page.tsx) (Storefront Home), [`src/app/(main)/orders/page.tsx`](https://github.com/zainshah3464/vestior-store/blob/main/src/app/(main)/orders/page.tsx) (Order Tracking), [`src/app/(main)/products/[id]/ProductDetailClient.tsx`](https://github.com/zainshah3464/vestior-store/blob/main/src/app/(main)/products/%5Bid%5D/ProductDetailClient.tsx) (Product Detail), [`src/app/(main)/cart/page.tsx`](https://github.com/zainshah3464/vestior-store/blob/main/src/app/(main)/cart/page.tsx) (Cart)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_storefront["Storefront"]
  node_home["Storefront Home<br/>[page.tsx]"]
  node_catalog["Product Discovery<br/>[page.tsx]"]
  node_category["Category Browse<br/>[page.tsx]"]
  node_product_detail["Product Detail"]
  node_search_nav["Search and Navigation<br/>[Navbar.tsx]"]
end

subgraph group_purchase["Purchase Flow"]
  node_cart["Cart<br/>[page.tsx]"]
  node_cart_state["Browser Cart State"]
  node_checkout["COD Checkout<br/>[page.tsx]"]
  node_customer_orders["Order Tracking<br/>[page.tsx]"]
  node_realtime["Order Realtime<br/>[OrdersRealtime.tsx]"]
end

subgraph group_identity["Identity"]
  node_auth_pages["Login and Signup<br/>[page.tsx]"]
  node_auth_callback["OAuth Callback<br/>[route.ts]"]
  node_auth_context["Auth Context<br/>[AuthProvider.tsx]"]
  node_access_middleware["Route Access<br/>[middleware.ts]"]
end

subgraph group_admin["Administration"]
  node_status_action["Update Order Status"]
  node_admin_dashboard["Admin Dashboard<br/>[page.tsx]"]
  node_admin_products["Product Management<br/>[page.tsx]"]
  node_admin_orders["Order Management<br/>[page.tsx]"]
  node_admin_users["User Management<br/>[page.tsx]"]
end

node_customer(("Customer"))
node_admin_user(("Administrator"))
node_supabase[("Supabase Services")]
node_analytics["Google Analytics"]

node_customer -->|"browses"| node_home
node_home -->|"explores products"| node_catalog
node_customer -->|"searches"| node_catalog
node_search_nav -->|"searches products"| node_supabase
node_customer -->|"browses category"| node_category
node_customer -->|"selects product"| node_product_detail
node_product_detail -->|"writes cart"| node_cart_state
node_cart -->|"reads and updates"| node_cart_state
node_customer -->|"reviews cart"| node_cart
node_customer -->|"provides address"| node_checkout
node_checkout -->|"creates order"| node_supabase
node_customer -->|"views orders"| node_customer_orders
node_customer_orders -->|"reads orders"| node_supabase
node_realtime -->|"subscribes to orders"| node_supabase
node_customer_orders -->|"shows status changes"| node_realtime
node_customer -->|"signs in"| node_auth_pages
node_auth_pages -->|"authenticates"| node_supabase
node_auth_callback -->|"exchanges code"| node_supabase
node_auth_context -->|"observes auth state"| node_supabase
node_access_middleware -->|"checks user and role"| node_supabase
node_admin_user -->|"manages store"| node_admin_dashboard
node_admin_dashboard -->|"loads analytics"| node_supabase
node_admin_user -->|"manages products"| node_admin_products
node_admin_products -->|"manages catalog and images"| node_supabase
node_admin_user -->|"manages orders"| node_admin_orders
node_admin_orders -->|"updates status"| node_status_action
node_status_action -->|"writes order status"| node_supabase
node_admin_user -->|"manages users"| node_admin_users
node_admin_users -->|"reads user data"| node_supabase
node_home -.->|"tracks page views"| node_analytics

click node_home "https://github.com/zainshah3464/vestior-store/blob/main/src/app/(main)/page.tsx"
click node_catalog "https://github.com/zainshah3464/vestior-store/blob/main/src/app/(main)/products/page.tsx"
click node_category "https://github.com/zainshah3464/vestior-store/blob/main/src/app/(main)/category/%5Bslug%5D/page.tsx"
click node_product_detail "https://github.com/zainshah3464/vestior-store/blob/main/src/app/(main)/products/%5Bid%5D/ProductDetailClient.tsx"
click node_search_nav "https://github.com/zainshah3464/vestior-store/blob/main/src/components/Navbar.tsx"
click node_cart "https://github.com/zainshah3464/vestior-store/blob/main/src/app/(main)/cart/page.tsx"
click node_cart_state "https://github.com/zainshah3464/vestior-store/blob/main/src/app/(main)/products/%5Bid%5D/ProductDetailClient.tsx"
click node_checkout "https://github.com/zainshah3464/vestior-store/blob/main/src/app/(main)/checkout/page.tsx"
click node_customer_orders "https://github.com/zainshah3464/vestior-store/blob/main/src/app/(main)/orders/page.tsx"
click node_realtime "https://github.com/zainshah3464/vestior-store/blob/main/src/components/OrdersRealtime.tsx"
click node_status_action "https://github.com/zainshah3464/vestior-store/blob/main/src/actions/updateOrderStatus.ts"
click node_auth_pages "https://github.com/zainshah3464/vestior-store/blob/main/src/app/(main)/auth/login/page.tsx"
click node_auth_callback "https://github.com/zainshah3464/vestior-store/blob/main/src/app/(main)/auth/callback/route.ts"
click node_auth_context "https://github.com/zainshah3464/vestior-store/blob/main/src/providers/AuthProvider.tsx"
click node_access_middleware "https://github.com/zainshah3464/vestior-store/blob/main/src/middleware.ts"
click node_admin_dashboard "https://github.com/zainshah3464/vestior-store/blob/main/src/app/admin/page.tsx"
click node_admin_products "https://github.com/zainshah3464/vestior-store/blob/main/src/app/admin/products/page.tsx"
click node_admin_orders "https://github.com/zainshah3464/vestior-store/blob/main/src/app/admin/orders/page.tsx"
click node_admin_users "https://github.com/zainshah3464/vestior-store/blob/main/src/app/admin/users/page.tsx"
click node_analytics "https://github.com/zainshah3464/vestior-store/blob/main/src/components/GoogleAnalytics.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_home,node_catalog,node_category,node_product_detail,node_search_nav toneBlue
class node_cart,node_cart_state,node_checkout,node_customer_orders,node_realtime,node_supabase toneAmber
class node_auth_pages,node_auth_callback,node_auth_context,node_access_middleware toneMint
class node_status_action,node_admin_dashboard,node_admin_products,node_admin_orders,node_admin_users toneRose
class node_customer,node_admin_user toneIndigo
class node_analytics toneTeal
```

## Components

### Storefront

- [Storefront Home](https://github.com/zainshah3464/vestior-store/blob/main/src/app/(main)/page.tsx): `src/app/(main)/page.tsx`
- [Product Discovery](https://github.com/zainshah3464/vestior-store/blob/main/src/app/(main)/products/page.tsx): `src/app/(main)/products/page.tsx`
- [Category Browse](https://github.com/zainshah3464/vestior-store/blob/main/src/app/(main)/category/%5Bslug%5D/page.tsx): `src/app/(main)/category/[slug]/page.tsx`
- [Product Detail](https://github.com/zainshah3464/vestior-store/blob/main/src/app/(main)/products/%5Bid%5D/ProductDetailClient.tsx): `src/app/(main)/products/[id]/ProductDetailClient.tsx`
- [Search and Navigation](https://github.com/zainshah3464/vestior-store/blob/main/src/components/Navbar.tsx): `src/components/Navbar.tsx`

### Purchase Flow

- [Cart](https://github.com/zainshah3464/vestior-store/blob/main/src/app/(main)/cart/page.tsx): `src/app/(main)/cart/page.tsx`
- [Browser Cart State](https://github.com/zainshah3464/vestior-store/blob/main/src/app/(main)/products/%5Bid%5D/ProductDetailClient.tsx): `src/app/(main)/products/[id]/ProductDetailClient.tsx`
- [COD Checkout](https://github.com/zainshah3464/vestior-store/blob/main/src/app/(main)/checkout/page.tsx): `src/app/(main)/checkout/page.tsx`
- [Order Tracking](https://github.com/zainshah3464/vestior-store/blob/main/src/app/(main)/orders/page.tsx): `src/app/(main)/orders/page.tsx`
- [Order Realtime](https://github.com/zainshah3464/vestior-store/blob/main/src/components/OrdersRealtime.tsx): `src/components/OrdersRealtime.tsx`

### Identity

- [Login and Signup](https://github.com/zainshah3464/vestior-store/blob/main/src/app/(main)/auth/login/page.tsx): `src/app/(main)/auth/login/page.tsx`
- [OAuth Callback](https://github.com/zainshah3464/vestior-store/blob/main/src/app/(main)/auth/callback/route.ts): `src/app/(main)/auth/callback/route.ts`
- [Auth Context](https://github.com/zainshah3464/vestior-store/blob/main/src/providers/AuthProvider.tsx): `src/providers/AuthProvider.tsx`
- [Route Access](https://github.com/zainshah3464/vestior-store/blob/main/src/middleware.ts): `src/middleware.ts`

### Administration

- [Update Order Status](https://github.com/zainshah3464/vestior-store/blob/main/src/actions/updateOrderStatus.ts): `src/actions/updateOrderStatus.ts`
- [Admin Dashboard](https://github.com/zainshah3464/vestior-store/blob/main/src/app/admin/page.tsx): `src/app/admin/page.tsx`
- [Product Management](https://github.com/zainshah3464/vestior-store/blob/main/src/app/admin/products/page.tsx): `src/app/admin/products/page.tsx`
- [Order Management](https://github.com/zainshah3464/vestior-store/blob/main/src/app/admin/orders/page.tsx): `src/app/admin/orders/page.tsx`
- [User Management](https://github.com/zainshah3464/vestior-store/blob/main/src/app/admin/users/page.tsx): `src/app/admin/users/page.tsx`

### Other components

- **Customer**
- **Administrator**
- **Supabase Services**
- [Google Analytics](https://github.com/zainshah3464/vestior-store/blob/main/src/components/GoogleAnalytics.tsx): `src/components/GoogleAnalytics.tsx`

## Connections

- Customer → Storefront Home: browses
- Storefront Home → Product Discovery: explores products
- Customer → Product Discovery: searches
- Search and Navigation → Supabase Services: searches products
- Customer → Category Browse: browses category
- Customer → Product Detail: selects product
- Product Detail → Browser Cart State: writes cart
- Cart → Browser Cart State: reads and updates
- Customer → Cart: reviews cart
- Customer → COD Checkout: provides address
- COD Checkout → Supabase Services: creates order
- Customer → Order Tracking: views orders
- Order Tracking → Supabase Services: reads orders
- Order Realtime → Supabase Services: subscribes to orders
- Order Tracking → Order Realtime: shows status changes
- Customer → Login and Signup: signs in
- Login and Signup → Supabase Services: authenticates
- OAuth Callback → Supabase Services: exchanges code
- Auth Context → Supabase Services: observes auth state
- Route Access → Supabase Services: checks user and role
- Administrator → Admin Dashboard: manages store
- Admin Dashboard → Supabase Services: loads analytics
- Administrator → Product Management: manages products
- Product Management → Supabase Services: manages catalog and images
- Administrator → Order Management: manages orders
- Order Management → Update Order Status: updates status
- Update Order Status → Supabase Services: writes order status
- Administrator → User Management: manages users
- User Management → Supabase Services: reads user data
- Storefront Home → Google Analytics: tracks page views