# markangelguevarra/gigpay architecture

> Architecture diagram of the GitHub repository markangelguevarra/gigpay, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-09-29). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/markangelguevarra/gigpay
- Repository: https://github.com/markangelguevarra/gigpay

## Overview

GigPay is a dual-sided freelance marketplace centered on escrow tasks: users authenticate and connect a wallet, clients post and sign funding actions, freelancers accept work, and clients approve completion to release funds. Supabase supplies task persistence and realtime updates; the Soroban contract implements on-chain funding, approval, and task lookup. The README also describes a fee-savings widget and human-verification puzzle, but their source wiring was not sampled. The map follows supplied source excerpts and documented capabilities; unsampled details are represented only at the existing directory level.

Main entry points: [`src/App.jsx`](https://github.com/markangelguevarra/gigpay/blob/main/src/App.jsx) (App Router), [`src/context/TaskContext.jsx`](https://github.com/markangelguevarra/gigpay/blob/main/src/context/TaskContext.jsx) (Task Context), [`src/lib/stellar.js`](https://github.com/markangelguevarra/gigpay/blob/main/src/lib/stellar.js) (Stellar Wallet Utility), [`src/pages/AuthPage.jsx`](https://github.com/markangelguevarra/gigpay/blob/main/src/pages/AuthPage.jsx) (Auth Page)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_access["Access and Identity"]
  node_app["App Router<br/>[App.jsx]"]
  node_authui["Auth Page<br/>[AuthPage.jsx]"]
  node_authstate["Auth Context<br/>[AuthContext.jsx]"]
  node_profile["User Profile<br/>[ProfilePage.jsx]"]
  node_authservice["Supabase Auth"]
end

subgraph group_market["Task Marketplace"]
  node_clientdash["Client Dashboard"]
  node_freelancerdash["Freelancer Dashboard"]
  node_taskstate["Task Context<br/>[TaskContext.jsx]"]
  node_progress["Task Progress<br/>[TaskProgress.jsx]"]
  node_supabaseclient["Supabase Client<br/>[supabase.js]"]
  node_taskdb[("Task Database")]
end

subgraph group_payments["Escrow Payments"]
  node_stellarutil["Stellar Wallet Utility<br/>[stellar.js]"]
  node_freighter["Freighter Wallet"]
  node_horizon["Stellar Horizon"]
  node_contract["Soroban Escrow<br/>[lib.rs]"]
  node_chainstate[("Contract Task Storage<br/>[lib.rs]")]
  node_token["Token Contract"]
end

subgraph group_experience["User Experience"]
  node_landing["Landing Page<br/>[LandingPage.jsx]"]
  node_navbar["Navigation<br/>[Navbar.jsx]"]
  node_captcha["Slide Verification<br/>[SlideToVerify.jsx]"]
  node_advantage["Fee Savings Widget"]
  node_toast["Toast Notifications<br/>[ToastContext.jsx]"]
end

node_user(("Client or Freelancer"))

node_user -->|"opens"| node_app
node_app -->|"routes"| node_landing
node_app -->|"routes"| node_authui
node_app -->|"routes"| node_clientdash
node_app -->|"routes"| node_freelancerdash
node_app -->|"routes"| node_profile
node_app -->|"renders"| node_navbar
node_authui -->|"signs in"| node_authstate
node_authui -->|"notifies"| node_toast
node_authstate -->|"authenticates"| node_authservice
node_navbar -->|"connects wallet"| node_authstate
node_authstate -->|"connects"| node_stellarutil
node_stellarutil -->|"requests access"| node_freighter
node_clientdash -->|"creates and approves"| node_taskstate
node_freelancerdash -->|"accepts work"| node_taskstate
node_clientdash -->|"displays status"| node_progress
node_freelancerdash -->|"displays status"| node_progress
node_taskstate -->|"reads and writes"| node_supabaseclient
node_supabaseclient -->|"queries and subscribes"| node_taskdb
node_taskdb -->|"sends realtime changes"| node_supabaseclient
node_taskstate -->|"requests signatures"| node_stellarutil
node_stellarutil -->|"loads account"| node_horizon
node_stellarutil -->|"signs transaction"| node_freighter
node_contract -->|"stores task state"| node_chainstate
node_contract -->|"transfers funds"| node_token
node_landing -.->|"presents savings"| node_advantage
node_authui -.->|"verifies human"| node_captcha
node_taskstate -->|"reports realtime events"| node_toast

click node_app "https://github.com/markangelguevarra/gigpay/blob/main/src/App.jsx"
click node_authui "https://github.com/markangelguevarra/gigpay/blob/main/src/pages/AuthPage.jsx"
click node_authstate "https://github.com/markangelguevarra/gigpay/blob/main/src/context/AuthContext.jsx"
click node_profile "https://github.com/markangelguevarra/gigpay/blob/main/src/pages/ProfilePage.jsx"
click node_landing "https://github.com/markangelguevarra/gigpay/blob/main/src/pages/LandingPage.jsx"
click node_navbar "https://github.com/markangelguevarra/gigpay/blob/main/src/components/Navbar.jsx"
click node_clientdash "https://github.com/markangelguevarra/gigpay/blob/main/src/pages/ClientDashboard.jsx"
click node_freelancerdash "https://github.com/markangelguevarra/gigpay/blob/main/src/pages/FreelancerDashboard.jsx"
click node_taskstate "https://github.com/markangelguevarra/gigpay/blob/main/src/context/TaskContext.jsx"
click node_progress "https://github.com/markangelguevarra/gigpay/blob/main/src/components/TaskProgress.jsx"
click node_captcha "https://github.com/markangelguevarra/gigpay/blob/main/src/components/SlideToVerify.jsx"
click node_advantage "https://github.com/markangelguevarra/gigpay/tree/main/src/pages"
click node_toast "https://github.com/markangelguevarra/gigpay/blob/main/src/context/ToastContext.jsx"
click node_supabaseclient "https://github.com/markangelguevarra/gigpay/blob/main/src/lib/supabase.js"
click node_stellarutil "https://github.com/markangelguevarra/gigpay/blob/main/src/lib/stellar.js"
click node_contract "https://github.com/markangelguevarra/gigpay/blob/main/contracts/gigpay_escrow/src/lib.rs"
click node_chainstate "https://github.com/markangelguevarra/gigpay/blob/main/contracts/gigpay_escrow/src/lib.rs"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_app,node_authui,node_authstate,node_profile,node_authservice,node_user toneBlue
class node_clientdash,node_freelancerdash,node_taskstate,node_progress,node_supabaseclient,node_taskdb toneAmber
class node_stellarutil,node_freighter,node_horizon,node_contract,node_chainstate,node_token toneMint
class node_landing,node_navbar,node_captcha,node_advantage,node_toast toneRose
```

## Components

### Access and Identity

- [App Router](https://github.com/markangelguevarra/gigpay/blob/main/src/App.jsx): `src/App.jsx`
- [Auth Page](https://github.com/markangelguevarra/gigpay/blob/main/src/pages/AuthPage.jsx): `src/pages/AuthPage.jsx`
- [Auth Context](https://github.com/markangelguevarra/gigpay/blob/main/src/context/AuthContext.jsx): `src/context/AuthContext.jsx`
- [User Profile](https://github.com/markangelguevarra/gigpay/blob/main/src/pages/ProfilePage.jsx): `src/pages/ProfilePage.jsx`
- **Supabase Auth**

### Task Marketplace

- [Client Dashboard](https://github.com/markangelguevarra/gigpay/blob/main/src/pages/ClientDashboard.jsx): `src/pages/ClientDashboard.jsx`
- [Freelancer Dashboard](https://github.com/markangelguevarra/gigpay/blob/main/src/pages/FreelancerDashboard.jsx): `src/pages/FreelancerDashboard.jsx`
- [Task Context](https://github.com/markangelguevarra/gigpay/blob/main/src/context/TaskContext.jsx): `src/context/TaskContext.jsx`
- [Task Progress](https://github.com/markangelguevarra/gigpay/blob/main/src/components/TaskProgress.jsx): `src/components/TaskProgress.jsx`
- [Supabase Client](https://github.com/markangelguevarra/gigpay/blob/main/src/lib/supabase.js): `src/lib/supabase.js`
- **Task Database**

### Escrow Payments

- [Stellar Wallet Utility](https://github.com/markangelguevarra/gigpay/blob/main/src/lib/stellar.js): `src/lib/stellar.js`
- **Freighter Wallet**
- **Stellar Horizon**
- [Soroban Escrow](https://github.com/markangelguevarra/gigpay/blob/main/contracts/gigpay_escrow/src/lib.rs): `contracts/gigpay_escrow/src/lib.rs`
- [Contract Task Storage](https://github.com/markangelguevarra/gigpay/blob/main/contracts/gigpay_escrow/src/lib.rs): `contracts/gigpay_escrow/src/lib.rs`
- **Token Contract**

### User Experience

- [Landing Page](https://github.com/markangelguevarra/gigpay/blob/main/src/pages/LandingPage.jsx): `src/pages/LandingPage.jsx`
- [Navigation](https://github.com/markangelguevarra/gigpay/blob/main/src/components/Navbar.jsx): `src/components/Navbar.jsx`
- [Slide Verification](https://github.com/markangelguevarra/gigpay/blob/main/src/components/SlideToVerify.jsx): `src/components/SlideToVerify.jsx`
- [Fee Savings Widget](https://github.com/markangelguevarra/gigpay/tree/main/src/pages): `src/pages`
- [Toast Notifications](https://github.com/markangelguevarra/gigpay/blob/main/src/context/ToastContext.jsx): `src/context/ToastContext.jsx`

### Other components

- **Client or Freelancer**

## Connections

- Client or Freelancer → App Router: opens
- App Router → Landing Page: routes
- App Router → Auth Page: routes
- App Router → Client Dashboard: routes
- App Router → Freelancer Dashboard: routes
- App Router → User Profile: routes
- App Router → Navigation: renders
- Auth Page → Auth Context: signs in
- Auth Page → Toast Notifications: notifies
- Auth Context → Supabase Auth: authenticates
- Navigation → Auth Context: connects wallet
- Auth Context → Stellar Wallet Utility: connects
- Stellar Wallet Utility → Freighter Wallet: requests access
- Client Dashboard → Task Context: creates and approves
- Freelancer Dashboard → Task Context: accepts work
- Client Dashboard → Task Progress: displays status
- Freelancer Dashboard → Task Progress: displays status
- Task Context → Supabase Client: reads and writes
- Supabase Client → Task Database: queries and subscribes
- Task Database → Supabase Client: sends realtime changes
- Task Context → Stellar Wallet Utility: requests signatures
- Stellar Wallet Utility → Stellar Horizon: loads account
- Stellar Wallet Utility → Freighter Wallet: signs transaction
- Soroban Escrow → Contract Task Storage: stores task state
- Soroban Escrow → Token Contract: transfers funds
- Landing Page → Fee Savings Widget: presents savings
- Auth Page → Slide Verification: verifies human
- Task Context → Toast Notifications: reports realtime events