Initial commit: Port Nimara CRM (Layers 0-4)

Full CRM rebuild with Next.js 15, TypeScript, Tailwind, Drizzle ORM,
PostgreSQL, Redis, BullMQ, MinIO, and Socket.io. Includes 461 source
files covering clients, berths, interests/pipeline, documents/EOI,
expenses/invoices, email, notifications, dashboard, admin, and
client portal. CI/CD via Gitea Actions with Docker builds.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

src/components/admin/queue-overview.tsx

@@ -0,0 +1,75 @@
+'use client';
+
+import { useParams, useRouter } from 'next/navigation';
+import { cn } from '@/lib/utils';
+import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
+import type { QueueStatus } from '@/lib/services/system-monitoring.service';
+
+interface QueueOverviewProps {
+  queues: QueueStatus[];
+}
+
+interface StatPillProps {
+  label: string;
+  value: number;
+  highlight?: boolean;
+}
+
+function StatPill({ label, value, highlight }: StatPillProps) {
+  return (
+    <div className="flex flex-col items-center">
+      <span
+        className={cn(
+          'text-lg font-bold leading-none',
+          highlight && value > 0 ? 'text-destructive' : 'text-foreground',
+        )}
+      >
+        {value}
+      </span>
+      <span className="text-[10px] text-muted-foreground mt-0.5 uppercase tracking-wide">
+        {label}
+      </span>
+    </div>
+  );
+}
+
+export function QueueOverview({ queues }: QueueOverviewProps) {
+  const router = useRouter();
+  const params = useParams<{ portSlug: string }>();
+
+  function handleQueueClick(queueName: string) {
+    router.push(`/${params.portSlug}/admin/monitoring/${queueName}` as any);
+  }
+
+  return (
+    <div className="grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-5 gap-3">
+      {queues.map((queue) => (
+        <Card
+          key={queue.name}
+          className="cursor-pointer hover:border-primary/50 transition-colors"
+          onClick={() => handleQueueClick(queue.name)}
+          role="button"
+          tabIndex={0}
+          onKeyDown={(e) => e.key === 'Enter' && handleQueueClick(queue.name)}
+        >
+          <CardHeader className="p-3 pb-0">
+            <CardTitle className="text-xs font-semibold capitalize truncate">{queue.name}</CardTitle>
+          </CardHeader>
+          <CardContent className="p-3 pt-2">
+            <div className="grid grid-cols-2 gap-x-2 gap-y-1">
+              <StatPill label="wait" value={queue.waiting} />
+              <StatPill label="active" value={queue.active} />
+              <StatPill label="done" value={queue.completed} />
+              <StatPill label="failed" value={queue.failed} highlight />
+            </div>
+            {queue.delayed > 0 && (
+              <p className="text-[10px] text-muted-foreground text-center mt-1">
+                {queue.delayed} delayed
+              </p>
+            )}
+          </CardContent>
+        </Card>
+      ))}
+    </div>
+  );
+}