# mateusz-bogacz-collegiumwitelona/spcrm_frontend architecture

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

- Interactive diagram: https://gitdiagram.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend
- Repository: https://github.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend

## Overview

SPCRM is a browser-based CRM frontend for a steel-trading business. Users sign in, navigate CRM workspaces, and manage customer relationships and sales records; task calendars, analytics, product and finance records, mailing, and administration are distinct product capabilities. The sampled authentication code confirms context-to-auth-API calls and the shared HTTP client; task excerpts confirm hooks calling task APIs. Other domain wiring is represented only where the file tree establishes the subsystem, so unsampled call relationships are omitted.

Main entry points: [`app/routes.ts`](https://github.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend/blob/main/app/routes.ts) (Route map), [`app/context/auth-context.tsx`](https://github.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend/blob/main/app/context/auth-context.tsx) (Auth context), [`app/api/auth.api.ts`](https://github.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend/blob/main/app/api/auth.api.ts) (Auth API), [`app/lib/client.ts`](https://github.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend/blob/main/app/lib/client.ts) (HTTP client)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_access["Access and navigation"]
  node_routes["Route map<br/>[routes.ts]"]
  node_auth["Auth context<br/>[auth-context.tsx]"]
  node_auth_api["Auth API<br/>[auth.api.ts]"]
  node_http["HTTP client<br/>[client.ts]"]
end

subgraph group_relationships["Customer relationships"]
  node_companies["Company workspace"]
  node_contacts["Contact workspace"]
  node_tasks["Task calendar"]
  node_task_hooks["Task data hooks<br/>[use-tasks.ts]"]
  node_task_api["Task API<br/>[task.api.ts]"]
  node_map["Company map<br/>[map.tsx]"]
end

subgraph group_commerce["Sales and commerce"]
  node_deals["Sales workspace"]
  node_products["Product catalog"]
  node_promotions["Promotions"]
  node_offers["Offers"]
  node_invoices["Invoices"]
end

subgraph group_insights["Insights and outreach"]
  node_dashboard["Dashboards<br/>[dashboard.tsx]"]
  node_analytics["Analytics<br/>[analytics.api.ts]"]
  node_mailing["Mailing creator"]
end

subgraph group_operations["Administration"]
  node_users["User management"]
  node_support["Help and support<br/>[help.tsx]"]
  node_reference_data["Reference data"]
end

node_user(("CRM user"))
node_backend["CRM backend"]

node_user -->|"navigates"| node_routes
node_routes -->|"renders auth flow"| node_auth
node_auth -->|"fetches session"| node_auth_api
node_auth -->|"logs out"| node_auth_api
node_auth_api -->|"sends requests"| node_http
node_http -->|"HTTP requests"| node_backend
node_routes -->|"routes to"| node_companies
node_routes -->|"routes to"| node_contacts
node_routes -->|"routes to"| node_tasks
node_tasks -->|"loads task data"| node_task_hooks
node_task_hooks -->|"calls"| node_task_api
node_task_api -->|"sends requests"| node_http
node_routes -->|"routes to"| node_deals
node_routes -->|"routes to"| node_products
node_routes -->|"routes to"| node_promotions
node_routes -->|"routes to"| node_offers
node_routes -->|"routes to"| node_invoices
node_routes -->|"routes to"| node_dashboard
node_routes -->|"routes to"| node_mailing
node_routes -->|"routes to"| node_users
node_routes -->|"routes to"| node_support
node_routes -->|"routes to"| node_reference_data
node_routes -->|"routes to"| node_map

click node_routes "https://github.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend/blob/main/app/routes.ts"
click node_auth "https://github.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend/blob/main/app/context/auth-context.tsx"
click node_auth_api "https://github.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend/blob/main/app/api/auth.api.ts"
click node_http "https://github.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend/blob/main/app/lib/client.ts"
click node_companies "https://github.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend/tree/main/app/routes/company"
click node_contacts "https://github.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend/tree/main/app/routes/contact"
click node_tasks "https://github.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend/tree/main/app/routes/task"
click node_task_hooks "https://github.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend/blob/main/app/hooks/use-tasks.ts"
click node_task_api "https://github.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend/blob/main/app/api/task.api.ts"
click node_deals "https://github.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend/tree/main/app/routes/deal"
click node_products "https://github.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend/tree/main/app/routes/product"
click node_promotions "https://github.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend/tree/main/app/routes/promotion"
click node_offers "https://github.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend/tree/main/app/routes/offer"
click node_invoices "https://github.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend/tree/main/app/routes/invoice"
click node_dashboard "https://github.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend/blob/main/app/routes/dashboard.tsx"
click node_analytics "https://github.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend/blob/main/app/api/analytics.api.ts"
click node_mailing "https://github.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend/blob/main/app/routes/mailing-creator.tsx"
click node_users "https://github.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend/tree/main/app/routes/user"
click node_support "https://github.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend/blob/main/app/routes/help.tsx"
click node_reference_data "https://github.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend/tree/main/app/routes/steel-grade"
click node_map "https://github.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend/blob/main/app/routes/company/map.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_routes,node_auth,node_auth_api,node_http,node_user toneBlue
class node_companies,node_contacts,node_tasks,node_task_hooks,node_task_api,node_map toneAmber
class node_deals,node_products,node_promotions,node_offers,node_invoices toneMint
class node_dashboard,node_analytics,node_mailing toneRose
class node_users,node_support,node_reference_data,node_backend toneIndigo
```

## Components

### Access and navigation

- [Route map](https://github.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend/blob/main/app/routes.ts): `app/routes.ts`
- [Auth context](https://github.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend/blob/main/app/context/auth-context.tsx): `app/context/auth-context.tsx`
- [Auth API](https://github.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend/blob/main/app/api/auth.api.ts): `app/api/auth.api.ts`
- [HTTP client](https://github.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend/blob/main/app/lib/client.ts): `app/lib/client.ts`

### Customer relationships

- [Company workspace](https://github.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend/tree/main/app/routes/company): `app/routes/company`
- [Contact workspace](https://github.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend/tree/main/app/routes/contact): `app/routes/contact`
- [Task calendar](https://github.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend/tree/main/app/routes/task): `app/routes/task`
- [Task data hooks](https://github.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend/blob/main/app/hooks/use-tasks.ts): `app/hooks/use-tasks.ts`
- [Task API](https://github.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend/blob/main/app/api/task.api.ts): `app/api/task.api.ts`
- [Company map](https://github.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend/blob/main/app/routes/company/map.tsx): `app/routes/company/map.tsx`

### Sales and commerce

- [Sales workspace](https://github.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend/tree/main/app/routes/deal): `app/routes/deal`
- [Product catalog](https://github.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend/tree/main/app/routes/product): `app/routes/product`
- [Promotions](https://github.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend/tree/main/app/routes/promotion): `app/routes/promotion`
- [Offers](https://github.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend/tree/main/app/routes/offer): `app/routes/offer`
- [Invoices](https://github.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend/tree/main/app/routes/invoice): `app/routes/invoice`

### Insights and outreach

- [Dashboards](https://github.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend/blob/main/app/routes/dashboard.tsx): `app/routes/dashboard.tsx`
- [Analytics](https://github.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend/blob/main/app/api/analytics.api.ts): `app/api/analytics.api.ts`
- [Mailing creator](https://github.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend/blob/main/app/routes/mailing-creator.tsx): `app/routes/mailing-creator.tsx`

### Administration

- [User management](https://github.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend/tree/main/app/routes/user): `app/routes/user`
- [Help and support](https://github.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend/blob/main/app/routes/help.tsx): `app/routes/help.tsx`
- [Reference data](https://github.com/mateusz-bogacz-collegiumwitelona/spcrm_frontend/tree/main/app/routes/steel-grade): `app/routes/steel-grade`

### Other components

- **CRM user**
- **CRM backend**

## Connections

- CRM user → Route map: navigates
- Route map → Auth context: renders auth flow
- Auth context → Auth API: fetches session
- Auth context → Auth API: logs out
- Auth API → HTTP client: sends requests
- HTTP client → CRM backend: HTTP requests
- Route map → Company workspace: routes to
- Route map → Contact workspace: routes to
- Route map → Task calendar: routes to
- Task calendar → Task data hooks: loads task data
- Task data hooks → Task API: calls
- Task API → HTTP client: sends requests
- Route map → Sales workspace: routes to
- Route map → Product catalog: routes to
- Route map → Promotions: routes to
- Route map → Offers: routes to
- Route map → Invoices: routes to
- Route map → Dashboards: routes to
- Route map → Mailing creator: routes to
- Route map → User management: routes to
- Route map → Help and support: routes to
- Route map → Reference data: routes to
- Route map → Company map: routes to