#434

frontend/src/components/counts/CountsTableLayout.tsx

@@ -0,0 +1,24 @@
+import { useState } from 'react'
+
+import { CountsLayoutContext, defaultCountWidths, MAX_COUNT_WIDTH, MIN_COUNT_WIDTH }
+    from '@/lib/countsTableLayout'
+
+import type { ReactNode } from 'react'
+
+
+const CountsTableLayout = ({ children }: { children: ReactNode }) => {
+  const [widths, setWidths] = useState<Record<string, number>> ({ })
+  const width = (family: string, key: string) =>
+      widths[`${family}/${key}`] ?? defaultCountWidths[key] ?? 160
+  const resize = (family: string, key: string, value: number) => {
+    const next = Math.round (Math.max (MIN_COUNT_WIDTH, Math.min (MAX_COUNT_WIDTH, value)))
+    setWidths (previous => ({ ...previous, [`${family}/${key}`]: next }))
+  }
+  return (
+      <CountsLayoutContext.Provider value={{ width, resize }}>
+	{children}
+      </CountsLayoutContext.Provider>)
+}
+
+
+export default CountsTableLayout