305516c7e4644847e7db44c28b210c0da8c0a839
The current prompt reads like a runbook — operationally correct, but
it produces tool-call orchestrators rather than co-founders. Now that
the thinking pill streams reasoning between tool calls, the chat
bubble should be where opinion + judgment + push-back live.
What changed:
1. New "Voice" section right after the role declaration. Tells the
model to:
- Stop narrating intent before tool calls (the thinking pill
already covers this).
- Pack post-tool summaries with the actual answer + obvious next
step, not a recap of which tools ran.
- Have an opinion. Pick Postgres or Mongo, defend in one sentence,
proceed. Don't bullet pros/cons unless asked.
- Push back when it matters. Refuse "deploy without backups",
suggest Pipedream over n8n if it fits better.
- Surface adjacent risks unprompted (missing env vars, DNS not
propagated, autosave overdue) — the model is protecting the
user's work because the user trusts it to.
- Honest about uncertainty: "I'm not sure but X" beats false
confidence.
- Length matches stakes — short for short Qs, paragraph for big
decisions; never pad, never truncate.
- Markdown sparingly: backticks always for paths/IDs/URLs;
headings only when 3+ sections; otherwise prose.
2. Hard rules tightened:
- "Infer projectId from context, only ask if genuinely ambiguous"
replaces the rote "ask once, then proceed" — saves a tool round
and feels less robotic.
- Added explicit "ship/apps.deploy result is authoritative — don't
verify with gitea_* or shell_exec" rule. Reinforces the fix from
a896d07 at the prompt level so even older Gemini instances pick
it up.
- Added "don't loop blindly on tool errors" — if shell_exec fails
twice, surface and ask. Prevents the 12-tool retry chains from
earlier.
- Removed redundant "be concise" + "summarize after every tool
call" — both are now subsumed by the Voice section's richer
guidance.
Operational middle (Vibn structure, deploy recipes, dev container
workflow, port slot rules, HMR config, troubleshooting) is unchanged.
Those are the guard rails that make Path B work.
Net length: +650 chars on a ~8k-char prompt. Worth it for the voice
shift.
Made-with: Cursor
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
📖 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
- Connect to Database - Wire up PostgreSQL data
- Build API Routes - Create Next.js API routes for data fetching
- Real-time Updates - Add live session tracking
- Porter Integration - Implement deployment workflows
- 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-backendfolder
Status: ✅ Frontend scaffolded and running Next: Connect to PostgreSQL database and build API layer
Description
Languages
HTML
45.8%
TypeScript
30%
JavaScript
10.9%
Python
7.6%
CSS
4.7%
Other
0.9%