@peers-app/peers-ui 0.26.0 → 0.26.2

package/dist/app-updates/app-update-controls.d.ts

@@ -0,0 +1,23 @@
+import type { IAppUpdateStatus } from "@peers-app/peers-sdk";
+/** Bootstrap Icons class used for "update available" everywhere in the shell. */
+export declare const APP_UPDATE_ICON_CLASS = "bi-arrow-up-circle-fill";
+/**
+ * Button that installs this device's available update and relaunches, or restarts it when
+ * there is nothing to install.
+ *
+ * @param props.status - This device's update status.
+ * @param props.className - Bootstrap button classes.
+ */
+export declare function UpdateAndRestartButton({ status, className, }: {
+    status: IAppUpdateStatus;
+    className?: string;
+}): import("react/jsx-runtime").JSX.Element;
+/**
+ * Update section of the network status popover. Renders only while an update is available,
+ * downloading, ready, or installing.
+ *
+ * @param props.status - This device's update status.
+ */
+export declare function AppUpdatePopoverSection({ status }: {
+    status: IAppUpdateStatus | undefined;
+}): import("react/jsx-runtime").JSX.Element | null;

package/dist/app-updates/app-update-controls.js

@@ -0,0 +1,40 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.APP_UPDATE_ICON_CLASS = void 0;
+exports.UpdateAndRestartButton = UpdateAndRestartButton;
+exports.AppUpdatePopoverSection = AppUpdatePopoverSection;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const app_updates_consumer_1 = require("./app-updates-consumer");
+/** Bootstrap Icons class used for "update available" everywhere in the shell. */
+exports.APP_UPDATE_ICON_CLASS = "bi-arrow-up-circle-fill";
+/**
+ * Button that installs this device's available update and relaunches, or restarts it when
+ * there is nothing to install.
+ *
+ * @param props.status - This device's update status.
+ * @param props.className - Bootstrap button classes.
+ */
+function UpdateAndRestartButton({ status, className = "btn btn-sm btn-warning", }) {
+    const [error, setError] = (0, react_1.useState)();
+    const busy = (0, app_updates_consumer_1.isAppRestarting)(status);
+    const label = (0, app_updates_consumer_1.hasAppUpdate)(status) ? "Update & restart" : "Restart";
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("button", { type: "button", className: className, disabled: busy || !status.canRestart, onClick: () => {
+                    setError(undefined);
+                    (0, app_updates_consumer_1.getAppUpdatesConsumer)()
+                        .then((appUpdates) => appUpdates.tools.installUpdateAndRestart())
+                        .catch((err) => setError(err instanceof Error ? err.message : String(err)));
+                }, children: [(0, jsx_runtime_1.jsx)("i", { className: `bi ${exports.APP_UPDATE_ICON_CLASS} me-1`, "aria-hidden": "true" }), busy ? (0, app_updates_consumer_1.describeAppUpdateStatus)(status) : label] }), error && (0, jsx_runtime_1.jsx)("div", { className: "small text-danger mt-1", children: error })] }));
+}
+/**
+ * Update section of the network status popover. Renders only while an update is available,
+ * downloading, ready, or installing.
+ *
+ * @param props.status - This device's update status.
+ */
+function AppUpdatePopoverSection({ status }) {
+    if (!status?.supported || !((0, app_updates_consumer_1.hasAppUpdate)(status) || (0, app_updates_consumer_1.isAppRestarting)(status))) {
+        return null;
+    }
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "alert alert-warning py-2 px-2 small mb-3", "data-testid": "app-update-section", children: [(0, jsx_runtime_1.jsxs)("div", { className: "mb-1", children: [(0, jsx_runtime_1.jsx)("i", { className: `bi ${exports.APP_UPDATE_ICON_CLASS} me-1`, "aria-hidden": "true" }), (0, app_updates_consumer_1.describeAppUpdateStatus)(status)] }), status.installOnQuitArmed && ((0, jsx_runtime_1.jsx)("div", { className: "text-muted mb-2", children: "Installs automatically the next time Peers restarts." })), (0, jsx_runtime_1.jsx)(UpdateAndRestartButton, { status: status, className: "btn btn-sm btn-warning w-100" })] }));
+}

