Add app update detection and multi-folder project support

Feature 1 - Update Detection: Query Gitea releases API on startup (3s
delay) and every 24h, compare patch versions by platform, show pulsing
"Update" button in TopBar with dialog for release notes/downloads.
Settings: auto-check toggle, manual check, dismiss per-version.

Feature 2 - Multi-Folder Projects: Replace single `path` with
`paths: Vec<ProjectPath>` (host_path + mount_name). Each folder mounts
to `/workspace/{mount_name}`. Auto-migrate old single-path JSON on load.
Container recreation via paths-fingerprint label. AddProjectDialog and
ProjectCard support add/remove/edit of multiple folders.

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

app/src/App.tsx

@@ -7,12 +7,14 @@ import TerminalView from "./components/terminal/TerminalView";
 import { useDocker } from "./hooks/useDocker";
 import { useSettings } from "./hooks/useSettings";
 import { useProjects } from "./hooks/useProjects";
+import { useUpdates } from "./hooks/useUpdates";
 import { useAppState } from "./store/appState";
 
 export default function App() {
   const { checkDocker, checkImage } = useDocker();
   const { checkApiKey, loadSettings } = useSettings();
   const { refresh } = useProjects();
+  const { loadVersion, checkForUpdates, startPeriodicCheck } = useUpdates();
   const { sessions, activeSessionId } = useAppState(
     useShallow(s => ({ sessions: s.sessions, activeSessionId: s.activeSessionId }))
   );
@@ -25,6 +27,15 @@ export default function App() {
     });
     checkApiKey();
     refresh();
