@peers-app/peers-ui 0.25.2 → 0.25.4

package/dist/screens/groups/group-list.d.ts

@@ -1 +1,18 @@
-export declare function GroupList(): import("react/jsx-runtime").JSX.Element;
+import { type GroupMemberRole, type IGroup } from "@peers-app/peers-sdk";
+/** Search, summarize, and create groups owned by the signed-in user. */
+export declare function GroupList(props?: {
+    creating?: boolean;
+}): import("react/jsx-runtime").JSX.Element;
+/** Data shown for one group in the Identity list. */
+export interface IGroupSummary {
+    /** Signed group record. */
+    group: IGroup;
+    /** Number of active memberships. */
+    memberCount: number;
+    /** Signed-in user's role in this group. */
+    myRole?: GroupMemberRole;
+}
+/** Compact, fully clickable group summary row. */
+export declare function GroupSummaryRow({ summary }: {
+    summary: IGroupSummary;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/screens/groups/group-list.js

@@ -1,77 +1,96 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.GroupList = GroupList;
+exports.GroupSummaryRow = GroupSummaryRow;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const peers_sdk_1 = require("@peers-app/peers-sdk");
 const react_1 = require("react");
-const input_1 = require("../../components/input");
-const lazy_list_1 = require("../../components/lazy-list");
 const loading_indicator_1 = require("../../components/loading-indicator");
-const markdown_with_mentions_1 = require("../../components/markdown-with-mentions");
 const globals_1 = require("../../globals");
 const hooks_1 = require("../../hooks");
-const ui_loader_1 = require("../../ui-router/ui-loader");
-function GroupList() {
+const identity_routes_1 = require("../identity/identity-routes");
+const activity_view_1 = require("../invites/activity-view");
+/** Search, summarize, and create groups owned by the signed-in user. */
+function GroupList(props = {}) {
     const userContext = (0, hooks_1.usePromise)(peers_sdk_1.getUserContext);
-    const [searchTextObs] = (0, react_1.useState)(() => (0, peers_sdk_1.observable)(""));
-    const [searchText] = (0, hooks_1.useObservable)(searchTextObs);
-    const [cursorObs] = (0, react_1.useState)(() => (0, peers_sdk_1.observable)());
-    // All hooks must be called before any conditional returns
-    const groupsTable = userContext ? (0, peers_sdk_1.Groups)(userContext.userDataContext) : null;
-    const newCursor = (0, react_1.useCallback)(async () => {
-        if (!groupsTable)
+    const [creating, setCreating] = (0, react_1.useState)(props.creating ?? false);
+    const [draftName, setDraftName] = (0, react_1.useState)("");
+    const [searchText, setSearchText] = (0, react_1.useState)("");
+    const [summaries, setSummaries] = (0, react_1.useState)();
+    const [error, setError] = (0, react_1.useState)("");
+    const [creatingBusy, setCreatingBusy] = (0, react_1.useState)(false);
+    const [groupRevision, setGroupRevision] = (0, react_1.useState)(0);
+    (0, react_1.useEffect)(() => {
+        if (!userContext) {
             return;
-        const filter = {
-            $or: [{ name: { $matchWords: searchText } }, { description: { $matchWords: searchText } }],
-            disabled: { $ne: true },
+        }
+        let disposed = false;
+        const subscriptions = [];
+        const refresh = async () => {
+            try {
+                const next = await loadGroupSummaries(userContext);
+                if (!disposed) {
+                    setSummaries(next);
+                    setError("");
+                }
+            }
+            catch (err) {
+                if (!disposed) {
+                    setError(err.message || "Could not load groups.");
+                }
+            }
         };
-        const cursor = await groupsTable.cursor(searchText ? filter : { disabled: { $ne: true } }, {
-            sortBy: ["name"],
-            ...(searchText ? {} : { textSearch: searchText }),
+        const table = (0, peers_sdk_1.Groups)(userContext.userDataContext);
+        subscriptions.push(table.dataChanged.subscribe(() => setGroupRevision((value) => value + 1)));
+        void table.list({ disabled: { $ne: true } }).then((groups) => {
+            if (disposed) {
+                return;
+            }
+            for (const group of groups) {
+                subscriptions.push((0, peers_sdk_1.GroupMembers)(userContext.getDataContext(group.groupId)).dataChanged.subscribe(() => void refresh()));
+            }
+            void refresh();
         });
-        cursorObs(cursor);
-        return cursor;
-    }, [groupsTable, searchText, cursorObs]);
+        return () => {
+            disposed = true;
+            for (const subscription of subscriptions) {
+                subscription.unsubscribe();
+            }
+        };
+    }, [groupRevision, userContext]);
     (0, react_1.useEffect)(() => {
-        if (groupsTable) {
-            void newCursor();
+        setCreating(props.creating ?? false);
+    }, [props.creating]);
+    const filtered = (0, react_1.useMemo)(() => {
+        const query = searchText.trim().toLocaleLowerCase();
+        if (!query) {
+            return summaries ?? [];
         }
-    }, [groupsTable, newCursor]);
-    // Early return after all hooks
-    if (!userContext) {
-        return (0, jsx_runtime_1.jsx)(loading_indicator_1.LoadingIndicator, {});
+        return (summaries ?? []).filter(({ group }) => group.name.toLocaleLowerCase().includes(query) ||
+            group.description.toLocaleLowerCase().includes(query));
+    }, [searchText, summaries]);
+    function startCreate() {
+        setDraftName(searchText.trim());
+        (0, globals_1.mainContentPath)(identity_routes_1.IDENTITY_GROUP_NEW_PATH);
     }
-    async function loadMore(existing) {
-        if (!groupsTable)
-            return [];
-        const moreMatches = [];
-        const cursor = cursorObs() || (await newCursor());
-        if (!cursor)
-            return [];
-        for await (const nextRecord of cursor) {
-            if (existing.some((e) => e.groupId === nextRecord.groupId))
-                continue;
-            if (moreMatches.some((e) => e.groupId === nextRecord.groupId))
-                continue;
-            moreMatches.push(nextRecord);
-            if (searchText.length && moreMatches.length > 5)
-                break;
-            if (moreMatches.length >= 10)
-                break;
+    async function confirmCreate() {
+        const name = draftName.trim();
+        if (!name) {
+            return;
         }
-        if (moreMatches.length === 0) {
-            cursorObs(undefined);
+        setCreatingBusy(true);
+        setError("");
+        try {
+            setDraftName("");
+            setSearchText("");
+            await newRecord(name);
+        }
+        catch (err) {
+            setError(err.message || "Could not create the group.");
+        }
+        finally {
+            setCreatingBusy(false);
         }
-        return moreMatches;
-    }
-    async function searchSubmit(evt) {
-        if (evt.key !== "Enter")
-            return;
-        const name = searchText.trim();
-        if (!name)
-            return;
-        searchTextObs("");
-        await newRecord(name);
     }
     async function newRecord(name) {
         const userContext = await (0, peers_sdk_1.getUserContext)();
@@ -106,86 +125,38 @@ function GroupList() {
         await peers_sdk_1.rpcServerCalls.seedBundledPeersCore(groupId).catch((err) => {
             console.error("Error auto-installing peers-core for group:", err);
         });
-        (0, globals_1.mainContentPath)(`groups/${group.groupId}`);
+        (0, globals_1.mainContentPath)(`${identity_routes_1.IDENTITY_GROUPS_PATH}/${group.groupId}`);
         return group;
     }
-    function renderItem(group) {
-        const groupIcon = group.iconClassName || "bi-people-fill";
-        return ((0, jsx_runtime_1.jsxs)("div", { className: "container-fluid pb-4", children: [(0, jsx_runtime_1.jsx)("i", { className: groupIcon }), "\u00A0", (0, jsx_runtime_1.jsx)("a", { href: `#groups/${group.groupId}`, children: group.name || "<unnamed-group>" }), (0, jsx_runtime_1.jsx)("div", { style: { paddingLeft: "20px" }, children: (0, jsx_runtime_1.jsx)(markdown_with_mentions_1.MarkdownWithMentions, { content: group.description || "" }) })] }, group.groupId));
-    }
-    return ((0, jsx_runtime_1.jsxs)("div", { className: "container-fluid", children: [(0, jsx_runtime_1.jsxs)("div", { className: "input-group mt-3 mb-3", children: [(0, jsx_runtime_1.jsx)(input_1.Input, { value: searchTextObs, className: "form-control", placeholder: "Search or create group", autoFocus: !!(0, globals_1.isDesktop)(), onKeyUp: (evt) => searchSubmit(evt) }), (0, jsx_runtime_1.jsx)(ImportGroupButton, {})] }), (0, jsx_runtime_1.jsx)("div", { className: "peers-list-container", children: (0, jsx_runtime_1.jsx)(lazy_list_1.LazyList, { resetTrigger: searchText, loadMore: loadMore, scrollThreshold: 0.6, renderItems: (groups) => {
-                        return groups.map(renderItem);
-                    }, loadingIndicator: (0, jsx_runtime_1.jsx)("div", { className: "d-flex justify-content-center", style: { height: 200 }, children: (0, jsx_runtime_1.jsx)(loading_indicator_1.LoadingIndicator, {}) }), endOfList: (0, jsx_runtime_1.jsx)("div", { className: "d-flex justify-content-center", style: { height: 200 } }) }) })] }));
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "container-xxl p-3", children: [(0, jsx_runtime_1.jsxs)("div", { className: "mb-3", children: [(0, jsx_runtime_1.jsxs)("h4", { className: "mb-1", children: [(0, jsx_runtime_1.jsx)("i", { className: "bi-people-fill me-2" }), "Groups"] }), (0, jsx_runtime_1.jsx)("div", { className: "small text-muted", children: "Shared spaces, membership, and access" })] }), creating ? ((0, jsx_runtime_1.jsx)("div", { className: "card mb-3", children: (0, jsx_runtime_1.jsxs)("div", { className: "card-body", children: [(0, jsx_runtime_1.jsx)("h6", { className: "card-title", children: "Create a group" }), (0, jsx_runtime_1.jsxs)("form", { className: "input-group", onSubmit: (event) => {
+                                event.preventDefault();
+                                void confirmCreate();
+                            }, children: [(0, jsx_runtime_1.jsx)("input", { id: "new-group-name", className: "form-control", value: draftName, onChange: (event) => setDraftName(event.target.value), placeholder: "Group name", "aria-label": "Group name" }), (0, jsx_runtime_1.jsx)("button", { type: "submit", className: "btn btn-primary", disabled: !draftName.trim() || creatingBusy, children: creatingBusy ? "Creating…" : "Create" }), (0, jsx_runtime_1.jsx)("a", { href: `#${identity_routes_1.IDENTITY_GROUPS_PATH}`, className: "btn btn-outline-secondary", children: "Cancel" })] })] }) })) : null, (0, jsx_runtime_1.jsx)(activity_view_1.PendingWorkLink, { type: "group" }), (0, jsx_runtime_1.jsxs)("div", { className: "position-relative my-3", children: [(0, jsx_runtime_1.jsx)("i", { className: "bi bi-search position-absolute text-muted", style: { left: 12, top: "50%", transform: "translateY(-50%)" } }), (0, jsx_runtime_1.jsx)("input", { type: "search", className: "form-control ps-5", value: searchText, onChange: (event) => setSearchText(event.target.value), placeholder: "Search groups", "aria-label": "Search groups" })] }), error ? (0, jsx_runtime_1.jsx)("div", { className: "alert alert-danger", children: error }) : null, !summaries && !error ? (0, jsx_runtime_1.jsx)(loading_indicator_1.LoadingIndicator, {}) : null, summaries && filtered.length === 0 ? ((0, jsx_runtime_1.jsxs)("div", { className: "border rounded p-4 text-center", children: [(0, jsx_runtime_1.jsx)("i", { className: "bi bi-people fs-2 text-muted" }), (0, jsx_runtime_1.jsx)("h6", { className: "mt-2", children: searchText ? "No matching groups" : "No groups yet" }), (0, jsx_runtime_1.jsx)("p", { className: "small text-muted", children: searchText
+                            ? "Try a different name or description."
+                            : "Create a shared space or use an invite to join one." }), !searchText ? ((0, jsx_runtime_1.jsx)("button", { type: "button", className: "btn btn-primary btn-sm", onClick: startCreate, children: "Create your first group" })) : null] })) : null, filtered.length > 0 ? ((0, jsx_runtime_1.jsx)("div", { className: "list-group", children: filtered.map((summary) => ((0, jsx_runtime_1.jsx)(GroupSummaryRow, { summary: summary }, summary.group.groupId))) })) : null] }));
+}
+async function loadGroupSummaries(userContext) {
+    const groups = await (0, peers_sdk_1.Groups)(userContext.userDataContext).list({ disabled: { $ne: true } });
+    const summaries = await Promise.all(groups.map(async (group) => {
+        const members = await (0, peers_sdk_1.GroupMembers)(userContext.getDataContext(group.groupId)).list({
+            deleted: { $ne: true },
+        });
+        return {
+            group,
+            memberCount: members.length,
+            myRole: members.find((member) => member.userId === userContext.userId)?.role,
+        };
+    }));
+    return summaries.sort((left, right) => left.group.name.localeCompare(right.group.name));
+}
+/** Compact, fully clickable group summary row. */
+function GroupSummaryRow({ summary }) {
+    const { group } = summary;
+    return ((0, jsx_runtime_1.jsxs)("a", { href: `#${identity_routes_1.IDENTITY_GROUPS_PATH}/${group.groupId}`, className: "list-group-item list-group-item-action d-flex align-items-center gap-3 py-3", children: [(0, jsx_runtime_1.jsx)("span", { className: "rounded-3 bg-body-secondary d-inline-flex align-items-center justify-content-center flex-shrink-0", style: { width: 44, height: 44 }, "aria-hidden": "true", children: (0, jsx_runtime_1.jsx)("i", { className: group.iconClassName || "bi bi-people-fill" }) }), (0, jsx_runtime_1.jsxs)("span", { className: "flex-grow-1 overflow-hidden", children: [(0, jsx_runtime_1.jsx)("span", { className: "fw-semibold d-block text-truncate", children: group.name || "Unnamed group" }), (0, jsx_runtime_1.jsx)("span", { className: "small text-muted d-block text-truncate", children: plainDescription(group.description) || "No description yet" })] }), (0, jsx_runtime_1.jsxs)("span", { className: "d-flex align-items-center gap-2 flex-wrap justify-content-end", children: [(0, jsx_runtime_1.jsxs)("span", { className: "badge text-bg-light border", children: [summary.memberCount, " member", summary.memberCount === 1 ? "" : "s"] }), summary.myRole !== undefined ? ((0, jsx_runtime_1.jsx)("span", { className: "badge text-bg-secondary", children: (0, peers_sdk_1.getRoleLabel)(summary.myRole) })) : null] }), (0, jsx_runtime_1.jsx)("i", { className: "bi bi-chevron-right text-muted", "aria-hidden": "true" })] }));
+}
+function plainDescription(markdown) {
+    return markdown
+        .replace(/[#_*`>[\]()!-]/g, " ")
+        .replace(/\s+/g, " ")
+        .trim();
 }
-const ImportGroupButton = () => {
-    const [isImporting, setIsImporting] = (0, react_1.useState)(false);
-    const [showImportDialog, setShowImportDialog] = (0, react_1.useState)(false);
-    const [importText, setImportText] = (0, react_1.useState)("");
-    const [importResult, setImportResult] = (0, react_1.useState)(null);
-    const handleImport = async () => {
-        if (!importText.trim()) {
-            setImportResult({
-                success: false,
-                message: "Please paste the group share JSON data",
-            });
-            return;
-        }
-        setIsImporting(true);
-        setImportResult(null);
-        try {
-            const groupId = await peers_sdk_1.rpcServerCalls.importGroupShare(importText.trim());
-            setImportResult({
-                success: true,
-                message: `Group imported successfully!`,
-                groupId,
-            });
-            setImportText("");
-            // Navigate to the imported group after a brief delay
-            setTimeout(() => {
-                (0, globals_1.mainContentPath)(`groups/${groupId}`);
-                setShowImportDialog(false);
-                setImportResult(null);
-            }, 2000);
-        }
-        catch (error) {
-            setImportResult({
-                success: false,
-                message: `Import failed: ${error instanceof Error ? error.message : String(error)}`,
-            });
-        }
-        finally {
-            setIsImporting(false);
-        }
-    };
-    const handlePasteFromClipboard = async () => {
-        try {
-            if (navigator.clipboard?.readText) {
-                const clipboardText = await navigator.clipboard.readText();
-                setImportText(clipboardText);
-            }
-        }
-        catch (_error) {
-            console.log("Failed to read from clipboard - user can paste manually");
-        }
-    };
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("button", { className: "btn btn-outline-secondary dropdown-toggle", type: "button", "data-bs-toggle": "dropdown", "aria-expanded": "false", children: (0, jsx_runtime_1.jsx)("i", { className: "bi-plus-lg" }) }), (0, jsx_runtime_1.jsx)("ul", { className: "dropdown-menu dropdown-menu-end", children: (0, jsx_runtime_1.jsx)("li", { children: (0, jsx_runtime_1.jsxs)("button", { className: "dropdown-item", onClick: () => setShowImportDialog(true), children: [(0, jsx_runtime_1.jsx)("i", { className: "bi-download me-2" }), "Import Shared Group"] }) }) }), showImportDialog && ((0, jsx_runtime_1.jsx)("div", { className: "position-fixed top-0 start-0 w-100 h-100 d-flex align-items-center justify-content-center", style: { backgroundColor: "rgba(0,0,0,0.5)", zIndex: 1050 }, children: (0, jsx_runtime_1.jsxs)("div", { className: "card", style: { maxWidth: "600px", width: "90%" }, children: [(0, jsx_runtime_1.jsxs)("div", { className: "card-header d-flex justify-content-between align-items-center", children: [(0, jsx_runtime_1.jsxs)("h6", { className: "mb-0", children: [(0, jsx_runtime_1.jsx)("i", { className: "bi-download me-2" }), "Import Shared Group"] }), (0, jsx_runtime_1.jsx)("button", { className: "btn-close", onClick: () => {
-                                        setShowImportDialog(false);
-                                        setImportText("");
-                                        setImportResult(null);
-                                    }, "aria-label": "Close" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "card-body", children: [(0, jsx_runtime_1.jsx)("p", { className: "mb-3", children: "Paste the group share JSON data below to import a shared group with its admin members." }), (0, jsx_runtime_1.jsxs)("div", { className: "mb-3", children: [(0, jsx_runtime_1.jsx)("label", { className: "form-label", children: "Group Share JSON:" }), (0, jsx_runtime_1.jsx)("div", { className: "d-flex gap-2 mb-2", children: (0, jsx_runtime_1.jsxs)("button", { className: "btn btn-secondary btn-sm", onClick: handlePasteFromClipboard, title: "Paste from clipboard", children: [(0, jsx_runtime_1.jsx)("i", { className: "bi-clipboard me-1" }), "Paste from Clipboard"] }) }), (0, jsx_runtime_1.jsx)("textarea", { className: "form-control font-monospace", rows: 8, value: importText, onChange: (e) => setImportText(e.target.value), placeholder: "Paste the group share JSON here...", style: { fontSize: "0.9em" } })] }), importResult && ((0, jsx_runtime_1.jsxs)("div", { className: `alert alert-${importResult.success ? "success" : "danger"} mb-3`, children: [(0, jsx_runtime_1.jsx)("i", { className: `bi-${importResult.success ? "check-circle" : "exclamation-triangle"} me-2` }), importResult.message, importResult.success && importResult.groupId && ((0, jsx_runtime_1.jsx)("div", { className: "mt-2", children: (0, jsx_runtime_1.jsx)("small", { children: "Redirecting to group in 2 seconds..." }) }))] })), (0, jsx_runtime_1.jsxs)("div", { className: "text-end", children: [(0, jsx_runtime_1.jsx)("button", { className: "btn btn-secondary me-2", onClick: () => {
-                                                setShowImportDialog(false);
-                                                setImportText("");
-                                                setImportResult(null);
-                                            }, disabled: isImporting, children: "Cancel" }), (0, jsx_runtime_1.jsx)("button", { className: "btn btn-primary", onClick: handleImport, disabled: isImporting || !importText.trim(), children: isImporting ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("span", { className: "spinner-border spinner-border-sm me-1", role: "status", "aria-hidden": "true" }), "Importing..."] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("i", { className: "bi-download me-1" }), "Import Group"] })) })] })] })] }) }))] }));
-};
-(0, ui_loader_1.registerInternalPeersUI)({
-    peersUIId: "00mf8qrs004w5u2wqk64d2yp6",
-    component: GroupList,
-    routes: [
-        {
-            isMatch: (_props, context) => context.path === "groups",
-            uiCategory: "screen",
-            priority: 2,
-        },
-    ],
-});

package/dist/screens/groups/group-list.test.d.ts

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

package/dist/screens/groups/group-list.test.js

@@ -0,0 +1,38 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const peers_sdk_1 = require("@peers-app/peers-sdk");
+const react_1 = require("@testing-library/react");
+const group_list_1 = require("./group-list");
+jest.mock("../../globals", () => ({
+    mainContentPath: jest.fn(),
+}));
+jest.mock("../../hooks", () => ({
+    usePromise: jest.fn(),
+}));
+jest.mock("../invites/activity-view", () => ({
+    PendingWorkLink: () => null,
+}));
+const summary = {
+    group: {
+        groupId: "zyxwvutsrqponmlkjihgfedcb",
+        name: "Neighborhood",
+        description: "**Local** projects and shared plans",
+        founderUserId: "abcdefghijklmnopqrstuvwxy",
+        publicKey: "signing-key",
+        publicBoxKey: "box-key",
+        signature: "signature",
+    },
+    memberCount: 7,
+    myRole: peers_sdk_1.GroupMemberRole.Admin,
+};
+describe("GroupSummaryRow", () => {
+    it("shows description, member count, and local role in a clickable row", () => {
+        (0, react_1.render)((0, jsx_runtime_1.jsx)(group_list_1.GroupSummaryRow, { summary: summary }));
+        expect(react_1.screen.getByText("Neighborhood")).toBeInTheDocument();
+        expect(react_1.screen.getByText("Local projects and shared plans")).toBeInTheDocument();
+        expect(react_1.screen.getByText("7 members")).toBeInTheDocument();
+        expect(react_1.screen.getByText("Admin")).toBeInTheDocument();
+        expect(react_1.screen.getByRole("link")).toHaveAttribute("href", `#identity/groups/${summary.group.groupId}`);
+    });
+});

package/dist/screens/groups/group-members.d.ts

@@ -3,5 +3,6 @@ interface GroupMembersUIProps {
     groupId: string;
     userContext: UserContext;
 }
+/** List group memberships and expose role-appropriate invite and member controls. */
 export declare const GroupMembersUI: (props: GroupMembersUIProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/screens/groups/group-members.js

@@ -11,6 +11,7 @@ const loading_indicator_1 = require("../../components/loading-indicator");
 const trust_level_badge_1 = require("../../components/trust-level-badge");
 const hooks_1 = require("../../hooks");
 const group_invite_panel_1 = require("./group-invite-panel");
+/** List group memberships and expose role-appropriate invite and member controls. */
 const GroupMembersUI = (props) => {
     const { groupId, userContext } = props;
     // Get the group's data context and tables
@@ -135,7 +136,7 @@ const GroupMembersUI = (props) => {
         return (0, jsx_runtime_1.jsx)(loading_indicator_1.LoadingIndicator, {});
     }
     const { canEdit, userRole, currentUserId } = userPermissions;
-    return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsxs)("div", { className: "d-flex justify-content-between align-items-center mb-3", children: [(0, jsx_runtime_1.jsx)("h6", { className: "mb-0", children: "Group Members" }), (0, jsx_runtime_1.jsxs)("div", { className: "d-flex align-items-center gap-2", children: [(0, jsx_runtime_1.jsxs)("div", { className: `alert alert-${userRole ? "primary" : "warning"} py-2 px-3 mb-0 d-flex align-items-center`, children: [(0, jsx_runtime_1.jsx)("i", { className: `bi ${userRole ? "bi-person-badge" : "bi-exclamation-triangle"} me-2` }), (0, jsx_runtime_1.jsxs)("strong", { children: ["Your role: ", (0, peers_sdk_1.getRoleLabel)(userRole)] })] }), founderData && founderData.founderUserId !== currentUserId && ((0, jsx_runtime_1.jsxs)("a", { href: `#contacts/${founderData.founderUserId}`, className: "alert alert-warning py-2 px-3 mb-0 d-flex align-items-center text-decoration-none", style: { cursor: "pointer" }, children: [(0, jsx_runtime_1.jsx)("i", { className: "bi bi-crown-fill me-2" }), (0, jsx_runtime_1.jsxs)("strong", { children: ["Founder: ", founderData.founderUser?.name || founderData.founderUserId] })] }))] })] }), canEdit && ((0, jsx_runtime_1.jsx)(group_invite_panel_1.GroupInvitePanel, { groupId: groupId, excludeUserIds: membersData.map((m) => m.member.userId), myRole: userRole })), !canEdit && userRole && ((0, jsx_runtime_1.jsxs)("div", { className: "alert alert-info", children: [(0, jsx_runtime_1.jsx)("i", { className: "bi bi-info-circle me-2" }), "You can view group members, but only admins and owners can manage membership."] })), membersData.length === 0 ? ((0, jsx_runtime_1.jsx)("div", { className: "alert alert-info", children: "No members in this group yet. Invite someone above." })) : ((0, jsx_runtime_1.jsx)("div", { className: "list-group", children: membersData.map(({ member, user }) => ((0, jsx_runtime_1.jsx)("div", { className: "list-group-item", children: (0, jsx_runtime_1.jsxs)("div", { className: "d-flex justify-content-between align-items-center", children: [(0, jsx_runtime_1.jsx)("div", { className: "flex-grow-1", children: (0, jsx_runtime_1.jsxs)("div", { className: "d-flex align-items-center", children: [(0, jsx_runtime_1.jsx)("i", { className: "bi bi-person-fill me-2" }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsxs)("div", { className: "d-flex align-items-center", children: [(0, jsx_runtime_1.jsxs)("strong", { children: [user?.name || member.userId, member.userId === currentUserId && " (You)"] }), user?.source === "userDataContext" && ((0, jsx_runtime_1.jsxs)("span", { className: "badge bg-info ms-2", style: { fontSize: "0.7rem" }, children: [(0, jsx_runtime_1.jsx)("i", { className: "bi bi-person me-1" }), "Personal"] })), user?.source === "otherDataContexts" && ((0, jsx_runtime_1.jsxs)("span", { className: "badge bg-secondary ms-2", style: { fontSize: "0.7rem" }, children: [(0, jsx_runtime_1.jsx)("i", { className: "bi bi-people me-1" }), "Other Groups"] }))] }), user && user.userId !== user.name && ((0, jsx_runtime_1.jsx)("small", { className: "text-muted d-block", children: member.userId }))] })] }) }), (0, jsx_runtime_1.jsxs)("div", { className: "d-flex align-items-center", children: [(0, jsx_runtime_1.jsx)("div", { className: "me-2", children: (0, jsx_runtime_1.jsx)(trust_level_badge_1.TrustLevelBadge, { level: user?.trustLevel || peers_sdk_1.TrustLevel.Unknown }) }), (0, jsx_runtime_1.jsxs)("a", { href: `#contacts/${member.userId}`, className: "btn btn-outline-primary btn-sm me-2", children: [(0, jsx_runtime_1.jsx)("i", { className: "bi-eye me-1" }), "View"] }), canEdit ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("select", { className: "form-select form-select-sm me-2", style: { width: "120px" }, value: member.role, onChange: (e) => updateRole(member.groupMemberId, Number(e.target.value) || 0), children: [(0, jsx_runtime_1.jsx)("option", { value: peers_sdk_1.GroupMemberRole.None, children: "None" }), (0, jsx_runtime_1.jsx)("option", { value: peers_sdk_1.GroupMemberRole.Reader, children: "Reader" }), (0, jsx_runtime_1.jsx)("option", { value: peers_sdk_1.GroupMemberRole.Writer, children: "Writer" }), (0, jsx_runtime_1.jsx)("option", { value: peers_sdk_1.GroupMemberRole.Admin, children: "Admin" }), (0, jsx_runtime_1.jsx)("option", { value: peers_sdk_1.GroupMemberRole.Owner, children: "Owner" })] }), (0, jsx_runtime_1.jsx)("button", { className: "btn btn-outline-danger btn-sm", onClick: () => removeMember(member.groupMemberId), title: "Remove member", children: (0, jsx_runtime_1.jsx)("i", { className: "bi bi-trash" }) })] })) : (
+    return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsxs)("div", { className: "d-flex justify-content-between align-items-center mb-3", children: [(0, jsx_runtime_1.jsx)("h6", { className: "mb-0", children: "Group Members" }), (0, jsx_runtime_1.jsxs)("div", { className: "d-flex align-items-center gap-2", children: [(0, jsx_runtime_1.jsxs)("div", { className: `alert alert-${userRole ? "primary" : "warning"} py-2 px-3 mb-0 d-flex align-items-center`, children: [(0, jsx_runtime_1.jsx)("i", { className: `bi ${userRole ? "bi-person-badge" : "bi-exclamation-triangle"} me-2` }), (0, jsx_runtime_1.jsxs)("strong", { children: ["Your role: ", (0, peers_sdk_1.getRoleLabel)(userRole)] })] }), founderData && founderData.founderUserId !== currentUserId && ((0, jsx_runtime_1.jsxs)("a", { href: `#identity/people/${founderData.founderUserId}`, className: "alert alert-warning py-2 px-3 mb-0 d-flex align-items-center text-decoration-none", style: { cursor: "pointer" }, children: [(0, jsx_runtime_1.jsx)("i", { className: "bi bi-crown-fill me-2" }), (0, jsx_runtime_1.jsxs)("strong", { children: ["Founder: ", founderData.founderUser?.name || founderData.founderUserId] })] }))] })] }), canEdit && ((0, jsx_runtime_1.jsx)(group_invite_panel_1.GroupInvitePanel, { groupId: groupId, excludeUserIds: membersData.map((m) => m.member.userId), myRole: userRole })), !canEdit && userRole && ((0, jsx_runtime_1.jsxs)("div", { className: "alert alert-info", children: [(0, jsx_runtime_1.jsx)("i", { className: "bi bi-info-circle me-2" }), "You can view group members, but only admins and owners can manage membership."] })), membersData.length === 0 ? ((0, jsx_runtime_1.jsx)("div", { className: "alert alert-info", children: "No members in this group yet. Invite someone above." })) : ((0, jsx_runtime_1.jsx)("div", { className: "list-group", children: membersData.map(({ member, user }) => ((0, jsx_runtime_1.jsx)("div", { className: "list-group-item", children: (0, jsx_runtime_1.jsxs)("div", { className: "d-flex justify-content-between align-items-center", children: [(0, jsx_runtime_1.jsx)("div", { className: "flex-grow-1", children: (0, jsx_runtime_1.jsxs)("div", { className: "d-flex align-items-center", children: [(0, jsx_runtime_1.jsx)("i", { className: "bi bi-person-fill me-2" }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsxs)("div", { className: "d-flex align-items-center", children: [(0, jsx_runtime_1.jsxs)("strong", { children: [user?.name || member.userId, member.userId === currentUserId && " (You)"] }), user?.source === "userDataContext" && ((0, jsx_runtime_1.jsxs)("span", { className: "badge bg-info ms-2", style: { fontSize: "0.7rem" }, children: [(0, jsx_runtime_1.jsx)("i", { className: "bi bi-person me-1" }), "Personal"] })), user?.source === "otherDataContexts" && ((0, jsx_runtime_1.jsxs)("span", { className: "badge bg-secondary ms-2", style: { fontSize: "0.7rem" }, children: [(0, jsx_runtime_1.jsx)("i", { className: "bi bi-people me-1" }), "Other Groups"] }))] }), user && user.userId !== user.name && ((0, jsx_runtime_1.jsx)("small", { className: "text-muted d-block", children: member.userId }))] })] }) }), (0, jsx_runtime_1.jsxs)("div", { className: "d-flex align-items-center", children: [(0, jsx_runtime_1.jsx)("div", { className: "me-2", children: (0, jsx_runtime_1.jsx)(trust_level_badge_1.TrustLevelBadge, { level: user?.trustLevel || peers_sdk_1.TrustLevel.Unknown }) }), (0, jsx_runtime_1.jsxs)("a", { href: `#identity/people/${member.userId}`, className: "btn btn-outline-primary btn-sm me-2", children: [(0, jsx_runtime_1.jsx)("i", { className: "bi-eye me-1" }), "View"] }), canEdit ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("select", { className: "form-select form-select-sm me-2", style: { width: "120px" }, value: member.role, onChange: (e) => updateRole(member.groupMemberId, Number(e.target.value) || 0), children: [(0, jsx_runtime_1.jsx)("option", { value: peers_sdk_1.GroupMemberRole.None, children: "None" }), (0, jsx_runtime_1.jsx)("option", { value: peers_sdk_1.GroupMemberRole.Reader, children: "Reader" }), (0, jsx_runtime_1.jsx)("option", { value: peers_sdk_1.GroupMemberRole.Writer, children: "Writer" }), (0, jsx_runtime_1.jsx)("option", { value: peers_sdk_1.GroupMemberRole.Admin, children: "Admin" }), (0, jsx_runtime_1.jsx)("option", { value: peers_sdk_1.GroupMemberRole.Owner, children: "Owner" })] }), (0, jsx_runtime_1.jsx)("button", { className: "btn btn-outline-danger btn-sm", onClick: () => removeMember(member.groupMemberId), title: "Remove member", children: (0, jsx_runtime_1.jsx)("i", { className: "bi bi-trash" }) })] })) : (
                                     /* Read-only role display for non-admins */
                                     (0, jsx_runtime_1.jsx)("span", { className: "badge bg-secondary text-capitalize", children: (0, peers_sdk_1.getRoleLabel)(member.role) }))] })] }) }, member.groupMemberId))) })), (0, jsx_runtime_1.jsx)("div", { className: "mt-4", children: (0, jsx_runtime_1.jsxs)("small", { className: "text-muted", children: [(0, jsx_runtime_1.jsx)("strong", { children: "Roles:" }), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)("strong", { children: "Reader:" }), " Can view group content", (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)("strong", { children: "Writer:" }), " Can create and edit content", (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)("strong", { children: "Admin:" }), " Can manage members and settings", (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)("strong", { children: "Owner:" }), " Full control including group deletion"] }) })] }));
 };