package/dist/app-updates/app-updates-consumer.d.ts

@@ -0,0 +1,41 @@
+import { type IAppUpdateStatus, type IAppUpdatesConsumer } from "@peers-app/peers-sdk";
+/** Shared handle for System App Updates on the local host; stable for `useHostContract`. */
+export declare const appUpdatesContract: import("@peers-app/peers-sdk").IHostContractConsumer<IAppUpdatesConsumer>;
+/** Return the System App Updates consumer bound to the current local host transport. */
+export declare function getAppUpdatesConsumer(): Promise<IAppUpdatesConsumer>;
+/**
+ * Why a call to another device's App Updates failed:
+ *
+ * - `unavailable` — the device cannot update or restart itself, or runs a build without App Updates.
+ * - `denied` — the device does not trust this user as `Self`, or does not allow remote restarts.
+ * - `unreachable` — the device is not connected or did not answer.
+ * - `failed` — anything else.
+ */
+export type AppUpdatesErrorKind = "unavailable" | "denied" | "unreachable" | "failed";
+/**
+ * Classify an App Updates error so the UI can hide, disable, or explain the action.
+ *
+ * @param error - Error thrown by a relayed App Updates call.
+ */
+export declare function classifyAppUpdatesError(error: unknown): AppUpdatesErrorKind;
+/**
+ * Whether a newer version is available, downloading, or ready to install. A failed download
+ * or check still counts while a newer version is known: Update & restart retries it.
+ *
+ * @param status - Update status, or `undefined` while loading.
+ */
+export declare function hasAppUpdate(status: IAppUpdateStatus | undefined): boolean;
+/**
+ * Whether the device is already installing an update or restarting.
+ *
+ * @param status - Update status, or `undefined` while loading.
+ */
+export declare function isAppRestarting(status: IAppUpdateStatus | undefined): boolean;
+/** Version being downloaded, or the cached version being prepared for installation. */
+export declare function getAppUpdateVersion(status: IAppUpdateStatus): string | undefined;
+/**
+ * One-line, human-readable summary of an update status.
+ *
+ * @param status - Update status to describe.
+ */
+export declare function describeAppUpdateStatus(status: IAppUpdateStatus): string;

package/dist/app-updates/app-updates-consumer.js

@@ -0,0 +1,96 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.appUpdatesContract = void 0;
+exports.getAppUpdatesConsumer = getAppUpdatesConsumer;
+exports.classifyAppUpdatesError = classifyAppUpdatesError;
+exports.hasAppUpdate = hasAppUpdate;
+exports.isAppRestarting = isAppRestarting;
+exports.getAppUpdateVersion = getAppUpdateVersion;
+exports.describeAppUpdateStatus = describeAppUpdateStatus;
+const peers_sdk_1 = require("@peers-app/peers-sdk");
+/** Shared handle for System App Updates on the local host; stable for `useHostContract`. */
+exports.appUpdatesContract = (0, peers_sdk_1.hostContractConsumer)((0, peers_sdk_1.getAppUpdatesContractDefinition)());
+/** Return the System App Updates consumer bound to the current local host transport. */
+function getAppUpdatesConsumer() {
+    return exports.appUpdatesContract.get();
+}
+/**
+ * Classify an App Updates error so the UI can hide, disable, or explain the action.
+ *
+ * @param error - Error thrown by a relayed App Updates call.
+ */
+function classifyAppUpdatesError(error) {
+    const message = error instanceof Error ? error.message : String(error);
+    if (/No contract provider registered|has no live resolver|cannot install updates or restart/i.test(message)) {
+        return "unavailable";
+    }
+    if (/Permission denied/i.test(message)) {
+        return "denied";
+    }
+    if (/not connected|not reachable|timed out|did not answer/i.test(message)) {
+        return "unreachable";
+    }
+    return "failed";
+}
+function knowsNewerVersion(status) {
+    return [status.latestVersion, status.downloadedVersion].some((version) => !!version && (0, peers_sdk_1.isNewerVersion)(status.currentVersion, version));
+}
+/**
+ * Whether a newer version is available, downloading, or ready to install. A failed download
+ * or check still counts while a newer version is known: Update & restart retries it.
+ *
+ * @param status - Update status, or `undefined` while loading.
+ */
+function hasAppUpdate(status) {
+    if (!status) {
+        return false;
+    }
+    return (status.state === "available" ||
+        status.state === "downloading" ||
+        status.state === "downloaded" ||
+        (status.state === "error" && knowsNewerVersion(status)));
+}
+/**
+ * Whether the device is already installing an update or restarting.
+ *
+ * @param status - Update status, or `undefined` while loading.
+ */
+function isAppRestarting(status) {
+    return status?.state === "installing" || status?.state === "restarting";
+}
+/** Version being downloaded, or the cached version being prepared for installation. */
+function getAppUpdateVersion(status) {
+    return status.state === "downloaded" || status.state === "installing"
+        ? (status.downloadedVersion ?? status.latestVersion)
+        : (status.latestVersion ?? status.downloadedVersion);
+}
+/**
+ * One-line, human-readable summary of an update status.
+ *
+ * @param status - Update status to describe.
+ */
+function describeAppUpdateStatus(status) {
+    const version = getAppUpdateVersion(status);
+    switch (status.state) {
+        case "installing":
+            return version ? `Installing ${version}…` : "Installing update…";
+        case "restarting":
+            return "Restarting…";
+        case "downloaded":
+            return `Version ${version} is ready to install${status.error ? `. Update problem: ${status.error}` : ""}`;
+        case "downloading":
+            return `Downloading ${version}${status.downloadPercent != null ? ` (${status.downloadPercent}%)` : ""}`;
+        case "available":
+            return `Version ${version} is available`;
+        case "checking":
+            return "Checking for updates…";
+        case "up-to-date":
+            return "Up to date";
+        case "error":
+            return knowsNewerVersion(status)
+                ? `Version ${version} is available. Update problem: ${status.error ?? "unknown error"}`
+                : `Update problem: ${status.error ?? "unknown error"}`;
+        default:
+            return status.supported ? "Not checked yet" : "Updates are not available for this build";
+    }
+}

