Add React frontend and clean up legacy HTTP backend

2026-06-15 22:20:56 +02:00
parent b8e2d15e27
commit beaf142ee4
40 changed files with 8328 additions and 437 deletions
@@ -0,0 +1,56 @@
+import { useState } from 'react';
+import type { PlayerInfo } from '../types';
+import { computeTotal } from '../lib/standings';
+
+interface Props {
+  standings: number[][][];
+  players: PlayerInfo[];
+}
+
+export default function Standings({ standings, players }: Props) {
+  const [open, setOpen] = useState(false);
+
+  const sorted = [...players]
+    .map((p) => ({ ...p, total: computeTotal(standings, p.order) }))
+    .sort((a, b) => b.total - a.total);
+
+  return (
+    <div className="bg-slate-800 rounded-xl overflow-hidden">
+      <button
+        onClick={() => setOpen((o) => !o)}
+        className="w-full flex justify-between items-center px-4 py-2 text-sm font-semibold text-gray-200 hover:bg-slate-700"
+      >
+        <span>Skore</span>
+        <span>{open ? '▲' : '▼'}</span>
+      </button>
+      {open && (
+        <table className="w-full text-sm text-center">
+          <thead>
+            <tr className="text-gray-400 border-b border-slate-700">
+              <th className="py-1 px-2 text-left">Hrac</th>
+              {standings.map((_, si) => (
+                <th key={si} className="py-1 px-2">S{si + 1}</th>
+              ))}
+              <th className="py-1 px-2">Spolu</th>
+            </tr>
+          </thead>
+          <tbody>
+            {sorted.map((p) => (
+              <tr key={p.order} className="border-b border-slate-700/50">
+                <td className="py-1 px-2 text-left text-gray-200">{p.name}</td>
+                {standings.map((series, si) => {
+                  return (
+                    <td key={si} className="py-1 px-2 text-gray-300">
+                      {computeTotal([series], p.order)}
+                    </td>
+                  );
+                })}
+                <td className="py-1 px-2 font-bold text-white">{p.total}</td>
+              </tr>
+            ))}
+          </tbody>
+        </table>
+      )}
+    </div>
+  );
+}