Add E2E tests for critical user flows with Playwright

[pragmaticAweds]

Context

The project has 12 unit/integration test files but zero end-to-end tests. Critical user journeys — wallet connection, stream creation, distribution submission, offramp flow — are completely untested at the integration level. A single broken import or missing provider can break an entire page, and unit tests won't catch it. E2E tests provide the safety net for shipping with confidence.

What Success Looks Like

• Playwright is set up and configured for the Next.js app
• E2E tests cover these critical flows:
  1. Wallet connection — user opens modal, selects wallet, sees address in navbar
  2. Payment stream creation — user fills form, sees summary, confirms transaction
  3. Distribution flow — user adds recipients (manual + CSV), submits distribution
  4. History page — user views transactions, filters by type, exports CSV
  5. Navigation — sidebar links work, pages load without errors
• Tests run in CI and locally with pnpm test:e2e
• Wallet interactions are mocked (no real browser extensions needed)

Implementation Guidance

• Install Playwright: pnpm add -D @playwright/test in the apps/web package
• Create apps/web/playwright.config.ts with the Next.js dev server as the web server
• Create apps/web/e2e/ directory for test files
• Mock the wallet context by injecting test state via a custom provider or page.addInitScript()
• Start with navigation and page-load tests (simplest) before tackling transaction flows
• Use Playwright's page.route() to intercept and mock RPC/API calls
• Add a test:e2e script to package.json
• Consider using Playwright's codegen (npx playwright codegen) to bootstrap test recording