@peers-app/peers-ui 0.29.0 → 0.29.2

package/dist/hooks/index.d.ts

@@ -1,3 +1,4 @@
+export * from "./use-file-url";
 export * from "./use-observable";
 export * from "./use-observable-state";
 export * from "./use-on-screen";

package/dist/hooks/index.js

@@ -15,6 +15,7 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 // `use-host-contract` stays internal: its screens import it by path.
+__exportStar(require("./use-file-url"), exports);
 __exportStar(require("./use-observable"), exports);
 __exportStar(require("./use-observable-state"), exports);
 __exportStar(require("./use-on-screen"), exports);

package/dist/hooks/use-file-url.d.ts

@@ -0,0 +1,23 @@
+/** What {@link useFileUrl} returns. */
+export interface IUseFileUrlResult {
+    /** An object URL for the file, such as an `<img src>`. Undefined until it's read. */
+    url: string | undefined;
+    /** True while the file is being read. */
+    loading: boolean;
+    /** Why the file couldn't be read: not found, or not on any connected device. */
+    error: Error | undefined;
+}
+/**
+ * Read a file saved with System Files and give a URL for it, for an image or a download link.
+ *
+ * ```tsx
+ * const avatar = useFileUrl(member.imageFileId);
+ * {avatar.url ? <img src={avatar.url} alt="" /> : <Initials />}
+ * ```
+ *
+ * Reads through `hostContract(SystemFiles)` in the screen's data context, the active group.
+ * The URL is revoked when the file id changes or the component unmounts, so don't keep it.
+ *
+ * @param fileId - The file's id; nothing is read while it's undefined.
+ */
+export declare function useFileUrl(fileId: string | undefined): IUseFileUrlResult;

package/dist/hooks/use-file-url.js

@@ -0,0 +1,52 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useFileUrl = useFileUrl;
+const peers_sdk_1 = require("@peers-app/peers-sdk");
+const react_1 = require("react");
+/**
+ * Read a file saved with System Files and give a URL for it, for an image or a download link.
+ *
+ * ```tsx
+ * const avatar = useFileUrl(member.imageFileId);
+ * {avatar.url ? <img src={avatar.url} alt="" /> : <Initials />}
+ * ```
+ *
+ * Reads through `hostContract(SystemFiles)` in the screen's data context, the active group.
+ * The URL is revoked when the file id changes or the component unmounts, so don't keep it.
+ *
+ * @param fileId - The file's id; nothing is read while it's undefined.
+ */
+function useFileUrl(fileId) {
+    const [state, setState] = (0, react_1.useState)({
+        url: undefined,
+        loading: !!fileId,
+        error: undefined,
+    });
+    (0, react_1.useEffect)(() => {
+        if (!fileId) {
+            setState({ url: undefined, loading: false, error: undefined });
+            return;
+        }
+        let ended = false;
+        let url;
+        setState({ url: undefined, loading: true, error: undefined });
+        const files = (0, peers_sdk_1.hostContract)(peers_sdk_1.SystemFiles);
+        (0, peers_sdk_1.readWholeFile)((input) => files.tools.read(input), fileId).then(({ bytes, mimeType }) => {
+            if (ended)
+                return;
+            url = URL.createObjectURL(new Blob([bytes], mimeType ? { type: mimeType } : undefined));
+            setState({ url, loading: false, error: undefined });
+        }, (error) => {
+            if (ended)
+                return;
+            const reason = error instanceof Error ? error : new Error(String(error));
+            setState({ url: undefined, loading: false, error: reason });
+        });
+        return () => {
+            ended = true;
+            if (url)
+                URL.revokeObjectURL(url);
+        };
+    }, [fileId]);
+    return state;
+}

package/dist/screens/packages/package-info.js

