Problem
The /vouch page is a placeholder. Mentors have no way
to see vouch requests, review learner profiles, or
submit vouches from the web app.
Context
Mentor vouching is central to StepFi. A vouch from a
Silver tier mentor adds 12 reputation points to a learner,
which drops their interest rate from 8% to 6%. Mentors
need a clean way to manage this on desktop.
Before Starting
Read these context files:
- context/architecture-context.md
- context/code-standards.md
What To Build
-
Create src/services/vouching.service.ts:
- getVouchRequests() -> GET /vouching/requests
- getMyVouches() -> GET /vouching/given
- submitVouch(learnerAddress) -> POST /vouching
- revokeVouch(id) -> DELETE /vouching/:id
-
Build /vouch page with tabs:
Tab 1 - Pending Requests:
List of learners who requested a vouch.
Each row shows wallet, reputation score,
loan amount, purpose.
Action buttons: Review Profile, Vouch, Decline
Tab 2 - My Active Vouches:
List of learners you are currently vouching for.
Shows reputation boost given, expiry date,
learner repayment status.
Revoke button per vouch.
-
Build vouch detail modal/page:
Shows full learner profile before vouching.
Shows vouch impact preview (score before/after).
Confirm button triggers wallet signing.
Files To Touch
- src/pages/Vouch.tsx
- src/services/vouching.service.ts (new)
- src/components/vouch/VouchRequestCard.tsx (new)
- src/components/vouch/VouchImpactPreview.tsx (new)
Acceptance Criteria
Mandatory Checks Before PR
Problem
The /vouch page is a placeholder. Mentors have no way
to see vouch requests, review learner profiles, or
submit vouches from the web app.
Context
Mentor vouching is central to StepFi. A vouch from a
Silver tier mentor adds 12 reputation points to a learner,
which drops their interest rate from 8% to 6%. Mentors
need a clean way to manage this on desktop.
Before Starting
Read these context files:
What To Build
Create src/services/vouching.service.ts:
Build /vouch page with tabs:
Tab 1 - Pending Requests:
List of learners who requested a vouch.
Each row shows wallet, reputation score,
loan amount, purpose.
Action buttons: Review Profile, Vouch, Decline
Tab 2 - My Active Vouches:
List of learners you are currently vouching for.
Shows reputation boost given, expiry date,
learner repayment status.
Revoke button per vouch.
Build vouch detail modal/page:
Shows full learner profile before vouching.
Shows vouch impact preview (score before/after).
Confirm button triggers wallet signing.
Files To Touch
Acceptance Criteria
Mandatory Checks Before PR