package/dist/app-updates/app-updates-consumer.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/app-updates/app-updates-consumer.test.js

@@ -0,0 +1,56 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const app_updates_consumer_1 = require("./app-updates-consumer");
+function status(overrides = {}) {
+    return {
+        supported: true,
+        canRestart: true,
+        platform: "darwin",
+        currentVersion: "1.0.0",
+        state: "idle",
+        installOnRestart: true,
+        installOnQuitArmed: false,
+        remoteRestartAllowed: true,
+        ...overrides,
+    };
+}
+describe("classifyAppUpdatesError", () => {
+    it.each([
+        ["No contract provider registered for abc v1", "unavailable"],
+        ["Provider p has no live resolver for abc v1", "unavailable"],
+        ["This device cannot install updates or restart itself", "unavailable"],
+        ["Permission denied: tool 'getStatus'.run on contract abc", "denied"],
+        ["Device d is not connected", "unreachable"],
+        ["Device d is not reachable through the peers mesh", "unreachable"],
+        ["Remote contract call to d timed out after 30000ms", "unreachable"],
+        ["Device d did not answer within 30000ms", "unreachable"],
+        ["Something else", "failed"],
+    ])("classifies %s as %s", (message, kind) => {
+        expect((0, app_updates_consumer_1.classifyAppUpdatesError)(new Error(message))).toBe(kind);
+    });
+});
+describe("status helpers", () => {
+    it("treats available, downloading, and downloaded as an available update", () => {
+        expect((0, app_updates_consumer_1.hasAppUpdate)(undefined)).toBe(false);
+        expect((0, app_updates_consumer_1.hasAppUpdate)(status({ state: "up-to-date" }))).toBe(false);
+        for (const state of ["available", "downloading", "downloaded"]) {
+            expect((0, app_updates_consumer_1.hasAppUpdate)(status({ state }))).toBe(true);
+        }
+        expect((0, app_updates_consumer_1.isAppRestarting)(status({ state: "installing" }))).toBe(true);
+        expect((0, app_updates_consumer_1.isAppRestarting)(status({ state: "downloaded" }))).toBe(false);
+    });
+    it("keeps a known newer version as an update after a failed download", () => {
+        expect((0, app_updates_consumer_1.hasAppUpdate)(status({ state: "error", latestVersion: "1.1.0" }))).toBe(true);
+        expect((0, app_updates_consumer_1.hasAppUpdate)(status({ state: "error", downloadedVersion: "1.1.0" }))).toBe(true);
+        expect((0, app_updates_consumer_1.hasAppUpdate)(status({ state: "error", latestVersion: "1.0.0" }))).toBe(false);
+        expect((0, app_updates_consumer_1.hasAppUpdate)(status({ state: "error" }))).toBe(false);
+    });
+    it("describes each state", () => {
+        expect((0, app_updates_consumer_1.describeAppUpdateStatus)(status({ state: "downloading", latestVersion: "1.2.0", downloadedVersion: "1.1.0" }))).toBe("Downloading 1.2.0");
+        expect((0, app_updates_consumer_1.describeAppUpdateStatus)(status({ state: "downloading", latestVersion: "1.1.0", downloadPercent: 42 }))).toBe("Downloading 1.1.0 (42%)");
+        expect((0, app_updates_consumer_1.describeAppUpdateStatus)(status({ state: "downloaded", downloadedVersion: "1.1.0" }))).toBe("Version 1.1.0 is ready to install");
+        expect((0, app_updates_consumer_1.describeAppUpdateStatus)(status({ state: "error", error: "offline" }))).toBe("Update problem: offline");
+        expect((0, app_updates_consumer_1.describeAppUpdateStatus)(status({ state: "error", latestVersion: "1.1.0", error: "download failed" }))).toBe("Version 1.1.0 is available. Update problem: download failed");
+        expect((0, app_updates_consumer_1.describeAppUpdateStatus)(status({ supported: false }))).toBe("Updates are not available for this build");
+    });
+});

