feat(files): API tokens in Settings, the Hub folder in Files, a notice before a token runs out

Settings gains an API tokens tab: a row per token (name and prefix; each
folder with its rights; last use and expiry, "expires soon" marked),
revoked from its menu behind a confirm. A new token is the Hub exchange in
one click, or folders and rights picked per folder (no Write where an
upload cannot land); expiry 30/90 days, 1 year or never (warned). The
token shows once in the same dialog, with Copy and a ready curl line.

The Hub folder closes the Sources in the Files rail, takes uploads and
moved-in files. A token about to run out warns its user once, a week
before (the Files GC's sixth pass); the notice opens the tokens tab.

frontend/src/components/SettingsPanel.tsx

@@ -9,6 +9,7 @@ import {
   Bell,
   Check,
   Download,
+  KeyRound,
   Loader2,
   Monitor,
   RefreshCw,
@@ -17,6 +18,8 @@ import {
 } from "lucide-react";
 import { DownloadFormats } from "./ProfileEditor";
 import DiagnosticsSettings from "./DiagnosticsSettings";
+import ApiTokens from "./ApiTokens";
+import { type SettingsTabId } from "../lib/settingsTab";
 import { SCHEMES, type Scheme, type ThemePrefs } from "../lib/theme";
 import { api, HttpError, type Me } from "../lib/api";
 import { displayName, roleKey } from "../lib/api/account";
@@ -61,11 +64,12 @@ export interface PrefsController {
   saveState: PrefsSaveState;
 }
 
-type TabId = "appearance" | "notifications" | "downloads" | "account" | "diagnostics";
+type TabId = SettingsTabId;
 const TABS: { id: TabId; icon: typeof Monitor }[] = [
   { id: "appearance", icon: Monitor },
   { id: "notifications", icon: Bell },
   { id: "downloads", icon: Download },
+  { id: "tokens", icon: KeyRound },
   { id: "account", icon: User },
   { id: "diagnostics", icon: Activity },
 ];
@@ -114,6 +118,7 @@ export default function SettingsPanel() {
             {tab === "appearance" && <Appearance prefs={prefs} />}
             {tab === "notifications" && <Notifications prefs={prefs} />}
             {tab === "downloads" && <Downloads />}
+            {tab === "tokens" && <ApiTokens />}
             {tab === "account" && <Account me={me} onOpenWizard={openWizard} />}
             {tab === "diagnostics" && <DiagnosticsSettings />}
           </div>