Migrate to Supabase, UI redesign, and multi-AI provider support#21
Migrate to Supabase, UI redesign, and multi-AI provider support#21DealPatrol wants to merge 4 commits into
Conversation
Co-authored-by: Cole Collins <DealPatrol@users.noreply.github.com>
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
This pull request has been ignored for the connected project Preview Branches by Supabase. |
- Replace @neondatabase/serverless with postgres (postgres.js) package - Update lib/db.ts to use postgres.js with connection pooling singleton - Update lib/queries.ts with proper typed generics for postgres.js - Update all documentation (README, QUICK_START, VERCEL_SETUP, etc.) - Update .env.example with Supabase connection string format - Update AGENTS.md with new database instructions The postgres.js driver connects via standard TCP sockets, making it compatible with any PostgreSQL database (Supabase, local, etc.) without needing the Neon HTTP proxy. Co-authored-by: Cole Collins <DealPatrol@users.noreply.github.com>
- New color palette: emerald/green primary accent replacing blue
- Landing page: compelling narrative ('Your next product is already built'),
gradient hero, refined metrics strip, feature cards with hover states,
numbered steps section, and strong CTA
- Dashboard header: compact, glass-morphism backdrop blur, active state
highlighting with primary color
- Dashboard overview: clean stat cards with primary-tinted icons,
polished empty states, refined repo cards
- Analyses list: streamlined cards, consistent primary accent usage
- Repositories list: refined layout, improved spacing and visual hierarchy
- All components use consistent design language: rounded-2xl cards,
primary/8 and primary/10 tints, muted-foreground for secondary text
Co-authored-by: Cole Collins <DealPatrol@users.noreply.github.com>
- New lib/ai-providers.ts: unified abstraction for Anthropic Claude and OpenAI GPT with identical prompt/schema, Zod validation on both - New /api/ai-providers endpoint: returns available providers based on configured API keys - Updated /api/analyses/[id]/run: accepts ?providers=anthropic,openai query param; runs each provider sequentially, stores results with ai_provider tag; supports comparing blueprints from multiple models - Updated analysis-detail.tsx: provider checkboxes (Claude/GPT) next to Run Analysis button; shows 'Run Analysis (2 models)' when both selected; provider status indicators during analysis; filter tabs to view blueprints by provider; color-coded badges on each blueprint card - Added ai_provider column to app_blueprints table (schema + init-db) - Added openai package dependency - Updated .env.example with OPENAI_ANALYSIS_MODEL option Co-authored-by: Cole Collins <DealPatrol@users.noreply.github.com>
There was a problem hiding this comment.
Pull request overview
This PR modernizes CodeVault across three core areas: it migrates the database layer from Neon to postgres.js/Supabase-style PostgreSQL, refreshes the product UI/branding, and adds multi-provider AI analysis so blueprint generation can run on Anthropic, OpenAI, or both.
Changes:
- Replaces the Neon serverless client with postgres.js, updates schema/setup artifacts, and adds
ai_providerpersistence for blueprints. - Introduces a shared AI-provider layer plus API support for provider discovery and multi-provider analysis runs.
- Redesigns the landing page and dashboard/repository/analysis UI with a new emerald theme and comparison-oriented analysis UX.
Reviewed changes
Copilot reviewed 24 out of 26 changed files in this pull request and generated 9 comments.
Show a summary per file
| File | Description |
|---|---|
scripts/setup-deployment.sh |
Updates deployment prompt text to reference Supabase/PostgreSQL. |
scripts/01-create-schema.sql |
Adds ai_provider to the app_blueprints schema. |
pnpm-lock.yaml |
Locks the dependency changes for postgres.js/OpenAI and removes Neon packages. |
package.json |
Swaps database/client dependencies and adds OpenAI support. |
next-env.d.ts |
Changes the generated typed-routes import path. |
lib/queries.ts |
Extends blueprint/query types and adds provider-aware blueprint deletion/inserts. |
lib/db.ts |
Replaces the Neon client with a cached postgres.js client. |
lib/ai-providers.ts |
Adds the shared Anthropic/OpenAI analysis abstraction and schemas. |
components/repositories-list.tsx |
Refreshes repository management copy and card styling. |
components/dashboard-header.tsx |
Restyles dashboard navigation/header chrome. |
components/analysis-detail.tsx |
Adds provider selection, provider filtering/status UI, and refreshed analysis presentation. |
components/analyses-list.tsx |
Restyles the analyses list and creation dialog. |
app/page.tsx |
Rebuilds the landing page with the new marketing layout/theme. |
app/globals.css |
Replaces core design tokens with the new emerald palette. |
app/dashboard/page.tsx |
Redesigns the dashboard overview and quick-action cards. |
app/dashboard/layout.tsx |
Tweaks dashboard page spacing/container padding. |
app/api/setup/init-db/route.ts |
Updates DB initialization to add the new blueprint provider column. |
app/api/analyses/[id]/run/route.ts |
Refactors analysis execution for selectable providers and provider-tagged results. |
app/api/ai-providers/route.ts |
Adds an endpoint exposing configured AI providers. |
VERCEL_SETUP.md |
Updates deployment docs from Neon terminology to Supabase/PostgreSQL. |
README.md |
Refreshes setup/docs to reflect the new database client. |
QUICK_START.md |
Updates quick-start instructions for Supabase/PostgreSQL setup. |
IMPLEMENTATION_SUMMARY.md |
Revises the architecture summary for postgres.js/Supabase. |
ARCHITECTURE.md |
Renames the documented data layer from Neon to Supabase. |
AGENTS.md |
Adds repo-specific agent/contributor instructions and validation notes. |
.env.example |
Replaces the sample DB URL and documents provider-related env vars. |
Files not reviewed (1)
- pnpm-lock.yaml: Language not supported
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| - **Database**: Supabase PostgreSQL (`postgres` / postgres.js) | ||
| - **AI**: Vercel AI SDK + OpenAI GPT-4 |
| ai_provider VARCHAR(50) DEFAULT 'anthropic', | ||
| created_at TIMESTAMP WITH TIME ZONE DEFAULT CURRENT_TIMESTAMP | ||
| ); | ||
|
|
| const statusInfo = statusConfig[status] | ||
| const StatusIcon = statusInfo.icon | ||
|
|
||
| const uniqueProviders = [...new Set(localBlueprints.map(b => b.ai_provider).filter(Boolean))] as string[] | ||
| const isComparison = uniqueProviders.length > 1 | ||
|
|
| console.error('[analysis] Blueprint schema validation failed:', parsed?.error?.flatten()) | ||
| } | ||
| try { | ||
| await deleteBlueprintsByAnalysis(id, provider) |
| ) | ||
| } | ||
| return neon(databaseUrl) | ||
| sql = postgres(databaseUrl) |
| useEffect(() => { | ||
| fetch('/api/ai-providers') | ||
| .then(r => r.json()) | ||
| .then((data: ProviderInfo[]) => { | ||
| setProviders(data) | ||
| const avail = data.filter(p => p.available).map(p => p.id) | ||
| setSelectedProviders(avail.length > 0 ? avail : []) | ||
| }) | ||
| .catch(() => {}) |
| "next": "16.1.6", | ||
| "next-themes": "^0.4.6", | ||
| "openai": "^6.35.0", | ||
| "pg": "^8.11.3", |
| - `OPENAI_API_KEY` — For AI analysis features | ||
| - `ANTHROPIC_API_KEY` — Optional, for scaffold generation |
| - **Framework**: Next.js 16 with App Router | ||
| - **Database**: Neon PostgreSQL with connection pooling | ||
| - **Database**: Supabase PostgreSQL (or any PostgreSQL) | ||
| - **AI**: Vercel AI SDK (OpenAI GPT-4) |
Summary
Three major features in this PR:
1. Database: Neon → Supabase (postgres.js)
@neondatabase/serverless(HTTP) withpostgres(postgres.js, TCP)2. Professional UI Redesign
3. Multi-AI Provider Support (Claude + GPT)
Users can now pick which AI service to use for analysis — or run both simultaneously and compare blueprints side-by-side.
New files:
lib/ai-providers.ts— unified abstraction for Anthropic Claude and OpenAI GPTapp/api/ai-providers/route.ts— returns which providers have API keys configuredHow it works:
ai_providerDatabase change:
ai_providercolumn toapp_blueprintstableMulti-provider analysis detail with Claude and GPT checkboxes
Analysis detail showing provider checkboxes (Claude + GPT) and "Run Analysis (2 models)" button.
Landing page redesign
codevault_redesign_landing_page.mp4
Redesigned hero
Dashboard
Verified
tsc --noEmitpnpm lintpnpm build/api/ai-providers/api/analyses/[id]/run?providers=anthropic,openaiTo show artifacts inline, enable in settings.