How sabriboulahia42/ins_statistiques works
1. Repo shape
- This is a monorepo centered on a statistics platform for INS Tunisia, with three client surfaces and a shared backend/core layer:
- a Node.js server at the repo root,
- a Vite/React web dashboard in WebApp/,
- a React Native mobile app in MobileApp/.
- The root also contains deployment docs, legal pages, and generated report artifacts.
2. Backend and API boundary
- The root-level app.js, backend.js, proxy.js, and ins-api.js form the server-side entry points and integration layer.
- This layer is the main boundary between clients and data: it serves application endpoints, mediates API calls, and likely proxies or normalizes upstream INS-related data.
- cache-manager.js suggests backend-side caching to avoid repeatedly recomputing or refetching datasets and exports.
3. Data storage model
- The repository uses file-based JSON data under data/ as the main application dataset store:
- agriculture.json, demographics.json, industry.json, tourism.json, trade.json, traditional.json.
- data/users.json indicates user/account state is also persisted locally rather than in an external database.
- settings.json and Request.xml suggest additional runtime configuration or request payload artifacts.
4. Authentication subsystem
- The auth/ folder is a self-contained auth module with config.js, db.js, middleware.js, and routes.js.
- Its role is to handle login/session/token concerns and protect privileged routes, especially the admin dashboard.
- The web client reflects this split with AuthContext.jsx and ProtectedRoute.jsx, showing auth is enforced at the UI boundary as well as on the server.
5. Export/report generation subsystem
- exporter/ is a dedicated multi-format export pipeline with TypeScript implementations for Excel, JSON, PDF, PowerPoint, and Word.
- exporter.ts and exportUtils.ts act as orchestration/shared helpers, while exporter.js and shared/core/exporter.js expose reusable runtime entry points.
- The generated .pdf, .pptx, and .json files in the repo root indicate exports are first-class outputs, not just transient downloads.
6. Web application architecture
- WebApp/ is a React + Vite front end, with src/main.ts bootstrapping the app and src/App.jsx composing the top-level layout.
- The key user flow is login followed by an admin dashboard in pages/AdminDashboard.jsx.
- The dashboard is split into panels for analytics, users, data management, and settings under src/components/admin/, with shared navigation in DashboardSidebar.jsx.
7. Shared web UI components
- shared/components/ contains reusable UI pieces such as DatasetList.jsx, ExportPanel.jsx, and StatsCard.jsx.
- shared/core/theme.js and shared/core/exporter.js indicate shared presentation and export logic intended to keep the web experience and root app consistent.
- This shared layer is the main reuse boundary for dashboard-style UI and export controls.
8. Mobile application architecture
- MobileApp/ is a React Native client with App.js as the entry and api/client.js as its API integration point.
- screens/HomeScreen.js and components/AnimatedCard.js show a lightweight mobile UI focused on presentation and data access rather than admin workflows.
- The macos/ and windows/ directories are native platform shells for desktop targets, meaning the same JS app can run on macOS and Windows with platform-specific wrappers.
9. Geographic and external data integration
- geo-adapter.js suggests a normalization layer for geographic or regional data, likely translating backend datasets into a consistent structure for charts/maps.
- ins-api.js points to an external INS data source or integration contract.
- Together with cache-manager.js, this implies a flow of external data ingestion → normalization → cached server-side access → client consumption.
10. Static/public-facing assets and legal pages
- The root includes index.html, index.css, privacy.html, and terms.html, which implies the repo also serves static/public pages alongside the app shell.
- WebApp/public/ and MobileApp platform assets handle client-specific static resources and icons.
11. Deployment and platform concerns
- render.yaml, DEPLOYMENT_GUIDE.md, HF_SETUP.md, and related docs show the app is designed for managed deployment, likely with a separate backend and front-end build step.
- MobileApp/windows/* and MobileApp/macos/* are generated/native project files, so the architecture spans web hosting plus desktop/mobile packaging.
- The platform boundary is therefore: server/data/export core in Node.js, web dashboard in Vite/React, and mobile/native wrappers for React Native.
12. High-level data flow
- Core flow: datasets in data/ and external INS integration are processed by the backend and cache layer, exposed through auth-protected endpoints, then consumed by the web admin dashboard and mobile client.
- Secondary flow: the export subsystem reads the same data model to generate downloadable reports in multiple formats.
- For an architecture diagram, the main nodes are: clients (WebApp, MobileApp) → auth/API server → data/cache/export subsystems → file-based datasets and external INS source.
Main entry points: backend.js Backend API · exporter Exports · auth Auth module · App.jsx Web app
Components 20
Core backend
Node server, auth, data access, caching, export, and integration layers at the repository root.
- Server app · Primary Node.js application entry point.
app.js - Backend API · Backend orchestration and application endpoint layer.
backend.js - Proxy · Request mediation and upstream passthrough layer.
proxy.js - INS API · Integration contract for INS data access.
ins-api.js - Cache · Server-side caching for datasets and exports.
cache-manager.js - Geo adapter · Geographic data normalization for charts or maps.
geo-adapter.js - Auth module · Self-contained authentication and route protection boundary.
auth - Auth routes · Login and session-facing route definitions.
auth/routes.js - Auth guard · Server-side route protection and request checks.
auth/middleware.js - Exports · Multi-format report generation subsystem.
exporter - Export core · Main export orchestration entry in TypeScript.
exporter/exporter.ts
Web app
React/Vite dashboard and its UI/auth composition.
Mobile app
React Native client and platform wrappers.
- Mobile app · Cross-platform React Native client.
MobileApp/App.js - Mobile API · Mobile-side API client integration.
MobileApp/api/client.js
Shared UI
Reusable UI and shared presentation/export helpers.
- Shared UI · Reusable dashboard and data display components.
shared/components - Shared export · Shared export helper used by multiple surfaces.
shared/core/exporter.js
Data store
File-based datasets and runtime state used by the backend.
- Datasets · File-based application datasets and user state.
data
Connections 23
- Server app → Backend API: boots · Server entry delegates to backend runtime.
- Backend API → Auth module: secures · Backend uses auth to protect privileged routes.
- Backend API → Cache: caches · Backend reads and stores cached results.
- Backend API → Geo adapter: normalizes · Backend normalizes geographic data for clients.
- Backend API → Exports: exports · Backend feeds data into report generation.
- Backend API → Datasets: reads/writes · Backend persists and retrieves file-based state.
- Proxy → INS API: forwards · Proxy mediates upstream INS access.
- INS API → Cache: feeds · External data is cached after retrieval.
- Auth module → Auth routes: exposes · Auth module publishes login/session routes.
- Auth module → Auth guard: enforces · Auth module protects server endpoints.
- Auth routes → Datasets: stores users · User/account state is backed by local JSON data.
- Exports → Export core: orchestrates · Export subsystem is coordinated by the main exporter entry.
- Exports → Shared export: reuses · Shared export helpers support runtime export flows.
- Exports → Datasets: reads · Exports are generated from the core data model.
- Web entry → Web app: mounts · Frontend bootstrap composes the app shell.
- Web app → Login: routes to · Web app includes login flow.
- Web app → Dashboard: routes to · Authenticated users enter the admin dashboard.
- Dashboard → Shared UI: uses · Dashboard panels reuse shared UI components.
- Dashboard → Auth module: depends on · UI protection mirrors server auth boundary.
- Mobile app → Mobile API: calls · Mobile client consumes backend APIs through a client wrapper.
- Mobile app → Shared UI: shares UI · Mobile surface reuses common presentation patterns conceptually.
- Mobile API → Backend API: requests · Mobile API client targets the backend boundary.
- Shared export → Exports: supports · Shared export helper backs the main export subsystem.