810 lines
31 KiB
TypeScript
810 lines
31 KiB
TypeScript
import { Workspace, Project, Artifact, LlmEngineConfig, SnapshotBinding, Session } from './types';
|
||
import { buildBucketsReferenceArtifacts } from './lib/bucketsTemplates';
|
||
|
||
export const INITIAL_WORKSPACES: Workspace[] = [
|
||
{
|
||
id: 'ws-personal',
|
||
name: 'Personal Dev Studio',
|
||
description: 'Main workspace for personal full-stack apps and web tools.',
|
||
icon: 'Layers',
|
||
color: 'from-emerald-500 to-teal-700',
|
||
createdAt: '2026-07-01T10:00:00.000Z',
|
||
},
|
||
{
|
||
id: 'ws-enterprise',
|
||
name: 'Enterprise AI Lab',
|
||
description: 'Shared workspace for team microservices and customer portals.',
|
||
icon: 'Cpu',
|
||
color: 'from-blue-600 to-indigo-800',
|
||
createdAt: '2026-07-15T14:30:00.000Z',
|
||
},
|
||
];
|
||
|
||
export const INITIAL_PROJECTS: Project[] = [
|
||
{
|
||
id: 'proj-buckets-booking',
|
||
workspaceId: 'ws-personal',
|
||
name: 'Buckets.id AI Booking Concierge',
|
||
description: 'Conversational booking assistant integrated with buckets-id.stble.fi, featuring real-time SSE streaming, authoritative calendar slot calculations, and customer OAuth.',
|
||
tags: ['Buckets.id', 'React 19', 'SSE', 'Scheduling', 'FastAPI'],
|
||
createdAt: '2026-08-14T07:00:00.000Z',
|
||
updatedAt: '2026-08-14T07:30:00.000Z',
|
||
},
|
||
{
|
||
id: 'proj-ecommerce',
|
||
workspaceId: 'ws-personal',
|
||
name: 'Modern E-Commerce Store',
|
||
description: 'React Vite frontend storefront + Express Node.js REST API service with Stripe payment webhooks.',
|
||
tags: ['React', 'Express', 'Tailwind', 'Stripe'],
|
||
createdAt: '2026-08-01T08:00:00.000Z',
|
||
updatedAt: '2026-08-08T06:00:00.000Z',
|
||
},
|
||
{
|
||
id: 'proj-analytics',
|
||
workspaceId: 'ws-personal',
|
||
name: 'Realtime Metrics Portal',
|
||
description: 'Dashboard portal for telemetry metrics, chart visualizers, and automated alert rules.',
|
||
tags: ['TypeScript', 'Recharts', 'PostgreSQL'],
|
||
createdAt: '2026-08-03T11:20:00.000Z',
|
||
updatedAt: '2026-08-07T16:00:00.000Z',
|
||
},
|
||
{
|
||
id: 'proj-customerhub',
|
||
workspaceId: 'ws-enterprise',
|
||
name: 'Customer Service Hub',
|
||
description: 'AI ticket routing platform with automated response suggestions and knowledge base search.',
|
||
tags: ['Next.js', 'FastAPI', 'VectorDB'],
|
||
createdAt: '2026-08-05T09:15:00.000Z',
|
||
updatedAt: '2026-08-08T04:00:00.000Z',
|
||
},
|
||
];
|
||
|
||
const INITIAL_BUCKETS_REFERENCE_ARTIFACTS: Artifact[] = buildBucketsReferenceArtifacts({
|
||
templateId: 'booking_concierge',
|
||
projectId: 'proj-buckets-booking',
|
||
appName: 'Buckets AI Booking Assistant Reference App',
|
||
brandTitle: 'Northstar Studio',
|
||
serviceName: 'Strategy Consultation',
|
||
welcomeMessage: 'Hi — I can answer questions, check authoritative availability, book or manage an appointment, and bring in a person whenever you need one.',
|
||
targetDomain: 'https://buckets-id.stble.fi',
|
||
timezone: 'Asia/Bangkok',
|
||
durationMinutes: 60,
|
||
confirmationMode: 'auto_confirm',
|
||
premiumPriceCredits: 20,
|
||
schedulingMode: 'buckets',
|
||
}).map((artifact, index) => ({
|
||
...artifact,
|
||
id: index === 0 ? 'art-fe-buckets' : 'art-be-buckets',
|
||
updatedAt: '2026-08-15T00:00:00.000Z',
|
||
versions: artifact.versions.map((version) => ({
|
||
...version,
|
||
id: index === 0 ? 'ver-bkt-fe-1' : 'ver-bkt-be-1',
|
||
createdAt: '2026-08-15T00:00:00.000Z',
|
||
})),
|
||
}));
|
||
|
||
export const INITIAL_ARTIFACTS: Artifact[] = [
|
||
...INITIAL_BUCKETS_REFERENCE_ARTIFACTS,
|
||
{
|
||
id: 'art-fe-ecom',
|
||
projectId: 'proj-ecommerce',
|
||
title: 'Frontend Storefront Codebase',
|
||
type: 'frontend',
|
||
currentVersion: 2,
|
||
description: 'Vite React 19 single-page app with cart state and responsive checkout UI.',
|
||
updatedAt: '2026-08-08T05:30:00.000Z',
|
||
versions: [
|
||
{
|
||
id: 'ver-fe-1',
|
||
versionNumber: 1,
|
||
createdAt: '2026-08-01T08:30:00.000Z',
|
||
summary: 'Initial storefront layout with product list and responsive navbar.',
|
||
zipFileName: 'frontend_storefront_v1.zip',
|
||
files: [
|
||
{
|
||
path: 'src/App.tsx',
|
||
language: 'typescript',
|
||
content: `import React, { useState } from 'react';
|
||
|
||
export default function App() {
|
||
const [cart, setCart] = useState([]);
|
||
|
||
return (
|
||
<div className="min-h-screen bg-slate-950 text-white p-8">
|
||
<header className="flex justify-between items-center pb-6 border-b border-slate-800">
|
||
<h1 className="text-2xl font-bold tracking-tight">Apex Store</h1>
|
||
<div className="bg-slate-800 px-4 py-2 rounded-full">Cart ({cart.length})</div>
|
||
</header>
|
||
<main className="mt-8 grid grid-cols-3 gap-6">
|
||
<div className="p-6 bg-slate-900 border border-slate-800 rounded-2xl">
|
||
<h3 className="font-bold text-lg">Wireless Headphones</h3>
|
||
<p className="text-slate-400 text-sm mt-1">$199.99</p>
|
||
<button onClick={() => setCart([...cart, '1'])} className="mt-4 w-full bg-emerald-600 hover:bg-emerald-500 py-2 rounded-xl text-white font-medium">Add to Cart</button>
|
||
</div>
|
||
</main>
|
||
</div>
|
||
);
|
||
}`,
|
||
},
|
||
{
|
||
path: 'package.json',
|
||
language: 'json',
|
||
content: `{
|
||
"name": "apex-frontend-v1",
|
||
"version": "1.0.0",
|
||
"dependencies": {
|
||
"react": "^19.0.0",
|
||
"lucide-react": "^0.500.0"
|
||
}
|
||
}`,
|
||
},
|
||
],
|
||
},
|
||
{
|
||
id: 'ver-fe-2',
|
||
versionNumber: 2,
|
||
createdAt: '2026-08-08T05:30:00.000Z',
|
||
summary: 'Added Cart drawer modal, quantity selectors, and instant tax estimator.',
|
||
createdByPrompt: 'Add a slide-out cart drawer and tax calculation logic to the storefront artifact.',
|
||
zipFileName: 'frontend_storefront_v2.zip',
|
||
files: [
|
||
{
|
||
path: 'src/App.tsx',
|
||
language: 'typescript',
|
||
content: `import React, { useState } from 'react';
|
||
import { ShoppingBag, X, Trash2 } from 'lucide-react';
|
||
|
||
interface Product {
|
||
id: string;
|
||
name: string;
|
||
price: number;
|
||
}
|
||
|
||
const PRODUCTS: Product[] = [
|
||
{ id: '1', name: 'Wireless Noise-Canceling Headphones', price: 249.99 },
|
||
{ id: '2', name: 'Mechanical RGB Keyboard', price: 129.50 },
|
||
{ id: '3', name: 'Ergonomic Curved Monitor 34"', price: 499.00 },
|
||
];
|
||
|
||
export default function App() {
|
||
const [cartItems, setCartItems] = useState<{ product: Product; qty: number }[]>([]);
|
||
const [isCartOpen, setIsCartOpen] = useState(false);
|
||
|
||
const addToCart = (product: Product) => {
|
||
setCartItems((prev) => {
|
||
const existing = prev.find((item) => item.product.id === product.id);
|
||
if (existing) {
|
||
return prev.map((item) =>
|
||
item.product.id === product.id ? { ...item, qty: item.qty + 1 } : item
|
||
);
|
||
}
|
||
return [...prev, { product, qty: 1 }];
|
||
});
|
||
setIsCartOpen(true);
|
||
};
|
||
|
||
const subtotal = cartItems.reduce((acc, item) => acc + item.product.price * item.qty, 0);
|
||
const tax = subtotal * 0.08;
|
||
const total = subtotal + tax;
|
||
|
||
return (
|
||
<div className="min-h-screen bg-slate-950 text-slate-100 font-sans">
|
||
<header className="sticky top-0 z-30 bg-slate-950/80 backdrop-blur-md border-b border-slate-800 px-8 py-4 flex justify-between items-center">
|
||
<div className="flex items-center gap-3">
|
||
<div className="w-8 h-8 rounded-lg bg-emerald-500 flex items-center justify-center font-black text-slate-950">A</div>
|
||
<span className="font-bold text-xl tracking-tight">Apex Store</span>
|
||
</div>
|
||
<button
|
||
onClick={() => setIsCartOpen(true)}
|
||
className="relative flex items-center gap-2 bg-slate-900 hover:bg-slate-800 border border-slate-700/60 px-4 py-2 rounded-xl transition text-sm font-medium"
|
||
>
|
||
<ShoppingBag className="w-4 h-4 text-emerald-400" />
|
||
<span>Cart</span>
|
||
{cartItems.length > 0 && (
|
||
<span className="bg-emerald-500 text-slate-950 font-bold text-xs px-2 py-0.5 rounded-full ml-1">
|
||
{cartItems.reduce((a, b) => a + b.qty, 0)}
|
||
</span>
|
||
)}
|
||
</button>
|
||
</header>
|
||
|
||
<main className="max-w-6xl mx-auto px-8 py-10">
|
||
<h2 className="text-3xl font-extrabold tracking-tight mb-8">Featured Gear</h2>
|
||
<div className="grid grid-cols-1 md:grid-cols-3 gap-6">
|
||
{PRODUCTS.map((prod) => (
|
||
<div key={prod.id} className="p-6 bg-slate-900 border border-slate-800 rounded-2xl flex flex-col justify-between hover:border-slate-700 transition">
|
||
<div>
|
||
<h3 className="font-semibold text-lg text-white">{prod.name}</h3>
|
||
<p className="text-slate-400 text-2xl font-bold mt-2">\${prod.price.toFixed(2)}</p>
|
||
</div>
|
||
<button
|
||
onClick={() => addToCart(prod)}
|
||
className="mt-6 w-full bg-emerald-600 hover:bg-emerald-500 active:scale-98 transition text-white font-medium py-2.5 rounded-xl text-sm"
|
||
>
|
||
Add to Order
|
||
</button>
|
||
</div>
|
||
))}
|
||
</div>
|
||
</main>
|
||
|
||
{/* Slide-out Cart Drawer */}
|
||
{isCartOpen && (
|
||
<div className="fixed inset-0 z-50 flex justify-end bg-black/60 backdrop-blur-sm">
|
||
<div className="w-full max-w-md bg-slate-900 border-l border-slate-800 p-6 flex flex-col h-full shadow-2xl">
|
||
<div className="flex justify-between items-center pb-4 border-b border-slate-800">
|
||
<h3 className="font-bold text-lg flex items-center gap-2 text-white">
|
||
<ShoppingBag className="w-5 h-5 text-emerald-400" /> Your Order
|
||
</h3>
|
||
<button onClick={() => setIsCartOpen(false)} className="p-1 rounded-lg hover:bg-slate-800 text-slate-400 hover:text-white">
|
||
<X className="w-5 h-5" />
|
||
</button>
|
||
</div>
|
||
|
||
<div className="flex-1 overflow-y-auto py-4 space-y-4">
|
||
{cartItems.length === 0 ? (
|
||
<p className="text-slate-500 text-center py-12 text-sm">Your cart is currently empty.</p>
|
||
) : (
|
||
cartItems.map((item) => (
|
||
<div key={item.product.id} className="p-3 bg-slate-950/60 rounded-xl border border-slate-800/80 flex justify-between items-center">
|
||
<div>
|
||
<p className="font-medium text-sm text-white">{item.product.name}</p>
|
||
<p className="text-xs text-slate-400 mt-1">
|
||
\${item.product.price.toFixed(2)} × {item.qty}
|
||
</p>
|
||
</div>
|
||
<button
|
||
onClick={() => setCartItems(cartItems.filter((i) => i.product.id !== item.product.id))}
|
||
className="p-1.5 text-slate-500 hover:text-red-400 hover:bg-slate-900 rounded-lg"
|
||
>
|
||
<Trash2 className="w-4 h-4" />
|
||
</button>
|
||
</div>
|
||
))
|
||
)}
|
||
</div>
|
||
|
||
<div className="pt-4 border-t border-slate-800 space-y-2 text-sm">
|
||
<div className="flex justify-between text-slate-400">
|
||
<span>Subtotal</span>
|
||
<span>\${subtotal.toFixed(2)}</span>
|
||
</div>
|
||
<div className="flex justify-between text-slate-400">
|
||
<span>Estimated Tax (8%)</span>
|
||
<span>\${tax.toFixed(2)}</span>
|
||
</div>
|
||
<div className="flex justify-between text-base font-bold text-white pt-2 border-t border-slate-800">
|
||
<span>Total</span>
|
||
<span className="text-emerald-400">\${total.toFixed(2)}</span>
|
||
</div>
|
||
<button className="w-full mt-4 bg-emerald-500 hover:bg-emerald-400 text-slate-950 font-bold py-3 rounded-xl transition shadow-lg shadow-emerald-500/20">
|
||
Proceed to Checkout
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
)}
|
||
</div>
|
||
);
|
||
}`,
|
||
},
|
||
{
|
||
path: 'src/components/CartDrawer.tsx',
|
||
language: 'typescript',
|
||
content: `// Cart Drawer Modular Component v2
|
||
export function CartDrawer() {
|
||
return <div>Cart Drawer Module</div>;
|
||
}`,
|
||
},
|
||
],
|
||
},
|
||
],
|
||
},
|
||
{
|
||
id: 'art-be-ecom',
|
||
projectId: 'proj-ecommerce',
|
||
title: 'Backend API Service',
|
||
type: 'backend',
|
||
currentVersion: 1,
|
||
description: 'Node.js Express REST server with Stripe webhook handlers and order management routes.',
|
||
updatedAt: '2026-08-02T12:00:00.000Z',
|
||
versions: [
|
||
{
|
||
id: 'ver-be-1',
|
||
versionNumber: 1,
|
||
createdAt: '2026-08-02T12:00:00.000Z',
|
||
summary: 'Express API setup with /api/products, /api/checkout, and JWT auth router.',
|
||
zipFileName: 'backend_api_service_v1.zip',
|
||
files: [
|
||
{
|
||
path: 'server.ts',
|
||
language: 'typescript',
|
||
content: `import express from 'express';
|
||
import cors from 'cors';
|
||
|
||
const app = express();
|
||
app.use(cors());
|
||
app.use(express.json());
|
||
|
||
app.get('/api/products', (req, res) => {
|
||
res.json([
|
||
{ id: '1', name: 'Wireless Headphones', price: 249.99, stock: 15 },
|
||
{ id: '2', name: 'RGB Keyboard', price: 129.50, stock: 40 },
|
||
]);
|
||
});
|
||
|
||
app.post('/api/checkout', (req, res) => {
|
||
const { items } = req.body;
|
||
res.json({ success: true, orderId: 'ord_' + Date.now(), total: 379.49 });
|
||
});
|
||
|
||
app.listen(4000, () => console.log('Backend listening on port 4000'));`,
|
||
},
|
||
{
|
||
path: 'package.json',
|
||
language: 'json',
|
||
content: `{
|
||
"name": "apex-backend-service",
|
||
"version": "1.0.0",
|
||
"dependencies": {
|
||
"express": "^4.21.0",
|
||
"cors": "^2.8.5"
|
||
}
|
||
}`,
|
||
},
|
||
],
|
||
},
|
||
],
|
||
},
|
||
{
|
||
id: 'art-db-ecom',
|
||
projectId: 'proj-ecommerce',
|
||
title: 'Database Schema & Migrations',
|
||
type: 'database',
|
||
currentVersion: 1,
|
||
description: 'PostgreSQL schema definitions for users, products, orders, and payments.',
|
||
updatedAt: '2026-08-01T15:00:00.000Z',
|
||
versions: [
|
||
{
|
||
id: 'ver-db-1',
|
||
versionNumber: 1,
|
||
createdAt: '2026-08-01T15:00:00.000Z',
|
||
summary: 'Initial PostgreSQL table schemas.',
|
||
zipFileName: 'database_schema_v1.zip',
|
||
files: [
|
||
{
|
||
path: 'migrations/001_initial.sql',
|
||
language: 'sql',
|
||
content: `-- Initial Migration Schema
|
||
CREATE TABLE users (
|
||
id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
|
||
email VARCHAR(255) UNIQUE NOT NULL,
|
||
created_at TIMESTAMP WITH TIME ZONE DEFAULT CURRENT_TIMESTAMP
|
||
);
|
||
|
||
CREATE TABLE products (
|
||
id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
|
||
name VARCHAR(255) NOT NULL,
|
||
price_cents INT NOT NULL,
|
||
stock INT DEFAULT 0
|
||
);
|
||
|
||
CREATE TABLE orders (
|
||
id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
|
||
user_id UUID REFERENCES users(id),
|
||
total_cents INT NOT NULL,
|
||
status VARCHAR(50) DEFAULT 'pending',
|
||
created_at TIMESTAMP WITH TIME ZONE DEFAULT CURRENT_TIMESTAMP
|
||
);`,
|
||
},
|
||
],
|
||
},
|
||
],
|
||
},
|
||
];
|
||
|
||
export const DEFAULT_CREDENTIALS: LlmEngineConfig = {
|
||
email: '',
|
||
isVerified: true,
|
||
selectedModels: ['gemini-3.7-flash', 'gpt-4o'],
|
||
mainModel: 'gemini-3.7-flash',
|
||
apiKeys: {
|
||
geminiApiKey: '',
|
||
openaiApiKey: '',
|
||
anthropicApiKey: '',
|
||
groqApiKey: '',
|
||
},
|
||
autoAttachArtifacts: true,
|
||
extractDeliverables: true,
|
||
};
|
||
|
||
export const INITIAL_SNAPSHOTS: SnapshotBinding[] = [
|
||
{
|
||
id: 'snap-bkt-v1',
|
||
versionLabel: 'v1',
|
||
versionTag: 'v1.0.0',
|
||
commitHash: 'b7c8d9e',
|
||
commitMessage: 'Initial Buckets AI Booking & Concierge Architecture',
|
||
createdAt: '2026-08-14T07:30:00.000Z',
|
||
timestamp: '07:30 AM',
|
||
createdByModel: 'gemini-3.7-flash',
|
||
generatedByModel: 'gemini-3.7-flash',
|
||
provider: 'google',
|
||
isMainBranch: true,
|
||
branchName: 'main',
|
||
author: 'Buckets & Rokcet Integration Agent',
|
||
summary: 'React 19 Booking Assistant frontend, Express webhook adapter, and live calendar slot calculation connected to buckets-id.stble.fi',
|
||
boundArtifactVersions: {
|
||
'art-fe-buckets': 1,
|
||
'art-be-buckets': 1,
|
||
},
|
||
boundVersions: [
|
||
{ artifactId: 'art-fe-buckets', versionNumber: 1 },
|
||
{ artifactId: 'art-be-buckets', versionNumber: 1 },
|
||
],
|
||
},
|
||
{
|
||
id: 'snap-v1-main',
|
||
versionLabel: 'v1',
|
||
versionTag: 'v1.0.0',
|
||
commitHash: 'a1b2c3d',
|
||
commitMessage: 'Initial project setup & database schema',
|
||
createdAt: '2026-08-08T04:00:00.000Z',
|
||
timestamp: '04:00 AM',
|
||
createdByModel: 'gemini-3.7-flash',
|
||
generatedByModel: 'gemini-3.7-flash',
|
||
provider: 'google',
|
||
isMainBranch: true,
|
||
branchName: 'main',
|
||
author: 'Gemini 3.7 Flash',
|
||
summary: 'Initial storefront React code and express API schema',
|
||
boundArtifactVersions: {
|
||
'art-fe-ecom': 1,
|
||
'art-be-ecom': 1,
|
||
'art-db-ecom': 1,
|
||
},
|
||
boundVersions: [
|
||
{ artifactId: 'art-fe-ecom', versionNumber: 1 },
|
||
{ artifactId: 'art-be-ecom', versionNumber: 1 },
|
||
{ artifactId: 'art-db-ecom', versionNumber: 1 },
|
||
],
|
||
},
|
||
{
|
||
id: 'snap-v1-claude',
|
||
versionLabel: 'v1',
|
||
versionTag: 'v1.0.0-claude',
|
||
commitHash: 'c9f8e7d',
|
||
commitMessage: 'Initial setup generated via Claude 3.5 Sonnet',
|
||
createdAt: '2026-08-08T04:00:05.000Z',
|
||
timestamp: '04:00 AM',
|
||
createdByModel: 'claude-3-5-sonnet',
|
||
generatedByModel: 'claude-3-5-sonnet',
|
||
provider: 'anthropic',
|
||
isMainBranch: false,
|
||
branchName: 'claude-3-5-sonnet',
|
||
author: 'Claude 3.5 Sonnet',
|
||
summary: 'Alternative modular setup using Anthropic Sonnet',
|
||
boundArtifactVersions: {
|
||
'art-fe-ecom': 1,
|
||
'art-be-ecom': 1,
|
||
'art-db-ecom': 1,
|
||
},
|
||
boundVersions: [
|
||
{ artifactId: 'art-fe-ecom', versionNumber: 1 },
|
||
{ artifactId: 'art-be-ecom', versionNumber: 1 },
|
||
{ artifactId: 'art-db-ecom', versionNumber: 1 },
|
||
],
|
||
},
|
||
{
|
||
id: 'snap-v2-main',
|
||
versionLabel: 'v2',
|
||
versionTag: 'v2.0.0',
|
||
commitHash: 'e4f5g6h',
|
||
commitMessage: 'Cart Drawer & Tax Calculation Implementation',
|
||
createdAt: '2026-08-08T05:02:15.000Z',
|
||
timestamp: '05:02 AM',
|
||
createdByModel: 'gemini-3.7-flash',
|
||
generatedByModel: 'gemini-3.7-flash',
|
||
provider: 'google',
|
||
isMainBranch: true,
|
||
branchName: 'main',
|
||
parentSnapshotId: 'snap-v1-main',
|
||
author: 'Gemini 3.7 Flash',
|
||
summary: 'Slide-out cart drawer, tax logic, and item quantity triggers',
|
||
boundArtifactVersions: {
|
||
'art-fe-ecom': 2,
|
||
'art-be-ecom': 1,
|
||
'art-db-ecom': 1,
|
||
},
|
||
boundVersions: [
|
||
{ artifactId: 'art-fe-ecom', versionNumber: 2 },
|
||
{ artifactId: 'art-be-ecom', versionNumber: 1 },
|
||
{ artifactId: 'art-db-ecom', versionNumber: 1 },
|
||
],
|
||
},
|
||
{
|
||
id: 'snap-v2-gpt4o',
|
||
versionLabel: 'v2',
|
||
versionTag: 'v2.0.0-gpt4o',
|
||
commitHash: '7b8c9d0',
|
||
commitMessage: 'Cart Drawer Variant via GPT-4o Omni',
|
||
createdAt: '2026-08-08T05:02:15.000Z',
|
||
timestamp: '05:02 AM',
|
||
createdByModel: 'gpt-4o',
|
||
generatedByModel: 'gpt-4o',
|
||
provider: 'openai',
|
||
isMainBranch: false,
|
||
branchName: 'gpt-4o',
|
||
parentSnapshotId: 'snap-v1-main',
|
||
author: 'GPT-4o Omni',
|
||
summary: 'Alternative cart drawer modal with custom animation hooks',
|
||
boundArtifactVersions: {
|
||
'art-fe-ecom': 2,
|
||
'art-be-ecom': 1,
|
||
'art-db-ecom': 1,
|
||
},
|
||
boundVersions: [
|
||
{ artifactId: 'art-fe-ecom', versionNumber: 2 },
|
||
{ artifactId: 'art-be-ecom', versionNumber: 1 },
|
||
{ artifactId: 'art-db-ecom', versionNumber: 1 },
|
||
],
|
||
},
|
||
{
|
||
id: 'snap-v2-claude',
|
||
versionLabel: 'v2',
|
||
versionTag: 'v2.0.0-claude',
|
||
commitHash: '3f2e1d0',
|
||
commitMessage: 'Cart Drawer Variant via Claude 3.5 Sonnet',
|
||
createdAt: '2026-08-08T05:02:15.000Z',
|
||
timestamp: '05:02 AM',
|
||
createdByModel: 'claude-3-5-sonnet',
|
||
generatedByModel: 'claude-3-5-sonnet',
|
||
provider: 'anthropic',
|
||
isMainBranch: false,
|
||
branchName: 'claude-3-5-sonnet',
|
||
parentSnapshotId: 'snap-v1-claude',
|
||
author: 'Claude 3.5 Sonnet',
|
||
summary: 'Alternative cart drawer using headless Radix dialog primitives',
|
||
boundArtifactVersions: {
|
||
'art-fe-ecom': 2,
|
||
'art-be-ecom': 1,
|
||
'art-db-ecom': 1,
|
||
},
|
||
boundVersions: [
|
||
{ artifactId: 'art-fe-ecom', versionNumber: 2 },
|
||
{ artifactId: 'art-be-ecom', versionNumber: 1 },
|
||
{ artifactId: 'art-db-ecom', versionNumber: 1 },
|
||
],
|
||
},
|
||
];
|
||
|
||
export const INITIAL_SESSIONS: Session[] = [
|
||
{
|
||
id: 'sess-buckets-booking',
|
||
projectId: 'proj-buckets-booking',
|
||
title: 'Buckets AI Booking Assistant & Availability Implementation',
|
||
createdAt: '2026-08-14T07:00:00.000Z',
|
||
updatedAt: '2026-08-14T07:30:00.000Z',
|
||
referencedArtifacts: [
|
||
{ artifactId: 'art-fe-buckets', versionNumber: 1 },
|
||
{ artifactId: 'art-be-buckets', versionNumber: 1 },
|
||
],
|
||
messages: [
|
||
{
|
||
id: 'msg-bkt-1',
|
||
sessionId: 'sess-buckets-booking',
|
||
role: 'user',
|
||
timestamp: '2026-08-14T07:00:00.000Z',
|
||
content: 'Integrate buckets-id.stble.fi to build an AI Booking Concierge application with real-time SSE streaming, authoritative calendar slot calculations, and customer reservation confirmations.',
|
||
referencedArtifacts: [
|
||
{
|
||
artifactId: 'art-fe-buckets',
|
||
versionNumber: 1,
|
||
title: 'Buckets AI Booking Concierge Web App',
|
||
type: 'frontend',
|
||
},
|
||
{
|
||
artifactId: 'art-be-buckets',
|
||
versionNumber: 1,
|
||
title: 'Buckets Customer BFF & Webhook Receiver',
|
||
type: 'backend',
|
||
},
|
||
],
|
||
},
|
||
{
|
||
id: 'msg-bkt-2',
|
||
sessionId: 'sess-buckets-booking',
|
||
role: 'assistant',
|
||
timestamp: '2026-08-14T07:02:15.000Z',
|
||
content: `I have scaffolded and connected the complete **Buckets.id AI Booking & Concierge Web Application** to the staging environment at **https://buckets-id.stble.fi**!
|
||
|
||
### Key Architecture Components:
|
||
1. **Frontend Client Application (\`art-fe-buckets\` v1)**:
|
||
- React 19 single-page application with split-view AI chat assistant and interactive calendar slot picker.
|
||
- Authoritative slot discovery through Buckets find_open_slots; the generated app never calculates business availability locally.
|
||
- Policy-driven booking lifecycle with create, reschedule, cancel, approval states, and human handoff.
|
||
2. **Backend Customer BFF & Webhook Receiver (\`art-be-buckets\` v1)**:
|
||
- Thin Node.js BFF for customer OAuth/session handling, Buckets API/SSE pass-through, and canonical timestamped HMAC verification for real Buckets events.
|
||
3. **Bound Snapshot (\`snap-bkt-v1\`)**:
|
||
- Snapshot binding frontend and backend deliverables into a single reproducible release ready for deployment!`,
|
||
activeVariantIndex: 0,
|
||
selectedModelId: 'gemini-3.7-flash',
|
||
variants: [
|
||
{
|
||
id: 'var-bkt-1',
|
||
modelId: 'gemini-3.7-flash',
|
||
provider: 'google',
|
||
modelName: 'Gemini 3.7 Flash',
|
||
isMain: true,
|
||
snapshotId: 'snap-bkt-v1',
|
||
content: `I have scaffolded and connected the complete **Buckets.id AI Booking & Concierge Web Application** to the staging environment at **https://buckets-id.stble.fi**!`,
|
||
deliverablesExtracted: [
|
||
{
|
||
artifactId: 'art-fe-buckets',
|
||
versionNumber: 1,
|
||
title: 'Buckets AI Booking Concierge Web App',
|
||
summary: 'Conversational booking assistant and live calendar slot picker.',
|
||
filesCount: 2,
|
||
},
|
||
{
|
||
artifactId: 'art-be-buckets',
|
||
versionNumber: 1,
|
||
title: 'Buckets Customer BFF & Webhook Receiver',
|
||
summary: 'Express webhook receiver and staging proxy.',
|
||
filesCount: 1,
|
||
},
|
||
],
|
||
logs: [
|
||
{ id: 'lb1', timestamp: '07:00:01 AM', step: 'Querying Buckets MCP tool: buckets_integration_inspect', status: 'success', detail: 'Developer MCP contract selected for build-time configuration; runtime remains on customer APIs' },
|
||
{ id: 'lb2', timestamp: '07:00:02 AM', step: 'Ensuring Agent & Scheduling Rules via buckets_agent_ensure', status: 'success', detail: 'Booking Assistant plan includes managed Agent plus deterministic booking runtime tools' },
|
||
{ id: 'lb3', timestamp: '07:00:04 AM', step: 'Scaffolding React 19 Frontend & Customer BFF Artifacts', status: 'success', detail: 'Compiled art-fe-buckets and art-be-buckets' },
|
||
{ id: 'lb4', timestamp: '07:02:14 AM', step: 'Created Snapshot snap-bkt-v1', status: 'success', detail: 'Bound to main release' },
|
||
],
|
||
},
|
||
],
|
||
deliverablesExtracted: [
|
||
{
|
||
artifactId: 'art-fe-buckets',
|
||
versionNumber: 1,
|
||
title: 'Buckets AI Booking Concierge Web App',
|
||
summary: 'Conversational booking assistant and live calendar slot picker.',
|
||
filesCount: 2,
|
||
},
|
||
],
|
||
logs: [
|
||
{ id: 'lb1', timestamp: '07:00:01 AM', step: 'Querying Buckets MCP tool: buckets_integration_inspect', status: 'success', detail: 'Developer MCP contract selected for build-time configuration; runtime remains on customer APIs' },
|
||
{ id: 'lb2', timestamp: '07:00:02 AM', step: 'Ensuring Agent & Scheduling Rules via buckets_agent_ensure', status: 'success', detail: 'Booking Assistant plan includes managed Agent plus deterministic booking runtime tools' },
|
||
{ id: 'lb3', timestamp: '07:00:04 AM', step: 'Scaffolding React 19 Frontend & Customer BFF Artifacts', status: 'success', detail: 'Compiled art-fe-buckets and art-be-buckets' },
|
||
{ id: 'lb4', timestamp: '07:02:14 AM', step: 'Created Snapshot snap-bkt-v1', status: 'success', detail: 'Bound to main release' },
|
||
],
|
||
},
|
||
],
|
||
},
|
||
{
|
||
id: 'sess-cart-feature',
|
||
projectId: 'proj-ecommerce',
|
||
title: 'Cart Drawer & Tax Calculation Implementation',
|
||
createdAt: '2026-08-08T05:00:00.000Z',
|
||
updatedAt: '2026-08-08T05:30:00.000Z',
|
||
referencedArtifacts: [
|
||
{ artifactId: 'art-fe-ecom', versionNumber: 2 },
|
||
{ artifactId: 'art-be-ecom', versionNumber: 1 },
|
||
],
|
||
messages: [
|
||
{
|
||
id: 'msg-1',
|
||
sessionId: 'sess-cart-feature',
|
||
role: 'user',
|
||
timestamp: '2026-08-08T05:00:00.000Z',
|
||
content: 'Please update our storefront React frontend code. We need a slide-out cart drawer modal with quantity increment/decrement, 8% tax calculation, and total price calculation.',
|
||
referencedArtifacts: [
|
||
{
|
||
artifactId: 'art-fe-ecom',
|
||
versionNumber: 2,
|
||
title: 'Frontend Storefront Codebase',
|
||
type: 'frontend',
|
||
},
|
||
{
|
||
artifactId: 'art-be-ecom',
|
||
versionNumber: 1,
|
||
title: 'Backend API Service',
|
||
type: 'backend',
|
||
},
|
||
],
|
||
},
|
||
{
|
||
id: 'msg-2',
|
||
sessionId: 'sess-cart-feature',
|
||
role: 'assistant',
|
||
timestamp: '2026-08-08T05:02:15.000Z',
|
||
content: `I have updated the **Frontend Storefront Codebase** to include the slide-out Cart Drawer with responsive tax calculations and quantity controls.
|
||
|
||
### Summary of Changes Made:
|
||
1. Created an interactive \`isCartOpen\` state and slide-out backdrop drawer overlay.
|
||
2. Implemented quantity accumulation, subtotal calculations, and 8% tax calculations.
|
||
3. Added Lucide React icon triggers for seamless UI interaction.
|
||
|
||
The deliverable has been automatically compiled into **Frontend Storefront Codebase (v2)**!`,
|
||
activeVariantIndex: 0,
|
||
selectedModelId: 'gemini-3.7-flash',
|
||
variants: [
|
||
{
|
||
id: 'var-1',
|
||
modelId: 'gemini-3.7-flash',
|
||
provider: 'google',
|
||
modelName: 'Gemini 3.7 Flash',
|
||
isMain: true,
|
||
snapshotId: 'snap-v2-main',
|
||
content: `I have updated the **Frontend Storefront Codebase** to include the slide-out Cart Drawer with responsive tax calculations and quantity controls.
|
||
|
||
### Summary of Changes Made:
|
||
1. Created an interactive \`isCartOpen\` state and slide-out backdrop drawer overlay.
|
||
2. Implemented quantity accumulation, subtotal calculations, and 8% tax calculations.
|
||
3. Added Lucide React icon triggers for seamless UI interaction.
|
||
|
||
The deliverable has been automatically compiled into **Frontend Storefront Codebase (v2)**!`,
|
||
deliverablesExtracted: [
|
||
{
|
||
artifactId: 'art-fe-ecom',
|
||
versionNumber: 2,
|
||
title: 'Frontend Storefront Codebase',
|
||
summary: 'Added Cart drawer modal, quantity selectors, and instant tax estimator.',
|
||
filesCount: 2,
|
||
},
|
||
],
|
||
logs: [
|
||
{ id: 'l1', timestamp: '05:00:01 AM', step: 'Initializing LLM Context & Artifact Snapshots', status: 'success', detail: 'Loaded frontend (v1) and backend (v1) bound context' },
|
||
{ id: 'l2', timestamp: '05:00:02 AM', step: 'Authenticating Google GenAI Provider', status: 'success', detail: 'Using model: gemini-3.7-flash' },
|
||
{ id: 'l3', timestamp: '05:00:05 AM', step: 'Streaming AI Code Generation', status: 'success', detail: 'Completed 100% output in 1.4s' },
|
||
{ id: 'l4', timestamp: '05:02:14 AM', step: 'Bound Snapshot Created', status: 'success', detail: 'Generated snapshot snap-v2-main (FE v2 bound to BE v1)' },
|
||
],
|
||
},
|
||
{
|
||
id: 'var-2',
|
||
modelId: 'gpt-4o',
|
||
provider: 'openai',
|
||
modelName: 'GPT-4o (Omni)',
|
||
isMain: false,
|
||
snapshotId: 'snap-v2-gpt4o',
|
||
content: `Here is the alternative solution generated using **GPT-4o**. I have added the slide-out Cart Drawer with custom animations and tax summary logic.
|
||
|
||
### Technical Overview:
|
||
- Integrated modular slide-out container.
|
||
- Added 8% tax calculator helper with currency formatting.
|
||
- Linked to active project snapshot v2-experimental.`,
|
||
deliverablesExtracted: [
|
||
{
|
||
artifactId: 'art-fe-ecom',
|
||
versionNumber: 2,
|
||
title: 'Frontend Storefront Codebase (GPT-4o variant)',
|
||
summary: 'Modular cart drawer with animated side panel.',
|
||
filesCount: 2,
|
||
},
|
||
],
|
||
logs: [
|
||
{ id: 'l1b', timestamp: '05:00:01 AM', step: 'Initializing LLM Context & Artifact Snapshots', status: 'success', detail: 'Loaded frontend (v1) and backend (v1) bound context' },
|
||
{ id: 'l2b', timestamp: '05:00:03 AM', step: 'Authenticating OpenAI Provider Engine', status: 'success', detail: 'Using model: gpt-4o' },
|
||
{ id: 'l3b', timestamp: '05:00:08 AM', step: 'Streaming Code Generation', status: 'success', detail: 'Completed in 2.1s' },
|
||
],
|
||
},
|
||
],
|
||
deliverablesExtracted: [
|
||
{
|
||
artifactId: 'art-fe-ecom',
|
||
versionNumber: 2,
|
||
title: 'Frontend Storefront Codebase',
|
||
summary: 'Added Cart drawer modal, quantity selectors, and instant tax estimator.',
|
||
filesCount: 2,
|
||
},
|
||
],
|
||
logs: [
|
||
{ id: 'l1', timestamp: '05:00:01 AM', step: 'Initializing LLM Context & Artifact Snapshots', status: 'success', detail: 'Loaded frontend (v1) and backend (v1) bound context' },
|
||
{ id: 'l2', timestamp: '05:00:02 AM', step: 'Authenticating Google GenAI Provider', status: 'success', detail: 'Using model: gemini-3.7-flash' },
|
||
{ id: 'l3', timestamp: '05:00:05 AM', step: 'Streaming AI Code Generation', status: 'success', detail: 'Completed 100% output in 1.4s' },
|
||
{ id: 'l4', timestamp: '05:02:14 AM', step: 'Bound Snapshot Created', status: 'success', detail: 'Generated snapshot snap-v2-main (FE v2 bound to BE v1)' },
|
||
],
|
||
},
|
||
],
|
||
},
|
||
];
|