@peers-app/peers-ui 0.27.3 → 0.27.4

package/src/screens/packages/local-folder-grants-panel.tsx

@@ -1,290 +0,0 @@
-import type { ILocalFolderGrantInfo, LocalFolderMode } from "@peers-app/peers-sdk";
-import { useEffect, useState } from "react";
-import { groups } from "../../globals";
-import { useObservable } from "../../hooks";
-import { useHostContract } from "../../hooks/use-host-contract";
-import { localFoldersConsumer } from "./local-folders-ipc";
-
-/** Props for {@link LocalFolderGrantsPanel}. */
-export interface ILocalFolderGrantsPanelProps {
-  /**
-   * When set, the list and new grants are limited to this package.
-   * Omit it for the device-wide operator list.
-   */
-  packageId?: string;
-}
-
-/**
- * Folder grants on this device, with add and revoke.
- *
- * Add opens the host folder picker. A host that does not provide System Local Folders
- * (the PWA) shows the contract as unavailable.
- */
-export function LocalFolderGrantsPanel(props: ILocalFolderGrantsPanelProps) {
-  const { consumer, error: transportError } = useHostContract(localFoldersConsumer);
-  const [groupList] = useObservable(groups);
-  const [grants, setGrants] = useState<ILocalFolderGrantInfo[] | undefined>();
-  const [loadError, setLoadError] = useState<Error | undefined>();
-  const [actionError, setActionError] = useState<string | undefined>();
-  const [busy, setBusy] = useState(false);
-  const [groupId, setGroupId] = useState("");
-  const [mode, setMode] = useState<LocalFolderMode>("readwrite");
-  const [refresh, setRefresh] = useState(0);
-
-  useEffect(() => {
-    if (!consumer) {
-      return;
-    }
-    let cancelled = false;
-    consumer.tools.listGrants().then(
-      (result) => {
-        if (!cancelled) {
-          setGrants(result.grants);
-          setLoadError(undefined);
-        }
-      },
-      (cause: unknown) => {
-        if (!cancelled) {
-          setLoadError(cause instanceof Error ? cause : new Error(String(cause)));
-        }
-      },
-    );
-    return () => {
-      cancelled = true;
-    };
-  }, [consumer, refresh]);
-
-  const unavailable = isUnavailable(transportError) || isUnavailable(loadError);
-  const visible = (grants ?? []).filter((grant) =>
-    props.packageId ? grant.packageId === props.packageId : true,
-  );
-  const names = new Map(groupList.map((group) => [group.groupId, group.name || group.groupId]));
-
-  async function addFolder(): Promise<void> {
-    if (!consumer || !groupId) {
-      return;
-    }
-    setBusy(true);
-    setActionError(undefined);
-    try {
-      await consumer.tools.requestGrant({
-        groupId,
-        mode,
-        ...(props.packageId ? { packageId: props.packageId } : {}),
-      });
-      setRefresh((value) => value + 1);
-    } catch (cause) {
-      const message = cause instanceof Error ? cause.message : String(cause);
-      if (!/cancelled/i.test(message)) {
-        setActionError(message);
-      }
-    } finally {
-      setBusy(false);
-    }
-  }
-
-  async function revoke(grantId: string): Promise<void> {
-    if (!consumer) {
-      return;
-    }
-    if (!window.confirm("Revoke this folder grant?")) {
-      return;
-    }
-    setBusy(true);
-    setActionError(undefined);
-    try {
-      await consumer.tools.revokeGrant({ grantId });
-      setRefresh((value) => value + 1);
-    } catch (cause) {
-      setActionError(cause instanceof Error ? cause.message : String(cause));
-    } finally {
-      setBusy(false);
-    }
-  }
-
-  return (
-    <section className="mb-4">
-      <h5>{props.packageId ? "Folders" : "Local folders"}</h5>
-      <FolderStatus
-        unavailable={unavailable}
-        transportError={transportError}
-        loadError={loadError}
-        loading={!!consumer && grants === undefined && !loadError}
-      />
-      {consumer && !unavailable && (
-        <>
-          <GrantTable grants={visible} names={names} busy={busy} onRevoke={revoke} />
-          <AddFolderForm
-            fieldScope={props.packageId ?? "device"}
-            groupId={groupId}
-            groups={groupList.map((group) => ({
-              groupId: group.groupId,
-              name: group.name || group.groupId,
-            }))}
-            mode={mode}
-            busy={busy}
-            onGroupId={setGroupId}
-            onMode={setMode}
-            onAdd={addFolder}
-          />
-          {actionError && <div className="alert alert-danger mt-2 mb-0">{actionError}</div>}
-        </>
-      )}
-    </section>
-  );
-}
-
-function FolderStatus(props: {
-  unavailable: boolean;
-  transportError: Error | undefined;
-  loadError: Error | undefined;
-  loading: boolean;
-}) {
-  if (props.unavailable) {
-    return (
-      <div className="alert alert-secondary mb-0">
-        System Local Folders is not available on this host.
-      </div>
-    );
-  }
-  const error = props.loadError ?? props.transportError;
-  if (error) {
-    return <div className="alert alert-danger mb-0">{error.message}</div>;
-  }
-  if (props.loading) {
-    return <div className="text-muted">Loading folder grants…</div>;
-  }
-  return null;
-}
-
-function GrantTable(props: {
-  grants: ILocalFolderGrantInfo[];
-  names: Map<string, string>;
-  busy: boolean;
-  onRevoke: (grantId: string) => void;
-}) {
-  if (props.grants.length === 0) {
-    return <p className="text-muted">No folder grants.</p>;
-  }
-  return (
-    <div className="table-responsive">
-      <table className="table table-sm align-middle">
-        <thead>
-          <tr>
-            <th>Path</th>
-            <th>Group</th>
-            <th>Package</th>
-            <th>Mode</th>
-            <th>Created</th>
-            <th />
-          </tr>
-        </thead>
-        <tbody>
-          {props.grants.map((grant) => (
-            <GrantRow
-              key={grant.grantId}
-              grant={grant}
-              groupName={props.names.get(grant.groupId) ?? grant.groupId}
-              busy={props.busy}
-              onRevoke={props.onRevoke}
-            />
-          ))}
-        </tbody>
-      </table>
-    </div>
-  );
-}
-
-function GrantRow(props: {
-  grant: ILocalFolderGrantInfo;
-  groupName: string;
-  busy: boolean;
-  onRevoke: (grantId: string) => void;
-}) {
-  const { grant } = props;
-  return (
-    <tr>
-      <td className="text-break">{grant.absolutePath}</td>
-      <td>{props.groupName}</td>
-      <td>{grant.packageId ?? "operator"}</td>
-      <td>{grant.mode}</td>
-      <td>{new Date(grant.createdAt).toLocaleString()}</td>
-      <td>
-        <button
-          type="button"
-          className="btn btn-sm btn-outline-danger"
-          disabled={props.busy}
-          onClick={() => props.onRevoke(grant.grantId)}
-        >
-          Revoke
-        </button>
-      </td>
-    </tr>
-  );
-}
-
-function AddFolderForm(props: {
-  fieldScope: string;
-  groupId: string;
-  groups: { groupId: string; name: string }[];
-  mode: LocalFolderMode;
-  busy: boolean;
-  onGroupId: (groupId: string) => void;
-  onMode: (mode: LocalFolderMode) => void;
-  onAdd: () => void;
-}) {
-  return (
-    <form
-      className="row g-2 align-items-end"
-      onSubmit={(event) => {
-        event.preventDefault();
-        props.onAdd();
-      }}
-    >
-      <div className="col-md-5">
-        <label className="form-label" htmlFor={`local-folder-group-${props.fieldScope}`}>
-          Group
-        </label>
-        <select
-          id={`local-folder-group-${props.fieldScope}`}
-          className="form-select"
-          value={props.groupId}
-          onChange={(event) => props.onGroupId(event.target.value)}
-        >
-          <option value="">Select a group</option>
-          {props.groups.map((group) => (
-            <option key={group.groupId} value={group.groupId}>
-              {group.name}
-            </option>
-          ))}
-        </select>
-      </div>
-      <div className="col-md-3">
-        <label className="form-label" htmlFor={`local-folder-mode-${props.fieldScope}`}>
-          Mode
-        </label>
-        <select
-          id={`local-folder-mode-${props.fieldScope}`}
-          className="form-select"
-          value={props.mode}
-          onChange={(event) => props.onMode(event.target.value as LocalFolderMode)}
-        >
-          <option value="readwrite">readwrite</option>
-          <option value="read">read</option>
-        </select>
-      </div>
-      <div className="col-md-4">
-        <button type="submit" className="btn btn-primary" disabled={props.busy || !props.groupId}>
-          {props.busy ? "Working…" : "Add folder"}
-        </button>
-      </div>
-    </form>
-  );
-}
-
-function isUnavailable(error: Error | undefined): boolean {
-  if (!error) {
-    return false;
-  }
-  return /No contract provider registered|not available locally/i.test(error.message);
-}

