@peers-app/peers-ui 0.19.13 → 0.20.0

package/dist/components/trust-level-dropdown.d.ts

@@ -5,5 +5,6 @@ interface TrustLevelDropdownProps {
     onChange?: (newLevel: TrustLevel) => void;
     type?: "user" | "device";
 }
+/** Select a context-scoped user or device trust level, including the full-access Self grant. */
 export declare const TrustLevelDropdown: ({ userId, dataContext, onChange, type, }: TrustLevelDropdownProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/trust-level-dropdown.js

@@ -5,11 +5,17 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const peers_sdk_1 = require("@peers-app/peers-sdk");
 const react_1 = require("react");
 const loading_indicator_1 = require("./loading-indicator");
+/** Select a context-scoped user or device trust level, including the full-access Self grant. */
 const TrustLevelDropdown = ({ userId, dataContext, onChange, type = "user", }) => {
     const [trustLevel, setTrustLevelState] = (0, react_1.useState)(peers_sdk_1.TrustLevel.Unknown);
     const [loading, setLoading] = (0, react_1.useState)(true);
     const allTrustLevelConfigs = [
-        { value: peers_sdk_1.TrustLevel.Self, color: "success", icon: "bi-shield-fill-check", text: "Self" },
+        {
+            value: peers_sdk_1.TrustLevel.Self,
+            color: "success",
+            icon: "bi-shield-fill-check",
+            text: "Self (full remote contract access)",
+        },
         { value: peers_sdk_1.TrustLevel.Trusted, color: "success", icon: "bi-shield-check", text: "Trusted" },
         { value: peers_sdk_1.TrustLevel.Known, color: "primary", icon: "bi-shield-check", text: "Known" },
         {

package/dist/screens/contacts/contact-details.d.ts

@@ -1,5 +1,6 @@
 interface IProps {
     userId: string;
 }
+/** Edit a contact's signed profile fields and personal-context trust assignment. */
 export declare const ContactDetails: (props: IProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/screens/contacts/contact-details.js

@@ -11,6 +11,7 @@ const trust_level_dropdown_1 = require("../../components/trust-level-dropdown");
 const hooks_1 = require("../../hooks");
 const tabs_state_1 = require("../../tabs-layout/tabs-state");
 const ui_loader_1 = require("../../ui-router/ui-loader");
+/** Edit a contact's signed profile fields and personal-context trust assignment. */
 const ContactDetails = (props) => {
     const contact = (0, hooks_1.usePromise)(async () => {
         const userContext = await (0, peers_sdk_1.getUserContext)();
@@ -34,7 +35,7 @@ const ContactDetails = (props) => {
 exports.ContactDetails = ContactDetails;
 const ContactInfo = (props) => {
     const { contact } = props;
-    return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", { className: "mb-3", children: (0, jsx_runtime_1.jsxs)("div", { className: "d-flex align-items-center gap-3", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex-grow-1", children: [(0, jsx_runtime_1.jsx)("small", { className: "text-muted d-block mb-1", children: "Name" }), (0, jsx_runtime_1.jsx)(input_1.Input, { value: contact.qs.name, className: "form-control mb-3 ps-2", placeholder: "Contact name", title: "Contact name" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "border-start ps-3", children: [(0, jsx_runtime_1.jsx)("small", { className: "text-muted d-block mb-1", children: "User ID" }), (0, jsx_runtime_1.jsx)("code", { className: "small", children: contact.userId })] }), (0, jsx_runtime_1.jsxs)("div", { className: "border-start ps-3", children: [(0, jsx_runtime_1.jsx)("small", { className: "text-muted d-block mb-1", children: "Trust Level" }), (0, jsx_runtime_1.jsx)(trust_level_dropdown_1.TrustLevelDropdown, { userId: contact.userId })] })] }) }), (0, jsx_runtime_1.jsxs)("div", { className: "mb-3", children: [(0, jsx_runtime_1.jsx)("small", { children: "Public Key:" }), (0, jsx_runtime_1.jsx)(input_1.Input, { value: contact.qs.publicKey, className: "form-control mb-3 p-0 ps-2", placeholder: "Public key", title: "Public key" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "mb-3", children: [(0, jsx_runtime_1.jsx)("small", { children: "Public Box Key:" }), (0, jsx_runtime_1.jsx)(input_1.Input, { value: contact.qs.publicBoxKey, className: "form-control mb-3 p-0 ps-2", placeholder: "Public box key", title: "Public box key" })] })] }));
+    return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", { className: "mb-3", children: (0, jsx_runtime_1.jsxs)("div", { className: "d-flex align-items-center gap-3", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex-grow-1", children: [(0, jsx_runtime_1.jsx)("small", { className: "text-muted d-block mb-1", children: "Name" }), (0, jsx_runtime_1.jsx)(input_1.Input, { value: contact.qs.name, className: "form-control mb-3 ps-2", placeholder: "Contact name", title: "Contact name" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "border-start ps-3", children: [(0, jsx_runtime_1.jsx)("small", { className: "text-muted d-block mb-1", children: "User ID" }), (0, jsx_runtime_1.jsx)("code", { className: "small", children: contact.userId })] }), (0, jsx_runtime_1.jsxs)("div", { className: "border-start ps-3", children: [(0, jsx_runtime_1.jsx)("small", { className: "text-muted d-block mb-1", children: "Trust Level" }), (0, jsx_runtime_1.jsx)(trust_level_dropdown_1.TrustLevelDropdown, { userId: contact.userId }), (0, jsx_runtime_1.jsx)("small", { className: "text-muted d-block mt-1", children: "Self grants this user full remote contract access." })] })] }) }), (0, jsx_runtime_1.jsxs)("div", { className: "mb-3", children: [(0, jsx_runtime_1.jsx)("small", { children: "Public Key:" }), (0, jsx_runtime_1.jsx)(input_1.Input, { value: contact.qs.publicKey, className: "form-control mb-3 p-0 ps-2", placeholder: "Public key", title: "Public key" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "mb-3", children: [(0, jsx_runtime_1.jsx)("small", { children: "Public Box Key:" }), (0, jsx_runtime_1.jsx)(input_1.Input, { value: contact.qs.publicBoxKey, className: "form-control mb-3 p-0 ps-2", placeholder: "Public box key", title: "Public box key" })] })] }));
 };
 (0, ui_loader_1.registerInternalPeersUI)({
     peersUIId: "00contact00details00component",

package/dist/screens/network-viewer/device-details-modal.d.ts

@@ -3,5 +3,6 @@ interface IDeviceDetailsModalProps {
     onClose: () => void;
     onDisconnect?: () => void;
 }
+/** Show connection, sync, topology, and provider-authorized remote-log diagnostics for one device. */
 export declare function DeviceDetailsModal({ deviceId, onClose, onDisconnect }: IDeviceDetailsModalProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/screens/network-viewer/device-details-modal.js

@@ -7,6 +7,7 @@ const react_1 = require("react");
 const loading_indicator_1 = require("../../components/loading-indicator");
 const trust_level_badge_1 = require("../../components/trust-level-badge");
 const network_viewer_ipc_1 = require("./network-viewer-ipc");
+const remote_logs_panel_1 = require("./remote-logs-panel");
 /** Format bytes to human-readable string (KB, MB, GB) */
 function formatBytes(bytes) {
     if (bytes < 1024)
@@ -28,6 +29,7 @@ function formatRate(mbps) {
     }
     return `${mbps.toFixed(2)} MB/s`;
 }
+/** Show connection, sync, topology, and provider-authorized remote-log diagnostics for one device. */
 function DeviceDetailsModal({ deviceId, onClose, onDisconnect }) {
     const [device, setDevice] = (0, react_1.useState)(null);
     const [loading, setLoading] = (0, react_1.useState)(true);
@@ -86,7 +88,7 @@ function DeviceDetailsModal({ deviceId, onClose, onDisconnect }) {
             overflowY: "auto",
             paddingTop: "2rem",
             paddingBottom: "2rem",
-        }, onClick: onClose, children: (0, jsx_runtime_1.jsxs)("div", { className: "card", style: { maxWidth: "900px", width: "90%", maxHeight: "90vh" }, onClick: (e) => e.stopPropagation(), children: [(0, jsx_runtime_1.jsxs)("div", { className: "card-header d-flex justify-content-between align-items-center", children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h5", { className: "mb-0", children: loading ? "Loading..." : device?.userName || device?.userId || "Device Details" }), device?.userName && ((0, jsx_runtime_1.jsx)("small", { className: "text-muted", children: (0, jsx_runtime_1.jsx)("code", { children: device.userId }) }))] }), (0, jsx_runtime_1.jsxs)("div", { children: [device && ((0, jsx_runtime_1.jsxs)("button", { className: "btn btn-sm btn-danger me-2", onClick: handleDisconnect, children: [(0, jsx_runtime_1.jsx)("i", { className: "bi bi-x-circle" }), " Disconnect"] })), (0, jsx_runtime_1.jsx)("button", { className: "btn-close", onClick: onClose, "aria-label": "Close" })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "card-body", style: { overflowY: "auto", maxHeight: "calc(90vh - 120px)" }, children: [loading && (0, jsx_runtime_1.jsx)(loading_indicator_1.LoadingIndicator, {}), !loading && (notFound || !device) && ((0, jsx_runtime_1.jsx)("div", { className: "alert alert-warning", children: "Device not found or connection has been closed." })), !loading && device && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", { className: "mb-4", children: [(0, jsx_runtime_1.jsx)("h6", { className: "border-bottom pb-2 mb-3", children: "Connection Information" }), (0, jsx_runtime_1.jsxs)("div", { className: "row", children: [device.deviceName && ((0, jsx_runtime_1.jsxs)("div", { className: "col-md-6 mb-3", children: [(0, jsx_runtime_1.jsx)("strong", { children: "Device Name:" }), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)("span", { children: device.deviceName })] })), (0, jsx_runtime_1.jsxs)("div", { className: "col-md-6 mb-3", children: [(0, jsx_runtime_1.jsx)("strong", { children: "Device ID:" }), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)("code", { className: "text-muted small", children: device.deviceId })] }), (0, jsx_runtime_1.jsxs)("div", { className: "col-md-6 mb-3", children: [(0, jsx_runtime_1.jsx)("strong", { children: "Connection State:" }), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)("span", { className: "badge bg-success", children: device.connectionState })] }), (0, jsx_runtime_1.jsxs)("div", { className: "col-md-6 mb-3", children: [(0, jsx_runtime_1.jsx)("strong", { children: "Trust Level:" }), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)(trust_level_badge_1.TrustLevelBadge, { level: device.trustLevel || peers_sdk_1.TrustLevel.Unknown })] }), (0, jsx_runtime_1.jsxs)("div", { className: "col-md-6 mb-3", children: [(0, jsx_runtime_1.jsx)("strong", { children: "Path Type:" }), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)("span", { className: `badge bg-${device.pathType === "direct" ? "success" : "info"}`, children: device.pathType })] }), device.throughDeviceIds && device.throughDeviceIds.length > 0 && ((0, jsx_runtime_1.jsxs)("div", { className: "col-md-12 mb-3", children: [(0, jsx_runtime_1.jsx)("strong", { children: "Path:" }), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)("small", { className: "text-muted", children: device.throughDeviceIds.join(" → ") })] }))] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "mb-4", children: [(0, jsx_runtime_1.jsx)("h6", { className: "border-bottom pb-2 mb-3", children: "Throughput" }), (0, jsx_runtime_1.jsxs)("div", { className: "row", children: [(0, jsx_runtime_1.jsxs)("div", { className: "col-md-6 mb-3", children: [(0, jsx_runtime_1.jsx)("strong", { children: "Send Rate:" }), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsxs)("span", { className: "text-success", children: ["\u2191 ", formatRate(device.sendRateMBps)] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "col-md-6 mb-3", children: [(0, jsx_runtime_1.jsx)("strong", { children: "Receive Rate:" }), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsxs)("span", { className: "text-primary", children: ["\u2193 ", formatRate(device.receiveRateMBps)] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "col-md-6 mb-3", children: [(0, jsx_runtime_1.jsx)("strong", { children: "Total Sent:" }), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)("span", { children: formatBytes(device.bytesSent || 0) })] }), (0, jsx_runtime_1.jsxs)("div", { className: "col-md-6 mb-3", children: [(0, jsx_runtime_1.jsx)("strong", { children: "Total Received:" }), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)("span", { children: formatBytes(device.bytesReceived || 0) })] })] })] }), device.sharedGroups.length > 0 && ((0, jsx_runtime_1.jsxs)("div", { className: "mb-4", children: [(0, jsx_runtime_1.jsxs)("h6", { className: "border-bottom pb-2 mb-3", children: ["Shared Groups (", device.sharedGroups.length, ")"] }), (0, jsx_runtime_1.jsx)("div", { className: "table-responsive", children: (0, jsx_runtime_1.jsxs)("table", { className: "table table-sm table-hover", children: [(0, jsx_runtime_1.jsx)("thead", { children: (0, jsx_runtime_1.jsxs)("tr", { children: [(0, jsx_runtime_1.jsx)("th", { children: "Group ID" }), (0, jsx_runtime_1.jsx)("th", { children: "Role" }), (0, jsx_runtime_1.jsx)("th", { children: "Sync Status" })] }) }), (0, jsx_runtime_1.jsx)("tbody", { children: device.sharedGroups.map((groupId) => {
+        }, onClick: onClose, children: (0, jsx_runtime_1.jsxs)("div", { className: "card", style: { maxWidth: "900px", width: "90%", maxHeight: "90vh" }, onClick: (e) => e.stopPropagation(), children: [(0, jsx_runtime_1.jsxs)("div", { className: "card-header d-flex justify-content-between align-items-center", children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h5", { className: "mb-0", children: loading ? "Loading..." : device?.userName || device?.userId || "Device Details" }), device?.userName && ((0, jsx_runtime_1.jsx)("small", { className: "text-muted", children: (0, jsx_runtime_1.jsx)("code", { children: device.userId }) }))] }), (0, jsx_runtime_1.jsxs)("div", { children: [device && ((0, jsx_runtime_1.jsxs)("button", { className: "btn btn-sm btn-danger me-2", onClick: handleDisconnect, children: [(0, jsx_runtime_1.jsx)("i", { className: "bi bi-x-circle" }), " Disconnect"] })), (0, jsx_runtime_1.jsx)("button", { className: "btn-close", onClick: onClose, "aria-label": "Close" })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "card-body", style: { overflowY: "auto", maxHeight: "calc(90vh - 120px)" }, children: [loading && (0, jsx_runtime_1.jsx)(loading_indicator_1.LoadingIndicator, {}), !loading && (notFound || !device) && ((0, jsx_runtime_1.jsx)("div", { className: "alert alert-warning", children: "Device not found or connection has been closed." })), !loading && device && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", { className: "mb-4", children: [(0, jsx_runtime_1.jsx)("h6", { className: "border-bottom pb-2 mb-3", children: "Connection Information" }), (0, jsx_runtime_1.jsxs)("div", { className: "row", children: [device.deviceName && ((0, jsx_runtime_1.jsxs)("div", { className: "col-md-6 mb-3", children: [(0, jsx_runtime_1.jsx)("strong", { children: "Device Name:" }), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)("span", { children: device.deviceName })] })), (0, jsx_runtime_1.jsxs)("div", { className: "col-md-6 mb-3", children: [(0, jsx_runtime_1.jsx)("strong", { children: "Device ID:" }), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)("code", { className: "text-muted small", children: device.deviceId })] }), (0, jsx_runtime_1.jsxs)("div", { className: "col-md-6 mb-3", children: [(0, jsx_runtime_1.jsx)("strong", { children: "Connection State:" }), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)("span", { className: "badge bg-success", children: device.connectionState })] }), (0, jsx_runtime_1.jsxs)("div", { className: "col-md-6 mb-3", children: [(0, jsx_runtime_1.jsx)("strong", { children: "Trust Level:" }), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)(trust_level_badge_1.TrustLevelBadge, { level: device.trustLevel || peers_sdk_1.TrustLevel.Unknown })] }), (0, jsx_runtime_1.jsxs)("div", { className: "col-md-6 mb-3", children: [(0, jsx_runtime_1.jsx)("strong", { children: "Path Type:" }), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)("span", { className: `badge bg-${device.pathType === "direct" ? "success" : "info"}`, children: device.pathType })] }), device.throughDeviceIds && device.throughDeviceIds.length > 0 && ((0, jsx_runtime_1.jsxs)("div", { className: "col-md-12 mb-3", children: [(0, jsx_runtime_1.jsx)("strong", { children: "Path:" }), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)("small", { className: "text-muted", children: device.throughDeviceIds.join(" → ") })] }))] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "mb-4", children: [(0, jsx_runtime_1.jsx)("h6", { className: "border-bottom pb-2 mb-3", children: "Throughput" }), (0, jsx_runtime_1.jsxs)("div", { className: "row", children: [(0, jsx_runtime_1.jsxs)("div", { className: "col-md-6 mb-3", children: [(0, jsx_runtime_1.jsx)("strong", { children: "Send Rate:" }), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsxs)("span", { className: "text-success", children: ["\u2191 ", formatRate(device.sendRateMBps)] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "col-md-6 mb-3", children: [(0, jsx_runtime_1.jsx)("strong", { children: "Receive Rate:" }), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsxs)("span", { className: "text-primary", children: ["\u2193 ", formatRate(device.receiveRateMBps)] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "col-md-6 mb-3", children: [(0, jsx_runtime_1.jsx)("strong", { children: "Total Sent:" }), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)("span", { children: formatBytes(device.bytesSent || 0) })] }), (0, jsx_runtime_1.jsxs)("div", { className: "col-md-6 mb-3", children: [(0, jsx_runtime_1.jsx)("strong", { children: "Total Received:" }), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)("span", { children: formatBytes(device.bytesReceived || 0) })] })] })] }), device.canReadRemoteLogs && (0, jsx_runtime_1.jsx)(remote_logs_panel_1.RemoteLogsPanel, { deviceId: device.deviceId }), device.sharedGroups.length > 0 && ((0, jsx_runtime_1.jsxs)("div", { className: "mb-4", children: [(0, jsx_runtime_1.jsxs)("h6", { className: "border-bottom pb-2 mb-3", children: ["Shared Groups (", device.sharedGroups.length, ")"] }), (0, jsx_runtime_1.jsx)("div", { className: "table-responsive", children: (0, jsx_runtime_1.jsxs)("table", { className: "table table-sm table-hover", children: [(0, jsx_runtime_1.jsx)("thead", { children: (0, jsx_runtime_1.jsxs)("tr", { children: [(0, jsx_runtime_1.jsx)("th", { children: "Group ID" }), (0, jsx_runtime_1.jsx)("th", { children: "Role" }), (0, jsx_runtime_1.jsx)("th", { children: "Sync Status" })] }) }), (0, jsx_runtime_1.jsx)("tbody", { children: device.sharedGroups.map((groupId) => {
                                                             const syncStats = device.syncStatsByGroup[groupId];
                                                             const role = device.roles[groupId];
                                                             return ((0, jsx_runtime_1.jsxs)("tr", { children: [(0, jsx_runtime_1.jsx)("td", { children: (0, jsx_runtime_1.jsx)("code", { className: "text-muted small", children: groupId }) }), (0, jsx_runtime_1.jsx)("td", { children: role != null ? String(role) : "N/A" }), (0, jsx_runtime_1.jsx)("td", { children: syncStats ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [syncStats.isPreferred && ((0, jsx_runtime_1.jsx)("span", { className: "badge bg-primary me-2", children: "Preferred" })), (0, jsx_runtime_1.jsx)("small", { className: "text-muted", children: new Date(syncStats.lastSyncTime).toLocaleString() })] })) : ((0, jsx_runtime_1.jsx)("span", { className: "text-muted", children: "-" })) })] }, groupId));

package/dist/screens/network-viewer/network-viewer-ipc.d.ts

@@ -1,3 +1,21 @@
+import type { IConsoleLog } from "@peers-app/peers-sdk";
+/** Filters and bounds accepted by the desktop remote-log diagnostic endpoint. */
+export type RemoteLogsQuery = {
+    sinceTimestamp?: number;
+    level?: IConsoleLog["level"];
+    process?: string;
+    search?: string;
+    pageSize?: number;
+    timeoutMs?: number;
+};
+/** Result of reading a directly connected, provider-authorized device's console-log table. */
+export type RemoteLogsResult = {
+    deviceId: string;
+    truncated: boolean;
+    logs: IConsoleLog[];
+    queriedAt: number;
+};
+/** Electron preload APIs used by the Network Viewer screen. */
 export type NetworkViewerElectronApi = {
     getOverview: () => Promise<unknown>;
     getConnections: () => Promise<unknown>;
@@ -16,7 +34,9 @@ export type NetworkViewerElectronApi = {
     }>;
     getDeviceDetails: (deviceId: string) => Promise<unknown>;
     getGroupDetails: (groupId: string) => Promise<unknown>;
+    getRemoteLogs: (deviceId: string, query?: RemoteLogsQuery) => Promise<RemoteLogsResult>;
     downloadRemoteDatabase?: (groupId: string, deviceId: string) => Promise<unknown>;
     runDiagnostics: () => Promise<unknown>;
 };
+/** Return the context-isolated desktop diagnostics bridge when running in Electron. */
 export declare function getNetworkViewerApi(): NetworkViewerElectronApi | undefined;

package/dist/screens/network-viewer/network-viewer-ipc.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getNetworkViewerApi = getNetworkViewerApi;
+/** Return the context-isolated desktop diagnostics bridge when running in Electron. */
 function getNetworkViewerApi() {
     return window.electronAPI?.networkViewer;
 }

package/dist/screens/network-viewer/remote-logs-panel.d.ts

@@ -0,0 +1,6 @@
+interface RemoteLogsPanelProps {
+    deviceId: string;
+}
+/** Read-only System Logs contract panel for a directly connected, provider-authorized device. */
+export declare function RemoteLogsPanel({ deviceId }: RemoteLogsPanelProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/screens/network-viewer/remote-logs-panel.js

@@ -0,0 +1,61 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.RemoteLogsPanel = RemoteLogsPanel;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const network_viewer_ipc_1 = require("./network-viewer-ipc");
+function RemoteLogRow({ log }) {
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "border-bottom py-2", children: [(0, jsx_runtime_1.jsxs)("div", { className: "d-flex flex-wrap gap-2 align-items-center small", children: [(0, jsx_runtime_1.jsx)("code", { children: new Date(log.timestamp).toLocaleTimeString() }), (0, jsx_runtime_1.jsx)("span", { className: `badge ${log.level === "error" ? "bg-danger" : "bg-secondary"}`, children: log.level }), (0, jsx_runtime_1.jsx)("span", { className: "badge bg-info text-dark", children: log.process }), log.source && (0, jsx_runtime_1.jsx)("span", { className: "text-muted", children: log.source })] }), (0, jsx_runtime_1.jsx)("div", { className: "mt-1", style: { whiteSpace: "pre-wrap", overflowWrap: "anywhere" }, children: log.message }), (log.context || log.stackTrace) && ((0, jsx_runtime_1.jsxs)("details", { className: "mt-1", children: [(0, jsx_runtime_1.jsx)("summary", { className: "small text-muted", children: "Details" }), (0, jsx_runtime_1.jsx)("pre", { className: "small bg-body-tertiary rounded p-2 mt-1", style: { maxHeight: "240px" }, children: JSON.stringify({ context: log.context, stackTrace: log.stackTrace }, null, 2) })] }))] }));
+}
+/** Read-only System Logs contract panel for a directly connected, provider-authorized device. */
+function RemoteLogsPanel({ deviceId }) {
+    const [result, setResult] = (0, react_1.useState)(null);
+    const [loading, setLoading] = (0, react_1.useState)(false);
+    const [error, setError] = (0, react_1.useState)();
+    const [processName, setProcessName] = (0, react_1.useState)("");
+    const [level, setLevel] = (0, react_1.useState)("");
+    const [search, setSearch] = (0, react_1.useState)("");
+    const [minutes, setMinutes] = (0, react_1.useState)("60");
+    const loadLogs = (0, react_1.useCallback)(async () => {
+        const api = (0, network_viewer_ipc_1.getNetworkViewerApi)();
+        if (!api) {
+            setError("Network Viewer API is unavailable");
+            return;
+        }
+        setLoading(true);
+        setError(undefined);
+        try {
+            const minutesNumber = Number(minutes);
+            const sinceTimestamp = Number.isFinite(minutesNumber) && minutesNumber > 0
+                ? Date.now() - minutesNumber * 60_000
+                : undefined;
+            const response = await api.getRemoteLogs(deviceId, {
+                sinceTimestamp,
+                level: level ? level : undefined,
+                process: processName || undefined,
+                search: search || undefined,
+                pageSize: 100,
+                timeoutMs: 10_000,
+            });
+            setResult(response);
+        }
+        catch (cause) {
+            setError(cause instanceof Error ? cause.message : String(cause));
+        }
+        finally {
+            setLoading(false);
+        }
+    }, [deviceId, level, minutes, processName, search]);
+    const exportLogs = (0, react_1.useCallback)(() => {
+        if (!result)
+            return;
+        const blob = new Blob([JSON.stringify(result, null, 2)], { type: "application/json" });
+        const url = URL.createObjectURL(blob);
+        const anchor = document.createElement("a");
+        anchor.href = url;
+        anchor.download = `remote-logs-${deviceId}-${result.queriedAt}.json`;
+        anchor.click();
+        URL.revokeObjectURL(url);
+    }, [deviceId, result]);
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "mb-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "d-flex justify-content-between align-items-center border-bottom pb-2 mb-3", children: [(0, jsx_runtime_1.jsx)("h6", { className: "mb-0", children: "Remote Console Logs" }), (0, jsx_runtime_1.jsxs)("div", { className: "d-flex gap-2", children: [(0, jsx_runtime_1.jsx)("button", { type: "button", className: "btn btn-sm btn-outline-secondary", onClick: exportLogs, disabled: !result, children: "Export JSON" }), (0, jsx_runtime_1.jsx)("button", { type: "button", className: "btn btn-sm btn-primary", onClick: () => void loadLogs(), disabled: loading, children: loading ? "Loading..." : result ? "Refresh" : "Load logs" })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "row g-2 mb-3", children: [(0, jsx_runtime_1.jsxs)("div", { className: "col-md-3", children: [(0, jsx_runtime_1.jsx)("label", { className: "form-label small", htmlFor: "remote-logs-process", children: "Process" }), (0, jsx_runtime_1.jsx)("input", { id: "remote-logs-process", className: "form-control form-control-sm", value: processName, onChange: (event) => setProcessName(event.target.value), placeholder: "All processes" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "col-md-2", children: [(0, jsx_runtime_1.jsx)("label", { className: "form-label small", htmlFor: "remote-logs-level", children: "Level" }), (0, jsx_runtime_1.jsxs)("select", { id: "remote-logs-level", className: "form-select form-select-sm", value: level, onChange: (event) => setLevel(event.target.value), children: [(0, jsx_runtime_1.jsx)("option", { value: "", children: "All" }), (0, jsx_runtime_1.jsx)("option", { value: "debug", children: "Debug" }), (0, jsx_runtime_1.jsx)("option", { value: "info", children: "Info" }), (0, jsx_runtime_1.jsx)("option", { value: "log", children: "Log" }), (0, jsx_runtime_1.jsx)("option", { value: "warn", children: "Warn" }), (0, jsx_runtime_1.jsx)("option", { value: "error", children: "Error" })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "col-md-2", children: [(0, jsx_runtime_1.jsx)("label", { className: "form-label small", htmlFor: "remote-logs-minutes", children: "Time range" }), (0, jsx_runtime_1.jsxs)("select", { id: "remote-logs-minutes", className: "form-select form-select-sm", value: minutes, onChange: (event) => setMinutes(event.target.value), children: [(0, jsx_runtime_1.jsx)("option", { value: "15", children: "15 minutes" }), (0, jsx_runtime_1.jsx)("option", { value: "60", children: "1 hour" }), (0, jsx_runtime_1.jsx)("option", { value: "360", children: "6 hours" }), (0, jsx_runtime_1.jsx)("option", { value: "0", children: "All retained" })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "col-md-5", children: [(0, jsx_runtime_1.jsx)("label", { className: "form-label small", htmlFor: "remote-logs-search", children: "Message words" }), (0, jsx_runtime_1.jsx)("input", { id: "remote-logs-search", className: "form-control form-control-sm", value: search, onChange: (event) => setSearch(event.target.value), placeholder: "BrowserWebRTC" })] })] }), error && (0, jsx_runtime_1.jsx)("div", { className: "alert alert-danger py-2", children: error }), result && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", { className: "small text-muted mb-2", children: ["Showing ", result.logs.length, result.truncated ? " newest" : "", " matching logs", result.truncated ? "; narrow the filters to see a different slice" : "", "; queried", " ", new Date(result.queriedAt).toLocaleString(), "."] }), (0, jsx_runtime_1.jsx)("div", { className: "border rounded px-2", style: { maxHeight: "420px", overflowY: "auto" }, children: result.logs.length ? (result.logs.map((log) => (0, jsx_runtime_1.jsx)(RemoteLogRow, { log: log }, log.logId))) : ((0, jsx_runtime_1.jsx)("div", { className: "text-muted py-3 text-center", children: "No matching remote logs." })) })] }))] }));
+}

package/package.json

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

package/src/components/trust-level-dropdown.tsx

@@ -15,6 +15,7 @@ interface TrustLevelDropdownProps {
   type?: "user" | "device";
 }
 
+/** Select a context-scoped user or device trust level, including the full-access Self grant. */
 export const TrustLevelDropdown = ({
   userId,
   dataContext,
@@ -25,7 +26,12 @@ export const TrustLevelDropdown = ({
   const [loading, setLoading] = useState(true);
 
   const allTrustLevelConfigs = [
-    { value: TrustLevel.Self, color: "success", icon: "bi-shield-fill-check", text: "Self" },
+    {
+      value: TrustLevel.Self,
+      color: "success",
+      icon: "bi-shield-fill-check",
+      text: "Self (full remote contract access)",
+    },
     { value: TrustLevel.Trusted, color: "success", icon: "bi-shield-check", text: "Trusted" },
     { value: TrustLevel.Known, color: "primary", icon: "bi-shield-check", text: "Known" },
     {

package/src/screens/contacts/contact-details.tsx

@@ -12,6 +12,7 @@ interface IProps {
   userId: string;
 }
 
+/** Edit a contact's signed profile fields and personal-context trust assignment. */
 export const ContactDetails = (props: IProps) => {
   const contact = usePromise(
     async () => {
@@ -94,6 +95,9 @@ const ContactInfo = (props: { contact: IDoc<IUser> }) => {
           <div className="border-start ps-3">
             <small className="text-muted d-block mb-1">Trust Level</small>
             <TrustLevelDropdown userId={contact.userId} />
+            <small className="text-muted d-block mt-1">
+              Self grants this user full remote contract access.
+            </small>
           </div>
         </div>
       </div>

package/src/screens/network-viewer/device-details-modal.tsx

@@ -3,6 +3,7 @@ import { useCallback, useEffect, useState } from "react";
 import { LoadingIndicator } from "../../components/loading-indicator";
 import { TrustLevelBadge } from "../../components/trust-level-badge";
 import { getNetworkViewerApi } from "./network-viewer-ipc";
+import { RemoteLogsPanel } from "./remote-logs-panel";
 
 /** Format bytes to human-readable string (KB, MB, GB) */
 function formatBytes(bytes: number): string {
@@ -31,6 +32,7 @@ interface IDeviceDetails {
   deviceName?: string;
   trustLevel: number;
   connectionState: "connected" | "syncing" | "idle";
+  canReadRemoteLogs: boolean;
   sharedGroups: string[];
   roles: Record<string, unknown>;
   pathType: "direct" | "indirect" | "unknown";
@@ -63,6 +65,7 @@ interface IDeviceDetailsModalProps {
   onDisconnect?: () => void;
 }
 
+/** Show connection, sync, topology, and provider-authorized remote-log diagnostics for one device. */
 export function DeviceDetailsModal({ deviceId, onClose, onDisconnect }: IDeviceDetailsModalProps) {
   const [device, setDevice] = useState<IDeviceDetails | null>(null);
   const [loading, setLoading] = useState(true);
@@ -244,6 +247,8 @@ export function DeviceDetailsModal({ deviceId, onClose, onDisconnect }: IDeviceD
                 </div>
               </div>
 
+              {device.canReadRemoteLogs && <RemoteLogsPanel deviceId={device.deviceId} />}
+
               {/* Shared Groups */}
               {device.sharedGroups.length > 0 && (
                 <div className="mb-4">

package/src/screens/network-viewer/network-viewer-ipc.ts

@@ -1,3 +1,24 @@
+import type { IConsoleLog } from "@peers-app/peers-sdk";
+
+/** Filters and bounds accepted by the desktop remote-log diagnostic endpoint. */
+export type RemoteLogsQuery = {
+  sinceTimestamp?: number;
+  level?: IConsoleLog["level"];
+  process?: string;
+  search?: string;
+  pageSize?: number;
+  timeoutMs?: number;
+};
+
+/** Result of reading a directly connected, provider-authorized device's console-log table. */
+export type RemoteLogsResult = {
+  deviceId: string;
+  truncated: boolean;
+  logs: IConsoleLog[];
+  queriedAt: number;
+};
+
+/** Electron preload APIs used by the Network Viewer screen. */
 export type NetworkViewerElectronApi = {
   getOverview: () => Promise<unknown>;
   getConnections: () => Promise<unknown>;
@@ -10,6 +31,7 @@ export type NetworkViewerElectronApi = {
   deleteDevice: (deviceId: string) => Promise<{ success: boolean; message?: string }>;
   getDeviceDetails: (deviceId: string) => Promise<unknown>;
   getGroupDetails: (groupId: string) => Promise<unknown>;
+  getRemoteLogs: (deviceId: string, query?: RemoteLogsQuery) => Promise<RemoteLogsResult>;
   downloadRemoteDatabase?: (groupId: string, deviceId: string) => Promise<unknown>;
   runDiagnostics: () => Promise<unknown>;
 };
@@ -18,6 +40,7 @@ type WindowWithNetworkViewer = Window & {
   electronAPI?: { networkViewer?: NetworkViewerElectronApi };
 };
 
+/** Return the context-isolated desktop diagnostics bridge when running in Electron. */
 export function getNetworkViewerApi(): NetworkViewerElectronApi | undefined {
   return (window as WindowWithNetworkViewer).electronAPI?.networkViewer;
 }

package/src/screens/network-viewer/remote-logs-panel.tsx

@@ -0,0 +1,192 @@
+import type { IConsoleLog } from "@peers-app/peers-sdk";
+import { useCallback, useState } from "react";
+import { getNetworkViewerApi, type RemoteLogsResult } from "./network-viewer-ipc";
+
+interface RemoteLogsPanelProps {
+  deviceId: string;
+}
+
+function RemoteLogRow({ log }: { log: IConsoleLog }) {
+  return (
+    <div className="border-bottom py-2">
+      <div className="d-flex flex-wrap gap-2 align-items-center small">
+        <code>{new Date(log.timestamp).toLocaleTimeString()}</code>
+        <span className={`badge ${log.level === "error" ? "bg-danger" : "bg-secondary"}`}>
+          {log.level}
+        </span>
+        <span className="badge bg-info text-dark">{log.process}</span>
+        {log.source && <span className="text-muted">{log.source}</span>}
+      </div>
+      <div className="mt-1" style={{ whiteSpace: "pre-wrap", overflowWrap: "anywhere" }}>
+        {log.message}
+      </div>
+      {(log.context || log.stackTrace) && (
+        <details className="mt-1">
+          <summary className="small text-muted">Details</summary>
+          <pre className="small bg-body-tertiary rounded p-2 mt-1" style={{ maxHeight: "240px" }}>
+            {JSON.stringify({ context: log.context, stackTrace: log.stackTrace }, null, 2)}
+          </pre>
+        </details>
+      )}
+    </div>
+  );
+}
+
+/** Read-only System Logs contract panel for a directly connected, provider-authorized device. */
+export function RemoteLogsPanel({ deviceId }: RemoteLogsPanelProps) {
+  const [result, setResult] = useState<RemoteLogsResult | null>(null);
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState<string>();
+  const [processName, setProcessName] = useState("");
+  const [level, setLevel] = useState("");
+  const [search, setSearch] = useState("");
+  const [minutes, setMinutes] = useState("60");
+
+  const loadLogs = useCallback(async () => {
+    const api = getNetworkViewerApi();
+    if (!api) {
+      setError("Network Viewer API is unavailable");
+      return;
+    }
+
+    setLoading(true);
+    setError(undefined);
+    try {
+      const minutesNumber = Number(minutes);
+      const sinceTimestamp =
+        Number.isFinite(minutesNumber) && minutesNumber > 0
+          ? Date.now() - minutesNumber * 60_000
+          : undefined;
+      const response = await api.getRemoteLogs(deviceId, {
+        sinceTimestamp,
+        level: level ? (level as IConsoleLog["level"]) : undefined,
+        process: processName || undefined,
+        search: search || undefined,
+        pageSize: 100,
+        timeoutMs: 10_000,
+      });
+      setResult(response);
+    } catch (cause) {
+      setError(cause instanceof Error ? cause.message : String(cause));
+    } finally {
+      setLoading(false);
+    }
+  }, [deviceId, level, minutes, processName, search]);
+
+  const exportLogs = useCallback(() => {
+    if (!result) return;
+    const blob = new Blob([JSON.stringify(result, null, 2)], { type: "application/json" });
+    const url = URL.createObjectURL(blob);
+    const anchor = document.createElement("a");
+    anchor.href = url;
+    anchor.download = `remote-logs-${deviceId}-${result.queriedAt}.json`;
+    anchor.click();
+    URL.revokeObjectURL(url);
+  }, [deviceId, result]);
+
+  return (
+    <div className="mb-4">
+      <div className="d-flex justify-content-between align-items-center border-bottom pb-2 mb-3">
+        <h6 className="mb-0">Remote Console Logs</h6>
+        <div className="d-flex gap-2">
+          <button
+            type="button"
+            className="btn btn-sm btn-outline-secondary"
+            onClick={exportLogs}
+            disabled={!result}
+          >
+            Export JSON
+          </button>
+          <button
+            type="button"
+            className="btn btn-sm btn-primary"
+            onClick={() => void loadLogs()}
+            disabled={loading}
+          >
+            {loading ? "Loading..." : result ? "Refresh" : "Load logs"}
+          </button>
+        </div>
+      </div>
+
+      <div className="row g-2 mb-3">
+        <div className="col-md-3">
+          <label className="form-label small" htmlFor="remote-logs-process">
+            Process
+          </label>
+          <input
+            id="remote-logs-process"
+            className="form-control form-control-sm"
+            value={processName}
+            onChange={(event) => setProcessName(event.target.value)}
+            placeholder="All processes"
+          />
+        </div>
+        <div className="col-md-2">
+          <label className="form-label small" htmlFor="remote-logs-level">
+            Level
+          </label>
+          <select
+            id="remote-logs-level"
+            className="form-select form-select-sm"
+            value={level}
+            onChange={(event) => setLevel(event.target.value)}
+          >
+            <option value="">All</option>
+            <option value="debug">Debug</option>
+            <option value="info">Info</option>
+            <option value="log">Log</option>
+            <option value="warn">Warn</option>
+            <option value="error">Error</option>
+          </select>
+        </div>
+        <div className="col-md-2">
+          <label className="form-label small" htmlFor="remote-logs-minutes">
+            Time range
+          </label>
+          <select
+            id="remote-logs-minutes"
+            className="form-select form-select-sm"
+            value={minutes}
+            onChange={(event) => setMinutes(event.target.value)}
+          >
+            <option value="15">15 minutes</option>
+            <option value="60">1 hour</option>
+            <option value="360">6 hours</option>
+            <option value="0">All retained</option>
+          </select>
+        </div>
+        <div className="col-md-5">
+          <label className="form-label small" htmlFor="remote-logs-search">
+            Message words
+          </label>
+          <input
+            id="remote-logs-search"
+            className="form-control form-control-sm"
+            value={search}
+            onChange={(event) => setSearch(event.target.value)}
+            placeholder="BrowserWebRTC"
+          />
+        </div>
+      </div>
+
+      {error && <div className="alert alert-danger py-2">{error}</div>}
+      {result && (
+        <>
+          <div className="small text-muted mb-2">
+            Showing {result.logs.length}
+            {result.truncated ? " newest" : ""} matching logs
+            {result.truncated ? "; narrow the filters to see a different slice" : ""}; queried{" "}
+            {new Date(result.queriedAt).toLocaleString()}.
+          </div>
+          <div className="border rounded px-2" style={{ maxHeight: "420px", overflowY: "auto" }}>
+            {result.logs.length ? (
+              result.logs.map((log) => <RemoteLogRow key={log.logId} log={log} />)
+            ) : (
+              <div className="text-muted py-3 text-center">No matching remote logs.</div>
+            )}
+          </div>
+        </>
+      )}
+    </div>
+  );
+}