+
+    // Update detection
+    loadVersion();
+    const updateTimer = setTimeout(() => checkForUpdates(), 3000);
+    const cleanup = startPeriodicCheck();
+    return () => {
+      clearTimeout(updateTimer);
+      cleanup?.();
+    };
   }, []); // eslint-disable-line react-hooks/exhaustive-deps
 
   return (

app/src/components/layout/TopBar.tsx

@@ -1,22 +1,62 @@
+import { useState } from "react";
 import { useShallow } from "zustand/react/shallow";
 import TerminalTabs from "../terminal/TerminalTabs";
 import { useAppState } from "../../store/appState";
+import { useSettings } from "../../hooks/useSettings";
+import UpdateDialog from "../settings/UpdateDialog";
 
 export default function TopBar() {
-  const { dockerAvailable, imageExists } = useAppState(
-    useShallow(s => ({ dockerAvailable: s.dockerAvailable, imageExists: s.imageExists }))
+  const { dockerAvailable, imageExists, updateInfo, appVersion, setUpdateInfo } = useAppState(
+    useShallow(s => ({
+      dockerAvailable: s.dockerAvailable,
+      imageExists: s.imageExists,
+      updateInfo: s.updateInfo,
+      appVersion: s.appVersion,
+      setUpdateInfo: s.setUpdateInfo,
+    }))
   );
+  const { appSettings, saveSettings } = useSettings();
+  const [showUpdateDialog, setShowUpdateDialog] = useState(false);
+
+  const handleDismiss = async () => {
+    if (appSettings && updateInfo) {
+      await saveSettings({
+        ...appSettings,
+        dismissed_update_version: updateInfo.version,
+      });
+    }
+    setUpdateInfo(null);
+    setShowUpdateDialog(false);
+  };
 
   return (
-    <div className="flex items-center h-10 bg-[var(--bg-secondary)] border border-[var(--border-color)] rounded-lg overflow-hidden">
-      <div className="flex-1 overflow-x-auto pl-2">
-        <TerminalTabs />
+    <>
+      <div className="flex items-center h-10 bg-[var(--bg-secondary)] border border-[var(--border-color)] rounded-lg overflow-hidden">
+        <div className="flex-1 overflow-x-auto pl-2">
+          <TerminalTabs />
+        </div>
+        <div className="flex items-center gap-2 px-4 flex-shrink-0 text-xs text-[var(--text-secondary)]">
+          {updateInfo && (
+            <button
+              onClick={() => setShowUpdateDialog(true)}
+              className="px-2 py-0.5 rounded text-xs font-medium bg-[var(--accent)] text-white animate-pulse hover:bg-[var(--accent-hover)] transition-colors"
+            >
+              Update
+            </button>
+          )}
+          <StatusDot ok={dockerAvailable === true} label="Docker" />
+          <StatusDot ok={imageExists === true} label="Image" />
+        </div>
       </div>
-      <div className="flex items-center gap-2 px-4 flex-shrink-0 text-xs text-[var(--text-secondary)]">
-        <StatusDot ok={dockerAvailable === true} label="Docker" />
-        <StatusDot ok={imageExists === true} label="Image" />
-      </div>
-    </div>
+      {showUpdateDialog && updateInfo && (
+        <UpdateDialog
+          updateInfo={updateInfo}
+          currentVersion={appVersion}
+          onDismiss={handleDismiss}
+          onClose={() => setShowUpdateDialog(false)}
+        />
+      )}
+    </>
   );
 }
 

app/src/components/projects/AddProjectDialog.tsx

@@ -1,67 +1,111 @@
 import { useState, useEffect, useRef, useCallback } from "react";
 import { open } from "@tauri-apps/plugin-dialog";
 import { useProjects } from "../../hooks/useProjects";
+import type { ProjectPath } from "../../lib/types";
 
 interface Props {
   onClose: () => void;
 }
 
+interface PathEntry {
+  host_path: string;
+  mount_name: string;
+}
+
+function basenameFromPath(p: string): string {
+  return p.replace(/[/\\]$/, "").split(/[/\\]/).pop() || "";
+}
+
 export default function AddProjectDialog({ onClose }: Props) {
   const { add } = useProjects();
   const [name, setName] = useState("");
-  const [path, setPath] = useState("");
+  const [pathEntries, setPathEntries] = useState<PathEntry[]>([
+    { host_path: "", mount_name: "" },
+  ]);
   const [error, setError] = useState<string | null>(null);
   const [loading, setLoading] = useState(false);
   const nameInputRef = useRef<HTMLInputElement>(null);
   const overlayRef = useRef<HTMLDivElement>(null);
 
-  // Auto-focus the first input when the dialog opens
   useEffect(() => {
     nameInputRef.current?.focus();
   }, []);
 
-  // Close on Escape key
   useEffect(() => {
     const handleKeyDown = (e: KeyboardEvent) => {
-      if (e.key === "Escape") {
-        onClose();
-      }
+      if (e.key === "Escape") onClose();
     };
     document.addEventListener("keydown", handleKeyDown);
     return () => document.removeEventListener("keydown", handleKeyDown);
   }, [onClose]);
 
-  // Close on click outside (click on overlay backdrop)
   const handleOverlayClick = useCallback(
     (e: React.MouseEvent<HTMLDivElement>) => {
-      if (e.target === overlayRef.current) {
-        onClose();
-      }
+      if (e.target === overlayRef.current) onClose();
     },
     [onClose],
   );
 
-  const handleBrowse = async () => {
+  const handleBrowse = async (index: number) => {
     const selected = await open({ directory: true, multiple: false });
     if (typeof selected === "string") {
-      setPath(selected);
-      if (!name) {
-        const parts = selected.replace(/[/\\]$/, "").split(/[/\\]/);
-        setName(parts[parts.length - 1]);
+      const basename = basenameFromPath(selected);
+      const entries = [...pathEntries];
+      entries[index] = {
+        host_path: selected,
+        mount_name: entries[index].mount_name || basename,
+      };
+      setPathEntries(entries);
+      // Auto-fill project name from first folder
+      if (!name && index === 0) {
+        setName(basename);
       }
     }
   };
 
+  const updateEntry = (
+    index: number,
+    field: keyof PathEntry,
+    value: string,
+  ) => {
+    const entries = [...pathEntries];
+    entries[index] = { ...entries[index], [field]: value };
+    setPathEntries(entries);
+  };
+
+  const removeEntry = (index: number) => {
+    setPathEntries(pathEntries.filter((_, i) => i !== index));
+  };
+
+  const addEntry = () => {
+    setPathEntries([...pathEntries, { host_path: "", mount_name: "" }]);
+  };
+
   const handleSubmit = async (e?: React.FormEvent) => {
     if (e) e.preventDefault();
-    if (!name.trim() || !path.trim()) {
-      setError("Name and path are required");
+    if (!name.trim()) {
+      setError("Project name is required");
+      return;
+    }
+    const validPaths: ProjectPath[] = pathEntries
+      .filter((p) => p.host_path.trim())
+      .map((p) => ({
+        host_path: p.host_path.trim(),
+        mount_name: p.mount_name.trim() || basenameFromPath(p.host_path),
+      }));
+    if (validPaths.length === 0) {
+      setError("At least one folder path is required");
+      return;
+    }
+    const mountNames = validPaths.map((p) => p.mount_name);
+    if (new Set(mountNames).size !== mountNames.length) {
+      setError("Mount names must be unique");
       return;
     }
     setLoading(true);
     setError(null);
     try {
-      await add(name.trim(), path.trim());
+      await add(name.trim(), validPaths);
       onClose();
     } catch (err) {
       setError(String(err));
@@ -76,7 +120,7 @@ export default function AddProjectDialog({ onClose }: Props) {
       onClick={handleOverlayClick}
       className="fixed inset-0 bg-black/50 flex items-center justify-center z-50"
     >
-      <div className="bg-[var(--bg-secondary)] border border-[var(--border-color)] rounded-lg p-6 w-96 shadow-xl">
+      <div className="bg-[var(--bg-secondary)] border border-[var(--border-color)] rounded-lg p-6 w-[28rem] shadow-xl max-h-[80vh] overflow-y-auto">
         <h2 className="text-lg font-semibold mb-4">Add Project</h2>
 
         <form onSubmit={handleSubmit}>
@@ -92,23 +136,54 @@ export default function AddProjectDialog({ onClose }: Props) {
           />
 
           <label className="block text-sm text-[var(--text-secondary)] mb-1">
-            Project Path
+            Folders
           </label>
-          <div className="flex gap-2 mb-4">
-            <input
-              value={path}
-              onChange={(e) => setPath(e.target.value)}
-              placeholder="/path/to/project"
-              className="flex-1 px-3 py-2 bg-[var(--bg-primary)] border border-[var(--border-color)] rounded text-sm text-[var(--text-primary)] focus:outline-none focus:border-[var(--accent)]"
-            />
-            <button
-              type="button"
-              onClick={handleBrowse}
-              className="px-3 py-2 bg-[var(--bg-tertiary)] border border-[var(--border-color)] rounded text-sm hover:bg-[var(--border-color)] transition-colors"
-            >
-              Browse
-            </button>
+          <div className="space-y-2 mb-3">
+            {pathEntries.map((entry, i) => (
+              <div key={i} className="space-y-1 p-2 bg-[var(--bg-primary)] rounded border border-[var(--border-color)]">
+                <div className="flex gap-1">
+                  <input
+                    value={entry.host_path}
+                    onChange={(e) => updateEntry(i, "host_path", e.target.value)}
+                    placeholder="/path/to/folder"
+                    className="flex-1 px-2 py-1.5 bg-[var(--bg-secondary)] border border-[var(--border-color)] rounded text-xs text-[var(--text-primary)] focus:outline-none focus:border-[var(--accent)]"
+                  />
+                  <button
+                    type="button"
+                    onClick={() => handleBrowse(i)}
+                    className="px-2 py-1.5 text-xs bg-[var(--bg-tertiary)] border border-[var(--border-color)] rounded hover:bg-[var(--border-color)] transition-colors"
+                  >
+                    Browse
+                  </button>
+                  {pathEntries.length > 1 && (
+                    <button
+                      type="button"
+                      onClick={() => removeEntry(i)}
+                      className="px-1.5 py-1.5 text-xs text-[var(--error)] hover:bg-[var(--bg-secondary)] rounded transition-colors"
+                    >
+                      x
+                    </button>
+                  )}
+                </div>
+                <div className="flex items-center gap-1">
+                  <span className="text-xs text-[var(--text-secondary)] flex-shrink-0">/workspace/</span>
+                  <input
+                    value={entry.mount_name}
+                    onChange={(e) => updateEntry(i, "mount_name", e.target.value)}
+                    placeholder="mount-name"
+                    className="flex-1 px-2 py-1 bg-[var(--bg-secondary)] border border-[var(--border-color)] rounded text-xs text-[var(--text-primary)] focus:outline-none focus:border-[var(--accent)] font-mono"
+                  />
+                </div>
+              </div>
+            ))}
           </div>
+          <button
+            type="button"
+            onClick={addEntry}
+            className="text-xs text-[var(--accent)] hover:text-[var(--accent-hover)] mb-4 transition-colors"
+          >
+            + Add folder
+          </button>
 
           {error && (
             <div className="text-xs text-[var(--error)] mb-3">{error}</div>

app/src/components/projects/ProjectCard.tsx

@@ -1,6 +1,6 @@
 import { useState, useEffect } from "react";
 import { open } from "@tauri-apps/plugin-dialog";
-import type { Project, AuthMode, BedrockConfig, BedrockAuthMethod } from "../../lib/types";
+import type { Project, ProjectPath, AuthMode, BedrockConfig, BedrockAuthMethod } from "../../lib/types";
 import { useProjects } from "../../hooks/useProjects";
 import { useTerminal } from "../../hooks/useTerminal";
 import { useAppState } from "../../store/appState";
@@ -21,6 +21,7 @@ export default function ProjectCard({ project }: Props) {
   const isStopped = project.status === "stopped" || project.status === "error";
 
   // Local state for text fields (save on blur, not on every keystroke)
+  const [paths, setPaths] = useState<ProjectPath[]>(project.paths ?? []);
   const [sshKeyPath, setSshKeyPath] = useState(project.ssh_key_path ?? "");
   const [gitName, setGitName] = useState(project.git_user_name ?? "");
   const [gitEmail, setGitEmail] = useState(project.git_user_email ?? "");
@@ -39,6 +40,7 @@ export default function ProjectCard({ project }: Props) {
 
   // Sync local state when project prop changes (e.g., after save or external update)
   useEffect(() => {
+    setPaths(project.paths ?? []);
     setSshKeyPath(project.ssh_key_path ?? "");
     setGitName(project.git_user_name ?? "");
     setGitEmail(project.git_user_email ?? "");
@@ -263,8 +265,14 @@ export default function ProjectCard({ project }: Props) {
         <span className={`w-2 h-2 rounded-full flex-shrink-0 ${statusColor}`} />
         <span className="text-sm font-medium truncate flex-1">{project.name}</span>
       </div>
-      <div className="text-xs text-[var(--text-secondary)] truncate mt-0.5 ml-4">
-        {project.path}
+      <div className="mt-0.5 ml-4 space-y-0.5">
+        {project.paths.map((pp, i) => (
+          <div key={i} className="text-xs text-[var(--text-secondary)] truncate">
+            <span className="font-mono">/workspace/{pp.mount_name}</span>
+            <span className="mx-1">&larr;</span>
+            <span>{pp.host_path}</span>
+          </div>
+        ))}
       </div>
 
       {isSelected && (
@@ -352,6 +360,91 @@ export default function ProjectCard({ project }: Props) {
           {/* Config panel */}
           {showConfig && (
             <div className="space-y-2 pt-1 border-t border-[var(--border-color)]" onClick={(e) => e.stopPropagation()}>
+              {/* Folder paths */}
+              <div>
+                <label className="block text-xs text-[var(--text-secondary)] mb-0.5">Folders</label>
+                {paths.map((pp, i) => (
+                  <div key={i} className="flex gap-1 mb-1 items-center">
+                    <input
+                      value={pp.host_path}
+                      onChange={(e) => {
+                        const updated = [...paths];
+                        updated[i] = { ...updated[i], host_path: e.target.value };
+                        setPaths(updated);
+                      }}
+                      onBlur={async () => {
+                        try { await update({ ...project, paths }); } catch (err) {
+                          console.error("Failed to update paths:", err);
+                        }
+                      }}
+                      placeholder="/path/to/folder"
+                      disabled={!isStopped}
+                      className="flex-1 px-2 py-1 bg-[var(--bg-primary)] border border-[var(--border-color)] rounded text-xs text-[var(--text-primary)] focus:outline-none focus:border-[var(--accent)] disabled:opacity-50"
+                    />
+                    <button
+                      onClick={async () => {
+                        const selected = await open({ directory: true, multiple: false });
+                        if (typeof selected === "string") {
+                          const updated = [...paths];
+                          const basename = selected.replace(/[/\\]$/, "").split(/[/\\]/).pop() || "";
+                          updated[i] = { host_path: selected, mount_name: updated[i].mount_name || basename };
+                          setPaths(updated);
+                          try { await update({ ...project, paths: updated }); } catch (err) {
+                            console.error("Failed to update paths:", err);
+                          }
+                        }
+                      }}
+                      disabled={!isStopped}
+                      className="px-2 py-1 text-xs bg-[var(--bg-primary)] border border-[var(--border-color)] rounded hover:bg-[var(--border-color)] disabled:opacity-50 transition-colors"
+                    >
+                      ...
+                    </button>
+                    <span className="text-xs text-[var(--text-secondary)] flex-shrink-0">/workspace/</span>
+                    <input
+                      value={pp.mount_name}
+                      onChange={(e) => {
+                        const updated = [...paths];
+                        updated[i] = { ...updated[i], mount_name: e.target.value };
+                        setPaths(updated);
+                      }}
+                      onBlur={async () => {
+                        try { await update({ ...project, paths }); } catch (err) {
+                          console.error("Failed to update paths:", err);
+                        }
+                      }}
+                      placeholder="name"
+                      disabled={!isStopped}
+                      className="w-20 px-2 py-1 bg-[var(--bg-primary)] border border-[var(--border-color)] rounded text-xs text-[var(--text-primary)] focus:outline-none focus:border-[var(--accent)] disabled:opacity-50 font-mono"
+                    />
+                    {paths.length > 1 && (
+                      <button
+                        onClick={async () => {
+                          const updated = paths.filter((_, j) => j !== i);
+                          setPaths(updated);
+                          try { await update({ ...project, paths: updated }); } catch (err) {
+                            console.error("Failed to remove path:", err);
+                          }
+                        }}
+                        disabled={!isStopped}
+                        className="px-1.5 py-1 text-xs text-[var(--error)] hover:bg-[var(--bg-primary)] rounded disabled:opacity-50 transition-colors"
+                      >
+                        x
+                      </button>
+                    )}
+                  </div>
+                ))}
+                <button
+                  onClick={async () => {
+                    const updated = [...paths, { host_path: "", mount_name: "" }];
+                    setPaths(updated);
+                  }}
+                  disabled={!isStopped}
+                  className="text-xs text-[var(--accent)] hover:text-[var(--accent-hover)] disabled:opacity-50 transition-colors"
+                >
+                  + Add folder
+                </button>
+              </div>
+
               {/* SSH Key */}
               <div>
                 <label className="block text-xs text-[var(--text-secondary)] mb-0.5">SSH Key Directory</label>

app/src/components/settings/SettingsPanel.tsx

@@ -3,10 +3,13 @@ import ApiKeyInput from "./ApiKeyInput";
 import DockerSettings from "./DockerSettings";
 import AwsSettings from "./AwsSettings";
 import { useSettings } from "../../hooks/useSettings";
+import { useUpdates } from "../../hooks/useUpdates";
 
 export default function SettingsPanel() {
   const { appSettings, saveSettings } = useSettings();
+  const { appVersion, checkForUpdates } = useUpdates();
   const [globalInstructions, setGlobalInstructions] = useState(appSettings?.global_claude_instructions ?? "");
+  const [checkingUpdates, setCheckingUpdates] = useState(false);
 
   // Sync local state when appSettings change
   useEffect(() => {
@@ -18,6 +21,20 @@ export default function SettingsPanel() {
     await saveSettings({ ...appSettings, global_claude_instructions: globalInstructions || null });
   };
 
+  const handleCheckNow = async () => {
+    setCheckingUpdates(true);
+    try {
+      await checkForUpdates();
+    } finally {
+      setCheckingUpdates(false);
+    }
+  };
+
+  const handleAutoCheckToggle = async () => {
+    if (!appSettings) return;
+    await saveSettings({ ...appSettings, auto_check_updates: !appSettings.auto_check_updates });
+  };
+
   return (
     <div className="p-4 space-y-6">
       <h2 className="text-xs font-semibold uppercase text-[var(--text-secondary)]">
@@ -40,6 +57,38 @@ export default function SettingsPanel() {
           className="w-full px-2 py-1.5 text-xs bg-[var(--bg-primary)] border border-[var(--border-color)] rounded focus:outline-none focus:border-[var(--accent)] resize-y font-mono"
         />
       </div>
+
+      {/* Updates section */}
+      <div>
+        <label className="block text-sm font-medium mb-2">Updates</label>
+        <div className="space-y-2">
+          {appVersion && (
+            <p className="text-xs text-[var(--text-secondary)]">
+              Current version: <span className="text-[var(--text-primary)] font-mono">{appVersion}</span>
+            </p>
+          )}
+          <div className="flex items-center gap-2">
+            <label className="text-xs text-[var(--text-secondary)]">Auto-check for updates</label>
+            <button
+              onClick={handleAutoCheckToggle}
+              className={`px-2 py-0.5 text-xs rounded transition-colors ${
+                appSettings?.auto_check_updates !== false
+                  ? "bg-[var(--success)] text-white"
+                  : "bg-[var(--bg-primary)] border border-[var(--border-color)] text-[var(--text-secondary)]"
+              }`}
+            >
+              {appSettings?.auto_check_updates !== false ? "ON" : "OFF"}
+            </button>
+          </div>
+          <button
+            onClick={handleCheckNow}
+            disabled={checkingUpdates}
+            className="px-3 py-1.5 text-xs bg-[var(--bg-primary)] border border-[var(--border-color)] rounded hover:bg-[var(--border-color)] disabled:opacity-50 transition-colors"
+          >
+            {checkingUpdates ? "Checking..." : "Check now"}
+          </button>
+        </div>
+      </div>
     </div>
   );
 }

app/src/components/settings/UpdateDialog.tsx

@@ -0,0 +1,121 @@
+import { useEffect, useRef, useCallback } from "react";
+import { openUrl } from "@tauri-apps/plugin-opener";
+import type { UpdateInfo } from "../../lib/types";
+
+interface Props {
+  updateInfo: UpdateInfo;
+  currentVersion: string;
+  onDismiss: () => void;
+  onClose: () => void;
+}
+
+export default function UpdateDialog({
+  updateInfo,
+  currentVersion,
+  onDismiss,
+  onClose,
+}: Props) {
+  const overlayRef = useRef<HTMLDivElement>(null);
+
+  useEffect(() => {
+    const handleKeyDown = (e: KeyboardEvent) => {
+      if (e.key === "Escape") onClose();
+    };
+    document.addEventListener("keydown", handleKeyDown);
+    return () => document.removeEventListener("keydown", handleKeyDown);
+  }, [onClose]);
+
+  const handleOverlayClick = useCallback(
+    (e: React.MouseEvent<HTMLDivElement>) => {
+      if (e.target === overlayRef.current) onClose();
+    },
+    [onClose],
+  );
+
+  const handleDownload = async (url: string) => {
+    try {
+      await openUrl(url);
+    } catch (e) {
+      console.error("Failed to open URL:", e);
+    }
+  };
+
+  const formatSize = (bytes: number) => {
+    if (bytes < 1024 * 1024) return `${(bytes / 1024).toFixed(0)} KB`;
+    return `${(bytes / (1024 * 1024)).toFixed(1)} MB`;
+  };
+
+  return (
+    <div
+      ref={overlayRef}
+      onClick={handleOverlayClick}
+      className="fixed inset-0 bg-black/50 flex items-center justify-center z-50"
+    >
+      <div className="bg-[var(--bg-secondary)] border border-[var(--border-color)] rounded-lg p-6 w-[28rem] max-h-[80vh] overflow-y-auto shadow-xl">
+        <h2 className="text-lg font-semibold mb-3">Update Available</h2>
+
+        <div className="flex items-center gap-2 mb-4 text-sm">
+          <span className="text-[var(--text-secondary)]">{currentVersion}</span>
+          <span className="text-[var(--text-secondary)]">&rarr;</span>
+          <span className="text-[var(--accent)] font-semibold">
+            {updateInfo.version}
+          </span>
+        </div>
+
+        {updateInfo.body && (
+          <div className="mb-4">
+            <h3 className="text-xs font-semibold uppercase text-[var(--text-secondary)] mb-1">
+              Release Notes
+            </h3>
+            <div className="text-xs text-[var(--text-primary)] whitespace-pre-wrap bg-[var(--bg-primary)] rounded p-3 max-h-48 overflow-y-auto border border-[var(--border-color)]">
+              {updateInfo.body}
+            </div>
+          </div>
+        )}
+
+        {updateInfo.assets.length > 0 && (
+          <div className="mb-4 space-y-1">
+            <h3 className="text-xs font-semibold uppercase text-[var(--text-secondary)] mb-1">
+              Downloads
+            </h3>
+            {updateInfo.assets.map((asset) => (
+              <button
+                key={asset.name}
+                onClick={() => handleDownload(asset.browser_download_url)}
+                className="w-full flex items-center justify-between px-3 py-2 text-xs bg-[var(--bg-primary)] border border-[var(--border-color)] rounded hover:border-[var(--accent)] transition-colors"
+              >
+                <span className="truncate">{asset.name}</span>
+                <span className="text-[var(--text-secondary)] ml-2 flex-shrink-0">
+                  {formatSize(asset.size)}
+                </span>
+              </button>
+            ))}
+          </div>
+        )}
+
+        <div className="flex items-center justify-between">
+          <button
+            onClick={() => handleDownload(updateInfo.release_url)}
+            className="text-xs text-[var(--accent)] hover:text-[var(--accent-hover)] transition-colors"
+          >
+            View on Gitea
+          </button>
+          <div className="flex gap-2">
+            <button
+              onClick={onDismiss}
+              className="px-3 py-1.5 text-xs text-[var(--text-secondary)] hover:text-[var(--text-primary)] transition-colors"
+            >
+              Dismiss
+            </button>
+            <button
+              onClick={onClose}
+              className="px-3 py-1.5 text-xs bg-[var(--bg-tertiary)] border border-[var(--border-color)] rounded hover:bg-[var(--border-color)] transition-colors"
+            >
+              Close
+            </button>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}

app/src/hooks/useProjects.ts

@@ -2,6 +2,7 @@ import { useCallback } from "react";
 import { useShallow } from "zustand/react/shallow";
 import { useAppState } from "../store/appState";
 import * as commands from "../lib/tauri-commands";
+import type { ProjectPath } from "../lib/types";
 
 export function useProjects() {
   const {
@@ -30,8 +31,8 @@ export function useProjects() {
   }, [setProjects]);
 
   const add = useCallback(
-    async (name: string, path: string) => {
-      const project = await commands.addProject(name, path);
+    async (name: string, paths: ProjectPath[]) => {
+      const project = await commands.addProject(name, paths);
       // Refresh from backend to avoid stale closure issues
       const list = await commands.listProjects();
       setProjects(list);

app/src/hooks/useUpdates.ts

@@ -0,0 +1,72 @@
+import { useCallback, useRef } from "react";
+import { useShallow } from "zustand/react/shallow";
+import { useAppState } from "../store/appState";
+import * as commands from "../lib/tauri-commands";
+
+const CHECK_INTERVAL_MS = 24 * 60 * 60 * 1000; // 24 hours
+
+export function useUpdates() {
+  const { updateInfo, setUpdateInfo, appVersion, setAppVersion, appSettings } =
+    useAppState(
+      useShallow((s) => ({
+        updateInfo: s.updateInfo,
+        setUpdateInfo: s.setUpdateInfo,
+        appVersion: s.appVersion,
+        setAppVersion: s.setAppVersion,
+        appSettings: s.appSettings,
+      })),
+    );
+
+  const intervalRef = useRef<ReturnType<typeof setInterval> | null>(null);
+
+  const loadVersion = useCallback(async () => {
+    try {
+      const version = await commands.getAppVersion();
+      setAppVersion(version);
+    } catch (e) {
+      console.error("Failed to load app version:", e);
+    }
+  }, [setAppVersion]);
+
+  const checkForUpdates = useCallback(async () => {
+    try {
+      const info = await commands.checkForUpdates();
+      if (info) {
+        // Respect dismissed version
+        const dismissed = appSettings?.dismissed_update_version;
+        if (dismissed && dismissed === info.version) {
+          setUpdateInfo(null);
+          return null;
+        }
+      }
+      setUpdateInfo(info);
+      return info;
+    } catch (e) {
+      console.error("Failed to check for updates:", e);
+      return null;
+    }
+  }, [setUpdateInfo, appSettings?.dismissed_update_version]);
+
+  const startPeriodicCheck = useCallback(() => {
+    if (intervalRef.current) return;
+    intervalRef.current = setInterval(() => {
+      if (appSettings?.auto_check_updates !== false) {
+        checkForUpdates();
+      }
+    }, CHECK_INTERVAL_MS);
+    return () => {
+      if (intervalRef.current) {
+        clearInterval(intervalRef.current);
+        intervalRef.current = null;
+      }
+    };
+  }, [checkForUpdates, appSettings?.auto_check_updates]);
+
+  return {
+    updateInfo,
+    appVersion,
+    loadVersion,
+    checkForUpdates,
+    startPeriodicCheck,
+  };
+}

app/src/lib/tauri-commands.ts

@@ -1,5 +1,5 @@
 import { invoke } from "@tauri-apps/api/core";
-import type { Project, ContainerInfo, SiblingContainer, AppSettings } from "./types";
+import type { Project, ProjectPath, ContainerInfo, SiblingContainer, AppSettings, UpdateInfo } from "./types";
 
 // Docker
 export const checkDocker = () => invoke<boolean>("check_docker");
@@ -12,8 +12,8 @@ export const listSiblingContainers = () =>
 
 // Projects
 export const listProjects = () => invoke<Project[]>("list_projects");
-export const addProject = (name: string, path: string) =>
-  invoke<Project>("add_project", { name, path });
+export const addProject = (name: string, paths: ProjectPath[]) =>
+  invoke<Project>("add_project", { name, paths });
 export const removeProject = (projectId: string) =>
   invoke<void>("remove_project", { projectId });
 export const updateProject = (project: Project) =>
@@ -49,3 +49,8 @@ export const terminalResize = (sessionId: string, cols: number, rows: number) =>
   invoke<void>("terminal_resize", { sessionId, cols, rows });
 export const closeTerminalSession = (sessionId: string) =>
   invoke<void>("close_terminal_session", { sessionId });
+
+// Updates
+export const getAppVersion = () => invoke<string>("get_app_version");
+export const checkForUpdates = () =>
+  invoke<UpdateInfo | null>("check_for_updates");

app/src/lib/types.ts

@@ -3,10 +3,15 @@ export interface EnvVar {
   value: string;
 }
 
+export interface ProjectPath {
+  host_path: string;
+  mount_name: string;
+}
+
 export interface Project {
   id: string;
   name: string;
-  path: string;
+  paths: ProjectPath[];
   container_id: string | null;
   status: ProjectStatus;
   auth_mode: AuthMode;
@@ -83,4 +88,21 @@ export interface AppSettings {
   custom_image_name: string | null;
   global_aws: GlobalAwsSettings;
   global_claude_instructions: string | null;
+  auto_check_updates: boolean;
+  dismissed_update_version: string | null;
+}
+
+export interface UpdateInfo {
+  version: string;
+  tag_name: string;
+  release_url: string;
+  body: string;
+  assets: ReleaseAsset[];
+  published_at: string;
+}
+
+export interface ReleaseAsset {
+  name: string;
+  browser_download_url: string;
+  size: number;
 }

app/src/store/appState.ts

@@ -1,5 +1,5 @@
 import { create } from "zustand";
-import type { Project, TerminalSession, AppSettings } from "../lib/types";
+import type { Project, TerminalSession, AppSettings, UpdateInfo } from "../lib/types";
 
 interface AppState {
   // Projects
@@ -30,6 +30,12 @@ interface AppState {
   // App settings
   appSettings: AppSettings | null;
   setAppSettings: (settings: AppSettings) => void;
+
+  // Update info
+  updateInfo: UpdateInfo | null;
+  setUpdateInfo: (info: UpdateInfo | null) => void;
+  appVersion: string;
+  setAppVersion: (version: string) => void;
 }
 
 export const useAppState = create<AppState>((set) => ({
@@ -85,4 +91,10 @@ export const useAppState = create<AppState>((set) => ({
   // App settings
   appSettings: null,
   setAppSettings: (settings) => set({ appSettings: settings }),
+
+  // Update info
+  updateInfo: null,
+  setUpdateInfo: (info) => set({ updateInfo: info }),
+  appVersion: "",
+  setAppVersion: (version) => set({ appVersion: version }),
 }));