Add agent workflows & stuff

apps/next/src/app/(app)/dashboard/page.tsx

@@ -3,8 +3,15 @@
 import Link from 'next/link';
 import { MetricCard } from '@/components/dashboard/metric-card';
 import { SpoonCard } from '@/components/spoons/spoon-card';
+import { MaintenanceQueue } from '@/components/updates/maintenance-queue';
 import { useQuery } from 'convex/react';
-import { Bot, GitBranch, GitPullRequest, RefreshCw } from 'lucide-react';
+import {
+  Bot,
+  GitBranch,
+  GitPullRequest,
+  RefreshCw,
+  ShieldCheck,
+} from 'lucide-react';
 
 import { api } from '@spoon/backend/convex/_generated/api.js';
 import { Button, Card, CardContent, CardHeader, CardTitle } from '@spoon/ui';
@@ -14,12 +21,18 @@ const DashboardPage = () => {
   const syncRuns = useQuery(api.syncRuns.listRecent, { limit: 5 }) ?? [];
   const agentRequests =
     useQuery(api.agentRequests.listRecent, { limit: 5 }) ?? [];
+  const aiReviews = useQuery(api.aiReviews.listRecent, { limit: 5 }) ?? [];
   const activeSpoons = spoons.filter(
     (spoon) => spoon.status === 'active',
   ).length;
-  const needsReview = syncRuns.filter(
-    (run) => run.status === 'needs_review',
+  const behind = spoons.filter((spoon) => spoon.syncStatus === 'behind').length;
+  const diverged = spoons.filter(
+    (spoon) => spoon.syncStatus === 'diverged',
   ).length;
+  const openPullRequests = spoons.reduce(
+    (total, spoon) => total + (spoon.upstreamAheadBy ?? 0),
+    0,
+  );
 
   return (
     <main className='space-y-6'>
@@ -49,9 +62,9 @@ const DashboardPage = () => {
           icon={GitPullRequest}
         />
         <MetricCard
-          label='Needs review'
-          value={needsReview}
-          note='Upstream updates'
+          label='Behind upstream'
+          value={behind}
+          note={`${diverged} diverged`}
           icon={RefreshCw}
         />
         <MetricCard
@@ -60,8 +73,19 @@ const DashboardPage = () => {
           note='Queued and recent'
           icon={Bot}
         />
+        <MetricCard
+          label='Upstream commits'
+          value={openPullRequests}
+          note='Waiting across Spoons'
+          icon={ShieldCheck}
+        />
       </div>
 
+      <section className='space-y-3'>
+        <h2 className='text-lg font-semibold'>Maintenance queue</h2>
+        <MaintenanceQueue spoons={spoons} />
+      </section>
+
       <div className='grid gap-6 xl:grid-cols-2'>
         <section className='space-y-3'>
           <h2 className='text-lg font-semibold'>Recent Spoons</h2>
@@ -112,6 +136,35 @@ const DashboardPage = () => {
               )}
             </CardContent>
           </Card>
+          <Card className='mt-4 shadow-none'>
+            <CardHeader>
+              <CardTitle className='text-base'>AI reviews</CardTitle>
+            </CardHeader>
+            <CardContent>
+              {aiReviews.length ? (
+                <div className='space-y-3'>
+                  {aiReviews.map((review) => (
+                    <div
+                      key={review._id}
+                      className='border-border border p-3 text-sm'
+                    >
+                      <p className='font-medium capitalize'>
+                        {review.risk} risk
+                      </p>
+                      <p className='text-muted-foreground'>
+                        {review.outputSummary ?? review.inputSummary}
+                      </p>
+                    </div>
+                  ))}
+                </div>
+              ) : (
+                <p className='text-muted-foreground text-sm'>
+                  OpenAI compatibility reviews will appear here after you run
+                  them on a Spoon.
+                </p>
+              )}
+            </CardContent>
+          </Card>
         </section>
       </div>
     </main>