How osgiliath01/cpecaps-project works
This is a voucher and project disbursement tracking application: users sign in, browse projects and disbursement records, review project expense summaries, and create, edit, or delete entries. The React app delegates requests through an API client to a FastAPI backend; backend routes apply authentication and CRUD operations over SQLAlchemy models and PostgreSQL. The excerpts establish the main UI composition and backend call structure. The API client is listed as read but its request implementation was not excerpted, so its connection to backend routes is shown as unverified.
Main entry points: Dashboard.jsx Dashboard · App.jsx App session · auth.py Auth and domain routes · api.js API client
Components 19
Workspace UI
- App session
Frontend/src/App.jsx - Login and registration
Frontend/src/components/Login.jsx - Dashboard
Frontend/src/components/Dashboard.jsx - Project control
Frontend/src/components/ProjectsTable.jsx - Expense summary
Frontend/src/components/SummaryOfExpenses.jsx - Entry dialog
Frontend/src/components/EntryDialog.jsx - Account menu
Frontend/src/components/AdminMenu.jsx - Chat widget
Frontend/src/components/ChatWidget.jsx - Pagination
Frontend/src/hooks/usePagination.js - Currency and dates
Frontend/src/utils/format.js
Request Client
- API client
Frontend/src/api/api.js - Mock API
Frontend/src/api/mockAPI.js
Backend Services
- Auth and domain routes
Backend/auth.py - Domain CRUD
Backend/crud.py - Authentication security
Backend/security.py
Persistence
- User and expense models
Backend/models.py - Database session
Backend/database.py
Other components
- Staff user
- PostgreSQL
Connections 23
- Staff user → App session: uses workspace
Frontend/src/App.jsx - App session → Login and registration: renders unauthenticated
Frontend/src/App.jsx - App session → Dashboard: renders signed-in
Frontend/src/App.jsx - App session → API client: creates client
Frontend/src/App.jsx - Dashboard → API client: requests records
Frontend/src/components/Dashboard.jsx - Dashboard → Project control: renders project list
Frontend/src/components/Dashboard.jsx - Dashboard → Expense summary: renders summary
Frontend/src/components/Dashboard.jsx - Dashboard → Entry dialog: opens entry form
Frontend/src/components/Dashboard.jsx - Dashboard → Account menu: renders account menu
Frontend/src/components/Dashboard.jsx - Dashboard → Chat widget: renders widget
Frontend/src/components/Dashboard.jsx - Expense summary → Pagination: pages entries
Frontend/src/components/SummaryOfExpenses.jsx - Expense summary → Currency and dates: formats amounts and dates
Frontend/src/components/SummaryOfExpenses.jsx - API client → Mock API: uses mock implementation
Frontend/src/api/api.js - API client → Auth and domain routes: sends API requests
- Auth and domain routes → Domain CRUD: dispatches domain operations
Backend/auth.py - Auth and domain routes → Authentication security: checks credentials
Backend/auth.py - Auth and domain routes → Database session: injects database session
Backend/auth.py - Domain CRUD → User and expense models: queries and updates
Backend/crud.py - Domain CRUD → Authentication security: hashes passwords
Backend/crud.py - Authentication security → User and expense models: loads current user
Backend/security.py - Authentication security → Database session: gets database session
Backend/security.py - User and expense models → Database session: uses declarative base
Backend/models.py - Database session → PostgreSQL: connects to
Backend/database.py