# shreyas-sv1/abafashions architecture

> Architecture diagram of the GitHub repository shreyas-sv1/abafashions, 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/shreyas-sv1/abafashions
- Repository: https://github.com/shreyas-sv1/abafashions

## Overview

ABAfashions is a fashion storefront with an administrator product-management interface. Customers browse and filter a product catalog, view product details, and manage a locally persisted cart; administrators sign in and maintain product listings, including images. The Express API serves product operations, while Prisma persists products and Cloudinary handles uploaded images. The graph follows sampled routing, cart, catalog, product-route, and dashboard code; unsampled page and API implementations are represented only where their paths and responsibilities are clear, so some wiring is intentionally omitted.

Main entry points: [`client/src/App.jsx`](https://github.com/shreyas-sv1/abafashions/blob/main/client/src/App.jsx) (App routing), [`server/routes/products.js`](https://github.com/shreyas-sv1/abafashions/blob/main/server/routes/products.js) (Product routes), [`server/server.js`](https://github.com/shreyas-sv1/abafashions/blob/main/server/server.js) (Express API), [`client/src/pages/Catalog.jsx`](https://github.com/shreyas-sv1/abafashions/blob/main/client/src/pages/Catalog.jsx) (Catalog browse)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_storefront["Customer storefront"]
  node_app["App routing<br/>[App.jsx]"]
  node_catalog["Catalog browse<br/>[Catalog.jsx]"]
  node_productcard["Product card<br/>[ProductCard.jsx]"]
  node_detail["Product detail<br/>[ProductDetail.jsx]"]
  node_cartpage["Cart page<br/>[Cart.jsx]"]
  node_cartstate["Cart state<br/>[CartContext.jsx]"]
end

subgraph group_admin["Administration"]
  node_adminlogin["Admin login<br/>[AdminLogin.jsx]"]
  node_dashboard["Product dashboard<br/>[AdminDashboard.jsx]"]
  node_authstate["Admin session<br/>[AuthContext.jsx]"]
end

subgraph group_api["API and access"]
  node_clientproducts["Product API client<br/>[products.js]"]
  node_clientadmin["Admin API client<br/>[admin.js]"]
  node_server["Express API<br/>[server.js]"]
  node_productsroute["Product routes<br/>[products.js]"]
  node_adminroute["Admin routes<br/>[admin.js]"]
  node_jwt["JWT middleware<br/>[auth.js]"]
end

subgraph group_data["Persistence and media"]
  node_productdb[("Product database<br/>[schema.prisma]")]
  node_cloudinarylib["Image service adapter<br/>[cloudinary.js]"]
end

node_customer(("Customer"))
node_cloudinary[("Cloudinary")]
node_browserstorage[("Browser local storage")]

node_customer -->|"uses storefront"| node_app
node_app -->|"routes to"| node_catalog
node_app -->|"routes to"| node_detail
node_app -->|"routes to"| node_cartpage
node_app -->|"routes to"| node_adminlogin
node_app -->|"protects route"| node_dashboard
node_catalog -->|"fetches products"| node_clientproducts
node_catalog -->|"renders products"| node_productcard
node_productcard -->|"adds item"| node_cartstate
node_cartpage -->|"reads and updates"| node_cartstate
node_cartstate -->|"persists cart"| node_browserstorage
node_dashboard -->|"manages products"| node_clientproducts
node_adminlogin -->|"submits credentials"| node_clientadmin
node_adminlogin -->|"sets session"| node_authstate
node_dashboard -->|"reads session"| node_authstate
node_clientproducts -->|"requests products"| node_server
node_clientadmin -->|"requests admin"| node_server
node_server -->|"dispatches products"| node_productsroute
node_server -->|"dispatches admin"| node_adminroute
node_productsroute -->|"verifies writes"| node_jwt
node_productsroute -->|"reads and writes"| node_productdb
node_productsroute -->|"uploads and deletes images"| node_cloudinarylib
node_cloudinarylib -.->|"transfers images"| node_cloudinary

click node_app "https://github.com/shreyas-sv1/abafashions/blob/main/client/src/App.jsx"
click node_catalog "https://github.com/shreyas-sv1/abafashions/blob/main/client/src/pages/Catalog.jsx"
click node_productcard "https://github.com/shreyas-sv1/abafashions/blob/main/client/src/components/ProductCard.jsx"
click node_detail "https://github.com/shreyas-sv1/abafashions/blob/main/client/src/pages/ProductDetail.jsx"
click node_cartpage "https://github.com/shreyas-sv1/abafashions/blob/main/client/src/pages/Cart.jsx"
click node_cartstate "https://github.com/shreyas-sv1/abafashions/blob/main/client/src/context/CartContext.jsx"
click node_adminlogin "https://github.com/shreyas-sv1/abafashions/blob/main/client/src/pages/admin/AdminLogin.jsx"
click node_dashboard "https://github.com/shreyas-sv1/abafashions/blob/main/client/src/pages/admin/AdminDashboard.jsx"
click node_authstate "https://github.com/shreyas-sv1/abafashions/blob/main/client/src/context/AuthContext.jsx"
click node_clientproducts "https://github.com/shreyas-sv1/abafashions/blob/main/client/src/api/products.js"
click node_clientadmin "https://github.com/shreyas-sv1/abafashions/blob/main/client/src/api/admin.js"
click node_server "https://github.com/shreyas-sv1/abafashions/blob/main/server/server.js"
click node_productsroute "https://github.com/shreyas-sv1/abafashions/blob/main/server/routes/products.js"
click node_adminroute "https://github.com/shreyas-sv1/abafashions/blob/main/server/routes/admin.js"
click node_jwt "https://github.com/shreyas-sv1/abafashions/blob/main/server/middleware/auth.js"
click node_productdb "https://github.com/shreyas-sv1/abafashions/blob/main/server/prisma/schema.prisma"
click node_cloudinarylib "https://github.com/shreyas-sv1/abafashions/blob/main/server/lib/cloudinary.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_catalog,node_productcard,node_detail,node_cartpage,node_cartstate toneBlue
class node_adminlogin,node_dashboard,node_authstate,node_cloudinary,node_browserstorage toneAmber
class node_clientproducts,node_clientadmin,node_server,node_productsroute,node_adminroute,node_jwt toneMint
class node_productdb,node_cloudinarylib toneRose
class node_customer toneIndigo
```

## Components

### Customer storefront

- [App routing](https://github.com/shreyas-sv1/abafashions/blob/main/client/src/App.jsx): `client/src/App.jsx`
- [Catalog browse](https://github.com/shreyas-sv1/abafashions/blob/main/client/src/pages/Catalog.jsx): `client/src/pages/Catalog.jsx`
- [Product card](https://github.com/shreyas-sv1/abafashions/blob/main/client/src/components/ProductCard.jsx): `client/src/components/ProductCard.jsx`
- [Product detail](https://github.com/shreyas-sv1/abafashions/blob/main/client/src/pages/ProductDetail.jsx): `client/src/pages/ProductDetail.jsx`
- [Cart page](https://github.com/shreyas-sv1/abafashions/blob/main/client/src/pages/Cart.jsx): `client/src/pages/Cart.jsx`
- [Cart state](https://github.com/shreyas-sv1/abafashions/blob/main/client/src/context/CartContext.jsx): `client/src/context/CartContext.jsx`

### Administration

- [Admin login](https://github.com/shreyas-sv1/abafashions/blob/main/client/src/pages/admin/AdminLogin.jsx): `client/src/pages/admin/AdminLogin.jsx`
- [Product dashboard](https://github.com/shreyas-sv1/abafashions/blob/main/client/src/pages/admin/AdminDashboard.jsx): `client/src/pages/admin/AdminDashboard.jsx`
- [Admin session](https://github.com/shreyas-sv1/abafashions/blob/main/client/src/context/AuthContext.jsx): `client/src/context/AuthContext.jsx`

### API and access

- [Product API client](https://github.com/shreyas-sv1/abafashions/blob/main/client/src/api/products.js): `client/src/api/products.js`
- [Admin API client](https://github.com/shreyas-sv1/abafashions/blob/main/client/src/api/admin.js): `client/src/api/admin.js`
- [Express API](https://github.com/shreyas-sv1/abafashions/blob/main/server/server.js): `server/server.js`
- [Product routes](https://github.com/shreyas-sv1/abafashions/blob/main/server/routes/products.js): `server/routes/products.js`
- [Admin routes](https://github.com/shreyas-sv1/abafashions/blob/main/server/routes/admin.js): `server/routes/admin.js`
- [JWT middleware](https://github.com/shreyas-sv1/abafashions/blob/main/server/middleware/auth.js): `server/middleware/auth.js`

### Persistence and media

- [Product database](https://github.com/shreyas-sv1/abafashions/blob/main/server/prisma/schema.prisma): `server/prisma/schema.prisma`
- [Image service adapter](https://github.com/shreyas-sv1/abafashions/blob/main/server/lib/cloudinary.js): `server/lib/cloudinary.js`

### Other components

- **Customer**
- **Cloudinary**
- **Browser local storage**

## Connections

- Customer → App routing: uses storefront
- App routing → Catalog browse: routes to
- App routing → Product detail: routes to
- App routing → Cart page: routes to
- App routing → Admin login: routes to
- App routing → Product dashboard: protects route
- Catalog browse → Product API client: fetches products
- Catalog browse → Product card: renders products
- Product card → Cart state: adds item
- Cart page → Cart state: reads and updates
- Cart state → Browser local storage: persists cart
- Product dashboard → Product API client: manages products
- Admin login → Admin API client: submits credentials
- Admin login → Admin session: sets session
- Product dashboard → Admin session: reads session
- Product API client → Express API: requests products
- Admin API client → Express API: requests admin
- Express API → Product routes: dispatches products
- Express API → Admin routes: dispatches admin
- Product routes → JWT middleware: verifies writes
- Product routes → Product database: reads and writes
- Product routes → Image service adapter: uploads and deletes images
- Image service adapter → Cloudinary: transfers images
