Extract 515 strings by codemod, and the two bugs only a screenshot caught

Wrapping ~1,000 strings by hand is a thousand chances to mistype the copy
itself, and a parser does not get bored. scripts/i18n-extract.mjs does the
mechanical part -- JSX text and the attributes a person actually reads -- and
refuses the rest rather than guessing. 78% now: 515 wrapped, 143 left.

What it refuses matters as much as what it does. Text split around an
interpolation arrives as separate fragments, and wrapping each on its own
produces "Move " and " messages", which no translator can do anything with;
those are listed for a person to rebuild as sentences. So is anything
containing a double quote, which would end the literal.

Three things it had to be taught, each found by running it:

- <code>, <kbd> and <pre> are not prose. The first run wrapped `label:name`
  inside <code> -- a search operator, where translating it breaks the thing it
  documents. Subtrees marked translate="no" are skipped for the same reason.
- `t` is a natural name for a callback parameter and several files already use
  it, so an import called `t` is shadowed inside those callbacks -- silently,
  wherever the local happens to be callable. The name is checked per file now
  and aliased to `translate` where it is taken.
- JSX decodes HTML entities and a JS string literal does not, so
  `Language &amp; region` moved into t("...") and rendered the entity on screen.

That last one is the one worth remembering. Typecheck passed, 443 tests
passed, and the page said "Language &amp; region" in plain sight. It took
looking at a screenshot, and then a sweep of ten views to find the second
occurrence in a sentence I had written by hand earlier the same day. Nothing
in the toolchain was ever going to catch it: it is valid TypeScript rendering
valid text that happens to be wrong.

The codemod decodes entities now, and checks for a quote after decoding rather
than before.

web/src/views/files/FilesTree.tsx

@@ -11,6 +11,7 @@ import { confirmDialog, promptDialog } from "@/ui/dialog";
 import { toast } from "@/ui/toast";
 import { loadRaw, saveJson } from "@/lib/storage";
 import { ShareDialog } from "../settings/ShareDialog";
+import { t } from "@/lib/i18n";
 
 /**
  * Re-read the session, so the shared accounts on offer are current.
@@ -172,7 +173,7 @@ export function FilesTree() {
           </button>
           {open && kids.length ? <FolderOpen size={17} /> : <Folder size={17} />}
           <span className="grow truncate">{d.name}</span>
-          {isShared(d) && <Share2 size={12} className="faint" aria-label="Shared" />}
+          {isShared(d) && <Share2 size={12} className="faint" aria-label={t("Shared")} />}
         </div>
         {open && kids.map((k) => row(k, depth + 1))}
       </div>
@@ -204,11 +205,11 @@ export function FilesTree() {
       {(viewingShare || sharedAccounts.length > 0) && (
         <>
           <div className="nav-section">
-            <span>Shared with me</span>
+            <span>{t("Shared with me")}</span>
             <button
               className="icon-btn sm"
-              title="Check for new shares"
-              aria-label="Check for new shares"
+              title={t("Check for new shares")}
+              aria-label={t("Check for new shares")}
               onClick={async () => { setRefreshing(true); await refreshShares(true); setRefreshing(false); }}
             >
               <RefreshCw size={14} className={refreshing ? "spin" : ""} />
@@ -218,7 +219,7 @@ export function FilesTree() {
             <div className="nav-item" onClick={() => { useFiles.getState().openAccount(ownAccountId); navigate("/files"); }}>
               <span className="nav-twisty" aria-hidden="true" />
               <HardDrive size={17} />
-              <span className="grow truncate">Back to my files</span>
+              <span className="grow truncate">{t("Back to my files")}</span>
             </div>
           )}
           {sharedAccounts.map((a) => (
@@ -232,14 +233,14 @@ export function FilesTree() {
               <span className="grow truncate">{a.name}</span>
             </div>
           ))}
-          {!sharedAccounts.length && <p className="hint" style={{ padding: "4px 12px" }}>Nothing is shared with you.</p>}
+          {!sharedAccounts.length && <p className="hint" style={{ padding: "4px 12px" }}>{t("Nothing is shared with you.")}</p>}
         </>
       )}
 
       <Popover anchor={menu.anchor} onClose={menu.close} width={210}>
         <MenuItem
           icon={<FolderPlus size={16} />}
-          label="New folder"
+          label={t("New folder")}
           onClick={async () => {
             const name = await promptDialog({ title: "New folder", placeholder: "Folder name" });
             if (!name?.trim()) return;
@@ -255,7 +256,7 @@ export function FilesTree() {
           <>
             <MenuItem
               icon={<Pencil size={16} />}
-              label="Rename"
+              label={t("Rename")}
               disabled={!menuNode.myRights?.mayRename}
               onClick={async () => {
                 const name = await promptDialog({ title: "Rename", defaultValue: menuNode.name });
@@ -267,12 +268,12 @@ export function FilesTree() {
                 }
               }}
             />
-            <MenuItem icon={<Share2 size={16} />} label="Share…" disabled={!menuNode.myRights?.mayShare} onClick={() => setShareNode(menuNode)} />
+            <MenuItem icon={<Share2 size={16} />} label={t("Share…")} disabled={!menuNode.myRights?.mayShare} onClick={() => setShareNode(menuNode)} />
             <MenuSep />
             <MenuItem
               danger
               icon={<Trash2 size={16} />}
-              label="Delete"
+              label={t("Delete")}
               disabled={!menuNode.myRights?.mayDelete}
               onClick={async () => {
                 if (!(await confirmDialog({ title: `Delete “${menuNode.name}”?`, message: "Everything inside it goes too.", confirmLabel: "Delete", danger: true }))) return;