# renjithpec/prompt-veno architecture

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

- Interactive diagram: https://gitdiagram.com/renjithpec/prompt-veno
- Repository: https://github.com/renjithpec/prompt-veno

## Overview

1. **Overall shape**
   Prompt Veno is a Next.js 15 App Router application with a strong split between public marketplace pages, authenticated user flows, and an admin dashboard. The app is designed as a Supabase-backed product: PostgreSQL stores the core data, Supabase Auth handles sign-in, and Supabase Storage supports uploaded images.

2. **Primary runtime boundary**
   The frontend is built with server-rendered route segments in `app/`, while interactive pieces are isolated into client components under `components/` and a few page-local client files. This gives the app a server-first architecture for data fetching and SEO, with client-side islands for actions like search, chat, dialogs, buttons, and settings edits.

3. **Public marketplace**
   The public surface includes the homepage, `/prompts`, category/tag browsing, prompt detail pages, creator/user pages, saved items, rewards, ranks, and static content like about/privacy. These pages are the main read path of the product and are optimized for discovery, ranking, and copy/share conversion.

4. **Prompt data flow**
   Prompt browsing and detail pages are driven by data coming from Supabase through shared helpers in `lib/data.ts` and the typed models in `lib/types.ts`. User-facing actions such as copy, like, dislike, save, share, and follow are handled through action modules in `app/actions/` and some API routes, then reflected back into ranking, analytics, and notification data.

5. **Authentication and route protection**
   Auth is centered on Supabase login, including a callback route at `/auth/callback`. Route protection is enforced through `middleware.ts` and the admin/layout structure, so admin pages only render for authorized users when Supabase is configured. The auth flow is intentionally lightweight and server-managed rather than using a separate backend.

6. **Admin subsystem**
   The `/admin` area is a distinct operational console with its own layout and pages for prompts, categories, tags, users, analytics, and settings. This is where content moderation, prompt management, and site-level configuration live. The README also indicates admin promotion is done by setting a profile role in the database.

7. **Settings and content configuration**
   Admin settings control site identity and creator-facing branding such as Instagram URL, username, creator name, avatar, site title, and description. These settings feed the marketing UI and prompt pages, which include the creator growth block and social prompts designed for Instagram traffic.

8. **Social and engagement features**
   The app includes social primitives beyond simple browsing: notifications, messaging/chat, user follow relationships, and reward mechanics. The presence of chat sidebar/window components and notification dropdowns suggests a real-time-ish engagement layer layered on top of the marketplace, with Supabase tables and RLS policies protecting access.

9. **Content contribution and media**
   Users can contribute and edit prompts through dedicated routes, with image upload and cropper components supporting prompt or profile media. Supabase Storage buckets are part of the architecture, so media is stored outside the database while metadata stays in Postgres.

10. **SEO and distribution**
   The app has built-in SEO artifacts like sitemap, robots, OpenGraph/Twitter metadata, and JSON-LD support. That matters architecturally because the public pages are intended to be indexed and shared, not just used behind login.

11. **Shared UI and design system**
   The component layer is a reusable product UI kit: prompt cards, buttons, dialogs, dropdowns, header/footer, global search, theme provider/toggle, and various marketplace widgets. The app uses Tailwind CSS and Shadcn-style primitives, with Framer Motion for motion feedback in interaction-heavy parts like copy, shells, and modal flows.

12. **Database and security model**
   The `supabase/migrations/` folder shows the backend schema evolving through prompt categories, public profiles, likes, saves, shares, rewards, notifications, messaging, and image support. RLS is a core boundary: the database is not just storage, it is the enforcement layer for who can read or mutate each domain object.

13. **Operational helpers**
   Supporting utilities include rate limiting, safe action wrappers, and Supabase client/server adapters under `lib/`. These form the glue between route handlers, server actions, and the database, while keeping secrets like the service role key server-only.

14. **What to draw in an architecture diagram**
   The main diagram should show: browser/client UI → Next.js App Router pages/components → server actions/API routes/middleware → Supabase Auth + PostgreSQL + Storage. Around that core, show the marketplace read paths, authenticated user actions, admin console, and the social/notification/chat/rewards subsystems as separate bounded domains sharing the same Supabase backend.

