feat: language picker with flags, paging and follow mode, translation run in the floating window

Language picker with search and SVG flags, real pagination with locate, one global machine translation run shown next to uploads.

Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>

frontend/tests/paging.test.mjs

@@ -0,0 +1,25 @@
+import assert from "node:assert/strict";
+import { fileURLToPath } from "node:url";
+import { test } from "node:test";
+import { build } from "esbuild";
+
+const out = await build({ entryPoints: [fileURLToPath(new URL("../src/ui/paging.ts", import.meta.url))],
+  bundle: true, write: false, format: "esm", platform: "node", logLevel: "silent" });
+const { pageNumbers } = await import(`data:text/javascript;base64,${Buffer.from(out.outputFiles[0].text).toString("base64")}`);
+
+test("few pages are all listed", () => {
+  assert.deepEqual(pageNumbers(0, 1), [0]);
+  assert.deepEqual(pageNumbers(2, 5), [0, 1, 2, 3, 4]);
+  assert.deepEqual(pageNumbers(0, 7), [0, 1, 2, null, 6]);
+});
+
+test("a long list keeps the ends and the neighbourhood, with gaps between", () => {
+  assert.deepEqual(pageNumbers(0, 100), [0, 1, 2, null, 99]);
+  assert.deepEqual(pageNumbers(50, 100), [0, null, 48, 49, 50, 51, 52, null, 99]);
+  assert.deepEqual(pageNumbers(99, 100), [0, null, 97, 98, 99]);
+});
+
+test("a gap of exactly one page shows that page instead of dots", () => {
+  assert.deepEqual(pageNumbers(4, 10), [0, 1, 2, 3, 4, 5, 6, null, 9]);
+  assert.deepEqual(pageNumbers(3, 10), [0, 1, 2, 3, 4, 5, null, 9]);
+});