palmier 0.8.10 → 0.9.2

package/palmier-server/pwa/src/contexts/HostStoreContext.tsx

@@ -10,19 +10,16 @@ import type { PairedHost } from "../types";
 
 interface HostStoreContextValue {
   pairedHosts: PairedHost[];
-  activeHostId: string | null;
   addPairedHost(host: PairedHost): void;
   removePairedHost(hostId: string): void;
   renamePairedHost(hostId: string, name: string): void;
   setHostLanUrl(hostId: string, lanUrl: string | undefined): void;
-  setActiveHostId(hostId: string): void;
-  getActiveHost(): PairedHost | null;
+  setHostLastAgent(hostId: string, agent: string): void;
 }
 
 const HostStoreContext = createContext<HostStoreContextValue | null>(null);
 
 const STORAGE_KEY = "palmier_paired_hosts";
-const ACTIVE_KEY = "palmier_active_host";
 
 function loadHosts(): PairedHost[] {
   try {
@@ -38,76 +35,36 @@ function saveHosts(hosts: PairedHost[]) {
   localStorage.setItem(STORAGE_KEY, JSON.stringify(hosts));
 }
 
-function loadActiveId(): string | null {
-  return localStorage.getItem(ACTIVE_KEY);
-}
-
-function saveActiveId(id: string | null) {
-  if (id) localStorage.setItem(ACTIVE_KEY, id);
-  else localStorage.removeItem(ACTIVE_KEY);
-}
+export const LOCAL_HOST_ID = "local";
 
-/** Local mode: served by palmier serve on localhost — auto-connect without pairing. */
+/** Local mode: served by palmier serve on localhost — auto-inject a local host entry. */
 const isLocalMode = !!(window as any).__PALMIER_SERVE__
   && (window.location.hostname === "localhost" || window.location.hostname === "127.0.0.1");
 
 export function HostStoreProvider({ children }: { children: ReactNode }) {
-  const [pairedHosts, setPairedHosts] = useState<PairedHost[]>(loadHosts);
-  const [activeHostId, setActiveHostIdState] = useState<string | null>(() => {
-    const saved = loadActiveId();
+  const [pairedHosts, setPairedHosts] = useState<PairedHost[]>(() => {
     const hosts = loadHosts();
-    if (saved && hosts.some((h) => h.hostId === saved)) return saved;
-    return hosts.length > 0 ? hosts[0].hostId : null;
-  });
-
-  // Auto-connect in local mode: inject a local host entry without pairing
-  useEffect(() => {
-    if (!isLocalMode) return;
-    const localHostId = "local";
-    const existing = loadHosts().find((h) => h.hostId === localHostId);
-    if (!existing) {
-      const localHost: PairedHost = { hostId: localHostId, clientToken: "", directUrl: window.location.origin };
-      setPairedHosts((prev) => [...prev.filter((h) => h.hostId !== localHostId), localHost]);
-      setActiveHostIdState(localHostId);
+    if (isLocalMode && !hosts.some((h) => h.hostId === LOCAL_HOST_ID)) {
+      hosts.push({ hostId: LOCAL_HOST_ID, clientToken: "", directUrl: window.location.origin });
     }
-  }, []);
+    return hosts;
+  });
 
   useEffect(() => {
     saveHosts(pairedHosts);
   }, [pairedHosts]);
 
-  useEffect(() => {
-    saveActiveId(activeHostId);
-  }, [activeHostId]);
-
   const addPairedHost = useCallback((host: PairedHost) => {
     setPairedHosts((prev) => {
       const filtered = prev.filter((h) => h.hostId !== host.hostId);
       return [...filtered, host];
     });
-    setActiveHostIdState(host.hostId);
   }, []);
 
   const removePairedHost = useCallback((hostId: string) => {
     setPairedHosts((prev) => prev.filter((h) => h.hostId !== hostId));
-    // Only change the active host when the active one is the one being deleted.
-    setActiveHostIdState((current) => {
-      if (current !== hostId) return current;
-      // The deleted host was active; we'll re-select once pairedHosts settles.
-      return null;
-    });
   }, []);
 
-  // When the active host disappears (e.g. it was just unpaired), fall back to
-  // any remaining paired host, otherwise null.
-  useEffect(() => {
-    if (activeHostId !== null && !pairedHosts.find((h) => h.hostId === activeHostId)) {
-      setActiveHostIdState(pairedHosts[0]?.hostId ?? null);
-    } else if (activeHostId === null && pairedHosts.length > 0) {
-      setActiveHostIdState(pairedHosts[0].hostId);
-    }
-  }, [pairedHosts, activeHostId]);
-
   const renamePairedHost = useCallback((hostId: string, name: string) => {
     setPairedHosts((prev) =>
       prev.map((h) => (h.hostId === hostId ? { ...h, name } : h))
@@ -124,24 +81,24 @@ export function HostStoreProvider({ children }: { children: ReactNode }) {
     );
   }, []);
 
-  const setActiveHostId = useCallback((hostId: string) => {
-    setActiveHostIdState(hostId);
+  const setHostLastAgent = useCallback((hostId: string, agent: string) => {
+    setPairedHosts((prev) =>
+      prev.map((h) => {
+        if (h.hostId !== hostId) return h;
+        if (h.lastAgent === agent) return h;
+        return { ...h, lastAgent: agent };
+      })
+    );
   }, []);
 
-  const getActiveHost = useCallback((): PairedHost | null => {
-    return pairedHosts.find((h) => h.hostId === activeHostId) ?? null;
-  }, [pairedHosts, activeHostId]);
-
   return (
     <HostStoreContext.Provider value={{
       pairedHosts,
-      activeHostId,
       addPairedHost,
       removePairedHost,
       renamePairedHost,
       setHostLanUrl,
-      setActiveHostId,
-      getActiveHost,
+      setHostLastAgent,
     }}>
       {children}
     </HostStoreContext.Provider>

package/palmier-server/pwa/src/hooks/usePushSubscription.ts

@@ -1,18 +1,17 @@
 import { useEffect, useRef } from "react";
 import { Capacitor } from "@capacitor/core";
-import { useHostStore } from "../contexts/HostStoreContext";
+import { useHostConnection } from "../contexts/HostConnectionContext";
 import { apiPost, apiGet } from "../api";
 
 export function usePushSubscription() {
-  const { getActiveHost } = useHostStore();
-  const activeHost = getActiveHost();
+  const { activeHost } = useHostConnection();
   const subscribedRef = useRef<string | null>(null);
 
   useEffect(() => {
     // Native app uses FCM for notifications, not Web Push
     if (Capacitor.isNativePlatform()) return;
     // Skip push subscription for direct-only (LAN) hosts — no cloud server to relay through
-    if (!activeHost || activeHost.directUrl || subscribedRef.current === activeHost.hostId) return;
+    if (activeHost.directUrl || subscribedRef.current === activeHost.hostId) return;
 
     async function subscribe() {
       try {
@@ -26,7 +25,7 @@ export function usePushSubscription() {
         // Send hostId to SW so it can include it in push responses
         registration.active?.postMessage({
           type: "set-host-id",
-          hostId: activeHost!.hostId,
+          hostId: activeHost.hostId,
         });
 
         let subscription = await registration.pushManager.getSubscription();
@@ -59,7 +58,7 @@ export function usePushSubscription() {
         // Always ensure subscription is saved to server
         const sub = subscription.toJSON();
         await apiPost("/api/push/subscribe", {
-          hostId: activeHost!.hostId,
+          hostId: activeHost.hostId,
           endpoint: sub.endpoint,
           keys: {
             p256dh: sub.keys!.p256dh,
@@ -67,7 +66,7 @@ export function usePushSubscription() {
           },
         });
 
-        subscribedRef.current = activeHost!.hostId;
+        subscribedRef.current = activeHost.hostId;
       } catch (err) {
         console.error("[Push] Subscription failed:", err);
       }

package/palmier-server/pwa/src/native/Device.ts

@@ -1,26 +1,5 @@
 import { Capacitor, registerPlugin, type PluginListenerHandle } from "@capacitor/core";
 
-export type PermissionType =
-  | "location"
-  | "smsRead"
-  | "smsSend"
-  | "contacts"
-  | "calendar"
-  | "notificationListener"
-  | "dnd"
-  | "fullScreenIntent"
-  | "postNotifications";
-
-export interface PermissionResult {
-  granted: boolean;
-  /**
-   * False when the native build doesn't recognize this permission type — the PWA
-   * is served remotely and may ship ahead of the installed APK. Callers should
-   * treat unsupported types as "cannot enable" rather than as a hard error.
-   */
-  supported: boolean;
-}
-
 export interface DeepLinkEvent {
   path: string;
 }
@@ -30,28 +9,34 @@ export interface InstalledApp {
   appName: string;
 }
 
+export interface CapabilityStatus {
+  name: string;
+  enabled: boolean;
+  supported: boolean;
+}
+
+export type SetCapabilityReason = "denied" | "no-email-client" | "unsupported";
+
+export interface SetCapabilityResult {
+  enabled: boolean;
+  reason?: SetCapabilityReason;
+}
+
 interface DevicePlugin {
   getFcmToken(): Promise<{ token: string }>;
-  /** Returns the set of PermissionType strings this native build understands. */
-  getSupportedPermissions(): Promise<{ types: PermissionType[] }>;
-  checkPermission(opts: { type: PermissionType }): Promise<PermissionResult>;
-  requestPermission(opts: { type: PermissionType }): Promise<PermissionResult>;
+  /** Returns one entry per capability the APK knows about. The PWA renders only these. */
+  getCapabilityStatus(): Promise<{ capabilities: CapabilityStatus[] }>;
   /**
-   * Authoritative list of capabilities the user has enabled on this device.
-   * Native receivers + handlers consult this as a local kill-switch. Unknown
-   * capability names are stored but ignored — safe for PWAs that ship new caps
-   * ahead of the installed APK.
+   * Atomically gates a single capability. When `enabled: true`, the plugin drives
+   * any required permission dialog or system-Settings round-trip and writes the
+   * native kill-switch only on grant. When `enabled: false`, the kill-switch is
+   * removed (no OS dialog). The returned `enabled` reflects the actual stored
+   * state; `reason` distinguishes denial from preconditions like
+   * "no email app installed".
    */
-  setEnabledCapabilities(opts: { capabilities: string[] }): Promise<void>;
-  /** Returns user-visible (launcher) apps on the device, with 96x96 PNG icons. */
+  setCapabilityEnabled(opts: { capability: string; enabled: boolean }): Promise<SetCapabilityResult>;
+  /** Returns user-visible (launcher) apps on the device. */
   getInstalledApps(): Promise<{ apps: InstalledApp[] }>;
-  /**
-   * Returns whether the device has at least one app that can handle a mailto:
-   * intent. Used to gate the Sending Email capability — silent PackageManager
-   * lookup, no side effects. `supported: false` on older APKs that don't expose
-   * this method; treat as "cannot enable" rather than as a hard error.
-   */
-  hasEmailClient(): Promise<{ available: boolean; supported: boolean }>;
   addListener(
     event: "deepLink",
     handler: (ev: DeepLinkEvent) => void

package/palmier-server/pwa/src/pages/Dashboard.tsx

@@ -10,6 +10,7 @@ import HostMenu from "../components/HostMenu";
 import ConnectionStatusIcon from "../components/ConnectionStatusIcon";
 import SessionsView from "../components/SessionsView";
 import RunDetailView from "../components/RunDetailView";
+import { loadEnabledCapabilities } from "../components/CapabilityToggles";
 import { usePushSubscription } from "../hooks/usePushSubscription";
 import { useMediaQuery } from "../hooks/useMediaQuery";
 import { setAgentLabels } from "../agentLabels";
@@ -45,14 +46,16 @@ interface PermissionPrompt { permissions: RequiredPermission[]; sessionName?: st
 interface InputPrompt { questions: string[]; description?: string; sessionName?: string }
 
 export default function Dashboard() {
-  const { pairedHosts, activeHostId, removePairedHost, setHostLanUrl } = useHostStore();
-  const { connected, request, subscribeEvents, unauthorized } = useHostConnection();
+  const { removePairedHost, setHostLanUrl } = useHostStore();
+  const { connected, request, subscribeEvents, unauthorized, activeHost } = useHostConnection();
+  const hostId = activeHost.hostId;
+  const activeClientToken = activeHost.clientToken || null;
   const navigate = useNavigate();
   const location = useLocation();
   const params = useParams<{ taskId?: string; runId?: string }>();
   const isDesktop = useMediaQuery("(min-width: 768px)");
 
-  const isTasksTab = location.pathname.startsWith("/tasks");
+  const isTasksTab = location.pathname.endsWith("/tasks");
   const runsFilterTaskId = params.runId ? undefined : params.taskId;
 
   // "latest" is passed through to RunDetailView, which does its own resolution
@@ -63,10 +66,13 @@ export default function Dashboard() {
   const [updating, setUpdating] = useState(false);
   const [updateError, setUpdateError] = useState<string | null>(null);
   const [daemonVersion, setDaemonVersion] = useState<string | null>(null);
-  const [capabilityTokens, setCapabilityTokens] = useState<Record<string, string | null>>({});
+  const [linkedClientToken, setLinkedClientToken] = useState<string | null>(null);
+  const [enabledCapabilities, setEnabledCapabilities] = useState<Set<string>>(new Set());
   const [agents, setAgents] = useState<AgentInfo[]>([]);
   const [hostPlatform, setHostPlatform] = useState<string | undefined>();
 
+  const isLinkedDevice = !!activeClientToken && linkedClientToken === activeClientToken;
+
   // Pending prompt state — owned by Dashboard because these modals must show
   // regardless of which tab (Sessions/Tasks/RunDetail) is currently rendered.
   const [pendingConfirms, setPendingConfirms] = useState<Map<string, ConfirmPrompt>>(new Map());
@@ -78,7 +84,13 @@ export default function Dashboard() {
 
   useEffect(() => {
     window.scrollTo(0, 0);
-  }, [activeHostId]);
+  }, [hostId]);
+
+  useEffect(() => {
+    let cancelled = false;
+    loadEnabledCapabilities().then((caps) => { if (!cancelled) setEnabledCapabilities(caps); });
+    return () => { cancelled = true; };
+  }, []);
 
   // host.info bootstrap: agents/version/platform + any prompts that were already
   // pending when this PWA connected. Runs once per (host, connection).
@@ -88,21 +100,19 @@ export default function Dashboard() {
       agents?: AgentInfo[];
       version?: string | null;
       host_platform?: string;
-      capability_tokens?: Record<string, string | null>;
+      linked_client_token?: string | null;
       pending_prompts?: PendingPrompt[];
       lan_url?: string | null;
     }>("host.info")
       .then((result) => {
         setAgents(result.agents ?? []);
         setHostPlatform(result.host_platform);
-        setCapabilityTokens(result.capability_tokens ?? {});
+        setLinkedClientToken(result.linked_client_token ?? null);
         setAgentLabels(result.agents ?? []);
         const version = result.version ?? null;
         setDaemonVersion(version);
         setUpdateRequired(!!version && isOlderThan(version, MIN_HOST_VERSION));
-        if (activeHostId) {
-          setHostLanUrl(activeHostId, result.lan_url ?? undefined);
-        }
+        setHostLanUrl(hostId, result.lan_url ?? undefined);
 
         // Seed modal state from already-pending prompts.
         const confirms = new Map<string, ConfirmPrompt>();
@@ -136,13 +146,13 @@ export default function Dashboard() {
         setInputValues(inputVals);
       })
       .catch(() => { /* silent — update-required prompt guards the broken case */ });
-  }, [connected, activeHostId, request, setHostLanUrl]);
+  }, [connected, hostId, request, setHostLanUrl]);
 
   // Always-on event subscription for modal lifecycle. Independent of which tab
   // is active. Task-card status updates happen inside TasksView while mounted.
   useEffect(() => {
-    if (!connected || !activeHostId) return;
-    const unsubscribe = subscribeEvents(activeHostId, (msg) => {
+    if (!connected) return;
+    const unsubscribe = subscribeEvents(hostId, (msg) => {
       const tokens = msg.subject.split(".");
       if (tokens.length < 3) return;
       const taskId = tokens.slice(2).join(".");
@@ -239,7 +249,7 @@ export default function Dashboard() {
       }
     });
     return unsubscribe;
-  }, [connected, activeHostId, subscribeEvents]);
+  }, [connected, hostId, subscribeEvents]);
 
   async function respondToConfirm(sessionId: string, response: "confirmed" | "aborted") {
     try {
@@ -267,11 +277,8 @@ export default function Dashboard() {
 
   function handleViewRun(taskId: string, runId?: string) {
     if (!confirmLeaveDraft()) return;
-    if (runId) {
-      navigate(`/runs/${encodeURIComponent(taskId)}/${encodeURIComponent(runId)}`);
-    } else {
-      navigate(`/runs/${encodeURIComponent(taskId)}`);
-    }
+    const base = `/hosts/${encodeURIComponent(hostId)}/runs/${encodeURIComponent(taskId)}`;
+    navigate(runId ? `${base}/${encodeURIComponent(runId)}` : base);
   }
 
   async function handleUpdate() {
@@ -290,18 +297,16 @@ export default function Dashboard() {
     setTimeout(() => window.location.reload(), 15000);
   }
 
-  const hasHosts = pairedHosts.length > 0;
-  const showTaskContent = hasHosts && connected && activeHostId && !unauthorized;
-  const activeClientToken = pairedHosts.find((h) => h.hostId === activeHostId)?.clientToken ?? null;
+  const showTaskContent = connected && !unauthorized;
 
   return (
     <div className="dashboard">
-      {isDesktop && <HostMenu daemonVersion={daemonVersion} capabilityTokens={capabilityTokens} activeClientToken={activeClientToken} request={request} onCapabilityTokensChange={setCapabilityTokens} />}
+      {isDesktop && <HostMenu daemonVersion={daemonVersion} linkedClientToken={linkedClientToken} request={request} onEnabledCapabilitiesChange={setEnabledCapabilities} onLinkedClientTokenChange={setLinkedClientToken} />}
 
       <div className="dashboard-content">
         <header className="app-header">
           <div className="app-title-bar">
-            {!isDesktop && <HostMenu daemonVersion={daemonVersion} capabilityTokens={capabilityTokens} activeClientToken={activeClientToken} request={request} onCapabilityTokensChange={setCapabilityTokens} />}
+            {!isDesktop && <HostMenu daemonVersion={daemonVersion} linkedClientToken={linkedClientToken} request={request} onEnabledCapabilitiesChange={setEnabledCapabilities} onLinkedClientTokenChange={setLinkedClientToken} />}
             <h1 className="app-title">Palmier</h1>
             <ConnectionStatusIcon />
           </div>
@@ -336,9 +341,7 @@ export default function Dashboard() {
               </button>
               <button
                 className="btn btn-secondary"
-                onClick={() => {
-                  if (activeHostId) removePairedHost(activeHostId);
-                }}
+                onClick={() => { removePairedHost(hostId); navigate("/", { replace: true }); }}
               >
                 Remove Host
               </button>
@@ -349,19 +352,19 @@ export default function Dashboard() {
             {isTasksTab && !isRunDetail && (
               <TasksView
                 connected={connected}
-                hostId={activeHostId}
+                hostId={hostId}
                 request={request}
                 subscribeEvents={subscribeEvents}
                 agents={agents}
                 hostPlatform={hostPlatform}
-                isNotificationListener={!!activeClientToken && capabilityTokens["notifications"] === activeClientToken}
+                isNotificationListener={isLinkedDevice && enabledCapabilities.has("notifications")}
                 onViewRun={handleViewRun}
               />
             )}
             {isRunDetail ? (
               <RunDetailView
                 connected={connected}
-                hostId={activeHostId}
+                hostId={hostId}
                 request={request}
                 subscribeEvents={subscribeEvents}
                 taskId={params.taskId!}
@@ -370,27 +373,19 @@ export default function Dashboard() {
             ) : !isTasksTab ? (
               <SessionsView
                 connected={connected}
-                hostId={activeHostId}
+                hostId={hostId}
                 request={request}
                 subscribeEvents={subscribeEvents}
                 agents={agents}
                 hostPlatform={hostPlatform}
                 filterTaskId={runsFilterTaskId}
-                onClearFilter={() => { if (confirmLeaveDraft()) navigate("/"); }}
+                onClearFilter={() => { if (confirmLeaveDraft()) navigate(`/hosts/${encodeURIComponent(hostId)}`); }}
               />
             ) : null}
           </>
         ) : (
           <div className="empty-state">
-            <p>{hasHosts ? "Connecting to host..." : "No host computer paired yet."}</p>
-            {!hasHosts && (
-              <button
-                className="btn btn-primary"
-                onClick={() => navigate("/pair")}
-              >
-                Pair Host
-              </button>
-            )}
+            <p>Connecting to host...</p>
           </div>
         )}
         </main>

package/palmier-server/pwa/src/pages/PairHost.tsx

@@ -18,8 +18,11 @@ interface PairResponse {
 const isLoopback = !!(window as any).__PALMIER_SERVE__
   && (window.location.hostname === "localhost" || window.location.hostname === "127.0.0.1");
 
+const isNative = Capacitor.isNativePlatform();
+
 export default function PairHost() {
   const [code, setCode] = useState("");
+  const [makeLinked, setMakeLinked] = useState(true);
   const [pairing, setPairing] = useState(false);
   const [error, setError] = useState<string | null>(null);
   const { addPairedHost } = useHostStore();
@@ -106,7 +109,8 @@ export default function PairHost() {
         }
       }
 
-      navigate(Capacitor.isNativePlatform() ? "/pair/setup" : "/");
+      const base = `/hosts/${encodeURIComponent(response.hostId)}`;
+      navigate(isNative && makeLinked ? `${base}/pair/setup` : base);
     } catch (err) {
       const message = err instanceof Error ? err.message : String(err);
       if (message.includes("timeout") || message.includes("TIMEOUT") || message.includes("503") || message.toLowerCase().includes("no responders")) {
@@ -176,6 +180,21 @@ export default function PairHost() {
             />
           </label>
 
+          {isNative && (
+            <label className="pair-checkbox">
+              <input
+                type="checkbox"
+                checked={makeLinked}
+                onChange={(e) => setMakeLinked(e.target.checked)}
+                disabled={pairing}
+              />
+              <span className="pair-checkbox-text">
+                <span className="pair-checkbox-title">Link this device</span>
+                <span className="pair-checkbox-hint">The host will use this device for SMS, contacts, calendar, location, and alarms. Only one device can be linked at a time.</span>
+              </span>
+            </label>
+          )}
+
           {error && <p className="pair-error">{error}</p>}
 
           <button