Initialization

2026-06-15 19:01:02 +08:00
commit 325c267f0c
28 changed files with 12087 additions and 0 deletions
@@ -0,0 +1,70 @@
+"use client"
+
+import { COLORS } from "@/components/logic"
+
+interface SingleModePanelProps {
+  singleBatches: { numbers: number[]; colorIndex: number; batchNumber: number }[]
+}
+
+export function SingleModePanel({ singleBatches }: SingleModePanelProps) {
+  if (singleBatches.length === 0) {
+    return (
+      <div className="flex flex-col items-center justify-center h-12 gap-3">
+        <div className="text-[10px] tracking-[0.2em] text-[#cdd2d8] font-mono uppercase">
+          — AWAITING INPUT —
+        </div>
+      </div>
+    )
+  }
+
+  // Reverse to show newest first
+  const reversedBatches = [...singleBatches].reverse()
+
+  return (
+    <div className="flex flex-col h-full overflow-hidden">
+      {/* Stats */}
+      <div className="flex items-center gap-4 px-5 py-2 border-b border-[#e2e6ea] flex-shrink-0">
+        <span className="text-[10px] tracking-[0.2em] uppercase text-[#8a95a1]">RECORDS</span>
+        <span className="flex-1 h-px bg-[#e2e6ea]" />
+        <span className="text-[10px] text-[#0f141a]">
+          {singleBatches.length} BATCHES
+        </span>
+      </div>
+
+      {/* Records grid - newest first, wrapping */}
+      <div className="flex-1 overflow-y-auto scrollbar-thin px-5 py-3">
+        <div className="flex flex-wrap gap-2">
+          {reversedBatches.map((batch, displayIdx) => {
+            const actualIdx = singleBatches.length - 1 - displayIdx
+            return (
+              <div
+                key={`batch-${batch.batchNumber}`}
+                className="flex items-center gap-2 px-3 py-2 border border-[#e2e6ea] fui-slide-up"
+                style={{ animationDelay: `${displayIdx * 20}ms` }}
+              >
+                {/* Color indicator */}
+                <div
+                  className="w-2 h-2 rounded-full flex-shrink-0"
+                  style={{ backgroundColor: COLORS[batch.colorIndex] }}
+                />
+                {/* Numbers - sorted */}
+                <span
+                  className="text-sm font-mono"
+                  style={{ 
+                    color: COLORS[batch.colorIndex],
+                  }}
+                >
+                  {[...batch.numbers].sort((a, b) => a - b).map(n => String(n).padStart(2, "0")).join(" ")}
+                </span>
+                {/* Batch index */}
+                <span className="text-[9px] text-[#8a95a1] font-mono ml-1">
+                  #{String(batch.batchNumber).padStart(3, "0")}
+                </span>
+              </div>
+            )
+          })}
+        </div>
+      </div>
+    </div>
+  )
+}