package/src/screens/packages/local-folders-ipc.ts

@@ -1,28 +0,0 @@
-import {
-  getLocalFoldersContractDefinition,
-  hostContractConsumer,
-  type IContractConsumerBase,
-  type IHostContractConsumer,
-  type ILocalFolderGrantInfo,
-  type ILocalFolderRequestGrantInput,
-} from "@peers-app/peers-sdk";
-
-/** Tools the Packages screens use on System Local Folders. */
-export interface ILocalFoldersUiConsumer extends IContractConsumerBase {
-  tools: {
-    /** Create a grant. Omitting `absolutePath` opens the desktop folder picker. */
-    requestGrant(input: ILocalFolderRequestGrantInput): Promise<ILocalFolderGrantInfo>;
-    /** Active grants on this device. */
-    listGrants(): Promise<{ grants: ILocalFolderGrantInfo[] }>;
-    /** Revoke one grant. `revoked` is false when it was already gone. */
-    revokeGrant(input: { grantId: string }): Promise<{ revoked: boolean }>;
-  };
-}
-
-/**
- * Shared System Local Folders consumer for the Packages screens.
- *
- * The PWA host does not register this contract. Callers treat a missing provider as unavailable.
- */
-export const localFoldersConsumer: IHostContractConsumer<ILocalFoldersUiConsumer> =
-  hostContractConsumer<ILocalFoldersUiConsumer>(getLocalFoldersContractDefinition());

