Mark Henderson 0797717bc1 Phase 4: AI-driven app/database/auth lifecycle
Workspace-owned deploy infra so AI agents can create and destroy
Coolify resources without ever touching the root admin token.

  vibn_workspaces
    + coolify_server_uuid, coolify_destination_uuid
    + coolify_environment_name (default "production")
    + coolify_private_key_uuid, gitea_bot_ssh_key_id

  ensureWorkspaceProvisioned
    + generates an ed25519 keypair per workspace
    + pushes pubkey to the Gitea bot user (read/write scoped by team)
    + registers privkey in Coolify as a reusable deploy key

  New endpoints under /api/workspaces/[slug]/
    apps/                POST (private-deploy-key from Gitea repo)
    apps/[uuid]          PATCH, DELETE?confirm=<name>
    apps/[uuid]/domains  GET, PATCH (policy: *.{ws}.vibnai.com only)
    databases/           GET, POST (8 types incl. postgres, clickhouse, dragonfly)
    databases/[uuid]     GET, PATCH, DELETE?confirm=<name>
    auth/                GET, POST (Pocketbase, Authentik, Keycloak, Pocket-ID, Logto, Supertokens)
    auth/[uuid]          DELETE?confirm=<name>

  MCP (/api/mcp) gains 15 new tools that mirror the REST surface and
  enforce the same workspace tenancy + delete-confirm guard.

  Safety: destructive ops require ?confirm=<exact-resource-name>; volumes
  are kept by default (pass delete_volumes=true to drop).

Made-with: Cursor
2026-04-21 12:04:59 -07:00

VIBN Frontend

AI-Powered Development Platform - Track, manage, and deploy your AI-coded projects with ease.

🎨 Features

Built with Plane.so design patterns:

  • Resizable Sidebar - Collapsible sidebar with peek-on-hover
  • Dashboard Layout - Clean, modern interface following Plane's style
  • Overview Page - Project stats, recent activity, and getting started guide
  • Sessions - Track AI coding sessions with conversation history
  • Features - Plan and track product features
  • API Map - Auto-generated API endpoint documentation
  • Architecture - Living architecture docs and ADRs (Architectural Decision Records)
  • Analytics - Cost analysis, token usage, and performance metrics
  • Porter Integration - One-click deployment for AI-coded tools

🛠️ Tech Stack

  • Framework: Next.js 15 (App Router)
  • Language: TypeScript
  • Styling: Tailwind CSS
  • UI Components: shadcn/ui
  • Icons: Lucide React
  • Notifications: Sonner

🚀 Getting Started

Quick Start

# 1. Install dependencies
npm install

# 2. Setup environment variables (see SETUP.md for details)
cp .env.template .env.local
# Edit .env.local with your Firebase credentials

# 3. Start development server
npm run dev

Open http://localhost:3000

📖 For detailed setup instructions, see SETUP.md

Build

npm run build
npm start

📁 Project Structure

vibn-frontend/
├── app/
│   ├── (dashboard)/
│   │   └── [projectId]/
│   │       ├── layout.tsx          # Main dashboard layout
│   │       ├── overview/page.tsx   # Dashboard home
│   │       ├── sessions/page.tsx   # AI coding sessions
│   │       ├── features/page.tsx   # Feature planning
│   │       ├── api-map/page.tsx    # API documentation
│   │       ├── architecture/       # Architecture docs
│   │       └── analytics/page.tsx  # Cost & metrics
│   ├── layout.tsx                  # Root layout
│   └── page.tsx                    # Home redirect
├── components/
│   ├── sidebar/
│   │   ├── resizable-sidebar.tsx   # Resizable sidebar wrapper
│   │   └── project-sidebar.tsx     # Sidebar content
│   └── ui/                         # shadcn/ui components
└── lib/
    └── utils.ts                    # Utility functions

🎯 Routes

  • /[projectId]/overview - Project dashboard
  • /[projectId]/sessions - AI coding sessions
  • /[projectId]/features - Feature planning
  • /[projectId]/api-map - API endpoint map
  • /[projectId]/architecture - Architecture documentation
  • /[projectId]/analytics - Cost and metrics

📊 Components

Resizable Sidebar

Based on Plane's sidebar pattern:

  • Drag-to-resize (200px - 400px)
  • Collapse/expand button
  • Peek-on-hover when collapsed
  • Smooth transitions

Dashboard Pages

All pages follow consistent patterns:

  • Header with title and actions
  • Content area with cards
  • Responsive layout
  • Empty states with CTAs

🔄 Next Steps

  1. Connect to Database - Wire up PostgreSQL data
  2. Build API Routes - Create Next.js API routes for data fetching
  3. Real-time Updates - Add live session tracking
  4. Porter Integration - Implement deployment workflows
  5. Authentication - Add user auth and project management

🎨 Design System

Following Plane.so patterns:

  • Clean, minimal interface
  • Consistent spacing and typography
  • Subtle animations
  • Dark mode support (via Tailwind)
  • Accessible components (via shadcn/ui)

📝 Notes

  • Built for Porter hosting deployment
  • Designed for AI vibe-coded project management
  • Real data integration coming next
  • Backend API in /vibn-backend folder

Status: Frontend scaffolded and running Next: Connect to PostgreSQL database and build API layer

Description
No description provided
Readme 8.7 MiB
Languages
TypeScript 94.2%
Shell 4%
CSS 0.8%
JavaScript 0.7%
PLpgSQL 0.2%