feat: complete marketing command center with pipeline, UI, and asset generation

- Dashboard with campaign management, asset gallery, and publishing queue
- 7-agent pipeline: trend scout, research, scripts, ad creative, video, copy, distribution
- Campaign form with screenshot upload, goal picker, platform selection
- Campaign detail view with Details/Pipeline/Assets/Chat tabs
- Two-set image generation: Gemini AI (NanoBanana MCP) + Canvas Design posters
- Remotion video rendering with phone.png frame and real screenshot alignment
- honeyDue branding: blue #0079FF, orange #FF9400, Inter font, warm off-white
- Asset cards with source badges (Gemini/Canvas/Remotion/Playwright)
- Markdown/JSON render endpoint for viewing pipeline outputs as HTML
- Settings page with Tavily, Gemini, Postiz, Nextdoor integration management
- Claude Chat for campaign feedback loop with streaming SSE
- Postiz publishing modal with scheduling
- Auth with NextAuth credentials + JWT sessions
- SQLite via Prisma with better-sqlite3 adapter

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Trey t
2026-03-23 21:05:26 -05:00
parent 6b08cfb73a
commit 66c2bbec8b
113 changed files with 12741 additions and 138 deletions
+106
View File
@@ -0,0 +1,106 @@
"use client";
import { useEffect, useState } from "react";
import { Badge } from "@/components/ui/badge";
import {
Card,
CardContent,
CardDescription,
CardHeader,
CardTitle,
} from "@/components/ui/card";
import {
Table,
TableBody,
TableCell,
TableHead,
TableHeader,
TableRow,
} from "@/components/ui/table";
interface QueueAsset {
id: string;
fileName: string;
platform?: string | null;
status: string;
postizPostId?: string | null;
metadata?: string | null;
createdAt: string;
campaign?: { name: string };
}
export default function QueuePage() {
const [assets, setAssets] = useState<QueueAsset[]>([]);
useEffect(() => {
fetch("/api/assets?status=published")
.then((r) => r.json())
.then(setAssets)
.catch(() => {});
}, []);
return (
<div className="space-y-6">
<h1 className="text-3xl font-bold">Publishing Queue</h1>
<Card>
<CardHeader>
<CardTitle>Scheduled & Published</CardTitle>
<CardDescription>
Assets pushed to Postiz for publishing
</CardDescription>
</CardHeader>
<CardContent>
{assets.length === 0 ? (
<p className="text-center text-muted-foreground py-8">
No published assets yet. Approve assets and push them to Postiz.
</p>
) : (
<Table>
<TableHeader>
<TableRow>
<TableHead>Asset</TableHead>
<TableHead>Campaign</TableHead>
<TableHead>Platform</TableHead>
<TableHead>Status</TableHead>
<TableHead>Post ID</TableHead>
</TableRow>
</TableHeader>
<TableBody>
{assets.map((asset) => {
const metadata = asset.metadata
? JSON.parse(asset.metadata)
: {};
return (
<TableRow key={asset.id}>
<TableCell className="font-medium">
{asset.fileName}
{metadata.caption && (
<p className="text-xs text-muted-foreground line-clamp-1 mt-1">
{metadata.caption}
</p>
)}
</TableCell>
<TableCell>{asset.campaign?.name || "—"}</TableCell>
<TableCell>
{asset.platform && (
<Badge variant="outline">{asset.platform}</Badge>
)}
</TableCell>
<TableCell>
<Badge variant="default">{asset.status}</Badge>
</TableCell>
<TableCell className="text-xs text-muted-foreground">
{asset.postizPostId || "—"}
</TableCell>
</TableRow>
);
})}
</TableBody>
</Table>
)}
</CardContent>
</Card>
</div>
);
}