# alfredocoj007-sketch/farmacia-frontend architecture

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

- Interactive diagram: https://gitdiagram.com/alfredocoj007-sketch/farmacia-frontend
- Repository: https://github.com/alfredocoj007-sketch/farmacia-frontend

## Overview

FrontendFarmacia is an Angular pharmacy-management interface. Users sign in, enter a guarded shell, and work through sales, inventory and operational workflows; feature services exchange data with an external API. The routes document product areas not sampled in source, while service-call details are shown only where supported by excerpts. The backend’s internal behavior is outside this repository.

Main entry points: [`src/app/core/services/auth.service.ts`](https://github.com/alfredocoj007-sketch/farmacia-frontend/blob/main/src/app/core/services/auth.service.ts) (Authentication service), [`src/app/app.routes.ts`](https://github.com/alfredocoj007-sketch/farmacia-frontend/blob/main/src/app/app.routes.ts) (Feature routes), [`src/app/core/interceptors/auth.interceptor.ts`](https://github.com/alfredocoj007-sketch/farmacia-frontend/blob/main/src/app/core/interceptors/auth.interceptor.ts) (Auth interceptor), [`src/main.ts`](https://github.com/alfredocoj007-sketch/farmacia-frontend/blob/main/src/main.ts) (Angular bootstrap)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_entry["Application entry"]
  node_bootstrap["Angular bootstrap<br/>[main.ts]"]
  node_routes["Feature routes<br/>[app.routes.ts]"]
  node_shell["Application shell<br/>[shell.ts]"]
end

subgraph group_security["Identity and access"]
  node_login["Login screen<br/>[login.ts]"]
  node_auth["Authentication service<br/>[auth.service.ts]"]
  node_guards["Route guards<br/>[auth.guard.ts]"]
  node_role_guard["Role guard<br/>[role.guard.ts]"]
  node_interceptor["Auth interceptor"]
end

subgraph group_commerce["Sales and orders"]
  node_sales["Sales<br/>[ventas.ts]"]
  node_cash["Cash management<br/>[cajas-list.ts]"]
  node_orders["Call-center orders<br/>[pedidos-list.ts]"]
end

subgraph group_inventory["Inventory operations"]
  node_products["Product catalog<br/>[productos-list.ts]"]
  node_lots["Lots and kardex<br/>[lotes-list.ts]"]
  node_transfers["Branch transfers"]
end

subgraph group_operations["Business administration"]
  node_branches["Branches<br/>[sucursales-list.ts]"]
  node_fixed_assets["Fixed assets<br/>[activos-list.ts]"]
  node_payroll["Payroll<br/>[planillas-list.ts]"]
  node_audit["Audit<br/>[auditoria-list.ts]"]
  node_users["User administration<br/>[usuarios-list.ts]"]
  node_dashboard["Dashboard<br/>[dashboard.ts]"]
end

node_user(("Staff user"))
node_api{{"Backend API"}}

node_user -->|"opens app"| node_bootstrap
node_bootstrap -->|"starts routing"| node_routes
node_routes -->|"loads login"| node_login
node_routes -->|"loads shell"| node_shell
node_routes -->|"checks access"| node_guards
node_routes -->|"checks roles"| node_role_guard
node_login -->|"submits credentials"| node_auth
node_auth -->|"requests login/profile"| node_api
node_auth -->|"HTTP requests"| node_interceptor
node_interceptor -->|"reads token"| node_auth
node_interceptor -->|"forwards authorized requests"| node_api
node_guards -->|"checks session"| node_auth
node_role_guard -->|"checks user role"| node_auth
node_shell -->|"hosts feature routes"| node_sales
node_sales -.->|"sales data"| node_api
node_cash -.->|"cash operations"| node_api
node_orders -.->|"order operations"| node_api
node_products -.->|"product data"| node_api
node_lots -->|"lot and movement data"| node_api
node_transfers -.->|"transfer operations"| node_api
node_branches -.->|"branch data"| node_api
node_fixed_assets -.->|"asset operations"| node_api
node_payroll -->|"payroll operations"| node_api
node_audit -.->|"audit data"| node_api
node_users -.->|"user administration"| node_api
node_dashboard -.->|"dashboard data"| node_api

click node_bootstrap "https://github.com/alfredocoj007-sketch/farmacia-frontend/blob/main/src/main.ts"
click node_routes "https://github.com/alfredocoj007-sketch/farmacia-frontend/blob/main/src/app/app.routes.ts"
click node_shell "https://github.com/alfredocoj007-sketch/farmacia-frontend/blob/main/src/app/layout/shell/shell.ts"
click node_login "https://github.com/alfredocoj007-sketch/farmacia-frontend/blob/main/src/app/features/login/login.ts"
click node_auth "https://github.com/alfredocoj007-sketch/farmacia-frontend/blob/main/src/app/core/services/auth.service.ts"
click node_guards "https://github.com/alfredocoj007-sketch/farmacia-frontend/blob/main/src/app/core/guards/auth.guard.ts"
click node_role_guard "https://github.com/alfredocoj007-sketch/farmacia-frontend/blob/main/src/app/core/guards/role.guard.ts"
click node_interceptor "https://github.com/alfredocoj007-sketch/farmacia-frontend/blob/main/src/app/core/interceptors/auth.interceptor.ts"
click node_sales "https://github.com/alfredocoj007-sketch/farmacia-frontend/blob/main/src/app/features/ventas/ventas.ts"
click node_cash "https://github.com/alfredocoj007-sketch/farmacia-frontend/blob/main/src/app/features/cajas/cajas-list/cajas-list.ts"
click node_orders "https://github.com/alfredocoj007-sketch/farmacia-frontend/blob/main/src/app/features/call-center/pedidos-list/pedidos-list.ts"
click node_products "https://github.com/alfredocoj007-sketch/farmacia-frontend/blob/main/src/app/features/productos/productos-list/productos-list.ts"
click node_lots "https://github.com/alfredocoj007-sketch/farmacia-frontend/blob/main/src/app/features/lotes/lotes-list/lotes-list.ts"
click node_transfers "https://github.com/alfredocoj007-sketch/farmacia-frontend/blob/main/src/app/features/transferencias/transferencias-list/transferencias-list.ts"
click node_branches "https://github.com/alfredocoj007-sketch/farmacia-frontend/blob/main/src/app/features/sucursales/sucursales-list/sucursales-list.ts"
click node_fixed_assets "https://github.com/alfredocoj007-sketch/farmacia-frontend/blob/main/src/app/features/activos-fijos/activos-list/activos-list.ts"
click node_payroll "https://github.com/alfredocoj007-sketch/farmacia-frontend/blob/main/src/app/features/planillas/planillas-list/planillas-list.ts"
click node_audit "https://github.com/alfredocoj007-sketch/farmacia-frontend/blob/main/src/app/features/auditoria/auditoria-list/auditoria-list.ts"
click node_users "https://github.com/alfredocoj007-sketch/farmacia-frontend/blob/main/src/app/features/usuarios/usuarios-list/usuarios-list.ts"
click node_dashboard "https://github.com/alfredocoj007-sketch/farmacia-frontend/blob/main/src/app/features/dashboard/dashboard.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_bootstrap,node_routes,node_shell,node_user toneBlue
class node_login,node_auth,node_guards,node_role_guard,node_interceptor toneAmber
class node_sales,node_cash,node_orders,node_api toneMint
class node_products,node_lots,node_transfers toneRose
class node_branches,node_fixed_assets,node_payroll,node_audit,node_users,node_dashboard toneIndigo
```

## Components

### Application entry

- [Angular bootstrap](https://github.com/alfredocoj007-sketch/farmacia-frontend/blob/main/src/main.ts): `src/main.ts`
- [Feature routes](https://github.com/alfredocoj007-sketch/farmacia-frontend/blob/main/src/app/app.routes.ts): `src/app/app.routes.ts`
- [Application shell](https://github.com/alfredocoj007-sketch/farmacia-frontend/blob/main/src/app/layout/shell/shell.ts): `src/app/layout/shell/shell.ts`

### Identity and access

- [Login screen](https://github.com/alfredocoj007-sketch/farmacia-frontend/blob/main/src/app/features/login/login.ts): `src/app/features/login/login.ts`
- [Authentication service](https://github.com/alfredocoj007-sketch/farmacia-frontend/blob/main/src/app/core/services/auth.service.ts): `src/app/core/services/auth.service.ts`
- [Route guards](https://github.com/alfredocoj007-sketch/farmacia-frontend/blob/main/src/app/core/guards/auth.guard.ts): `src/app/core/guards/auth.guard.ts`
- [Role guard](https://github.com/alfredocoj007-sketch/farmacia-frontend/blob/main/src/app/core/guards/role.guard.ts): `src/app/core/guards/role.guard.ts`
- [Auth interceptor](https://github.com/alfredocoj007-sketch/farmacia-frontend/blob/main/src/app/core/interceptors/auth.interceptor.ts): `src/app/core/interceptors/auth.interceptor.ts`

### Sales and orders

- [Sales](https://github.com/alfredocoj007-sketch/farmacia-frontend/blob/main/src/app/features/ventas/ventas.ts): `src/app/features/ventas/ventas.ts`
- [Cash management](https://github.com/alfredocoj007-sketch/farmacia-frontend/blob/main/src/app/features/cajas/cajas-list/cajas-list.ts): `src/app/features/cajas/cajas-list/cajas-list.ts`
- [Call-center orders](https://github.com/alfredocoj007-sketch/farmacia-frontend/blob/main/src/app/features/call-center/pedidos-list/pedidos-list.ts): `src/app/features/call-center/pedidos-list/pedidos-list.ts`

### Inventory operations

- [Product catalog](https://github.com/alfredocoj007-sketch/farmacia-frontend/blob/main/src/app/features/productos/productos-list/productos-list.ts): `src/app/features/productos/productos-list/productos-list.ts`
- [Lots and kardex](https://github.com/alfredocoj007-sketch/farmacia-frontend/blob/main/src/app/features/lotes/lotes-list/lotes-list.ts): `src/app/features/lotes/lotes-list/lotes-list.ts`
- [Branch transfers](https://github.com/alfredocoj007-sketch/farmacia-frontend/blob/main/src/app/features/transferencias/transferencias-list/transferencias-list.ts): `src/app/features/transferencias/transferencias-list/transferencias-list.ts`

### Business administration

- [Branches](https://github.com/alfredocoj007-sketch/farmacia-frontend/blob/main/src/app/features/sucursales/sucursales-list/sucursales-list.ts): `src/app/features/sucursales/sucursales-list/sucursales-list.ts`
- [Fixed assets](https://github.com/alfredocoj007-sketch/farmacia-frontend/blob/main/src/app/features/activos-fijos/activos-list/activos-list.ts): `src/app/features/activos-fijos/activos-list/activos-list.ts`
- [Payroll](https://github.com/alfredocoj007-sketch/farmacia-frontend/blob/main/src/app/features/planillas/planillas-list/planillas-list.ts): `src/app/features/planillas/planillas-list/planillas-list.ts`
- [Audit](https://github.com/alfredocoj007-sketch/farmacia-frontend/blob/main/src/app/features/auditoria/auditoria-list/auditoria-list.ts): `src/app/features/auditoria/auditoria-list/auditoria-list.ts`
- [User administration](https://github.com/alfredocoj007-sketch/farmacia-frontend/blob/main/src/app/features/usuarios/usuarios-list/usuarios-list.ts): `src/app/features/usuarios/usuarios-list/usuarios-list.ts`
- [Dashboard](https://github.com/alfredocoj007-sketch/farmacia-frontend/blob/main/src/app/features/dashboard/dashboard.ts): `src/app/features/dashboard/dashboard.ts`

### Other components

- **Staff user**
- **Backend API**

## Connections

- Staff user → Angular bootstrap: opens app
- Angular bootstrap → Feature routes: starts routing
- Feature routes → Login screen: loads login
- Feature routes → Application shell: loads shell
- Feature routes → Route guards: checks access
- Feature routes → Role guard: checks roles
- Login screen → Authentication service: submits credentials
- Authentication service → Backend API: requests login/profile
- Authentication service → Auth interceptor: HTTP requests
- Auth interceptor → Authentication service: reads token
- Auth interceptor → Backend API: forwards authorized requests
- Route guards → Authentication service: checks session
- Role guard → Authentication service: checks user role
- Application shell → Sales: hosts feature routes
- Sales → Backend API: sales data
- Cash management → Backend API: cash operations
- Call-center orders → Backend API: order operations
- Product catalog → Backend API: product data
- Lots and kardex → Backend API: lot and movement data
- Branch transfers → Backend API: transfer operations
- Branches → Backend API: branch data
- Fixed assets → Backend API: asset operations
- Payroll → Backend API: payroll operations
- Audit → Backend API: audit data
- User administration → Backend API: user administration
- Dashboard → Backend API: dashboard data