@peers-app/peers-ui 0.26.0 → 0.26.2

package/src/app-updates/app-update-controls.tsx

@@ -0,0 +1,73 @@
+import type { IAppUpdateStatus } from "@peers-app/peers-sdk";
+import { useState } from "react";
+import {
+  describeAppUpdateStatus,
+  getAppUpdatesConsumer,
+  hasAppUpdate,
+  isAppRestarting,
+} from "./app-updates-consumer";
+
+/** Bootstrap Icons class used for "update available" everywhere in the shell. */
+export 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 function UpdateAndRestartButton({
+  status,
+  className = "btn btn-sm btn-warning",
+}: {
+  status: IAppUpdateStatus;
+  className?: string;
+}) {
+  const [error, setError] = useState<string>();
+  const busy = isAppRestarting(status);
+  const label = hasAppUpdate(status) ? "Update & restart" : "Restart";
+  return (
+    <>
+      <button
+        type="button"
+        className={className}
+        disabled={busy || !status.canRestart}
+        onClick={() => {
+          setError(undefined);
+          getAppUpdatesConsumer()
+            .then((appUpdates) => appUpdates.tools.installUpdateAndRestart())
+            .catch((err: unknown) => setError(err instanceof Error ? err.message : String(err)));
+        }}
+      >
+        <i className={`bi ${APP_UPDATE_ICON_CLASS} me-1`} aria-hidden="true" />
+        {busy ? describeAppUpdateStatus(status) : label}
+      </button>
+      {error && <div className="small text-danger mt-1">{error}</div>}
+    </>
+  );
+}
+
+/**
+ * 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 function AppUpdatePopoverSection({ status }: { status: IAppUpdateStatus | undefined }) {
+  if (!status?.supported || !(hasAppUpdate(status) || isAppRestarting(status))) {
+    return null;
+  }
+  return (
+    <div className="alert alert-warning py-2 px-2 small mb-3" data-testid="app-update-section">
+      <div className="mb-1">
+        <i className={`bi ${APP_UPDATE_ICON_CLASS} me-1`} aria-hidden="true" />
+        {describeAppUpdateStatus(status)}
+      </div>
+      {status.installOnQuitArmed && (
+        <div className="text-muted mb-2">Installs automatically the next time Peers restarts.</div>
+      )}
+      <UpdateAndRestartButton status={status} className="btn btn-sm btn-warning w-100" />
+    </div>
+  );
+}

package/src/app-updates/app-updates-consumer.test.ts

@@ -0,0 +1,83 @@
+import type { IAppUpdateStatus } from "@peers-app/peers-sdk";
+import {
+  classifyAppUpdatesError,
+  describeAppUpdateStatus,
+  hasAppUpdate,
+  isAppRestarting,
+} from "./app-updates-consumer";
+
+function status(overrides: Partial<IAppUpdateStatus> = {}): IAppUpdateStatus {
+  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(classifyAppUpdatesError(new Error(message))).toBe(kind);
+  });
+});
+
+describe("status helpers", () => {
+  it("treats available, downloading, and downloaded as an available update", () => {
+    expect(hasAppUpdate(undefined)).toBe(false);
+    expect(hasAppUpdate(status({ state: "up-to-date" }))).toBe(false);
+    for (const state of ["available", "downloading", "downloaded"] as const) {
+      expect(hasAppUpdate(status({ state }))).toBe(true);
+    }
+    expect(isAppRestarting(status({ state: "installing" }))).toBe(true);
+    expect(isAppRestarting(status({ state: "downloaded" }))).toBe(false);
+  });
+
+  it("keeps a known newer version as an update after a failed download", () => {
+    expect(hasAppUpdate(status({ state: "error", latestVersion: "1.1.0" }))).toBe(true);
+    expect(hasAppUpdate(status({ state: "error", downloadedVersion: "1.1.0" }))).toBe(true);
+    expect(hasAppUpdate(status({ state: "error", latestVersion: "1.0.0" }))).toBe(false);
+    expect(hasAppUpdate(status({ state: "error" }))).toBe(false);
+  });
+
+  it("describes each state", () => {
+    expect(
+      describeAppUpdateStatus(
+        status({ state: "downloading", latestVersion: "1.2.0", downloadedVersion: "1.1.0" }),
+      ),
+    ).toBe("Downloading 1.2.0");
+    expect(
+      describeAppUpdateStatus(
+        status({ state: "downloading", latestVersion: "1.1.0", downloadPercent: 42 }),
+      ),
+    ).toBe("Downloading 1.1.0 (42%)");
+    expect(
+      describeAppUpdateStatus(status({ state: "downloaded", downloadedVersion: "1.1.0" })),
+    ).toBe("Version 1.1.0 is ready to install");
+    expect(describeAppUpdateStatus(status({ state: "error", error: "offline" }))).toBe(
+      "Update problem: offline",
+    );
+    expect(
+      describeAppUpdateStatus(
+        status({ state: "error", latestVersion: "1.1.0", error: "download failed" }),
+      ),
+    ).toBe("Version 1.1.0 is available. Update problem: download failed");
+    expect(describeAppUpdateStatus(status({ supported: false }))).toBe(
+      "Updates are not available for this build",
+    );
+  });
+});

package/src/app-updates/app-updates-consumer.ts

@@ -0,0 +1,121 @@
+import {
+  getAppUpdatesContractDefinition,
+  hostContractConsumer,
+  type IAppUpdateStatus,
+  type IAppUpdatesConsumer,
+  isNewerVersion,
+} from "@peers-app/peers-sdk";
+
+/** Shared handle for System App Updates on the local host; stable for `useHostContract`. */
+export const appUpdatesContract = hostContractConsumer<IAppUpdatesConsumer>(
+  getAppUpdatesContractDefinition(),
+);
+
+/** Return the System App Updates consumer bound to the current local host transport. */
+export function getAppUpdatesConsumer(): Promise<IAppUpdatesConsumer> {
+  return appUpdatesContract.get();
+}
+
+/**
+ * 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 function classifyAppUpdatesError(error: unknown): AppUpdatesErrorKind {
+  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: IAppUpdateStatus): boolean {
+  return [status.latestVersion, status.downloadedVersion].some(
+    (version) => !!version && 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.
+ */
+export function hasAppUpdate(status: IAppUpdateStatus | undefined): boolean {
+  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.
+ */
+export function isAppRestarting(status: IAppUpdateStatus | undefined): boolean {
+  return status?.state === "installing" || status?.state === "restarting";
+}
+
+/** Version being downloaded, or the cached version being prepared for installation. */
+export function getAppUpdateVersion(status: IAppUpdateStatus): string | undefined {
+  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.
+ */
+export function describeAppUpdateStatus(status: IAppUpdateStatus): string {
+  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/src/app-updates/app-updates-settings.test.tsx

@@ -0,0 +1,109 @@
+import type { IAppUpdateStatus } from "@peers-app/peers-sdk";
+import { fireEvent, render, waitFor } from "@testing-library/react";
+import { AppUpdatesSettings } from "./app-updates-settings";
+
+let mockStatus: IAppUpdateStatus | undefined;
+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: Partial<IAppUpdateStatus> = {}): IAppUpdateStatus {
+  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 = render(<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 = render(<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();
+
+    fireEvent.click(view.getByRole("button", { name: "Check now" }));
+    await 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 = render(<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 = render(<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 = render(<AppUpdatesSettings />);
+    fireEvent.click(view.getByRole("button", { name: "Check now" }));
+    expect(await view.findByRole("alert")).toHaveTextContent("Host disconnected");
+    fireEvent.click(view.getByRole("button", { name: "Check now" }));
+    await 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 = render(<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/src/app-updates/app-updates-settings.tsx

@@ -0,0 +1,136 @@
+import {
+  allowRemoteAppUpdateRestart,
+  type IAppUpdateStatus,
+  installAppUpdatesOnRestart,
+} from "@peers-app/peers-sdk";
+import { useState } from "react";
+import { Checkbox } from "../components/checkbox";
+import { Tooltip } from "../components/tooltip";
+import { UpdateAndRestartButton } from "./app-update-controls";
+import {
+  describeAppUpdateStatus,
+  getAppUpdatesConsumer,
+  hasAppUpdate,
+  isAppRestarting,
+} from "./app-updates-consumer";
+import { useAppUpdateStatus } from "./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: IAppUpdateStatus): boolean {
+  return status.platform === "darwin" && !status.installOnRestart && status.installOnQuitArmed;
+}
+
+function SettingCheckbox({
+  id,
+  label,
+  checked,
+  help,
+}: {
+  id: string;
+  label: string;
+  checked: typeof installAppUpdatesOnRestart;
+  help: string;
+}) {
+  return (
+    <div className="form-check mb-2">
+      <Checkbox id={id} className="form-check-input" checked={checked} />
+      <label htmlFor={id} className="form-check-label small me-1">
+        {label}
+      </label>
+      <Tooltip markdownContent={help} />
+    </div>
+  );
+}
+
+/**
+ * Settings tab for this device's application updates: version, check and install controls,
+ * and the two per-device update settings.
+ */
+export function AppUpdatesSettings() {
+  const status = useAppUpdateStatus();
+  const [checking, setChecking] = useState(false);
+  const [checkError, setCheckError] = useState<string>();
+
+  if (!status) {
+    return <p className="small text-muted">Loading update status…</p>;
+  }
+  if (!status.canRestart) {
+    return (
+      <p className="small text-muted">
+        This device does not update itself. Browser installs update when the page reloads.
+      </p>
+    );
+  }
+  return (
+    <>
+      <h5 className="mb-3">Updates</h5>
+      <dl className="row small mb-2">
+        <dt className="col-4">Installed version</dt>
+        <dd className="col-8">{status.currentVersion}</dd>
+        {status.latestVersion && (
+          <>
+            <dt className="col-4">Latest version</dt>
+            <dd className="col-8">{status.latestVersion}</dd>
+          </>
+        )}
+        <dt className="col-4">Status</dt>
+        <dd className="col-8">{describeAppUpdateStatus(status)}</dd>
+        {status.lastCheckedAt != null && (
+          <>
+            <dt className="col-4">Last checked</dt>
+            <dd className="col-8">{new Date(status.lastCheckedAt).toLocaleString()}</dd>
+          </>
+        )}
+      </dl>
+      <div className="d-flex gap-2 mb-3">
+        <button
+          type="button"
+          className="btn btn-sm btn-outline-secondary"
+          disabled={!status.supported || checking || isAppRestarting(status)}
+          onClick={() => {
+            setChecking(true);
+            setCheckError(undefined);
+            getAppUpdatesConsumer()
+              .then((appUpdates) => appUpdates.tools.checkForUpdates())
+              .catch((err: unknown) =>
+                setCheckError(err instanceof Error ? err.message : String(err)),
+              )
+              .finally(() => setChecking(false));
+          }}
+        >
+          Check now
+        </button>
+        <UpdateAndRestartButton
+          status={status}
+          className={`btn btn-sm ${hasAppUpdate(status) ? "btn-warning" : "btn-outline-secondary"}`}
+        />
+      </div>
+      {checkError && (
+        <p className="small text-danger" role="alert">
+          {checkError}
+        </p>
+      )}
+      <SettingCheckbox
+        id="installAppUpdatesOnRestart"
+        label="Install updates automatically when Peers restarts"
+        checked={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) && (
+        <p className="small text-muted ms-4">
+          macOS prepared version {status.downloadedVersion} for an earlier Update &amp; restart, so
+          it will still install when Peers quits. Later updates will wait for you.
+        </p>
+      )}
+      <SettingCheckbox
+        id="allowRemoteAppUpdateRestart"
+        label="Allow my other devices to update and restart this device"
+        checked={allowRemoteAppUpdateRestart}
+        help="Lets your other devices, and people you trust as yourself, run **Update & restart** on this device from Identity → Devices or the Network Viewer."
+      />
+    </>
+  );
+}