Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
77 changes: 77 additions & 0 deletions PR_CONTENT.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,77 @@
## Summary

Closes #[issue number]

Replace the stub `StepDeposit` component in the sponsor onboarding wizard with a fully functional deposit flow. Sponsors completing the 4-step onboarding can now actually deposit USDC — amount input with $10 minimum validation, unsigned XDR fetched from the API, signed via Freighter, submitted on-chain, and a success state with a Stellar Expert link. On success, onboarding is marked complete and the sponsor is navigated to the dashboard.

## This repo is for the React web app only

This app targets sponsors, vendors, and mentors.
It does NOT serve learners. Learner features
belong in StepFi-App.

Before submitting, confirm your changes belong here:

- [x] My changes are inside src/
- [x] I have NOT added Rust, Soroban, or
contract code
- [x] I have NOT added React Native or
Expo-specific code
- [x] I have NOT hardcoded hex color values
(use Tailwind classes or constants/colors.ts)
- [x] All icons are from lucide-react only
- [x] No API calls made directly in page files
(use services/ layer only)

## Type of change

- [x] Bug fix
- [ ] New page or component
- [x] Service layer addition
- [ ] Styling or responsive fix
- [ ] Accessibility improvement
- [ ] Performance improvement

## Testing

- [x] npm run build passes with zero errors
- [x] npm run lint passes with zero errors
- [x] Loading, error, and empty states handled
- [ ] Page tested on mobile viewport (375px)
- [ ] No console errors in browser

## Context files reviewed

- [x] context/architecture-context.md
- [x] context/code-standards.md
- [ ] context/progress-tracker.md updated

## Mandatory before requesting review

Running these must all exit 0:
- [x] npm run lint — 0 errors
- [x] npm test — 36 tests passed, 0 failures
- [x] npm run build — 0 errors

---

## What changed

**`src/pages/SponsorOnboarding.tsx`** — Replaced the `StepDeposit` stub with a real deposit flow:

- **Amount input** with `$10` minimum validation and inline error messaging (`aria-invalid`, `role="alert"`)
- **Unsigned XDR** fetched via `sponsorsService.deposit(amount)`
- **Freighter signing** handled by the existing `useTransaction` hook (which calls `@stellar/freighter-api`'s `signTransaction`)
- **Signed XDR submission** via `transactionsService.submit(signedXdr, 'deposit')`
- **Success state** showing deposit amount, transaction hash, and a Stellar Expert link
- **Onboarding completion** — `onComplete` fires after a successful deposit, setting `onboardingComplete: true` and navigating to `/sponsors`
- **Error state** displayed inline using the existing error card pattern from the Sponsors dashboard
- **Disconnected state** still shows "Connect Freighter Wallet" with Freighter download link and GrantFox fallback

All patterns mirror the existing deposit flow in `src/pages/Sponsors.tsx` exactly — `useTransaction`, `useToast`, `invalidatesubtree.pool`, and the success card layout.

### Files changed

| File | Change |
|------|--------|
| `src/pages/SponsorOnboarding.tsx` | Replaced `StepDeposit` stub with full deposit flow (+ imports) |
75 changes: 75 additions & 0 deletions PR_SPONSOR_ONBOARDING_DEPOSIT.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,75 @@
# PR: Fix Sponsor Onboarding — Wire StepDeposit to Real Deposit XDR Flow

## Summary

Closes #[issue number]

Replace the stub `StepDeposit` component in the sponsor onboarding wizard with a fully functional deposit flow. Sponsors completing the 4-step onboarding can now actually deposit USDC — amount input with $10 minimum validation, unsigned XDR fetched from the API, signed via Freighter, submitted on-chain, and a success state with a Stellar Expert link. On success, onboarding is marked complete and the sponsor is navigated to the dashboard.

## This repo is for the React web app only

This app targets sponsors, vendors, and mentors. It does NOT serve learners. Learner features belong in StepFi-App.

- [x] Changes are inside `src/`
- [x] No Rust, Soroban, or contract code
- [x] No React Native or Expo-specific code
- [x] No hardcoded hex color values (Tailwind classes only)
- [x] All icons from `lucide-react`
- [x] No API calls directly in page files (uses `services/` layer)

## Type of change

- [x] Bug fix
- [ ] New page or component
- [x] Service layer addition
- [ ] Styling or responsive fix
- [ ] Accessibility improvement
- [ ] Performance improvement

## Testing

- [x] `npm run build` — 0 errors
- [x] `npm run lint` — 0 errors
- [x] `npm test` — 36 tests passed, 0 failures
- [ ] Mobile viewport (375px) tested
- [ ] Browser console checked

## Context files reviewed

- [x] `context/architecture-context.md`
- [x] `context/code-standards.md`
- [ ] `context/progress-tracker.md` updated

---

## What changed

**`src/pages/SponsorOnboarding.tsx`** — Replaced the `StepDeposit` stub (lines 267–316) with a real deposit flow:

| Feature | Implementation |
|---------|---------------|
| **Amount input** | Numeric input with `$10` minimum validation, inline error messaging (`aria-invalid`, `role="alert"`) |
| **XDR fetch** | `sponsorsService.deposit(amount)` returns `UnsignedTransaction<DepositPreview>` |
| **Freighter signing** | Delegated to the existing `useTransaction` hook which calls `@stellar/freighter-api`'s `signTransaction` |
| **Submission** | `transactionsService.submit(signedXdr, 'deposit')` posts to `POST /transactions/submit` |
| **Success state** | Card showing deposit amount, transaction hash, and a clickable Stellar Expert link |
| **Onboarding completion** | `onComplete` fires after deposit success → sets `onboardingComplete: true` → navigates to `/sponsors` |
| **Error state** | Inline error card using the same pattern as the Sponsors dashboard |
| **Disconnected state** | "Connect Freighter Wallet" button with download link + GrantFox fallback |

All patterns mirror the existing deposit flow in `src/pages/Sponsors.tsx` — `useTransaction`, `useToast`, `invalidatesubtree.pool`, and the success card layout.

### Acceptance criteria met

- [x] Deposit amount input with $10 minimum validation
- [x] Unsigned XDR fetched from API
- [x] XDR signed via Freighter
- [x] Signed XDR submitted
- [x] Success state shown with Stellar Expert link
- [x] Onboarding marked complete after successful deposit

### Files changed

| File | Change |
|------|--------|
| `src/pages/SponsorOnboarding.tsx` | Replaced `StepDeposit` stub with full deposit flow (+ 5 new imports) |
Loading
Loading