package/src/screens/packages/package-details.tsx

@@ -1,166 +0,0 @@
-import { Packages } from "@peers-app/peers-sdk";
-import { Input } from "../../components/input";
-import { LoadingIndicator } from "../../components/loading-indicator";
-import { type ISaveButtonProps, SaveButton } from "../../components/save-button";
-import { ScreenTabBody, Tabs } from "../../components/tabs";
-import { useObservableState, usePromise } from "../../hooks";
-import { updateActiveTabTitle } from "../../tabs-layout/tabs-state";
-import { LocalFolderGrantsPanel } from "./local-folder-grants-panel";
-import { PackageInfo } from "./package-info";
-import { PackageRuntimeStatus } from "./package-runtime-status";
-import { PackageVersionsList } from "./package-versions";
-import { packagesTools } from "./packages-ipc";
-
-interface IProps {
-  /** Package to show. */
-  packageId: string;
-}
-
-/** Detail screen for a single package with Info, Versions, Components, and Dependencies tabs. */
-export const PackageDetails = (props: IProps) => {
-  const refresh = useObservableState(Date.now());
-
-  const pkg = usePromise(
-    async () => {
-      const pkg = await Packages().get(props.packageId);
-      if (!pkg) {
-        throw new Error("Workflow not found");
-      }
-      updateActiveTabTitle(pkg.name || "Package");
-      return Packages().initDoc(pkg);
-    },
-    undefined,
-    [props.packageId, refresh()],
-  );
-
-  if (!pkg) {
-    return <LoadingIndicator />;
-  }
-
-  const addActions: ISaveButtonProps["addActions"] = [
-    {
-      label: "Reload Package",
-      onClick: async () => {
-        try {
-          const { warning } = await (await packagesTools()).reloadPackage({
-            packageId: pkg.packageId,
-          });
-          if (warning) alert(warning);
-        } catch (err) {
-          alert(`Reload failed: ${err instanceof Error ? err.message : String(err)}`);
-          return;
-        }
-        await pkg.load();
-        window.location.reload();
-      },
-    },
-  ];
-  if (!pkg.remoteRepo) {
-    addActions.push({
-      label: "Make Remote ",
-      // className: 'text-bg-warning',
-      onClick: async () => {
-        if (confirm(`Create a remote repository from this local one: ${pkg.name}`)) {
-          const tools = await packagesTools();
-          try {
-            await tools.linkRemoteRepo({ packageId: pkg.packageId });
-          } catch (err) {
-            alert(`Error linking remote repo: ${err instanceof Error ? err.message : err}`);
-            return;
-          }
-          try {
-            await tools.reloadPackage({ packageId: pkg.packageId });
-          } catch (err) {
-            alert(
-              `Linked the remote repo, but reloading failed: ${err instanceof Error ? err.message : err}`,
-            );
-          }
-          refresh(Date.now());
-        }
-      },
-    });
-  }
-
-  return (
-    <div className="container-fluid p-3">
-      <div className="d-flex">
-        <div>
-          <h4>
-            <i className="bi bi-box-fill me-2"></i>
-          </h4>
-        </div>
-        <div className="flex-grow-1">
-          <h4>
-            <Input
-              key={pkg.packageId}
-              className="border border-0"
-              style={{ width: "100%", outline: "none", backgroundColor: "transparent" }}
-              value={pkg.qs.name}
-            />
-          </h4>
-        </div>
-        <div>
-          <SaveButton
-            key={pkg.packageId}
-            doc={pkg}
-            onClick={async () => {
-              await Packages().signAndSave(pkg.toJS());
-              pkg.q(0);
-            }}
-            addActions={[...addActions]}
-            deleteLabel="Uninstall"
-            onDelete={async () => {
-              await (await packagesTools()).uninstallPackage({ packageId: pkg.packageId });
-            }}
-          />
-        </div>
-      </div>
-
-      <PackageRuntimeStatus packageId={pkg.packageId} />
-
-      <Tabs
-        key={pkg.packageId}
-        tabs={[
-          {
-            name: "Info",
-            content: (
-              <ScreenTabBody>
-                <PackageInfo pkg={pkg} />
-              </ScreenTabBody>
-            ),
-          },
-          {
-            name: "Versions",
-            content: (
-              <ScreenTabBody>
-                <PackageVersionsList pkg={pkg} />
-              </ScreenTabBody>
-            ),
-          },
-          {
-            name: "Components",
-            content: (
-              <ScreenTabBody>
-                TODO - show all of the different components in the package
-              </ScreenTabBody>
-            ),
-          },
-          {
-            name: "Dependencies",
-            content: (
-              <ScreenTabBody>TODO - show all of the dependencies of the package</ScreenTabBody>
-            ),
-          },
-          {
-            name: "Folders",
-            content: (
-              <ScreenTabBody>
-                <LocalFolderGrantsPanel packageId={pkg.packageId} />
-              </ScreenTabBody>
-            ),
-          },
-        ]}
-      />
-    </div>
-  );
-};

