# sinungp/makna-kanta architecture

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

- Interactive diagram: https://gitdiagram.com/sinungp/makna-kanta
- Repository: https://github.com/sinungp/makna-kanta

## Overview

MaknaKanta is a photography-studio site with an editable public landing page, an admin CMS for clients/content/media, and a client portal for ready-to-view Google Drive galleries. The client-management flow creates accounts and attaches Drive folders; clients authenticate, request an owned ready folder’s images, and view them through a same-origin image proxy. Media uploads enter Supabase Storage and a thumbnail-job queue for worker processing. Several routes and worker files are represented from their exact tree paths; their internal behavior was not sampled, so uncertain calls are omitted.

Main entry points: [`Main-App/lib/supabase/admin.ts`](https://github.com/sinungp/makna-kanta/blob/main/Main-App/lib/supabase/admin.ts) (Supabase data and storage), [`Main-App/app/page.tsx`](https://github.com/sinungp/makna-kanta/blob/main/Main-App/app/page.tsx) (Landing page), [`Main-App/app/admin/dashboard/layout.tsx`](https://github.com/sinungp/makna-kanta/blob/main/Main-App/app/admin/dashboard/layout.tsx) (Admin dashboard), [`Main-App/components/admin/ClientsManager.tsx`](https://github.com/sinungp/makna-kanta/blob/main/Main-App/components/admin/ClientsManager.tsx) (Client manager)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_public["Public site"]
  node_landing["Landing page<br/>[page.tsx]"]
  node_landing_sections["Landing sections"]
end

subgraph group_admin["Admin CMS"]
  node_admin_login["Admin login<br/>[page.tsx]"]
  node_admin_shell["Admin dashboard<br/>[layout.tsx]"]
  node_clients_manager["Client manager<br/>[ClientsManager.tsx]"]
  node_content_editor["Content editor<br/>[ContentEditor.tsx]"]
  node_media_manager["Media manager<br/>[MediaManager.tsx]"]
end

subgraph group_portal["Client portal"]
  node_client_login["Client login<br/>[page.tsx]"]
  node_client_dashboard["Client dashboard<br/>[page.tsx]"]
end

subgraph group_services["Services and state"]
  node_site_content["Site content<br/>[site-content.ts]"]
  node_admin_login_api["Admin login API<br/>[route.ts]"]
  node_client_api["Client account API<br/>[route.ts]"]
  node_client_record_api["Client record API<br/>[route.ts]"]
  node_drive_link_api["Drive link APIs"]
  node_content_api["Content API<br/>[route.ts]"]
  node_upload_api["Media upload API<br/>[route.ts]"]
  node_media_delete_api["Media delete API<br/>[route.ts]"]
  node_gallery_api["Client gallery API<br/>[route.ts]"]
  node_drive_image_api["Drive image proxy<br/>[route.ts]"]
  node_auth["Supabase Auth"]
  node_supabase[("Supabase data and storage<br/>[admin.ts]")]
  node_drive_lib["Drive gallery access<br/>[drive.ts]"]
  node_thumbnail_jobs["Thumbnail jobs"]
  node_worker["Thumbnail worker<br/>[index.ts]"]
end

node_visitor(("Site visitor"))
node_admin_actor(("Admin"))
node_client_actor(("Client"))
node_google_drive["Google Drive"]

node_visitor -->|"opens"| node_landing
node_landing -->|"renders"| node_landing_sections
node_landing -->|"loads content"| node_site_content
node_admin_actor -->|"signs in"| node_admin_login
node_admin_login -->|"submits credentials"| node_admin_login_api
node_admin_login_api -->|"verifies credentials"| node_auth
node_admin_login_api -->|"checks profile"| node_supabase
node_admin_actor -->|"manages site"| node_admin_shell
node_admin_shell -->|"opens clients"| node_clients_manager
node_clients_manager -->|"creates client"| node_client_api
node_client_api -->|"creates account"| node_auth
node_client_api -->|"writes profile and client"| node_supabase
node_clients_manager -->|"deletes client"| node_client_record_api
node_client_record_api -->|"deletes client record"| node_supabase
node_client_record_api -->|"deletes account"| node_auth
node_clients_manager -->|"manages folder links"| node_drive_link_api
node_drive_link_api -->|"writes folder links"| node_supabase
node_admin_shell -->|"opens editor"| node_content_editor
node_content_editor -->|"saves content"| node_content_api
node_content_api -->|"upserts content"| node_supabase
node_landing -->|"reads landing content"| node_supabase
node_admin_shell -->|"opens media"| node_media_manager
node_media_manager -->|"uploads media"| node_upload_api
node_upload_api -->|"stores asset and original"| node_supabase
node_upload_api -->|"enqueues job"| node_thumbnail_jobs
node_media_manager -->|"deletes media"| node_media_delete_api
node_media_delete_api -->|"removes asset and files"| node_supabase
node_client_actor -->|"signs in"| node_client_login
node_client_login -->|"authenticates"| node_auth
node_client_actor -->|"opens portal"| node_client_dashboard
node_client_dashboard -->|"requests gallery"| node_gallery_api
node_gallery_api -->|"checks session"| node_auth
node_gallery_api -->|"checks ownership and readiness"| node_supabase
node_gallery_api -->|"lists folder images"| node_drive_lib
node_drive_lib -->|"lists images"| node_google_drive
node_client_dashboard -->|"loads image bytes"| node_drive_image_api
node_drive_image_api -->|"fetches image"| node_google_drive
node_worker -->|"processes jobs"| node_thumbnail_jobs
node_worker -->|"updates thumbnails"| node_supabase

click node_landing "https://github.com/sinungp/makna-kanta/blob/main/Main-App/app/page.tsx"
click node_landing_sections "https://github.com/sinungp/makna-kanta/tree/main/Main-App/components/landing"
click node_site_content "https://github.com/sinungp/makna-kanta/blob/main/Main-App/lib/site-content.ts"
click node_admin_login "https://github.com/sinungp/makna-kanta/blob/main/Main-App/app/admin/login/page.tsx"
click node_admin_login_api "https://github.com/sinungp/makna-kanta/blob/main/Main-App/app/api/admin/login/route.ts"
click node_admin_shell "https://github.com/sinungp/makna-kanta/blob/main/Main-App/app/admin/dashboard/layout.tsx"
click node_clients_manager "https://github.com/sinungp/makna-kanta/blob/main/Main-App/components/admin/ClientsManager.tsx"
click node_client_api "https://github.com/sinungp/makna-kanta/blob/main/Main-App/app/api/clients/route.ts"
click node_client_record_api "https://github.com/sinungp/makna-kanta/blob/main/Main-App/app/api/clients/%5Bid%5D/route.ts"
click node_drive_link_api "https://github.com/sinungp/makna-kanta/tree/main/Main-App/app/api/clients/%5Bid%5D/links"
click node_content_editor "https://github.com/sinungp/makna-kanta/blob/main/Main-App/components/admin/ContentEditor.tsx"
click node_content_api "https://github.com/sinungp/makna-kanta/blob/main/Main-App/app/api/content/route.ts"
click node_media_manager "https://github.com/sinungp/makna-kanta/blob/main/Main-App/components/admin/MediaManager.tsx"
click node_upload_api "https://github.com/sinungp/makna-kanta/blob/main/Main-App/app/api/media/upload/route.ts"
click node_media_delete_api "https://github.com/sinungp/makna-kanta/blob/main/Main-App/app/api/media/%5Bid%5D/route.ts"
click node_client_login "https://github.com/sinungp/makna-kanta/blob/main/Main-App/app/client/login/page.tsx"
click node_client_dashboard "https://github.com/sinungp/makna-kanta/blob/main/Main-App/app/client/dashboard/page.tsx"
click node_gallery_api "https://github.com/sinungp/makna-kanta/blob/main/Main-App/app/api/client/gallery/route.ts"
click node_drive_image_api "https://github.com/sinungp/makna-kanta/blob/main/Main-App/app/api/client/drive-image/route.ts"
click node_supabase "https://github.com/sinungp/makna-kanta/blob/main/Main-App/lib/supabase/admin.ts"
click node_drive_lib "https://github.com/sinungp/makna-kanta/blob/main/Main-App/lib/drive.ts"
click node_worker "https://github.com/sinungp/makna-kanta/blob/main/Main-App/worker/src/index.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_landing,node_landing_sections,node_client_actor toneBlue
class node_admin_login,node_admin_shell,node_clients_manager,node_content_editor,node_media_manager toneAmber
class node_client_login,node_client_dashboard toneMint
class node_site_content,node_admin_login_api,node_client_api,node_client_record_api,node_drive_link_api,node_content_api,node_upload_api,node_media_delete_api,node_gallery_api,node_drive_image_api,node_auth,node_supabase,node_drive_lib,node_thumbnail_jobs,node_worker toneRose
class node_visitor,node_admin_actor,node_google_drive toneIndigo
```

## Components

### Public site

- [Landing page](https://github.com/sinungp/makna-kanta/blob/main/Main-App/app/page.tsx): `Main-App/app/page.tsx`
- [Landing sections](https://github.com/sinungp/makna-kanta/tree/main/Main-App/components/landing): `Main-App/components/landing`

### Admin CMS

- [Admin login](https://github.com/sinungp/makna-kanta/blob/main/Main-App/app/admin/login/page.tsx): `Main-App/app/admin/login/page.tsx`
- [Admin dashboard](https://github.com/sinungp/makna-kanta/blob/main/Main-App/app/admin/dashboard/layout.tsx): `Main-App/app/admin/dashboard/layout.tsx`
- [Client manager](https://github.com/sinungp/makna-kanta/blob/main/Main-App/components/admin/ClientsManager.tsx): `Main-App/components/admin/ClientsManager.tsx`
- [Content editor](https://github.com/sinungp/makna-kanta/blob/main/Main-App/components/admin/ContentEditor.tsx): `Main-App/components/admin/ContentEditor.tsx`
- [Media manager](https://github.com/sinungp/makna-kanta/blob/main/Main-App/components/admin/MediaManager.tsx): `Main-App/components/admin/MediaManager.tsx`

### Client portal

- [Client login](https://github.com/sinungp/makna-kanta/blob/main/Main-App/app/client/login/page.tsx): `Main-App/app/client/login/page.tsx`
- [Client dashboard](https://github.com/sinungp/makna-kanta/blob/main/Main-App/app/client/dashboard/page.tsx): `Main-App/app/client/dashboard/page.tsx`

### Services and state

- [Site content](https://github.com/sinungp/makna-kanta/blob/main/Main-App/lib/site-content.ts): `Main-App/lib/site-content.ts`
- [Admin login API](https://github.com/sinungp/makna-kanta/blob/main/Main-App/app/api/admin/login/route.ts): `Main-App/app/api/admin/login/route.ts`
- [Client account API](https://github.com/sinungp/makna-kanta/blob/main/Main-App/app/api/clients/route.ts): `Main-App/app/api/clients/route.ts`
- [Client record API](https://github.com/sinungp/makna-kanta/blob/main/Main-App/app/api/clients/%5Bid%5D/route.ts): `Main-App/app/api/clients/[id]/route.ts`
- [Drive link APIs](https://github.com/sinungp/makna-kanta/tree/main/Main-App/app/api/clients/%5Bid%5D/links): `Main-App/app/api/clients/[id]/links`
- [Content API](https://github.com/sinungp/makna-kanta/blob/main/Main-App/app/api/content/route.ts): `Main-App/app/api/content/route.ts`
- [Media upload API](https://github.com/sinungp/makna-kanta/blob/main/Main-App/app/api/media/upload/route.ts): `Main-App/app/api/media/upload/route.ts`
- [Media delete API](https://github.com/sinungp/makna-kanta/blob/main/Main-App/app/api/media/%5Bid%5D/route.ts): `Main-App/app/api/media/[id]/route.ts`
- [Client gallery API](https://github.com/sinungp/makna-kanta/blob/main/Main-App/app/api/client/gallery/route.ts): `Main-App/app/api/client/gallery/route.ts`
- [Drive image proxy](https://github.com/sinungp/makna-kanta/blob/main/Main-App/app/api/client/drive-image/route.ts): `Main-App/app/api/client/drive-image/route.ts`
- **Supabase Auth**
- [Supabase data and storage](https://github.com/sinungp/makna-kanta/blob/main/Main-App/lib/supabase/admin.ts): `Main-App/lib/supabase/admin.ts`
- [Drive gallery access](https://github.com/sinungp/makna-kanta/blob/main/Main-App/lib/drive.ts): `Main-App/lib/drive.ts`
- **Thumbnail jobs**
- [Thumbnail worker](https://github.com/sinungp/makna-kanta/blob/main/Main-App/worker/src/index.ts): `Main-App/worker/src/index.ts`

### Other components

- **Site visitor**
- **Admin**
- **Client**
- **Google Drive**

## Connections

- Site visitor → Landing page: opens
- Landing page → Landing sections: renders
- Landing page → Site content: loads content
- Admin → Admin login: signs in
- Admin login → Admin login API: submits credentials
- Admin login API → Supabase Auth: verifies credentials
- Admin login API → Supabase data and storage: checks profile
- Admin → Admin dashboard: manages site
- Admin dashboard → Client manager: opens clients
- Client manager → Client account API: creates client
- Client account API → Supabase Auth: creates account
- Client account API → Supabase data and storage: writes profile and client
- Client manager → Client record API: deletes client
- Client record API → Supabase data and storage: deletes client record
- Client record API → Supabase Auth: deletes account
- Client manager → Drive link APIs: manages folder links
- Drive link APIs → Supabase data and storage: writes folder links
- Admin dashboard → Content editor: opens editor
- Content editor → Content API: saves content
- Content API → Supabase data and storage: upserts content
- Landing page → Supabase data and storage: reads landing content
- Admin dashboard → Media manager: opens media
- Media manager → Media upload API: uploads media
- Media upload API → Supabase data and storage: stores asset and original
- Media upload API → Thumbnail jobs: enqueues job
- Media manager → Media delete API: deletes media
- Media delete API → Supabase data and storage: removes asset and files
- Client → Client login: signs in
- Client login → Supabase Auth: authenticates
- Client → Client dashboard: opens portal
- Client dashboard → Client gallery API: requests gallery
- Client gallery API → Supabase Auth: checks session
- Client gallery API → Supabase data and storage: checks ownership and readiness
- Client gallery API → Drive gallery access: lists folder images
- Drive gallery access → Google Drive: lists images
- Client dashboard → Drive image proxy: loads image bytes
- Drive image proxy → Google Drive: fetches image
- Thumbnail worker → Thumbnail jobs: processes jobs
- Thumbnail worker → Supabase data and storage: updates thumbnails