package/dist/screens/groups/index.d.ts

@@ -1,6 +1,3 @@
-import "./group-list";
-import "./group-details";
-import "./group-members";
 export * from "./group-details";
 export * from "./group-list";
 export * from "./group-members";

package/dist/screens/groups/index.js

@@ -14,10 +14,6 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
     for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-// Import all group screen components to ensure they register their routes
-require("./group-list");
-require("./group-details");
-require("./group-members");
 __exportStar(require("./group-details"), exports);
 __exportStar(require("./group-list"), exports);
 __exportStar(require("./group-members"), exports);

package/dist/screens/identity/identity-routes.d.ts

@@ -0,0 +1,107 @@
+/**
+ * Canonical Identity routes and legacy aliases.
+ *
+ * Contacts, Groups, Devices, Account, and the old Invites paths all render
+ * inside the Identity app. Navigation rewrites those aliases before a tab is
+ * updated.
+ */
+/** Top-level Identity app path. Opening this lands on Activity. */
+export declare const IDENTITY_APP_PATH = "identity";
+/** Unified invite inbox. */
+export declare const IDENTITY_ACTIVITY_PATH = "identity/activity";
+/** Paste or scan an invite. */
+export declare const IDENTITY_ACCEPT_PATH = "identity/activity/accept";
+/** People (contacts) list. */
+export declare const IDENTITY_PEOPLE_PATH = "identity/people";
+/** Issue a one-off invitation to connect with a person. */
+export declare const IDENTITY_PEOPLE_INVITE_PATH = "identity/people/invite";
+/** Show the reusable profile invitation. */
+export declare const IDENTITY_PEOPLE_SHARE_PATH = "identity/people/share";
+/** Groups list. */
+export declare const IDENTITY_GROUPS_PATH = "identity/groups";
+/** Create a group. */
+export declare const IDENTITY_GROUP_NEW_PATH = "identity/groups/new";
+/** Devices list. */
+export declare const IDENTITY_DEVICES_PATH = "identity/devices";
+/** Source-device pairing flow. */
+export declare const IDENTITY_PAIR_PATH = "identity/devices/pair";
+/** Peers Services registration. */
+export declare const IDENTITY_ACCOUNT_PATH = "identity/account";
+/** Sidebar sections of the Identity app. */
+export type IdentitySectionId = "activity" | "people" | "groups" | "devices" | "account";
+/** Invite kinds that can filter Activity. */
+export type IdentityInviteType = "contact" | "group" | "device";
+/** Parsed Identity location, including detail and filter state. */
+export interface IdentityLocation {
+    /** Active sidebar section. */
+    section: IdentitySectionId;
+    /** Canonical path without a query string. */
+    pathname: string;
+    /** Person id when a contact detail is open. */
+    personId?: string;
+    /** People action selected by a route. */
+    peopleAction?: "invite" | "share";
+    /** Group id when a group detail is open. */
+    groupId?: string;
+    /** True when the group creation panel is open. */
+    creatingGroup: boolean;
+    /** Device id when a device detail is open. */
+    deviceId?: string;
+    /** True on the pairing route. */
+    pairing: boolean;
+    /** True on the paste-or-scan route. */
+    accepting: boolean;
+    /** Activity list filter from the query string. */
+    activityFilter: {
+        type?: IdentityInviteType;
+        groupId?: string;
+    };
+}
+interface ParsedRoute {
+    pathname: string;
+    query: URLSearchParams;
+}
+/**
+ * Split a hash path into its pathname and query.
+ *
+ * @param raw - Route with an optional leading `#` or `/` and an optional query.
+ */
+export declare function parseRoute(raw: string | null | undefined): ParsedRoute;
+/**
+ * Rewrite legacy identity aliases to their canonical `identity/*` path.
+ *
+ * Unrelated routes are returned with only slash cleanup, so other apps keep
+ * their existing path casing. `devices?action=pair` becomes the pair route.
+ *
+ * @param raw - Requested route, possibly a legacy alias.
+ * @returns Canonical route, including any query that still applies.
+ */
+export declare function canonicalizeRoute(raw: string | null | undefined): string;
+/**
+ * Whether a route belongs to the Identity app after alias rewrite.
+ *
+ * @param raw - Route to test.
+ */
+export declare function isIdentityPath(raw: string | null | undefined): boolean;
+/**
+ * Sidebar section for an Identity route.
+ *
+ * @param raw - Identity route or legacy alias.
+ * @returns The section, or `undefined` when the route is not Identity.
+ */
+export declare function identitySectionFromPath(raw: string | null | undefined): IdentitySectionId | undefined;
+/**
+ * Detail, pairing, accept, and filter state for an Identity route.
+ *
+ * @param raw - Identity route or legacy alias.
+ * @returns Parsed location, or `undefined` when the route is not Identity.
+ */
+export declare function parseIdentityLocation(raw: string | null | undefined): IdentityLocation | undefined;
+/**
+ * Activity route that shows one invite type, optionally one group.
+ *
+ * @param type - Invite type to show.
+ * @param groupId - Group to limit the list to.
+ */
+export declare function identityActivityFilterPath(type: IdentityInviteType, groupId?: string): string;
+export {};