package/src/screens/packages/package-helpers.test.ts

@@ -1,57 +0,0 @@
-import { GroupMemberRole, type IPackageVersion, newid } from "@peers-app/peers-sdk";
-import { activatePackageVersion } from "./package-helpers";
-
-const mockActivate = jest.fn(async () => ({}));
-const mockRole = jest.fn();
-const mockPrefs = jest.fn();
-
-jest.mock("./packages-ipc", () => ({
-  packagesTools: async () => ({ activatePackageVersion: mockActivate }),
-}));
-jest.mock("@peers-app/peers-sdk", () => {
-  const actual = jest.requireActual("@peers-app/peers-sdk");
-  return {
-    ...actual,
-    getUserContext: async () => ({
-      userId: "user",
-      defaultDataContext: () => ({ dataContextId: "group" }),
-    }),
-    getUserRole: () => mockRole(),
-    packagePrefsVar: () => Object.assign(mockPrefs, { loadingPromise: Promise.resolve() }),
-  };
-});
-
-beforeEach(() => {
-  jest.clearAllMocks();
-  mockRole.mockResolvedValue(GroupMemberRole.Admin);
-  mockPrefs.mockReturnValue({});
-});
-
-test.each([
-  "dev",
-  "",
-  undefined,
-])("activates dev tag %p only on this device", async (versionTag) => {
-  const packageId = newid();
-  const packageVersionId = newid();
-  await activatePackageVersion(packageId, { packageVersionId, versionTag } as IPackageVersion);
-  expect(mockActivate).toHaveBeenCalledWith({ packageId, packageVersionId, scope: "device" });
-});
-
-test.each(["beta", "stable"])("an admin activates %s for the group", async (versionTag) => {
-  const packageId = newid();
-  const packageVersionId = newid();
-  await activatePackageVersion(packageId, { packageVersionId, versionTag } as IPackageVersion);
-  expect(mockActivate).toHaveBeenCalledWith({ packageId, packageVersionId, scope: "group" });
-});
-
-test("a device follow override keeps release activation local", async () => {
-  mockPrefs.mockReturnValue({ followTags: "stable,beta" });
-  const packageId = newid();
-  const packageVersionId = newid();
-  await activatePackageVersion(packageId, {
-    packageVersionId,
-    versionTag: "stable",
-  } as IPackageVersion);
-  expect(mockActivate).toHaveBeenCalledWith({ packageId, packageVersionId, scope: "device" });
-});

package/src/screens/packages/package-helpers.ts

