# sayuru99/energy_optimizer_webapp architecture

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

## Overview

Apex Energy Optimization Portal is a frontend for factory managers to configure a garment factory, maintain its machine inventory, request an energy-cost optimization, and review savings on dashboards and reports. The main flow starts with sign-in, loads factory data, then moves through factory setup, machines, optimization, and reporting views. `src/data/api.ts` supplies either dummy-mode browser data or backend API calls. The README documents reports as demo data and describes the backend contract; excerpts do not show every API operation or report implementation.

Main entry points: [`src/App.tsx`](https://github.com/sayuru99/energy_optimizer_webapp/blob/main/src/App.tsx) (App workflow), [`src/data/api.ts`](https://github.com/sayuru99/energy_optimizer_webapp/blob/main/src/data/api.ts) (Data API adapter), [`src/auth/AuthContext.tsx`](https://github.com/sayuru99/energy_optimizer_webapp/blob/main/src/auth/AuthContext.tsx) (Session context), [`src/features/auth/Login.tsx`](https://github.com/sayuru99/energy_optimizer_webapp/blob/main/src/features/auth/Login.tsx) (Sign-in and signup)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_experience["Portal experience"]
  node_app["App workflow<br/>[App.tsx]"]
  node_login["Sign-in and signup<br/>[Login.tsx]"]
  node_auth["Session context<br/>[AuthContext.tsx]"]
end

subgraph group_workflow["Energy workflow"]
  node_factory["Factory setup<br/>[FactorySetup.tsx]"]
  node_machines["Machine inventory<br/>[Machines.tsx]"]
  node_optimization["Optimization schedule<br/>[Optimization.tsx]"]
  node_dashboard["Energy dashboard<br/>[Dashboard.tsx]"]
  node_reports["Cost reports<br/>[Reports.tsx]"]
end

subgraph group_integration["Data integration"]
  node_api["Data API adapter<br/>[api.ts]"]
  node_backend["Backend API"]
end

subgraph group_state["Session and demo state"]
  node_dummyfile["Demo data file<br/>[dummy.json]"]
  node_browserstorage[("Browser local storage")]
end

node_manager(("Factory manager"))

node_manager -->|"signs in"| node_login
node_login -->|"submits credentials"| node_auth
node_auth -->|"authenticates"| node_api
node_auth -->|"persists session"| node_browserstorage
node_app -->|"reads session"| node_auth
node_app -->|"loads portal data"| node_api
node_api -.->|"requests data"| node_backend
node_api -->|"loads demo data"| node_dummyfile
node_api -->|"reads and writes demo data"| node_browserstorage
node_app -->|"renders factory view"| node_factory
node_app -->|"renders inventory view"| node_machines
node_app -->|"renders schedule view"| node_optimization
node_app -->|"renders dashboard view"| node_dashboard
node_app -->|"renders reports view"| node_reports
node_factory -->|"updates factory"| node_api
node_machines -->|"manages machines"| node_api
node_optimization -->|"runs optimization"| node_api
node_app -->|"supplies loaded metrics"| node_dashboard
node_app -->|"supplies report rows"| node_reports

click node_app "https://github.com/sayuru99/energy_optimizer_webapp/blob/main/src/App.tsx"
click node_login "https://github.com/sayuru99/energy_optimizer_webapp/blob/main/src/features/auth/Login.tsx"
click node_auth "https://github.com/sayuru99/energy_optimizer_webapp/blob/main/src/auth/AuthContext.tsx"
click node_factory "https://github.com/sayuru99/energy_optimizer_webapp/blob/main/src/features/factory/FactorySetup.tsx"
click node_machines "https://github.com/sayuru99/energy_optimizer_webapp/blob/main/src/features/machines/Machines.tsx"
click node_optimization "https://github.com/sayuru99/energy_optimizer_webapp/blob/main/src/features/optimization/Optimization.tsx"
click node_dashboard "https://github.com/sayuru99/energy_optimizer_webapp/blob/main/src/features/dashboard/Dashboard.tsx"
click node_reports "https://github.com/sayuru99/energy_optimizer_webapp/blob/main/src/features/reports/Reports.tsx"
click node_api "https://github.com/sayuru99/energy_optimizer_webapp/blob/main/src/data/api.ts"
click node_dummyfile "https://github.com/sayuru99/energy_optimizer_webapp/blob/main/public/dummy.json"

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_auth toneBlue
class node_factory,node_machines,node_optimization,node_dashboard,node_reports toneAmber
class node_api,node_backend toneMint
class node_dummyfile,node_browserstorage toneRose
class node_manager toneIndigo
```

## Components

### Portal experience

- [App workflow](https://github.com/sayuru99/energy_optimizer_webapp/blob/main/src/App.tsx): `src/App.tsx`
- [Sign-in and signup](https://github.com/sayuru99/energy_optimizer_webapp/blob/main/src/features/auth/Login.tsx): `src/features/auth/Login.tsx`
- [Session context](https://github.com/sayuru99/energy_optimizer_webapp/blob/main/src/auth/AuthContext.tsx): `src/auth/AuthContext.tsx`

### Energy workflow

- [Factory setup](https://github.com/sayuru99/energy_optimizer_webapp/blob/main/src/features/factory/FactorySetup.tsx): `src/features/factory/FactorySetup.tsx`
- [Machine inventory](https://github.com/sayuru99/energy_optimizer_webapp/blob/main/src/features/machines/Machines.tsx): `src/features/machines/Machines.tsx`
- [Optimization schedule](https://github.com/sayuru99/energy_optimizer_webapp/blob/main/src/features/optimization/Optimization.tsx): `src/features/optimization/Optimization.tsx`
- [Energy dashboard](https://github.com/sayuru99/energy_optimizer_webapp/blob/main/src/features/dashboard/Dashboard.tsx): `src/features/dashboard/Dashboard.tsx`
- [Cost reports](https://github.com/sayuru99/energy_optimizer_webapp/blob/main/src/features/reports/Reports.tsx): `src/features/reports/Reports.tsx`

### Data integration

- [Data API adapter](https://github.com/sayuru99/energy_optimizer_webapp/blob/main/src/data/api.ts): `src/data/api.ts`
- **Backend API**

### Session and demo state

- [Demo data file](https://github.com/sayuru99/energy_optimizer_webapp/blob/main/public/dummy.json): `public/dummy.json`
- **Browser local storage**

### Other components

- **Factory manager**

## Connections

- Factory manager → Sign-in and signup: signs in
- Sign-in and signup → Session context: submits credentials
- Session context → Data API adapter: authenticates
- Session context → Browser local storage: persists session
- App workflow → Session context: reads session
- App workflow → Data API adapter: loads portal data
- Data API adapter → Backend API: requests data
- Data API adapter → Demo data file: loads demo data
- Data API adapter → Browser local storage: reads and writes demo data
- App workflow → Factory setup: renders factory view
- App workflow → Machine inventory: renders inventory view
- App workflow → Optimization schedule: renders schedule view
- App workflow → Energy dashboard: renders dashboard view
- App workflow → Cost reports: renders reports view
- Factory setup → Data API adapter: updates factory
- Machine inventory → Data API adapter: manages machines
- Optimization schedule → Data API adapter: runs optimization
- App workflow → Energy dashboard: supplies loaded metrics
- App workflow → Cost reports: supplies report rows