# iam-anouar/fich-cmponents architecture

> Architecture diagram of the GitHub repository iam-anouar/fich-cmponents, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-11-14). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/iam-anouar/fich-cmponents
- Repository: https://github.com/iam-anouar/fich-cmponents

## Overview

fichYa is a mobile time-and-attendance product with a React Native client and an Express API. Employees authenticate, record check-in/check-out events, and view attendance history; administrators manage users and work centers and inspect metrics. The backend routes requests through role/authentication guards to domain controllers and Sequelize models backed by PostgreSQL. The README describes deployment but little product behavior; relationships below rely on the sampled source and SOURCE INDEX references, so unsampled UI-to-API flows are not assumed.

Main entry points: [`backend/src/routes/v1.routes.js`](https://github.com/iam-anouar/fich-cmponents/blob/main/backend/src/routes/v1.routes.js) (API routes), [`backend/src/models/index.js`](https://github.com/iam-anouar/fich-cmponents/blob/main/backend/src/models/index.js) (Domain models), [`frontend/src/app/App.js`](https://github.com/iam-anouar/fich-cmponents/blob/main/frontend/src/app/App.js) (App shell), [`frontend/src/screens/LoginScreen.tsx`](https://github.com/iam-anouar/fich-cmponents/blob/main/frontend/src/screens/LoginScreen.tsx) (Auth screens)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_mobile["Mobile app"]
  node_app["App shell<br/>[App.js]"]
  node_navigation["App navigation<br/>[AppNavigator.js]"]
  node_auth_screens["Auth screens<br/>[LoginScreen.tsx]"]
  node_auth_state["Session state<br/>[AuthContext.js]"]
  node_auth_service["Auth requests<br/>[authService.js]"]
  node_attendance_ui["Attendance UI<br/>[UserDashboard.js]"]
  node_admin_ui["Admin UI<br/>[AdminDashboard.js]"]
end

subgraph group_api["Backend API"]
  node_api_app["Express app<br/>[app.js]"]
  node_v1_routes["API routes<br/>[v1.routes.js]"]
end

subgraph group_domain["Workforce domain"]
  node_user_controller["User accounts<br/>[user.Controller.js]"]
  node_attendance_controller["Attendance records"]
  node_centro_controller["Work centers"]
  node_metrics_controller["Workforce metrics"]
  node_models["Domain models<br/>[index.js]"]
  node_database[("PostgreSQL<br/>[db.js]")]
end

subgraph group_security["API security"]
  node_auth_guard["Auth and roles<br/>[auth.middleware.js]"]
  node_validation["Request validation"]
  node_api_guard["API key guard"]
  node_rate_limit["Rate limiter"]
end

node_employee(("Employee"))
node_administrator(("Administrator"))

node_app -->|"renders"| node_navigation
node_app -->|"provides session"| node_auth_state
node_navigation -->|"routes to"| node_auth_screens
node_auth_screens -->|"uses session"| node_auth_state
node_auth_screens -->|"imports requests"| node_auth_service
node_employee -.->|"uses"| node_app
node_administrator -.->|"uses"| node_app
node_api_app -->|"mounts routes"| node_v1_routes
node_v1_routes -->|"routes requests"| node_user_controller
node_v1_routes -->|"routes requests"| node_attendance_controller
node_v1_routes -->|"routes requests"| node_centro_controller
node_v1_routes -->|"routes requests"| node_metrics_controller
node_v1_routes -->|"protects endpoints"| node_auth_guard
node_v1_routes -->|"validates input"| node_validation
node_v1_routes -->|"checks API key"| node_api_guard
node_v1_routes -->|"limits requests"| node_rate_limit
node_user_controller -->|"reads and writes"| node_models
node_attendance_controller -->|"reads and writes"| node_models
node_centro_controller -->|"uses models"| node_models
node_metrics_controller -->|"queries metrics"| node_models
node_auth_guard -->|"loads user"| node_models
node_models -->|"configures ORM"| node_database
node_attendance_ui -.->|"serves"| node_employee
node_admin_ui -.->|"serves"| node_administrator

click node_app "https://github.com/iam-anouar/fich-cmponents/blob/main/frontend/src/app/App.js"
click node_navigation "https://github.com/iam-anouar/fich-cmponents/blob/main/frontend/src/navigation/AppNavigator.js"
click node_auth_screens "https://github.com/iam-anouar/fich-cmponents/blob/main/frontend/src/screens/LoginScreen.tsx"
click node_auth_state "https://github.com/iam-anouar/fich-cmponents/blob/main/frontend/src/context/AuthContext.js"
click node_auth_service "https://github.com/iam-anouar/fich-cmponents/blob/main/frontend/src/services/authService.js"
click node_attendance_ui "https://github.com/iam-anouar/fich-cmponents/blob/main/frontend/src/components/dashboard/UserDashboard.js"
click node_admin_ui "https://github.com/iam-anouar/fich-cmponents/blob/main/frontend/src/components/dashboard/AdminDashboard.js"
click node_api_app "https://github.com/iam-anouar/fich-cmponents/blob/main/backend/src/app.js"
click node_v1_routes "https://github.com/iam-anouar/fich-cmponents/blob/main/backend/src/routes/v1.routes.js"
click node_user_controller "https://github.com/iam-anouar/fich-cmponents/blob/main/backend/src/controllers/user.Controller.js"
click node_attendance_controller "https://github.com/iam-anouar/fich-cmponents/blob/main/backend/src/controllers/fichaje.Controller.js"
click node_centro_controller "https://github.com/iam-anouar/fich-cmponents/blob/main/backend/src/controllers/centro.Controller.js"
click node_metrics_controller "https://github.com/iam-anouar/fich-cmponents/blob/main/backend/src/controllers/metric.controller.js"
click node_models "https://github.com/iam-anouar/fich-cmponents/blob/main/backend/src/models/index.js"
click node_database "https://github.com/iam-anouar/fich-cmponents/blob/main/backend/src/config/db.js"
click node_auth_guard "https://github.com/iam-anouar/fich-cmponents/blob/main/backend/src/middlewares/auth.middleware.js"
click node_validation "https://github.com/iam-anouar/fich-cmponents/blob/main/backend/src/middlewares/validation.middleware.js"
click node_api_guard "https://github.com/iam-anouar/fich-cmponents/blob/main/backend/src/middlewares/apiKey.middleware.js"
click node_rate_limit "https://github.com/iam-anouar/fich-cmponents/blob/main/backend/src/middlewares/rateLimit.middleware.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_navigation,node_auth_screens,node_auth_state,node_auth_service,node_attendance_ui,node_admin_ui toneBlue
class node_api_app,node_v1_routes toneAmber
class node_user_controller,node_attendance_controller,node_centro_controller,node_metrics_controller,node_models,node_database toneMint
class node_auth_guard,node_validation,node_api_guard,node_rate_limit toneRose
class node_employee,node_administrator toneIndigo
```

## Components

### Mobile app

- [App shell](https://github.com/iam-anouar/fich-cmponents/blob/main/frontend/src/app/App.js): `frontend/src/app/App.js`
- [App navigation](https://github.com/iam-anouar/fich-cmponents/blob/main/frontend/src/navigation/AppNavigator.js): `frontend/src/navigation/AppNavigator.js`
- [Auth screens](https://github.com/iam-anouar/fich-cmponents/blob/main/frontend/src/screens/LoginScreen.tsx): `frontend/src/screens/LoginScreen.tsx`
- [Session state](https://github.com/iam-anouar/fich-cmponents/blob/main/frontend/src/context/AuthContext.js): `frontend/src/context/AuthContext.js`
- [Auth requests](https://github.com/iam-anouar/fich-cmponents/blob/main/frontend/src/services/authService.js): `frontend/src/services/authService.js`
- [Attendance UI](https://github.com/iam-anouar/fich-cmponents/blob/main/frontend/src/components/dashboard/UserDashboard.js): `frontend/src/components/dashboard/UserDashboard.js`
- [Admin UI](https://github.com/iam-anouar/fich-cmponents/blob/main/frontend/src/components/dashboard/AdminDashboard.js): `frontend/src/components/dashboard/AdminDashboard.js`

### Backend API

- [Express app](https://github.com/iam-anouar/fich-cmponents/blob/main/backend/src/app.js): `backend/src/app.js`
- [API routes](https://github.com/iam-anouar/fich-cmponents/blob/main/backend/src/routes/v1.routes.js): `backend/src/routes/v1.routes.js`

### Workforce domain

- [User accounts](https://github.com/iam-anouar/fich-cmponents/blob/main/backend/src/controllers/user.Controller.js): `backend/src/controllers/user.Controller.js`
- [Attendance records](https://github.com/iam-anouar/fich-cmponents/blob/main/backend/src/controllers/fichaje.Controller.js): `backend/src/controllers/fichaje.Controller.js`
- [Work centers](https://github.com/iam-anouar/fich-cmponents/blob/main/backend/src/controllers/centro.Controller.js): `backend/src/controllers/centro.Controller.js`
- [Workforce metrics](https://github.com/iam-anouar/fich-cmponents/blob/main/backend/src/controllers/metric.controller.js): `backend/src/controllers/metric.controller.js`
- [Domain models](https://github.com/iam-anouar/fich-cmponents/blob/main/backend/src/models/index.js): `backend/src/models/index.js`
- [PostgreSQL](https://github.com/iam-anouar/fich-cmponents/blob/main/backend/src/config/db.js): `backend/src/config/db.js`

### API security

- [Auth and roles](https://github.com/iam-anouar/fich-cmponents/blob/main/backend/src/middlewares/auth.middleware.js): `backend/src/middlewares/auth.middleware.js`
- [Request validation](https://github.com/iam-anouar/fich-cmponents/blob/main/backend/src/middlewares/validation.middleware.js): `backend/src/middlewares/validation.middleware.js`
- [API key guard](https://github.com/iam-anouar/fich-cmponents/blob/main/backend/src/middlewares/apiKey.middleware.js): `backend/src/middlewares/apiKey.middleware.js`
- [Rate limiter](https://github.com/iam-anouar/fich-cmponents/blob/main/backend/src/middlewares/rateLimit.middleware.js): `backend/src/middlewares/rateLimit.middleware.js`

### Other components

- **Employee**
- **Administrator**

## Connections

- App shell → App navigation: renders (evidence: `frontend/src/app/App.js`)
- App shell → Session state: provides session (evidence: `frontend/src/app/App.js`)
- App navigation → Auth screens: routes to (evidence: `frontend/src/navigation/AppNavigator.js`)
- Auth screens → Session state: uses session (evidence: `frontend/src/screens/LoginScreen.tsx`)
- Auth screens → Auth requests: imports requests (evidence: `frontend/src/screens/LoginScreen.tsx`)
- Employee → App shell: uses
- Administrator → App shell: uses
- Express app → API routes: mounts routes (evidence: `backend/src/app.js`)
- API routes → User accounts: routes requests (evidence: `backend/src/routes/v1.routes.js`)
- API routes → Attendance records: routes requests (evidence: `backend/src/routes/v1.routes.js`)
- API routes → Work centers: routes requests (evidence: `backend/src/routes/v1.routes.js`)
- API routes → Workforce metrics: routes requests (evidence: `backend/src/routes/v1.routes.js`)
- API routes → Auth and roles: protects endpoints (evidence: `backend/src/routes/v1.routes.js`)
- API routes → Request validation: validates input (evidence: `backend/src/routes/v1.routes.js`)
- API routes → API key guard: checks API key (evidence: `backend/src/routes/v1.routes.js`)
- API routes → Rate limiter: limits requests (evidence: `backend/src/routes/v1.routes.js`)
- User accounts → Domain models: reads and writes (evidence: `backend/src/controllers/user.Controller.js`)
- Attendance records → Domain models: reads and writes (evidence: `backend/src/controllers/fichaje.Controller.js`)
- Work centers → Domain models: uses models (evidence: `backend/src/controllers/centro.Controller.js`)
- Workforce metrics → Domain models: queries metrics (evidence: `backend/src/controllers/metric.controller.js`)
- Auth and roles → Domain models: loads user (evidence: `backend/src/middlewares/auth.middleware.js`)
- Domain models → PostgreSQL: configures ORM (evidence: `backend/src/models/index.js`)
- Attendance UI → Employee: serves
- Admin UI → Administrator: serves