@@ -1,137 +0,0 @@
-import {
-  doesTagMatch,
-  GroupMemberRole,
-  getUserContext,
-  getUserRole,
-  hasDeviceFollowOverride,
-  type IPackageVersion,
-  PackageVersions,
-  packagePrefsVar,
-} from "@peers-app/peers-sdk";
-import { packagesTools } from "./packages-ipc";
-
-/** Severity of a version update: major > minor > patch. */
-export type UpdateLevel = "major" | "minor" | "patch" | null;
-
-/** Result of checking a package's version status against available versions. */
-export interface IVersionStatus {
-  activePv: IPackageVersion;
-  newerLevel: UpdateLevel;
-  newestPv: IPackageVersion | null;
-}
-
-/**
- * Check a package's version status: what's currently active, whether a newer
- * version exists within the follow policy, and which version is the best
- * upgrade candidate.
- *
- * @param packageId - The package to check.
- * @param activePackageVersionId - The effective active version (device or group).
- * @param followVersionTags - Tag filter from effective prefs.
- */
-export async function checkVersionStatus(
-  packageId: string,
-  activePackageVersionId: string,
-  followVersionTags: string | undefined,
-): Promise<IVersionStatus | null> {
-  const all = await PackageVersions().list({ packageId });
-  const active = all.find((v) => v.packageVersionId === activePackageVersionId);
-  if (!active) return null;
-
-  let newerLevel: UpdateLevel = null;
-  let newestPv: IPackageVersion | null = null;
-
-  if (active.version) {
-    const parse = (v: string) => v.split(".").map(Number);
-    const [aMaj, aMin, aPat] = parse(active.version);
-    let bestVersion = active.version;
-
-    for (const v of all) {
-      if (!v.version || v.packageVersionId === activePackageVersionId) continue;
-      if (!doesTagMatch(active.versionTag, v.versionTag, followVersionTags, undefined)) continue;
-      const [maj, min, pat] = parse(v.version);
-      const [bMaj, bMin, bPat] = parse(bestVersion);
-
-      let candidateLevel: UpdateLevel = null;
-      if (maj > aMaj) candidateLevel = "major";
-      else if (maj === aMaj && min > aMin) candidateLevel = "minor";
-      else if (maj === aMaj && min === aMin && pat > aPat) candidateLevel = "patch";
-      else if (
-        maj === aMaj &&
-        min === aMin &&
-        pat === aPat &&
-        (v.createdAt || "") > (active.createdAt || "")
-      )
-        candidateLevel = "patch";
-
-      if (!candidateLevel) continue;
-
-      const levelRank = { major: 3, minor: 2, patch: 1 };
-      if (!newerLevel || levelRank[candidateLevel] > levelRank[newerLevel]) {
-        newerLevel = candidateLevel;
-      }
-
-      const isHigherThanBest =
-        maj > bMaj ||
-        (maj === bMaj && min > bMin) ||
-        (maj === bMaj && min === bMin && pat > bPat) ||
-        (maj === bMaj &&
-          min === bMin &&
-          pat === bPat &&
-          (v.createdAt || "") > (newestPv?.createdAt || active.createdAt || ""));
-
-      if (!newestPv || isHigherThanBest) {
-        newestPv = v;
-        bestVersion = v.version;
-      }
-    }
-  }
-  return { activePv: active, newerLevel, newestPv };
-}
-
-/** Whether the current user is an admin of the active group. */
-export async function isGroupAdmin(): Promise<boolean> {
-  try {
-    const userCtx = await getUserContext();
-    const dc = userCtx.defaultDataContext();
-    const contextId = dc?.groupId || dc?.dataContextId;
-    if (!contextId) return false;
-    const role = await getUserRole(contextId, userCtx.userId);
-    return role >= GroupMemberRole.Admin;
-  } catch {
-    return false;
-  }
-}
-
-/**
- * Activate a specific package version, handling group-level vs device-local
- * activation. When the device has no follow override and the user is a group
- * admin, a release advances the group's `activePackageVersionId` so all devices
- * stay in sync. Dev versions (including legacy missing or empty tags) and other
- * selections only update the device-local prefs.
- *
- * @param packageId - The package to activate a version for.
- * @param pv - The package version to activate.
- */
-export async function activatePackageVersion(
-  packageId: string,
-  pv: IPackageVersion,
-): Promise<void> {
-  const prefsVar = packagePrefsVar(packageId);
-  await prefsVar.loadingPromise;
-  const devicePrefs = prefsVar();
-
-  const activatesGroup =
-    (pv.versionTag || "dev") !== "dev" &&
-    !hasDeviceFollowOverride(devicePrefs) &&
-    (await isGroupAdmin());
-
-  await (await packagesTools()).activatePackageVersion({
-    packageId,
-    packageVersionId: pv.packageVersionId,
-    scope: activatesGroup ? "group" : "device",
-  });
-}
-
-/** Numeric rank for sorting packages by update urgency. */
-export const updateLevelRank: Record<string, number> = { major: 3, minor: 2, patch: 1 };