@@ -84,9 +84,11 @@ const PackageInfo = (props) => {
     };
     return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("small", { children: "Name:" }), (0, jsx_runtime_1.jsx)(input_1.Input, { value: pkg.qs.name, className: "form-control mb-3 p-0 ps-2", placeholder: "Package name", title: "Package name", disabled: true }), (0, jsx_runtime_1.jsxs)("div", { className: "mt-2", children: [(0, jsx_runtime_1.jsxs)("small", { children: ["Local Path:", (0, jsx_runtime_1.jsxs)("small", { children: [(0, jsx_runtime_1.jsx)(tooltip_1.Tooltip, { markdownContent: `The local path to the directory containing the package.  This will open in VS Code if it's installed otherwise this will open in your native file system` }), (0, jsx_runtime_1.jsx)("button", { className: "btn btn-sm btn-link", onClick: () => {
                                             void (0, host_shell_consumer_1.openInEditorOnHost)(localPath || peers_sdk_1.packagesRootDir);
-                                        }, children: "Open Local" })] })] }), (0, jsx_runtime_1.jsx)("input", { type: "text", className: "form-control mb-3 p-0 ps-2", placeholder: "~/peers/packages/my-package", value: localPath || "", onChange: (e) => setLocalPath(e.target.value) })] }), remoteRepoUrl ? ((0, jsx_runtime_1.jsxs)("div", { className: "mt-2", children: [(0, jsx_runtime_1.jsxs)("small", { children: ["Source URL:", (0, jsx_runtime_1.jsxs)("small", { children: [(0, jsx_runtime_1.jsx)(tooltip_1.Tooltip, { markdownContent: `The remote source of this package.  Often a github repository URL or a link to the Peers page for the package.` }), (0, jsx_runtime_1.jsx)("button", { className: "btn btn-sm btn-link", onClick: () => {
+                                        }, children: "Open Local" })] })] }), (0, jsx_runtime_1.jsx)("input", { type: "text", className: "form-control mb-3 p-0 ps-2", placeholder: "~/peers/packages/my-package", value: localPath || "", onChange: (e) => setLocalPath(e.target.value) })] }), remoteRepoUrl ? ((0, jsx_runtime_1.jsxs)("div", { className: "mt-2", children: [(0, jsx_runtime_1.jsxs)("small", { children: ["Source URL:", (0, jsx_runtime_1.jsxs)("small", { children: [(0, jsx_runtime_1.jsx)(tooltip_1.Tooltip, { markdownContent: `The remote source of this package.  Often a github repository URL, a link to the Peers page for the package, or a **peers://** URL shared through the Git package (clone it with **git clone**).` }), /^https?:\/\//.test(remoteRepoUrl) ? ((0, jsx_runtime_1.jsx)("button", { className: "btn btn-sm btn-link", onClick: () => {
                                             void (0, host_shell_consumer_1.openOnHost)(remoteRepoUrl);
-                                        }, children: "Open Remote" })] })] }), (0, jsx_runtime_1.jsx)(input_1.Input, { value: pkg.qs.remoteRepo, className: "form-control mb-3 p-0 ps-2", disabled: true })] })) : null, (0, jsx_runtime_1.jsxs)("div", { className: "mt-2", children: [(0, jsx_runtime_1.jsxs)("small", { children: ["Update URL:", (0, jsx_runtime_1.jsx)("small", { children: (0, jsx_runtime_1.jsx)(tooltip_1.Tooltip, { markdownContent: `Base URL for remote package updates. Admin devices poll **<updateUrl>/latest-<tag>.json** on startup (for example **latest-stable.json**). Signed artifacts must be published to this host separately — for example via the publish-package tool or the peers-core full-release pipeline.` }) })] }), (0, jsx_runtime_1.jsx)(input_1.Input, { value: pkg.qs.updateUrl, className: "form-control mb-3 p-0 ps-2", placeholder: "https://example.com/my-package", title: "Update URL" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "mt-2", children: [(0, jsx_runtime_1.jsx)("hr", {}), (0, jsx_runtime_1.jsxs)("small", { children: ["Version:", (0, jsx_runtime_1.jsx)(tooltip_1.Tooltip, { markdownContent: "The currently active version of this package. Manage versions in the Versions tab." })] }), activeVersion ? ((0, jsx_runtime_1.jsxs)("div", { className: "d-flex align-items-center mt-1 mb-3", children: [(0, jsx_runtime_1.jsxs)("strong", { className: "me-2", children: ["v", activeVersion.version] }), activeVersion.versionTag && ((0, jsx_runtime_1.jsx)("span", { className: `badge ${activeVersion.versionTag === "dev" ? "text-bg-danger" : activeVersion.versionTag.startsWith("beta") ? "text-bg-warning" : "text-bg-success"} me-2`, children: activeVersion.versionTag })), (0, jsx_runtime_1.jsx)("code", { className: "text-muted small me-2", children: activeVersion.packageVersionHash?.substring(0, 8) }), newerLevel === "uptodate" ? ((0, jsx_runtime_1.jsx)("span", { className: "badge text-bg-success", children: "Up to date" })) : newerLevel ? ((0, jsx_runtime_1.jsxs)("span", { className: `badge text-bg-${newerLevel === "major" ? "danger" : newerLevel === "minor" ? "warning" : "info"}`, children: ["Newer ", newerLevel, " version available"] })) : null] })) : ((0, jsx_runtime_1.jsx)("div", { className: "text-muted small mt-1 mb-3", children: "No active version" })), (0, jsx_runtime_1.jsxs)("div", { className: "mb-3", children: [(0, jsx_runtime_1.jsxs)("small", { children: ["Auto-Update Range:", (0, jsx_runtime_1.jsx)(tooltip_1.Tooltip, { markdownContent: "Controls which new versions are auto-activated for the group. When an admin device auto-upgrades, the group's active version advances for everyone. **Pinned** = never auto-update. **Patch** = same major.minor (e.g. 1.2.x). **Minor** = same major (e.g. 1.x.x). **Latest** = always auto-update to newest." })] }), (0, jsx_runtime_1.jsxs)("select", { className: "form-select form-select-sm", value: groupRange, onChange: (e) => saveFollowPolicy({
+                                        }, children: "Open Remote" })) : ((0, jsx_runtime_1.jsx)("button", { className: "btn btn-sm btn-link", onClick: () => {
+                                            void navigator.clipboard?.writeText(remoteRepoUrl);
+                                        }, children: "Copy" }))] })] }), (0, jsx_runtime_1.jsx)(input_1.Input, { value: pkg.qs.remoteRepo, className: "form-control mb-3 p-0 ps-2", disabled: true })] })) : null, (0, jsx_runtime_1.jsxs)("div", { className: "mt-2", children: [(0, jsx_runtime_1.jsxs)("small", { children: ["Update URL:", (0, jsx_runtime_1.jsx)("small", { children: (0, jsx_runtime_1.jsx)(tooltip_1.Tooltip, { markdownContent: `Base URL for remote package updates. Admin devices poll **<updateUrl>/latest-<tag>.json** on startup (for example **latest-stable.json**). Signed artifacts must be published to this host separately — for example via the publish-package tool or the peers-core full-release pipeline.` }) })] }), (0, jsx_runtime_1.jsx)(input_1.Input, { value: pkg.qs.updateUrl, className: "form-control mb-3 p-0 ps-2", placeholder: "https://example.com/my-package", title: "Update URL" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "mt-2", children: [(0, jsx_runtime_1.jsx)("hr", {}), (0, jsx_runtime_1.jsxs)("small", { children: ["Version:", (0, jsx_runtime_1.jsx)(tooltip_1.Tooltip, { markdownContent: "The currently active version of this package. Manage versions in the Versions tab." })] }), activeVersion ? ((0, jsx_runtime_1.jsxs)("div", { className: "d-flex align-items-center mt-1 mb-3", children: [(0, jsx_runtime_1.jsxs)("strong", { className: "me-2", children: ["v", activeVersion.version] }), activeVersion.versionTag && ((0, jsx_runtime_1.jsx)("span", { className: `badge ${activeVersion.versionTag === "dev" ? "text-bg-danger" : activeVersion.versionTag.startsWith("beta") ? "text-bg-warning" : "text-bg-success"} me-2`, children: activeVersion.versionTag })), (0, jsx_runtime_1.jsx)("code", { className: "text-muted small me-2", children: activeVersion.packageVersionHash?.substring(0, 8) }), newerLevel === "uptodate" ? ((0, jsx_runtime_1.jsx)("span", { className: "badge text-bg-success", children: "Up to date" })) : newerLevel ? ((0, jsx_runtime_1.jsxs)("span", { className: `badge text-bg-${newerLevel === "major" ? "danger" : newerLevel === "minor" ? "warning" : "info"}`, children: ["Newer ", newerLevel, " version available"] })) : null] })) : ((0, jsx_runtime_1.jsx)("div", { className: "text-muted small mt-1 mb-3", children: "No active version" })), (0, jsx_runtime_1.jsxs)("div", { className: "mb-3", children: [(0, jsx_runtime_1.jsxs)("small", { children: ["Auto-Update Range:", (0, jsx_runtime_1.jsx)(tooltip_1.Tooltip, { markdownContent: "Controls which new versions are auto-activated for the group. When an admin device auto-upgrades, the group's active version advances for everyone. **Pinned** = never auto-update. **Patch** = same major.minor (e.g. 1.2.x). **Minor** = same major (e.g. 1.x.x). **Latest** = always auto-update to newest." })] }), (0, jsx_runtime_1.jsxs)("select", { className: "form-select form-select-sm", value: groupRange, onChange: (e) => saveFollowPolicy({
                                     versionFollowRange: e.target.value,
                                 }), children: [(0, jsx_runtime_1.jsx)("option", { value: "latest", children: "Latest (auto-update to newest)" }), (0, jsx_runtime_1.jsx)("option", { value: "minor", children: "Minor (same major version)" }), (0, jsx_runtime_1.jsx)("option", { value: "patch", children: "Patch (same major.minor version)" }), (0, jsx_runtime_1.jsx)("option", { value: "pinned", children: "Pinned (no auto-updates)" })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: `mb-3 ${groupRange === "pinned" ? "opacity-50" : ""}`, children: [(0, jsx_runtime_1.jsxs)("small", { children: ["Following:", (0, jsx_runtime_1.jsx)(tooltip_1.Tooltip, { markdownContent: "Which release channel the group follows. Devices using group settings will auto-upgrade within this channel. **Stable** = only fully promoted releases. **Stable + Beta** = also includes beta pre-releases for early testing." })] }), (0, jsx_runtime_1.jsxs)("select", { className: "form-select form-select-sm", value: groupFollowTags, disabled: groupRange === "pinned", onChange: (e) => saveFollowPolicy({
                                     followVersionTags: e.target.value === "stable" ? undefined : e.target.value,

package/dist/ui-router/bundle-files.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Read a package's UI or routes bundle as text, through System Files in the context its
+ * version is installed in.
+ *
+ * @param dataContextId - Context of the selected package version.
+ * @param fileId - The bundle's file id.
+ */
+export declare function readBundleText(dataContextId: string, fileId: string): Promise<string>;

package/dist/ui-router/bundle-files.js

@@ -0,0 +1,28 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.readBundleText = readBundleText;
+const peers_sdk_1 = require("@peers-app/peers-sdk");
+const clients = new Map();
+/** System Files on the local host, scoped to one data context; one client per context. */
+function filesIn(dataContextId) {
+    let client = clients.get(dataContextId);
+    if (!client) {
+        client = (0, peers_sdk_1.hostContract)(peers_sdk_1.SystemFiles, { dataContextId: async () => dataContextId });
+        clients.set(dataContextId, client);
+    }
+    return client;
+}
+// Keep a leading BOM, as Buffer's UTF-8 decoding did, so bundle integrity hashes still match.
+const decoder = new TextDecoder("utf-8", { ignoreBOM: true });
+/**
+ * Read a package's UI or routes bundle as text, through System Files in the context its
+ * version is installed in.
+ *
+ * @param dataContextId - Context of the selected package version.
+ * @param fileId - The bundle's file id.
+ */
+async function readBundleText(dataContextId, fileId) {
+    const files = filesIn(dataContextId);
+    const { bytes } = await (0, peers_sdk_1.readWholeFile)((input) => files.tools.read(input), fileId);
+    return decoder.decode(bytes);
+}

package/dist/ui-router/routes-loader.js

@@ -3,6 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.loadAllRoutes = exports.allPackages = void 0;
 const peers_sdk_1 = require("@peers-app/peers-sdk");
 require("../ui-defaults");
+const bundle_files_1 = require("./bundle-files");
 const runnable_version_1 = require("./runnable-version");
 /** Packages with authorized navigation metadata available in the current context. */
 exports.allPackages = (0, peers_sdk_1.observable)([]);
@@ -102,8 +103,8 @@ function loadRoutesBundle(pkg, forceRefresh) {
                 const selected = await (0, runnable_version_1.resolveRunnableVersion)(pkg);
                 const routesBundleFileId = selected?.pv.routesBundleFileId;
                 let bundleCode = "";
-                if (routesBundleFileId) {
-                    bundleCode = await peers_sdk_1.rpcServerCalls.getFileContents(routesBundleFileId);
+                if (selected && routesBundleFileId) {
+                    bundleCode = await (0, bundle_files_1.readBundleText)(selected.dataContext.dataContextId, routesBundleFileId);
                 }
                 if (bundleCode) {
                     if (selected?.dataContext.groupId)

package/dist/ui-router/ui-loader.js

@@ -43,6 +43,7 @@ const loading_indicator_1 = require("../components/loading-indicator");
 const globals_1 = require("../globals");
 const hooks_1 = require("../hooks");
 require("../ui-defaults");
+const bundle_files_1 = require("./bundle-files");
 const routes_loader_1 = require("./routes-loader");
 const runnable_version_1 = require("./runnable-version");
 const peersUIs = {};
@@ -194,7 +195,7 @@ function loadUIBundle(pkg, forceRefresh) {
             if (!selected || !uiBundleFileId) {
                 return;
             }
-            const bundleCode = await peers_sdk_1.rpcServerCalls.getFileContents(uiBundleFileId);
+            const bundleCode = await (0, bundle_files_1.readBundleText)(selected.dataContext.dataContextId, uiBundleFileId);
             if (bundleCode) {
                 if (selected.dataContext.groupId)
                     (0, peers_sdk_1.assertPackageBundleIntegrity)(selected.pv, "ui", bundleCode);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@peers-app/peers-ui",
-  "version": "0.29.0",
+  "version": "0.29.2",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/peers-app/peers-ui.git"
@@ -36,7 +36,7 @@
     "lint:fix": "biome check --write ."
   },
   "peerDependencies": {
-    "@peers-app/peers-sdk": "^0.29.0",
+    "@peers-app/peers-sdk": "^0.29.2",
     "bootstrap": "^5.3.3",
     "react": "^18.0.0",
     "react-dom": "^18.0.0"
@@ -47,7 +47,7 @@
     "@babel/preset-react": "^7.24.1",
     "@babel/preset-typescript": "^7.27.1",
     "@biomejs/biome": "2.3.11",
-    "@peers-app/peers-sdk": "0.29.0",
+    "@peers-app/peers-sdk": "0.29.2",
     "@testing-library/dom": "^10.4.0",
     "@testing-library/jest-dom": "^6.6.3",
     "@testing-library/react": "^16.3.0",