Main entry points: [`app/actions/social.ts`](https://github.com/renjithpec/prompt-veno/blob/main/app/actions/social.ts) (Server Actions), [`lib/supabase/server.ts`](https://github.com/renjithpec/prompt-veno/blob/main/lib/supabase/server.ts) (Supabase Clients), [`lib/data.ts`](https://github.com/renjithpec/prompt-veno/blob/main/lib/data.ts) (Data Layer), [`supabase/migrations/001_promptvault_schema.sql`](https://github.com/renjithpec/prompt-veno/blob/main/supabase/migrations/001_promptvault_schema.sql) (Supabase Backend)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_app["App Router"]
  node_app_layout["App Shell<br/>next layout<br/>[layout.tsx]"]
  node_auth_routes["Auth Flow<br/>auth routes<br/>[page.tsx]"]
  node_settings_page["Settings<br/>account page<br/>[page.tsx]"]
  node_route_api["Prompt API<br/>route handler<br/>[route.ts]"]
  node_client_islands["UI Islands<br/>client components<br/>[global-search.tsx]"]
end

subgraph group_admin["Admin Console"]
  node_admin_area["Admin Area<br/>admin layout<br/>[layout.tsx]"]
  node_admin_pages["Admin Tools<br/>admin pages<br/>[page.tsx]"]
end

subgraph group_marketplace["Marketplace"]
  node_home_page["Home<br/>public page<br/>[page.tsx]"]
  node_prompts_page["Prompts<br/>browse page<br/>[page.tsx]"]
  node_prompt_page["Prompt Detail<br/>detail page<br/>[page.tsx]"]
  node_category_pages["Categories<br/>browse pages<br/>[page.tsx]"]
  node_creator_pages["Creator Pages<br/>profile pages<br/>[page.tsx]"]
  node_contribute_edit["Contribute/Edit<br/>submission flows<br/>[page.tsx]"]
end

subgraph group_social["Social Layer"]
  node_engagement_pages["Saved & Ranks<br/>engagement pages<br/>[page.tsx]"]
  node_messages_page["Messages<br/>social page<br/>[page.tsx]"]
end

subgraph group_infra["Shared Infra"]
  node_action_layer["Server Actions<br/>[social.ts]"]
  node_data_layer["Data Layer<br/>server helpers<br/>[data.ts]"]
  node_supabase_client["Supabase Clients<br/>adapter<br/>[server.ts]"]
  node_middleware["Middleware<br/>route guard<br/>[middleware.ts]"]
  node_supabase_backend[("Supabase Backend")]
end

node_browser(("Browser UI<br/>client"))

node_browser -->|"loads"| node_app_layout
node_app_layout -->|"renders"| node_home_page
node_app_layout -->|"hosts"| node_client_islands
node_home_page -->|"links to"| node_prompts_page
node_prompts_page -->|"opens"| node_prompt_page
node_prompts_page -->|"filters by"| node_category_pages
node_prompt_page -->|"mutates via"| node_action_layer
node_prompt_page -->|"copies via"| node_route_api
node_creator_pages -->|"follows via"| node_action_layer
node_engagement_pages -->|"reads"| node_data_layer
node_contribute_edit -->|"submits via"| node_action_layer
node_auth_routes -->|"authenticates with"| node_supabase_client
node_settings_page -->|"updates via"| node_action_layer
node_messages_page -->|"uses"| node_client_islands
node_admin_area -->|"contains"| node_admin_pages
node_admin_pages -->|"manages via"| node_action_layer
node_middleware -->|"protects"| node_admin_area
node_client_islands -->|"queries"| node_data_layer
node_action_layer -->|"calls"| node_supabase_client
node_data_layer -->|"reads through"| node_supabase_client
node_supabase_client -->|"connects to"| node_supabase_backend
node_action_layer -->|"writes"| node_supabase_backend
node_data_layer -->|"reads"| node_supabase_backend
node_route_api -->|"touches"| node_supabase_backend
node_middleware -->|"verifies session"| node_supabase_client

click node_app_layout "https://github.com/renjithpec/prompt-veno/blob/main/app/layout.tsx"
click node_home_page "https://github.com/renjithpec/prompt-veno/blob/main/app/page.tsx"
click node_prompts_page "https://github.com/renjithpec/prompt-veno/blob/main/app/prompts/page.tsx"
click node_prompt_page "https://github.com/renjithpec/prompt-veno/blob/main/app/prompt/[slug]/page.tsx"
click node_category_pages "https://github.com/renjithpec/prompt-veno/blob/main/app/categories/page.tsx"
click node_creator_pages "https://github.com/renjithpec/prompt-veno/blob/main/app/user/[id]/page.tsx"
click node_engagement_pages "https://github.com/renjithpec/prompt-veno/blob/main/app/saved/page.tsx"
click node_contribute_edit "https://github.com/renjithpec/prompt-veno/blob/main/app/contribute/page.tsx"
click node_auth_routes "https://github.com/renjithpec/prompt-veno/blob/main/app/login/page.tsx"
click node_settings_page "https://github.com/renjithpec/prompt-veno/blob/main/app/settings/page.tsx"
click node_messages_page "https://github.com/renjithpec/prompt-veno/blob/main/app/messages/page.tsx"
click node_admin_area "https://github.com/renjithpec/prompt-veno/blob/main/app/admin/layout.tsx"
click node_admin_pages "https://github.com/renjithpec/prompt-veno/blob/main/app/admin/prompts/page.tsx"
click node_route_api "https://github.com/renjithpec/prompt-veno/blob/main/app/api/prompts/[slug]/copy/route.ts"
click node_client_islands "https://github.com/renjithpec/prompt-veno/blob/main/components/global-search.tsx"
click node_action_layer "https://github.com/renjithpec/prompt-veno/blob/main/app/actions/social.ts"
click node_data_layer "https://github.com/renjithpec/prompt-veno/blob/main/lib/data.ts"
click node_supabase_client "https://github.com/renjithpec/prompt-veno/blob/main/lib/supabase/server.ts"
click node_middleware "https://github.com/renjithpec/prompt-veno/blob/main/middleware.ts"
click node_supabase_backend "https://github.com/renjithpec/prompt-veno/blob/main/supabase/migrations/001_promptvault_schema.sql"

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_layout,node_auth_routes,node_settings_page,node_route_api,node_client_islands toneBlue
class node_admin_area,node_admin_pages toneAmber
class node_home_page,node_prompts_page,node_prompt_page,node_category_pages,node_creator_pages,node_contribute_edit toneMint
class node_engagement_pages,node_messages_page toneRose
class node_action_layer,node_data_layer,node_supabase_client,node_middleware,node_supabase_backend toneIndigo
class node_browser toneNeutral
```

## Components

### App Router

Next.js route segments for public, authenticated, and API surfaces.

- [App Shell](https://github.com/renjithpec/prompt-veno/blob/main/app/layout.tsx): next layout · Root layout and global styling for the app router. · `app/layout.tsx`
- [Auth Flow](https://github.com/renjithpec/prompt-veno/blob/main/app/login/page.tsx): auth routes · Login, callback, password reset, and account update routes. · `app/login/page.tsx`
- [Settings](https://github.com/renjithpec/prompt-veno/blob/main/app/settings/page.tsx): account page · Authenticated user settings and profile edits. · `app/settings/page.tsx`
- [Prompt API](https://github.com/renjithpec/prompt-veno/blob/main/app/api/prompts/[slug]/copy/route.ts): route handler · Prompt-related API route used for copy and other server-side interactions. · `app/api/prompts/[slug]/copy/route.ts`
- [UI Islands](https://github.com/renjithpec/prompt-veno/blob/main/components/global-search.tsx): client components · Interactive components such as search, buttons, dialogs, chat, notifications, and media tools. · `components/global-search.tsx`

### Admin Console

Operational pages for moderation, analytics, and site settings.

- [Admin Area](https://github.com/renjithpec/prompt-veno/blob/main/app/admin/layout.tsx): admin layout · Protected operational console for moderation and configuration. · `app/admin/layout.tsx`
- [Admin Tools](https://github.com/renjithpec/prompt-veno/blob/main/app/admin/prompts/page.tsx): admin pages · Admin sections for prompts, categories, tags, users, analytics, and settings. · `app/admin/prompts/page.tsx`

### Marketplace

Public discovery and prompt browsing flows.

- [Home](https://github.com/renjithpec/prompt-veno/blob/main/app/page.tsx): public page · Landing page and top-level entry into the marketplace. · `app/page.tsx`
- [Prompts](https://github.com/renjithpec/prompt-veno/blob/main/app/prompts/page.tsx): browse page · Main discovery listing for prompts. · `app/prompts/page.tsx`
- [Prompt Detail](https://github.com/renjithpec/prompt-veno/blob/main/app/prompt/[slug]/page.tsx): detail page · Individual prompt view with copy, save, like, share, and related metadata. · `app/prompt/[slug]/page.tsx`
- [Categories](https://github.com/renjithpec/prompt-veno/blob/main/app/categories/page.tsx): browse pages · Category and tag browsing for discovery and filtering. · `app/categories/page.tsx`
- [Creator Pages](https://github.com/renjithpec/prompt-veno/blob/main/app/user/[id]/page.tsx): profile pages · Public user pages and follow-focused creator views. · `app/user/[id]/page.tsx`
- [Contribute/Edit](https://github.com/renjithpec/prompt-veno/blob/main/app/contribute/page.tsx): submission flows · Prompt creation and editing routes for user contributions. · `app/contribute/page.tsx`

### Social Layer

Engagement, messaging, rewards, and notifications.

- [Saved & Ranks](https://github.com/renjithpec/prompt-veno/blob/main/app/saved/page.tsx): engagement pages · Saved prompts, rewards, and leaderboard-style ranking views. · `app/saved/page.tsx`
- [Messages](https://github.com/renjithpec/prompt-veno/blob/main/app/messages/page.tsx): social page · Messaging and chat entry point. · `app/messages/page.tsx`

### Shared Infra

Client/server helpers, auth, and database integration.

- [Server Actions](https://github.com/renjithpec/prompt-veno/blob/main/app/actions/social.ts): actions · Mutation layer for admin, auth, search, social, rewards, and user flows. · `app/actions/social.ts`
- [Data Layer](https://github.com/renjithpec/prompt-veno/blob/main/lib/data.ts): server helpers · Shared read helpers, typed models, rate limiting, and safe action wrappers. · `lib/data.ts`
- [Supabase Clients](https://github.com/renjithpec/prompt-veno/blob/main/lib/supabase/server.ts): adapter · Server and browser adapters for Supabase access. · `lib/supabase/server.ts`
- [Middleware](https://github.com/renjithpec/prompt-veno/blob/main/middleware.ts): route guard · Edge protection and session-aware routing control. · `middleware.ts`
- [Supabase Backend](https://github.com/renjithpec/prompt-veno/blob/main/supabase/migrations/001_promptvault_schema.sql): auth + postgres + storage · Supabase Auth, PostgreSQL, Storage, and RLS-protected application data. · `supabase/migrations/001_promptvault_schema.sql`

### Other components

- **Browser UI**: client · Users interact through public pages and client-side islands.

## Connections

- Browser UI → App Shell: loads · The browser enters the Next.js app through the root shell.
- App Shell → Home: renders · Root app routes render public pages and shared UI.
- App Shell → UI Islands: hosts · Shared interactive components are mounted inside the app shell.
- Home → Prompts: links to · Home promotes browsing into the marketplace.
- Prompts → Prompt Detail: opens · Listings lead into individual prompt detail views.
- Prompts → Categories: filters by · Discovery flows branch into category and tag browsing.
- Prompt Detail → Server Actions: mutates via · Prompt actions like like, save, share, follow, and reward updates use server actions.
- Prompt Detail → Prompt API: copies via · Copy-related interactions use a dedicated API route.
- Creator Pages → Server Actions: follows via · Follow/unfollow and profile interactions are handled through server actions.
- Saved & Ranks → Data Layer: reads · Saved items, rewards, and ranks are assembled from shared data helpers.
- Contribute/Edit → Server Actions: submits via · Prompt creation and edits are persisted through server actions.
- Auth Flow → Supabase Clients: authenticates with · Sign-in and callback flows use Supabase auth clients.
- Settings → Server Actions: updates via · Profile and account edits go through server mutations.
- Messages → UI Islands: uses · Chat UI is primarily delivered through interactive client components.
- Admin Area → Admin Tools: contains · Admin layout wraps all operational console pages.
- Admin Tools → Server Actions: manages via · Admin moderation and configuration rely on server actions.
- Middleware → Admin Area: protects · Route protection gates admin access.
- UI Islands → Data Layer: queries · Search, cards, and widgets consume shared read helpers and types.
- Server Actions → Supabase Clients: calls · Server actions use Supabase adapters for authenticated reads and writes.
- Data Layer → Supabase Clients: reads through · Shared helpers fetch data through the Supabase client/server wrappers.
- Supabase Clients → Supabase Backend: connects to · Adapters talk to Supabase Auth, Postgres, and Storage.
- Server Actions → Supabase Backend: writes · Mutations persist content, social state, notifications, and rewards.
- Data Layer → Supabase Backend: reads · Public pages and dashboards load data from the Supabase-backed store.
- Prompt API → Supabase Backend: touches · API routes participate in server-side prompt operations.
- Middleware → Supabase Clients: verifies session · Middleware cooperates with Supabase session state for protected routes.