package/dist/app-updates/app-updates-settings.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Settings tab for this device's application updates: version, check and install controls,
+ * and the two per-device update settings.
+ */
+export declare function AppUpdatesSettings(): import("react/jsx-runtime").JSX.Element;

package/dist/app-updates/app-updates-settings.js

@@ -0,0 +1,44 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AppUpdatesSettings = AppUpdatesSettings;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const peers_sdk_1 = require("@peers-app/peers-sdk");
+const react_1 = require("react");
+const checkbox_1 = require("../components/checkbox");
+const tooltip_1 = require("../components/tooltip");
+const app_update_controls_1 = require("./app-update-controls");
+const app_updates_consumer_1 = require("./app-updates-consumer");
+const use_app_update_status_1 = require("./use-app-update-status");
+/**
+ * macOS accepted the update for an Update & restart that timed out, and installs it when
+ * Peers quits; that cannot be withdrawn.
+ */
+function isPreparedDespiteOptOut(status) {
+    return status.platform === "darwin" && !status.installOnRestart && status.installOnQuitArmed;
+}
+function SettingCheckbox({ id, label, checked, help, }) {
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "form-check mb-2", children: [(0, jsx_runtime_1.jsx)(checkbox_1.Checkbox, { id: id, className: "form-check-input", checked: checked }), (0, jsx_runtime_1.jsx)("label", { htmlFor: id, className: "form-check-label small me-1", children: label }), (0, jsx_runtime_1.jsx)(tooltip_1.Tooltip, { markdownContent: help })] }));
+}
+/**
+ * Settings tab for this device's application updates: version, check and install controls,
+ * and the two per-device update settings.
+ */
+function AppUpdatesSettings() {
+    const status = (0, use_app_update_status_1.useAppUpdateStatus)();
+    const [checking, setChecking] = (0, react_1.useState)(false);
+    const [checkError, setCheckError] = (0, react_1.useState)();
+    if (!status) {
+        return (0, jsx_runtime_1.jsx)("p", { className: "small text-muted", children: "Loading update status\u2026" });
+    }
+    if (!status.canRestart) {
+        return ((0, jsx_runtime_1.jsx)("p", { className: "small text-muted", children: "This device does not update itself. Browser installs update when the page reloads." }));
+    }
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("h5", { className: "mb-3", children: "Updates" }), (0, jsx_runtime_1.jsxs)("dl", { className: "row small mb-2", children: [(0, jsx_runtime_1.jsx)("dt", { className: "col-4", children: "Installed version" }), (0, jsx_runtime_1.jsx)("dd", { className: "col-8", children: status.currentVersion }), status.latestVersion && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("dt", { className: "col-4", children: "Latest version" }), (0, jsx_runtime_1.jsx)("dd", { className: "col-8", children: status.latestVersion })] })), (0, jsx_runtime_1.jsx)("dt", { className: "col-4", children: "Status" }), (0, jsx_runtime_1.jsx)("dd", { className: "col-8", children: (0, app_updates_consumer_1.describeAppUpdateStatus)(status) }), status.lastCheckedAt != null && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("dt", { className: "col-4", children: "Last checked" }), (0, jsx_runtime_1.jsx)("dd", { className: "col-8", children: new Date(status.lastCheckedAt).toLocaleString() })] }))] }), (0, jsx_runtime_1.jsxs)("div", { className: "d-flex gap-2 mb-3", children: [(0, jsx_runtime_1.jsx)("button", { type: "button", className: "btn btn-sm btn-outline-secondary", disabled: !status.supported || checking || (0, app_updates_consumer_1.isAppRestarting)(status), onClick: () => {
+                            setChecking(true);
+                            setCheckError(undefined);
+                            (0, app_updates_consumer_1.getAppUpdatesConsumer)()
+                                .then((appUpdates) => appUpdates.tools.checkForUpdates())
+                                .catch((err) => setCheckError(err instanceof Error ? err.message : String(err)))
+                                .finally(() => setChecking(false));
+                        }, children: "Check now" }), (0, jsx_runtime_1.jsx)(app_update_controls_1.UpdateAndRestartButton, { status: status, className: `btn btn-sm ${(0, app_updates_consumer_1.hasAppUpdate)(status) ? "btn-warning" : "btn-outline-secondary"}` })] }), checkError && ((0, jsx_runtime_1.jsx)("p", { className: "small text-danger", role: "alert", children: checkError })), (0, jsx_runtime_1.jsx)(SettingCheckbox, { id: "installAppUpdatesOnRestart", label: "Install updates automatically when Peers restarts", checked: peers_sdk_1.installAppUpdatesOnRestart, help: "Updates always download in the background. When this is off, they install only when you choose **Update & restart** here or in the network status menu." }), isPreparedDespiteOptOut(status) && ((0, jsx_runtime_1.jsxs)("p", { className: "small text-muted ms-4", children: ["macOS prepared version ", status.downloadedVersion, " for an earlier Update & restart, so it will still install when Peers quits. Later updates will wait for you."] })), (0, jsx_runtime_1.jsx)(SettingCheckbox, { id: "allowRemoteAppUpdateRestart", label: "Allow my other devices to update and restart this device", checked: peers_sdk_1.allowRemoteAppUpdateRestart, help: "Lets your other devices, and people you trust as yourself, run **Update & restart** on this device from Identity \u2192 Devices or the Network Viewer." })] }));
+}

