Frontend Application — Business and Lender Portal with Wallet Connect

[samjay8]

Title: feat: Frontend Application — Business and Lender Portal with Wallet Connect

Labels: frontend, core, priority-high

Description:
VaultLink has no user interface. This issue builds the full
Next.js frontend that businesses and lenders use to interact
with the protocol, including Freighter wallet connection and
role-based dashboards.

What Needs to Be Done:

Setup:

• apps/frontend/ using Next.js 14 + TypeScript + Tailwind CSS
• @stellar/freighter-api for wallet connection
• Axios API client configured with JWT interceptor
• React Query for server state management
• JWT stored in httpOnly cookies

Pages:

• / — Landing page with wallet connect and protocol overview
• /auth — Wallet connect, challenge/verify flow
• /dashboard — Role-based redirect after login
• /invoices — Business: list all invoices with status badges
• /invoices/new — Business: create invoice form with file upload
• /invoices/:id — Business: invoice detail, offers received
• /marketplace — Lender: browse available invoices with filters
• /marketplace/:id — Lender: invoice detail, submit offer form
• /portfolio — Lender: summary, positions, yield history charts
• /webhooks — Manage webhook endpoints
• /api-keys — Manage API keys
• /settings — Profile and preferences

Components:

• WalletConnectButton — Freighter integration
• InvoiceCard — status badge, amount, due date, actions
• OfferForm — amount, yield rate, submit button
• PortfolioSummary — deployed, earned, default rate cards
• MarketplaceFilters — filter sidebar for marketplace
• StatusBadge — colored pill for invoice/offer status

Key Files:

• apps/frontend/src/pages/
• apps/frontend/src/components/
• apps/frontend/src/lib/api-client.ts
• apps/frontend/src/hooks/useWallet.ts
• apps/frontend/src/hooks/useInvoices.ts

Acceptance Criteria:

• Business can connect wallet, create and submit an invoice
• Lender can browse marketplace and submit a financing offer
• All pages responsive on mobile and desktop
• Wallet disconnect clears JWT session
• Role-based routing — businesses see /invoices, lenders see /marketplace
• Loading and error states handled on all data-fetching pages
• Forms validate inputs before submission

Branch: feat/frontend-portal

Commit: feat(frontend): add Next.js frontend with Freighter wallet connect and role-based dashboards