Phase 12: file browser (0.12.0)

Add a full host filesystem browser reachable from the sidebar (/files):
breadcrumb navigation, browse-root chips, show-hidden toggle, and a table
with size/permissions/mtime. Text files open in a Monaco editor (language by
extension); binary/oversized files fall back to download. Admins can create
folders/files, rename, delete (recursive for dirs), upload, and save edits;
download is available to all users. Every mutation is audit-logged.

Backend: new services/file_service.py reuses device_service's sandbox helpers
(confined to ALLOWED_BROWSE_ROOTS, mapped via HOST_ROOT_PREFIX) and rejects
path traversal and deleting a browse root. routers/files.py exposes
/api/files/{list,read,download,write,mkdir,touch,rename,upload,DELETE}
(reads: any user; mutations: admin). device_service.browse entries gained
mtime + symlink (non-breaking).

Deployment: ALLOWED_BROWSE_ROOTS + HOST_ROOT_PREFIX are now env-wired in
docker-compose.yml and .env.example, with a commented /:/host_root mount to
browse/manage the real host filesystem.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

frontend/src/api/files.ts

@@ -0,0 +1,60 @@
+import api from "./client";
+import type { HostPathResult } from "@/types";
+
+export interface FileContent {
+  path: string;
+  content: string | null;
+  size: number;
+  binary: boolean;
+  too_large: boolean;
+}
+
+function triggerDownload(blob: Blob, filename: string) {
+  const url = URL.createObjectURL(blob);
+  const a = document.createElement("a");
+  a.href = url;
+  a.download = filename;
+  document.body.appendChild(a);
+  a.click();
+  a.remove();
+  URL.revokeObjectURL(url);
+}
+
+export const filesApi = {
+  list: (path: string, showHidden = false) =>
+    api
+      .get<HostPathResult>("/api/files/list", { params: { path, show_hidden: showHidden } })
+      .then((r) => r.data),
+
+  read: (path: string) =>
+    api.get<FileContent>("/api/files/read", { params: { path } }).then((r) => r.data),
+
+  write: (path: string, content: string) =>
+    api.put<{ path: string; size: number }>("/api/files/write", { path, content }).then((r) => r.data),
+
+  mkdir: (path: string, name: string) =>
+    api.post<{ path: string }>("/api/files/mkdir", { path, name }).then((r) => r.data),
+
+  touch: (path: string, name: string) =>
+    api.post<{ path: string }>("/api/files/touch", { path, name }).then((r) => r.data),
+
+  rename: (path: string, newName: string) =>
+    api.post<{ path: string }>("/api/files/rename", { path, new_name: newName }).then((r) => r.data),
+
+  remove: (path: string, recursive = false) =>
+    api.delete("/api/files", { params: { path, recursive } }).then((r) => r.data),
+
+  download: async (path: string, filename: string) => {
+    const res = await api.get("/api/files/download", { params: { path }, responseType: "blob" });
+    triggerDownload(res.data as Blob, filename);
+  },
+
+  upload: async (path: string, file: File, overwrite = false) => {
+    const form = new FormData();
+    form.append("path", path);
+    form.append("overwrite", String(overwrite));
+    form.append("file", file);
+    const res = await api.post<{ ok: boolean; name: string }>("/api/files/upload", form);
+    return res.data;
+  },
+};