package/dist/app-updates/app-updates-settings.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/app-updates/app-updates-settings.test.js

@@ -0,0 +1,93 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("@testing-library/react");
+const app_updates_settings_1 = require("./app-updates-settings");
+let mockStatus;
+const checkForUpdates = jest.fn();
+jest.mock("../components/tooltip", () => ({ Tooltip: () => null }));
+jest.mock("./use-app-update-status", () => ({ useAppUpdateStatus: () => mockStatus }));
+jest.mock("./app-updates-consumer", () => ({
+    ...jest.requireActual("./app-updates-consumer"),
+    getAppUpdatesConsumer: () => Promise.resolve({ tools: { checkForUpdates: () => checkForUpdates() } }),
+}));
+function status(overrides = {}) {
+    return {
+        supported: true,
+        canRestart: true,
+        platform: "darwin",
+        currentVersion: "1.0.0",
+        latestVersion: "1.0.0",
+        state: "up-to-date",
+        installOnRestart: true,
+        installOnQuitArmed: false,
+        remoteRestartAllowed: true,
+        ...overrides,
+    };
+}
+describe("AppUpdatesSettings", () => {
+    beforeEach(() => {
+        checkForUpdates.mockReset();
+        checkForUpdates.mockResolvedValue(status());
+    });
+    it("explains hosts that do not update themselves", () => {
+        mockStatus = status({ supported: false, canRestart: false });
+        const view = (0, react_1.render)((0, jsx_runtime_1.jsx)(app_updates_settings_1.AppUpdatesSettings, {}));
+        expect(view.container).toHaveTextContent("This device does not update itself");
+    });
+    it("shows versions, both settings, and checks on demand", async () => {
+        mockStatus = status();
+        const view = (0, react_1.render)((0, jsx_runtime_1.jsx)(app_updates_settings_1.AppUpdatesSettings, {}));
+        expect(view.container).toHaveTextContent("Installed version1.0.0");
+        expect(view.getByLabelText("Install updates automatically when Peers restarts")).toBeTruthy();
+        expect(view.getByLabelText("Allow my other devices to update and restart this device")).toBeTruthy();
+        expect(view.getByRole("button", { name: /^Restart$/ })).toBeTruthy();
+        react_1.fireEvent.click(view.getByRole("button", { name: "Check now" }));
+        await (0, react_1.waitFor)(() => expect(checkForUpdates).toHaveBeenCalledTimes(1));
+    });
+    it("adds no note when the user opts out of a downloaded update", () => {
+        mockStatus = status({
+            state: "downloaded",
+            latestVersion: "1.1.0",
+            downloadedVersion: "1.1.0",
+            installOnRestart: false,
+            installOnQuitArmed: false,
+        });
+        const view = (0, react_1.render)((0, jsx_runtime_1.jsx)(app_updates_settings_1.AppUpdatesSettings, {}));
+        expect(view.container).not.toHaveTextContent("will still install");
+        expect(view.getByRole("button", { name: /Update & restart/ })).toBeTruthy();
+    });
+    it("notes when macOS accepted an update for an earlier Update & restart", () => {
+        mockStatus = status({
+            state: "downloaded",
+            latestVersion: "1.1.0",
+            downloadedVersion: "1.1.0",
+            installOnRestart: false,
+            installOnQuitArmed: true,
+        });
+        const view = (0, react_1.render)((0, jsx_runtime_1.jsx)(app_updates_settings_1.AppUpdatesSettings, {}));
+        expect(view.container).toHaveTextContent("macOS prepared version 1.1.0 for an earlier Update & restart");
+        expect(view.getByRole("button", { name: /Update & restart/ })).toBeTruthy();
+    });
+    it("shows a failed check and lets the user retry", async () => {
+        mockStatus = status();
+        checkForUpdates.mockRejectedValueOnce(new Error("Host disconnected"));
+        const view = (0, react_1.render)((0, jsx_runtime_1.jsx)(app_updates_settings_1.AppUpdatesSettings, {}));
+        react_1.fireEvent.click(view.getByRole("button", { name: "Check now" }));
+        expect(await view.findByRole("alert")).toHaveTextContent("Host disconnected");
+        react_1.fireEvent.click(view.getByRole("button", { name: "Check now" }));
+        await (0, react_1.waitFor)(() => expect(checkForUpdates).toHaveBeenCalledTimes(2));
+        expect(view.queryByRole("alert")).toBeNull();
+    });
+    it("shows feed errors while a downloaded update remains ready to install", () => {
+        mockStatus = status({
+            state: "downloaded",
+            latestVersion: "1.1.0",
+            downloadedVersion: "1.1.0",
+            error: "Feed unreachable",
+        });
+        const view = (0, react_1.render)((0, jsx_runtime_1.jsx)(app_updates_settings_1.AppUpdatesSettings, {}));
+        expect(view.container).toHaveTextContent("Version 1.1.0 is ready to install. Update problem: Feed unreachable");
+        expect(view.getByRole("button", { name: /Update & restart/ })).toBeEnabled();
+    });
+});

