📍 Page Location
URL: /dashboard/authenticated
📸 Visual Representation of the Page
Step 4: Dashboard Overview
BUYER🔔 Notifications
My Contracts
| Contract ID | Product | Value | Status | Actions |
|---|---|---|---|---|
| contract-001 | Wheat | $2,627,500 | PENDING DEPOSIT |
🎨 Detailed Visual Description
Dashboard shows: User role badge, notification bell, contract list table, "Create New Contract" button, and contract action buttons (Pay Deposit, Manage, etc.). Each contract displays: ID, product, value, status, counterparty, flags, and actions.
Key Visual Elements:
- Contract list with filters
- Real-time status updates
- Action buttons per contract
- Notifications system
- Role-based UI
⚙️ Backend Process
API Endpoint: GET /api/contracts
Process Flow:
1. Authenticates user via JWT
2. Queries database.contracts Map
3. Filters contracts where user is buyerEmail or supplierEmail
4. Enriches contract data with status, flags, and actions
5. Returns JSON array of user contractsDatabase Operations:
- Table:
database.contracts - Action: Query user contracts
➡️ Next Action
User clicks "Create New Contract" button