# juansilv19/tasks-nextjs-supabase architecture

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

- Interactive diagram: https://gitdiagram.com/juansilv19/tasks-nextjs-supabase
- Repository: https://github.com/juansilv19/tasks-nextjs-supabase

## Overview

This is a Next.js application with Supabase-backed authentication and a dashboard; the repository name suggests task management, but the sampled sources and generic README do not establish task workflows. The visible user flow is authentication forms submitting credentials to server actions, with Supabase managing sessions and an email callback confirming OTPs before redirecting. The profile lookup provides a separate authenticated-user data layer. Dashboard behavior and password recovery implementation are not shown in the sampled source, so their wiring is left unspecified.

Main entry points: [`lib/supabase/server.ts`](https://github.com/juansilv19/tasks-nextjs-supabase/blob/main/lib/supabase/server.ts) (Server client), [`components/auth/AuthForm.tsx`](https://github.com/juansilv19/tasks-nextjs-supabase/blob/main/components/auth/AuthForm.tsx) (Auth selector), [`actions/auth/get-user.ts`](https://github.com/juansilv19/tasks-nextjs-supabase/blob/main/actions/auth/get-user.ts) (Profile lookup), [`app/page.tsx`](https://github.com/juansilv19/tasks-nextjs-supabase/blob/main/app/page.tsx) (Home page)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_ui["Application UI"]
  node_home["Home page<br/>[page.tsx]"]
  node_authform["Auth selector<br/>[AuthForm.tsx]"]
  node_signin["Sign-in form<br/>[SignInForm.tsx]"]
  node_signup["Sign-up form<br/>[SignUpForm.tsx]"]
  node_recover["Recovery form"]
  node_dashboard["Dashboard<br/>[page.tsx]"]
end

subgraph group_auth["Authentication"]
  node_login["Login action<br/>[auth.ts]"]
  node_register["Signup action<br/>[auth.ts]"]
  node_callback["OTP callback<br/>[route.ts]"]
  node_profile["Profile lookup<br/>[get-user.ts]"]
end

subgraph group_data["Supabase access"]
  node_sessionproxy["Session proxy<br/>[proxy.ts]"]
  node_supaproxy["Session refresh<br/>[proxy.ts]"]
  node_serverclient["Server client<br/>[server.ts]"]
  node_browserclient["Browser client<br/>[client.ts]"]
end

node_visitor(("Visitor"))
node_supabase{{"Supabase Auth"}}
node_profiles[("Profiles table")]

node_visitor -->|"opens"| node_home
node_home -->|"renders"| node_authform
node_authform -->|"selects"| node_signin
node_authform -->|"selects"| node_signup
node_authform -->|"selects"| node_recover
node_signin -->|"submits credentials"| node_login
node_signup -->|"submits details"| node_register
node_login -->|"creates client"| node_serverclient
node_register -->|"creates client"| node_serverclient
node_callback -->|"creates client"| node_serverclient
node_serverclient -->|"auth requests"| node_supabase
node_supabase -->|"session cookies"| node_serverclient
node_sessionproxy -->|"refreshes session"| node_supaproxy
node_supaproxy -->|"updates session"| node_supabase
node_profile -->|"creates client"| node_serverclient
node_profile -->|"reads profile"| node_profiles
node_browserclient -->|"auth requests"| node_supabase

click node_home "https://github.com/juansilv19/tasks-nextjs-supabase/blob/main/app/page.tsx"
click node_authform "https://github.com/juansilv19/tasks-nextjs-supabase/blob/main/components/auth/AuthForm.tsx"
click node_signin "https://github.com/juansilv19/tasks-nextjs-supabase/blob/main/components/auth/SignInForm.tsx"
click node_signup "https://github.com/juansilv19/tasks-nextjs-supabase/blob/main/components/auth/SignUpForm.tsx"
click node_recover "https://github.com/juansilv19/tasks-nextjs-supabase/blob/main/components/auth/RecoverPasswordForm.tsx"
click node_dashboard "https://github.com/juansilv19/tasks-nextjs-supabase/blob/main/app/dashboard/page.tsx"
click node_login "https://github.com/juansilv19/tasks-nextjs-supabase/blob/main/actions/auth/auth.ts"
click node_register "https://github.com/juansilv19/tasks-nextjs-supabase/blob/main/actions/auth/auth.ts"
click node_callback "https://github.com/juansilv19/tasks-nextjs-supabase/blob/main/app/api/auth/callback/route.ts"
click node_profile "https://github.com/juansilv19/tasks-nextjs-supabase/blob/main/actions/auth/get-user.ts"
click node_sessionproxy "https://github.com/juansilv19/tasks-nextjs-supabase/blob/main/proxy.ts"
click node_supaproxy "https://github.com/juansilv19/tasks-nextjs-supabase/blob/main/lib/supabase/proxy.ts"
click node_serverclient "https://github.com/juansilv19/tasks-nextjs-supabase/blob/main/lib/supabase/server.ts"
click node_browserclient "https://github.com/juansilv19/tasks-nextjs-supabase/blob/main/lib/supabase/client.ts"

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_home,node_authform,node_signin,node_signup,node_recover,node_dashboard toneBlue
class node_login,node_register,node_callback,node_profile,node_profiles toneAmber
class node_sessionproxy,node_supaproxy,node_serverclient,node_browserclient toneMint
class node_visitor,node_supabase toneIndigo
```

## Components

### Application UI

- [Home page](https://github.com/juansilv19/tasks-nextjs-supabase/blob/main/app/page.tsx): `app/page.tsx`
- [Auth selector](https://github.com/juansilv19/tasks-nextjs-supabase/blob/main/components/auth/AuthForm.tsx): `components/auth/AuthForm.tsx`
- [Sign-in form](https://github.com/juansilv19/tasks-nextjs-supabase/blob/main/components/auth/SignInForm.tsx): `components/auth/SignInForm.tsx`
- [Sign-up form](https://github.com/juansilv19/tasks-nextjs-supabase/blob/main/components/auth/SignUpForm.tsx): `components/auth/SignUpForm.tsx`
- [Recovery form](https://github.com/juansilv19/tasks-nextjs-supabase/blob/main/components/auth/RecoverPasswordForm.tsx): `components/auth/RecoverPasswordForm.tsx`
- [Dashboard](https://github.com/juansilv19/tasks-nextjs-supabase/blob/main/app/dashboard/page.tsx): `app/dashboard/page.tsx`

### Authentication

- [Login action](https://github.com/juansilv19/tasks-nextjs-supabase/blob/main/actions/auth/auth.ts): `actions/auth/auth.ts`
- [Signup action](https://github.com/juansilv19/tasks-nextjs-supabase/blob/main/actions/auth/auth.ts): `actions/auth/auth.ts`
- [OTP callback](https://github.com/juansilv19/tasks-nextjs-supabase/blob/main/app/api/auth/callback/route.ts): `app/api/auth/callback/route.ts`
- [Profile lookup](https://github.com/juansilv19/tasks-nextjs-supabase/blob/main/actions/auth/get-user.ts): `actions/auth/get-user.ts`

### Supabase access

- [Session proxy](https://github.com/juansilv19/tasks-nextjs-supabase/blob/main/proxy.ts): `proxy.ts`
- [Session refresh](https://github.com/juansilv19/tasks-nextjs-supabase/blob/main/lib/supabase/proxy.ts): `lib/supabase/proxy.ts`
- [Server client](https://github.com/juansilv19/tasks-nextjs-supabase/blob/main/lib/supabase/server.ts): `lib/supabase/server.ts`
- [Browser client](https://github.com/juansilv19/tasks-nextjs-supabase/blob/main/lib/supabase/client.ts): `lib/supabase/client.ts`

### Other components

- **Visitor**
- **Supabase Auth**
- **Profiles table**

## Connections

- Visitor → Home page: opens
- Home page → Auth selector: renders
- Auth selector → Sign-in form: selects
- Auth selector → Sign-up form: selects
- Auth selector → Recovery form: selects
- Sign-in form → Login action: submits credentials
- Sign-up form → Signup action: submits details
- Login action → Server client: creates client
- Signup action → Server client: creates client
- OTP callback → Server client: creates client
- Server client → Supabase Auth: auth requests
- Supabase Auth → Server client: session cookies
- Session proxy → Session refresh: refreshes session
- Session refresh → Supabase Auth: updates session
- Profile lookup → Server client: creates client
- Profile lookup → Profiles table: reads profile
- Browser client → Supabase Auth: auth requests