package/dist/app-updates/remote-app-update-panel.d.ts

@@ -0,0 +1,18 @@
+/** How often the panel refreshes the target's status after an update or restart request. */
+export declare const REMOTE_UPDATE_POLL_MS = 5000;
+/** How long the panel keeps refreshing after a request. */
+export declare const REMOTE_UPDATE_POLL_DURATION_MS: number;
+/**
+ * Card showing another device's app version with an **Update & restart** action.
+ *
+ * The local host relays both calls to the target, which requires that it trusts this user
+ * as `Self` and allows remote restarts. Renders nothing when the target cannot update or
+ * restart itself, runs a build without App Updates, or does not trust this user.
+ *
+ * @param props.deviceId - Target device.
+ * @param props.deviceName - Name used in the confirmation prompt.
+ */
+export declare function RemoteAppUpdatePanel({ deviceId, deviceName, }: {
+    deviceId: string;
+    deviceName?: string;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/app-updates/remote-app-update-panel.js

@@ -0,0 +1,125 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.REMOTE_UPDATE_POLL_DURATION_MS = exports.REMOTE_UPDATE_POLL_MS = void 0;
+exports.RemoteAppUpdatePanel = RemoteAppUpdatePanel;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const app_update_controls_1 = require("./app-update-controls");
+const app_updates_consumer_1 = require("./app-updates-consumer");
+/** How often the panel refreshes the target's status after an update or restart request. */
+exports.REMOTE_UPDATE_POLL_MS = 5_000;
+/** How long the panel keeps refreshing after a request. */
+exports.REMOTE_UPDATE_POLL_DURATION_MS = 3 * 60_000;
+function errorMessage(error) {
+    return error instanceof Error ? error.message : String(error);
+}
+function disabledReason(status) {
+    if (!status.remoteRestartAllowed) {
+        return "This device does not allow remote restarts. Turn on “Allow my other devices to update and restart this device” in its Settings → Updates.";
+    }
+    if (status.installNeedsElevation) {
+        return "Installing updates on this device needs an administrator password, so update it at the device.";
+    }
+    return undefined;
+}
+/**
+ * Card showing another device's app version with an **Update & restart** action.
+ *
+ * The local host relays both calls to the target, which requires that it trusts this user
+ * as `Self` and allows remote restarts. Renders nothing when the target cannot update or
+ * restart itself, runs a build without App Updates, or does not trust this user.
+ *
+ * @param props.deviceId - Target device.
+ * @param props.deviceName - Name used in the confirmation prompt.
+ */
+function RemoteAppUpdatePanel({ deviceId, deviceName, }) {
+    // Route changes must not keep another device's status, consent switch, or pending request.
+    return (0, jsx_runtime_1.jsx)(DeviceAppUpdatePanel, { deviceId: deviceId, deviceName: deviceName }, deviceId);
+}
+function DeviceAppUpdatePanel({ deviceId, deviceName }) {
+    const [state, setState] = (0, react_1.useState)({ kind: "loading" });
+    const [refreshKey, setRefreshKey] = (0, react_1.useState)(0);
+    const [requestedAt, setRequestedAt] = (0, react_1.useState)();
+    const [requestError, setRequestError] = (0, react_1.useState)();
+    const [sending, setSending] = (0, react_1.useState)(false);
+    (0, react_1.useEffect)(() => {
+        let active = true;
+        let poll;
+        const load = () => {
+            void (0, app_updates_consumer_1.getAppUpdatesConsumer)()
+                .then((appUpdates) => appUpdates.tools.getDeviceUpdateStatus({ deviceId }))
+                .then((status) => {
+                if (active) {
+                    setState(status.canRestart ? { kind: "ready", status } : { kind: "hidden" });
+                }
+            })
+                .catch((error) => {
+                if (!active)
+                    return;
+                const kind = (0, app_updates_consumer_1.classifyAppUpdatesError)(error);
+                if (kind === "unavailable" || kind === "denied") {
+                    setState({ kind: "hidden" });
+                }
+                else {
+                    setState({
+                        kind: kind === "unreachable" ? "unreachable" : "error",
+                        message: errorMessage(error),
+                    });
+                }
+            })
+                .finally(() => {
+                // Wait for the preceding RPC: a slow target can take up to 30s to answer.
+                // An interval would overlap calls and discard every response as stale.
+                if (active &&
+                    requestedAt !== undefined &&
+                    Date.now() - requestedAt < exports.REMOTE_UPDATE_POLL_DURATION_MS) {
+                    poll = setTimeout(load, exports.REMOTE_UPDATE_POLL_MS);
+                }
+            });
+        };
+        load();
+        return () => {
+            active = false;
+            if (poll)
+                clearTimeout(poll);
+        };
+    }, [deviceId, refreshKey, requestedAt]);
+    (0, react_1.useEffect)(() => {
+        if (requestedAt === undefined)
+            return;
+        const stop = setTimeout(() => setRequestedAt(undefined), exports.REMOTE_UPDATE_POLL_DURATION_MS);
+        return () => {
+            clearTimeout(stop);
+        };
+    }, [requestedAt]);
+    if (state.kind === "hidden") {
+        return null;
+    }
+    const requestUpdate = (status) => {
+        const name = deviceName || deviceId;
+        const prompt = (0, app_updates_consumer_1.hasAppUpdate)(status)
+            ? `Update ${name} to ${(0, app_updates_consumer_1.getAppUpdateVersion)(status)} and restart it?`
+            : `Restart ${name}? It will check for an update first.`;
+        if (!confirm(prompt))
+            return;
+        setSending(true);
+        setRequestError(undefined);
+        (0, app_updates_consumer_1.getAppUpdatesConsumer)()
+            .then((appUpdates) => appUpdates.tools.installUpdateAndRestartOnDevice({ deviceId }))
+            .then(() => {
+            setRequestedAt(Date.now());
+            setRefreshKey((key) => key + 1);
+        })
+            .catch((error) => setRequestError(errorMessage(error)))
+            .finally(() => setSending(false));
+    };
+    return ((0, jsx_runtime_1.jsx)("div", { className: "card mt-3", "data-testid": "remote-app-update", children: (0, jsx_runtime_1.jsxs)("div", { className: "card-body py-2 px-3 small", children: [(0, jsx_runtime_1.jsx)("div", { className: "fw-semibold mb-1", children: "App version" }), state.kind === "loading" && (0, jsx_runtime_1.jsx)("div", { className: "text-muted", children: "Checking this device\u2026" }), state.kind === "unreachable" && ((0, jsx_runtime_1.jsx)("div", { className: "text-muted", children: requestedAt !== undefined ? "Restarting…" : `Not reachable: ${state.message}` })), state.kind === "error" && (0, jsx_runtime_1.jsx)("div", { className: "text-danger", children: state.message }), (state.kind === "unreachable" || state.kind === "error") && ((0, jsx_runtime_1.jsx)("button", { type: "button", className: "btn btn-sm btn-outline-secondary mt-2", onClick: () => {
+                        setState({ kind: "loading" });
+                        setRefreshKey((key) => key + 1);
+                    }, children: "Retry" })), state.kind === "ready" && ((0, jsx_runtime_1.jsx)(RemoteStatus, { status: state.status, sending: sending, requested: requestedAt !== undefined, onRequest: () => requestUpdate(state.status) })), requestError && (0, jsx_runtime_1.jsx)("div", { className: "text-danger mt-1", children: requestError })] }) }));
+}
+function RemoteStatus({ status, sending, requested, onRequest, }) {
+    const reason = disabledReason(status);
+    const update = (0, app_updates_consumer_1.hasAppUpdate)(status);
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", { className: "mb-2", children: [status.currentVersion ? `Version ${status.currentVersion} · ` : "", (0, app_updates_consumer_1.describeAppUpdateStatus)(status)] }), (0, jsx_runtime_1.jsxs)("button", { type: "button", className: `btn btn-sm ${update ? "btn-warning" : "btn-outline-secondary"}`, disabled: Boolean(reason) || sending || (0, app_updates_consumer_1.isAppRestarting)(status), onClick: onRequest, children: [(0, jsx_runtime_1.jsx)("i", { className: `bi ${app_update_controls_1.APP_UPDATE_ICON_CLASS} me-1`, "aria-hidden": "true" }), update ? "Update & restart" : "Restart"] }), requested && !(0, app_updates_consumer_1.isAppRestarting)(status) && ((0, jsx_runtime_1.jsx)("span", { className: "text-muted ms-2", children: "Request sent" })), reason && (0, jsx_runtime_1.jsx)("div", { className: "text-muted mt-1", children: reason })] }));
+}

package/dist/app-updates/remote-app-update-panel.test.d.ts

@@ -0,0 +1 @@
+export {};