@peers-app/peers-ui 0.25.2 → 0.25.3

package/dist/screens/identity/identity-routes.js

@@ -0,0 +1,245 @@
+"use strict";
+/**
+ * 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.
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.IDENTITY_ACCOUNT_PATH = exports.IDENTITY_PAIR_PATH = exports.IDENTITY_DEVICES_PATH = exports.IDENTITY_GROUP_NEW_PATH = exports.IDENTITY_GROUPS_PATH = exports.IDENTITY_PEOPLE_SHARE_PATH = exports.IDENTITY_PEOPLE_INVITE_PATH = exports.IDENTITY_PEOPLE_PATH = exports.IDENTITY_ACCEPT_PATH = exports.IDENTITY_ACTIVITY_PATH = exports.IDENTITY_APP_PATH = void 0;
+exports.parseRoute = parseRoute;
+exports.canonicalizeRoute = canonicalizeRoute;
+exports.isIdentityPath = isIdentityPath;
+exports.identitySectionFromPath = identitySectionFromPath;
+exports.parseIdentityLocation = parseIdentityLocation;
+exports.identityActivityFilterPath = identityActivityFilterPath;
+/** Top-level Identity app path. Opening this lands on Activity. */
+exports.IDENTITY_APP_PATH = "identity";
+/** Unified invite inbox. */
+exports.IDENTITY_ACTIVITY_PATH = "identity/activity";
+/** Paste or scan an invite. */
+exports.IDENTITY_ACCEPT_PATH = "identity/activity/accept";
+/** People (contacts) list. */
+exports.IDENTITY_PEOPLE_PATH = "identity/people";
+/** Issue a one-off invitation to connect with a person. */
+exports.IDENTITY_PEOPLE_INVITE_PATH = "identity/people/invite";
+/** Show the reusable profile invitation. */
+exports.IDENTITY_PEOPLE_SHARE_PATH = "identity/people/share";
+/** Groups list. */
+exports.IDENTITY_GROUPS_PATH = "identity/groups";
+/** Create a group. */
+exports.IDENTITY_GROUP_NEW_PATH = "identity/groups/new";
+/** Devices list. */
+exports.IDENTITY_DEVICES_PATH = "identity/devices";
+/** Source-device pairing flow. */
+exports.IDENTITY_PAIR_PATH = "identity/devices/pair";
+/** Peers Services registration. */
+exports.IDENTITY_ACCOUNT_PATH = "identity/account";
+const IDENTITY_SECTIONS = new Set([
+    "activity",
+    "people",
+    "groups",
+    "devices",
+    "account",
+]);
+const INVITE_TYPES = new Set(["contact", "group", "device"]);
+/**
+ * Split a hash path into its pathname and query.
+ *
+ * @param raw - Route with an optional leading `#` or `/` and an optional query.
+ */
+function parseRoute(raw) {
+    let trimmed = (raw ?? "").trim();
+    if (trimmed.startsWith("/#")) {
+        trimmed = trimmed.slice(2);
+    }
+    else if (trimmed.startsWith("#")) {
+        trimmed = trimmed.slice(1);
+    }
+    const queryIndex = trimmed.indexOf("?");
+    const before = queryIndex >= 0 ? trimmed.slice(0, queryIndex) : trimmed;
+    const queryString = queryIndex >= 0 ? trimmed.slice(queryIndex + 1) : "";
+    let pathname = before.trim();
+    pathname = pathname.replace(/^\/+/, "").replace(/\/+$/, "");
+    return { pathname, query: new URLSearchParams(queryString) };
+}
+/**
+ * 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.
+ */
+function canonicalizeRoute(raw) {
+    const { pathname, query } = parseRoute(raw);
+    if (!pathname) {
+        return "";
+    }
+    const rewritten = rewritePathname(pathname, query);
+    const queryString = query.toString();
+    return queryString ? `${rewritten}?${queryString}` : rewritten;
+}
+/**
+ * Whether a route belongs to the Identity app after alias rewrite.
+ *
+ * @param raw - Route to test.
+ */
+function isIdentityPath(raw) {
+    const pathname = parseRoute(canonicalizeRoute(raw)).pathname;
+    return pathname === exports.IDENTITY_APP_PATH || pathname.startsWith(`${exports.IDENTITY_APP_PATH}/`);
+}
+/**
+ * Sidebar section for an Identity route.
+ *
+ * @param raw - Identity route or legacy alias.
+ * @returns The section, or `undefined` when the route is not Identity.
+ */
+function identitySectionFromPath(raw) {
+    return parseIdentityLocation(raw)?.section;
+}
+/**
+ * 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.
+ */
+function parseIdentityLocation(raw) {
+    const canonical = canonicalizeRoute(raw);
+    const { pathname, query } = parseRoute(canonical);
+    const parts = pathname.split("/").filter(Boolean);
+    if (parts[0] !== exports.IDENTITY_APP_PATH) {
+        return undefined;
+    }
+    const section = IDENTITY_SECTIONS.has(parts[1])
+        ? parts[1]
+        : "activity";
+    const rest = parts.slice(2);
+    const pairing = section === "devices" && rest[0] === "pair";
+    const accepting = section === "activity" && rest[0] === "accept";
+    const peopleAction = section === "people" && (rest[0] === "invite" || rest[0] === "share") ? rest[0] : undefined;
+    const creatingGroup = section === "groups" && rest[0] === "new";
+    const detailId = rest[0] &&
+        rest[0] !== "pair" &&
+        rest[0] !== "accept" &&
+        rest[0] !== "invite" &&
+        rest[0] !== "share" &&
+        rest[0] !== "new"
+        ? rest[0]
+        : undefined;
+    const type = query.get("type");
+    return {
+        section,
+        pathname,
+        personId: section === "people" ? detailId : undefined,
+        peopleAction,
+        groupId: section === "groups" ? detailId : undefined,
+        creatingGroup,
+        deviceId: section === "devices" && !pairing ? detailId : undefined,
+        pairing,
+        accepting,
+        activityFilter: {
+            type: type && INVITE_TYPES.has(type)
+                ? type
+                : undefined,
+            groupId: query.get("groupId") || 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.
+ */
+function identityActivityFilterPath(type, groupId) {
+    const query = new URLSearchParams();
+    query.set("type", type);
+    if (groupId) {
+        query.set("groupId", groupId);
+    }
+    return `${exports.IDENTITY_ACTIVITY_PATH}?${query.toString()}`;
+}
+function rewritePathname(pathname, query) {
+    const parts = pathname.split("/").filter(Boolean);
+    const root = parts[0]?.toLowerCase() ?? "";
+    let rewritten;
+    if (root === "identity") {
+        rewritten = rewriteIdentity(parts.slice(1));
+    }
+    else if (root === "contacts") {
+        rewritten = ["identity", "people", ...singleId(parts.slice(1))];
+    }
+    else if (root === "groups") {
+        rewritten = ["identity", "groups", ...singleId(parts.slice(1))];
+    }
+    else if (root === "devices") {
+        rewritten = rewriteDevices(parts.slice(1));
+    }
+    else if (root === "invites") {
+        rewritten =
+            parts[1]?.toLowerCase() === "accept"
+                ? ["identity", "activity", "accept"]
+                : ["identity", "activity"];
+    }
+    else if (root === "account") {
+        rewritten = ["identity", "account"];
+    }
+    if (!rewritten) {
+        return pathname;
+    }
+    if (rewritten.join("/") === exports.IDENTITY_DEVICES_PATH && query.get("action") === "pair") {
+        query.delete("action");
+        rewritten = ["identity", "devices", "pair"];
+    }
+    return rewritten.join("/");
+}
+function rewriteIdentity(rest) {
+    const section = rest[0]?.toLowerCase();
+    if (section === "people") {
+        return ["identity", "people", ...rewritePeople(rest.slice(1))];
+    }
+    if (section === "groups") {
+        return ["identity", "groups", ...rewriteGroups(rest.slice(1))];
+    }
+    if (section === "devices") {
+        return rewriteDevices(rest.slice(1));
+    }
+    if (section === "activity") {
+        return rest[1]?.toLowerCase() === "accept"
+            ? ["identity", "activity", "accept"]
+            : ["identity", "activity"];
+    }
+    if (section === "account") {
+        return ["identity", "account"];
+    }
+    return ["identity", "activity"];
+}
+function rewritePeople(rest) {
+    const head = rest[0]?.toLowerCase();
+    if (head === "invite" || head === "share") {
+        return [head];
+    }
+    return singleId(rest);
+}
+function rewriteGroups(rest) {
+    if (rest[0]?.toLowerCase() === "new") {
+        return ["new"];
+    }
+    return singleId(rest);
+}
+function rewriteDevices(rest) {
+    const head = rest[0]?.toLowerCase();
+    if (!head) {
+        return ["identity", "devices"];
+    }
+    if (head === "pair") {
+        return ["identity", "devices", "pair"];
+    }
+    return ["identity", "devices", rest[0]];
+}
+function singleId(rest) {
+    return rest[0] ? [rest[0]] : [];
+}

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

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

package/dist/screens/identity/identity-routes.test.js

@@ -0,0 +1,51 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const identity_routes_1 = require("./identity-routes");
+const PERSON_ID = "abcdefghijklmnopqrstuvwxy";
+const GROUP_ID = "zyxwvutsrqponmlkjihgfedcb";
+const DEVICE_ID = "0123456789abcdefghijklmno";
+describe("canonicalizeRoute", () => {
+    it.each([
+        ["contacts", identity_routes_1.IDENTITY_PEOPLE_PATH],
+        [`contacts/${PERSON_ID}`, `${identity_routes_1.IDENTITY_PEOPLE_PATH}/${PERSON_ID}`],
+        ["groups", identity_routes_1.IDENTITY_GROUPS_PATH],
+        [`groups/${GROUP_ID}`, `${identity_routes_1.IDENTITY_GROUPS_PATH}/${GROUP_ID}`],
+        ["devices", identity_routes_1.IDENTITY_DEVICES_PATH],
+        [`devices/${DEVICE_ID}`, `${identity_routes_1.IDENTITY_DEVICES_PATH}/${DEVICE_ID}`],
+        ["devices?action=pair", identity_routes_1.IDENTITY_PAIR_PATH],
+        ["devices?action=pair&foo=bar", `${identity_routes_1.IDENTITY_PAIR_PATH}?foo=bar`],
+        ["invites", identity_routes_1.IDENTITY_ACTIVITY_PATH],
+        ["invites/accept", identity_routes_1.IDENTITY_ACCEPT_PATH],
+        ["account", identity_routes_1.IDENTITY_ACCOUNT_PATH],
+        ["account?x=1", `${identity_routes_1.IDENTITY_ACCOUNT_PATH}?x=1`],
+        ["identity/account", identity_routes_1.IDENTITY_ACCOUNT_PATH],
+        ["identity/people/invite", identity_routes_1.IDENTITY_PEOPLE_INVITE_PATH],
+        ["identity/people/SHARE", identity_routes_1.IDENTITY_PEOPLE_SHARE_PATH],
+        ["identity/groups/new", identity_routes_1.IDENTITY_GROUP_NEW_PATH],
+        ["identity", identity_routes_1.IDENTITY_ACTIVITY_PATH],
+        [`/#contacts/${PERSON_ID}?x=1`, `${identity_routes_1.IDENTITY_PEOPLE_PATH}/${PERSON_ID}?x=1`],
+        ["tools/abc", "tools/abc"],
+        ["", ""],
+    ])("rewrites %s to %s", (input, expected) => {
+        expect((0, identity_routes_1.canonicalizeRoute)(input)).toBe(expected);
+    });
+});
+describe("parseIdentityLocation", () => {
+    it("parses detail routes and activity filters", () => {
+        expect((0, identity_routes_1.parseIdentityLocation)(`contacts/${PERSON_ID}`)?.personId).toBe(PERSON_ID);
+        expect((0, identity_routes_1.parseIdentityLocation)(`groups/${GROUP_ID}`)?.groupId).toBe(GROUP_ID);
+        expect((0, identity_routes_1.parseIdentityLocation)("devices?action=pair")?.pairing).toBe(true);
+        expect((0, identity_routes_1.parseIdentityLocation)(`devices/${DEVICE_ID}`)?.deviceId).toBe(DEVICE_ID);
+        expect((0, identity_routes_1.parseIdentityLocation)("invites/accept")?.accepting).toBe(true);
+        expect((0, identity_routes_1.parseIdentityLocation)(identity_routes_1.IDENTITY_PEOPLE_INVITE_PATH)?.peopleAction).toBe("invite");
+        expect((0, identity_routes_1.parseIdentityLocation)(identity_routes_1.IDENTITY_PEOPLE_SHARE_PATH)?.peopleAction).toBe("share");
+        expect((0, identity_routes_1.parseIdentityLocation)(identity_routes_1.IDENTITY_GROUP_NEW_PATH)?.creatingGroup).toBe(true);
+        expect((0, identity_routes_1.parseIdentityLocation)((0, identity_routes_1.identityActivityFilterPath)("group", GROUP_ID))?.activityFilter).toEqual({
+            type: "group",
+            groupId: GROUP_ID,
+        });
+        expect((0, identity_routes_1.identitySectionFromPath)("contacts")).toBe("people");
+        expect((0, identity_routes_1.identitySectionFromPath)("account")).toBe("account");
+        expect((0, identity_routes_1.isIdentityPath)("settings")).toBe(false);
+    });
+});

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

@@ -0,0 +1,9 @@
+/**
+ * Identity app shell.
+ *
+ * Activity, People, Groups, Devices, and Account stay one top-level tab. The
+ * route selects the section, and detail routes keep that section highlighted.
+ */
+export declare function IdentityScreen(props: {
+    path?: string;
+}): import("react/jsx-runtime").JSX.Element | null;

package/dist/screens/identity/identity-screen.js

@@ -0,0 +1,143 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.IdentityScreen = IdentityScreen;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const responsive_section_nav_1 = require("../../components/responsive-section-nav");
+const globals_1 = require("../../globals");
+const hooks_1 = require("../../hooks");
+const ui_loader_1 = require("../../ui-router/ui-loader");
+const account_screen_1 = require("../account/account-screen");
+const contact_details_1 = require("../contacts/contact-details");
+const contact_list_1 = require("../contacts/contact-list");
+const devices_list_1 = require("../devices/devices-list");
+const group_details_1 = require("../groups/group-details");
+const group_list_1 = require("../groups/group-list");
+const accept_invite_1 = require("../invites/accept-invite");
+const activity_view_1 = require("../invites/activity-view");
+const pending_invites_list_1 = require("../invites/pending-invites-list");
+const identity_routes_1 = require("./identity-routes");
+const SECTION_PATHS = {
+    activity: identity_routes_1.IDENTITY_ACTIVITY_PATH,
+    people: identity_routes_1.IDENTITY_PEOPLE_PATH,
+    groups: identity_routes_1.IDENTITY_GROUPS_PATH,
+    devices: identity_routes_1.IDENTITY_DEVICES_PATH,
+    account: identity_routes_1.IDENTITY_ACCOUNT_PATH,
+};
+/**
+ * Identity app shell.
+ *
+ * Activity, People, Groups, Devices, and Account stay one top-level tab. The
+ * route selects the section, and detail routes keep that section highlighted.
+ */
+function IdentityScreen(props) {
+    const [livePath] = (0, hooks_1.useObservable)(globals_1.mainContentPath);
+    const location = (0, identity_routes_1.parseIdentityLocation)(props.path ?? livePath) ?? (0, identity_routes_1.parseIdentityLocation)(identity_routes_1.IDENTITY_ACTIVITY_PATH);
+    const pending = (0, pending_invites_list_1.useInviteRows)({ statuses: ["pending"] });
+    const rows = pending?.rows;
+    if (!location) {
+        return null;
+    }
+    return ((0, jsx_runtime_1.jsx)(responsive_section_nav_1.ResponsiveSectionNav, { label: "Identity", activeSectionId: location.section, onSelect: (sectionId) => (0, globals_1.mainContentPath)(SECTION_PATHS[sectionId]), toolbar: (0, jsx_runtime_1.jsx)(IdentityQuickActions, {}), sections: [
+            {
+                id: "activity",
+                label: "Activity",
+                iconClassName: "bi-inbox",
+                badge: badgeCount(rows, "attention"),
+            },
+            {
+                id: "people",
+                label: "People",
+                iconClassName: "bi-person-fill-check",
+                badge: badgeCount(rows, "contact"),
+            },
+            {
+                id: "groups",
+                label: "Groups",
+                iconClassName: "bi-people-fill",
+                badge: badgeCount(rows, "group"),
+            },
+            {
+                id: "devices",
+                label: "Devices",
+                iconClassName: "bi-laptop",
+                badge: badgeCount(rows, "device"),
+            },
+            {
+                id: "account",
+                label: "Account",
+                iconClassName: "bi-person-circle",
+            },
+        ], children: (0, jsx_runtime_1.jsx)(IdentityBody, { location: location }) }));
+}
+function IdentityBody(props) {
+    const { location } = props;
+    if (location.accepting) {
+        return ((0, jsx_runtime_1.jsxs)("div", { className: "container-fluid py-3", style: { maxWidth: 720 }, children: [(0, jsx_runtime_1.jsx)("a", { href: `#${identity_routes_1.IDENTITY_ACTIVITY_PATH}`, className: "btn btn-link btn-sm px-0 mb-2", children: "Back to Activity" }), (0, jsx_runtime_1.jsxs)("h4", { className: "mb-3", children: [(0, jsx_runtime_1.jsx)("i", { className: "bi bi-envelope-paper me-2" }), "Accept an invite"] }), (0, jsx_runtime_1.jsx)("div", { className: "card", children: (0, jsx_runtime_1.jsx)("div", { className: "card-body", children: (0, jsx_runtime_1.jsx)(accept_invite_1.AcceptInvite, { onDone: () => (0, globals_1.mainContentPath)(identity_routes_1.IDENTITY_ACTIVITY_PATH) }) }) })] }));
+    }
+    if (location.section === "people") {
+        return location.personId ? ((0, jsx_runtime_1.jsx)(DetailFrame, { backHref: `#${identity_routes_1.IDENTITY_PEOPLE_PATH}`, backLabel: "Back to people", children: (0, jsx_runtime_1.jsx)(contact_details_1.ContactDetails, { userId: location.personId }) })) : ((0, jsx_runtime_1.jsx)(contact_list_1.ContactList, { action: location.peopleAction }));
+    }
+    if (location.section === "groups") {
+        return location.groupId ? ((0, jsx_runtime_1.jsx)(DetailFrame, { backHref: `#${identity_routes_1.IDENTITY_GROUPS_PATH}`, backLabel: "Back to groups", children: (0, jsx_runtime_1.jsx)(group_details_1.GroupDetails, { groupId: location.groupId }) })) : ((0, jsx_runtime_1.jsx)(group_list_1.GroupList, { creating: location.creatingGroup }));
+    }
+    if (location.section === "devices") {
+        const mode = location.pairing ? "pair" : location.deviceId ? "detail" : "list";
+        return (0, jsx_runtime_1.jsx)(devices_list_1.DevicesSection, { mode: mode, deviceId: location.deviceId });
+    }
+    if (location.section === "account") {
+        return (0, jsx_runtime_1.jsx)(account_screen_1.AccountScreen, {});
+    }
+    return ((0, jsx_runtime_1.jsx)("div", { className: "container-xxl p-3", children: (0, jsx_runtime_1.jsx)(activity_view_1.ActivityView, { filter: location.activityFilter }) }));
+}
+function IdentityQuickActions() {
+    const [desktop] = (0, hooks_1.useObservable)(globals_1.isDesktop);
+    const [showAdd, setShowAdd] = (0, react_1.useState)(false);
+    const addActions = [
+        {
+            path: identity_routes_1.IDENTITY_PEOPLE_INVITE_PATH,
+            label: "Add person",
+            icon: "bi-person-plus",
+        },
+        {
+            path: identity_routes_1.IDENTITY_GROUP_NEW_PATH,
+            label: "Create group",
+            icon: "bi-people",
+        },
+        {
+            path: identity_routes_1.IDENTITY_PAIR_PATH,
+            label: "Add device",
+            icon: "bi-laptop",
+        },
+    ];
+    if (desktop) {
+        return ((0, jsx_runtime_1.jsxs)("div", { className: "d-grid align-items-center gap-2 border-bottom p-2", style: { gridTemplateColumns: "minmax(0, 1fr) auto minmax(0, 1fr)" }, children: [(0, jsx_runtime_1.jsxs)("div", { className: "overflow-hidden", children: [(0, jsx_runtime_1.jsx)("div", { className: "fw-semibold", children: "Identity" }), (0, jsx_runtime_1.jsx)("small", { className: "text-muted text-truncate d-block", children: "People, groups, and your devices" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "d-flex align-items-center justify-content-center gap-2", children: [addActions.map((action) => ((0, jsx_runtime_1.jsxs)("a", { href: `#${action.path}`, className: "btn btn-outline-primary btn-sm", children: [(0, jsx_runtime_1.jsx)("i", { className: `bi ${action.icon} me-1` }), action.label] }, action.path))), (0, jsx_runtime_1.jsxs)("a", { href: `#${identity_routes_1.IDENTITY_ACCEPT_PATH}`, className: "btn btn-primary btn-sm", children: [(0, jsx_runtime_1.jsx)("i", { className: "bi bi-qr-code-scan me-1" }), "Use invite"] })] }), (0, jsx_runtime_1.jsx)("span", { "aria-hidden": "true" })] }));
+    }
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "position-relative d-flex align-items-center gap-2 border-bottom p-2", children: [(0, jsx_runtime_1.jsx)("div", { className: "me-auto fw-semibold", children: "Identity" }), (0, jsx_runtime_1.jsxs)("button", { type: "button", className: "btn btn-outline-primary btn-sm", "aria-expanded": showAdd, onClick: () => setShowAdd((open) => !open), children: [(0, jsx_runtime_1.jsx)("i", { className: "bi bi-plus-lg me-1" }), "Add"] }), (0, jsx_runtime_1.jsxs)("a", { href: `#${identity_routes_1.IDENTITY_ACCEPT_PATH}`, className: "btn btn-primary btn-sm", children: [(0, jsx_runtime_1.jsx)("i", { className: "bi bi-qr-code-scan me-1" }), "Invite"] }), showAdd ? ((0, jsx_runtime_1.jsx)("div", { className: "card position-absolute end-0 top-100 mt-1 shadow-sm", style: { zIndex: 20, minWidth: 190 }, children: (0, jsx_runtime_1.jsx)("div", { className: "list-group list-group-flush", children: addActions.map((action) => ((0, jsx_runtime_1.jsxs)("a", { href: `#${action.path}`, className: "list-group-item list-group-item-action d-flex align-items-center gap-2", onClick: () => setShowAdd(false), children: [(0, jsx_runtime_1.jsx)("i", { className: `bi ${action.icon}` }), action.label] }, action.path))) }) })) : null] }));
+}
+function DetailFrame(props) {
+    return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("a", { href: props.backHref, className: "btn btn-link btn-sm px-3 pt-3", children: props.backLabel }), props.children] }));
+}
+function badgeCount(rows, kind) {
+    if (!rows) {
+        return undefined;
+    }
+    const count = rows.filter((row) => kind === "attention"
+        ? (0, pending_invites_list_1.classifyInvite)(row) === "attention"
+        : row.type === kind && (0, pending_invites_list_1.classifyInvite)(row) === "attention").length;
+    return count > 0 ? count : undefined;
+}
+(0, ui_loader_1.registerInternalPeersUI)({
+    peersUIId: "00identity0screen00000001",
+    component: IdentityScreen,
+    routes: [
+        {
+            isMatch: (_props, context) => {
+                const path = context.path.split("?")[0];
+                return path === "identity" || path.startsWith("identity/");
+            },
+            uiCategory: "screen",
+            priority: 3,
+        },
+    ],
+});

package/dist/screens/identity/identity-screen.test.d.ts

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

package/dist/screens/identity/identity-screen.test.js

@@ -0,0 +1,103 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("@testing-library/react");
+const user_event_1 = __importDefault(require("@testing-library/user-event"));
+const globals_1 = require("../../globals");
+const identity_screen_1 = require("./identity-screen");
+jest.mock("../../globals", () => {
+    const { observable } = jest.requireActual("@peers-app/peers-sdk");
+    return {
+        isDesktop: observable(true),
+        mainContentPath: observable("identity/activity"),
+    };
+});
+jest.mock("../../ui-router/ui-loader", () => ({
+    registerInternalPeersUI: jest.fn(),
+}));
+jest.mock("../contacts/contact-list", () => ({
+    ContactList: () => (0, jsx_runtime_1.jsx)("div", { children: "People view" }),
+}));
+jest.mock("../contacts/contact-details", () => ({
+    ContactDetails: ({ userId }) => (0, jsx_runtime_1.jsxs)("div", { children: ["Person ", userId] }),
+}));
+jest.mock("../groups/group-list", () => ({
+    GroupList: () => (0, jsx_runtime_1.jsx)("div", { children: "Groups view" }),
+}));
+jest.mock("../groups/group-details", () => ({
+    GroupDetails: ({ groupId }) => (0, jsx_runtime_1.jsxs)("div", { children: ["Group ", groupId] }),
+}));
+jest.mock("../devices/devices-list", () => ({
+    DevicesSection: ({ mode }) => (0, jsx_runtime_1.jsxs)("div", { children: ["Devices ", mode] }),
+}));
+jest.mock("../invites/accept-invite", () => ({
+    AcceptInvite: () => (0, jsx_runtime_1.jsx)("div", { children: "Accept invite view" }),
+}));
+jest.mock("../invites/activity-view", () => ({
+    ActivityView: () => (0, jsx_runtime_1.jsx)("div", { children: "Activity view" }),
+}));
+jest.mock("../account/account-screen", () => ({
+    AccountScreen: () => (0, jsx_runtime_1.jsx)("div", { children: "Account view" }),
+}));
+jest.mock("../invites/pending-invites-list", () => ({
+    useInviteRows: () => ({
+        rows: [
+            {
+                inviteId: "inboundcontact0000000001",
+                type: "contact",
+                status: "pending",
+                direction: "in",
+                mode: "contact",
+            },
+        ],
+        hasHistory: false,
+    }),
+    classifyInvite: (row) => row.status === "pending" && row.direction === "in" && row.type === "contact"
+        ? "attention"
+        : "waiting",
+}));
+const PERSON_ID = "abcdefghijklmnopqrstuvwxy";
+describe("IdentityScreen", () => {
+    beforeEach(() => {
+        (0, globals_1.isDesktop)(true);
+        (0, globals_1.mainContentPath)("identity/activity");
+    });
+    it("highlights the parent section for a person route and keeps Activity counted", () => {
+        (0, react_1.render)((0, jsx_runtime_1.jsx)(identity_screen_1.IdentityScreen, { path: `identity/people/${PERSON_ID}` }));
+        expect(react_1.screen.getByRole("button", { name: /People/ })).toHaveAttribute("aria-current", "page");
+        expect(react_1.screen.getByText(`Person ${PERSON_ID}`)).toBeInTheDocument();
+        expect(react_1.screen.getByRole("button", { name: /Activity/ })).toHaveTextContent("1");
+    });
+    it("renders the accept flow on the activity section", () => {
+        (0, react_1.render)((0, jsx_runtime_1.jsx)(identity_screen_1.IdentityScreen, { path: "invites/accept" }));
+        expect(react_1.screen.getByText("Accept invite view")).toBeInTheDocument();
+        expect(react_1.screen.getByRole("button", { name: /Activity/ })).toHaveAttribute("aria-current", "page");
+    });
+    it("renders registration on the account section", () => {
+        (0, react_1.render)((0, jsx_runtime_1.jsx)(identity_screen_1.IdentityScreen, { path: "account" }));
+        expect(react_1.screen.getByText("Account view")).toBeInTheDocument();
+        expect(react_1.screen.getByRole("button", { name: /Account/ })).toHaveAttribute("aria-current", "page");
+    });
+    it("selects a section through the canonical route", async () => {
+        (0, react_1.render)((0, jsx_runtime_1.jsx)(identity_screen_1.IdentityScreen, { path: "identity/activity" }));
+        await user_event_1.default.click(react_1.screen.getByRole("button", { name: /Devices/ }));
+        expect((0, globals_1.mainContentPath)()).toBe("identity/devices");
+    });
+    it("keeps all desktop quick actions route-backed", () => {
+        (0, react_1.render)((0, jsx_runtime_1.jsx)(identity_screen_1.IdentityScreen, { path: "identity/activity" }));
+        expect(react_1.screen.getByRole("link", { name: /Add person/ })).toHaveAttribute("href", "#identity/people/invite");
+        expect(react_1.screen.getByRole("link", { name: /Create group/ })).toHaveAttribute("href", "#identity/groups/new");
+        expect(react_1.screen.getByRole("link", { name: /Add device/ })).toHaveAttribute("href", "#identity/devices/pair");
+        expect(react_1.screen.getByRole("link", { name: /Use invite/ })).toHaveAttribute("href", "#identity/activity/accept");
+    });
+    it("collapses add actions on a narrow screen", async () => {
+        (0, globals_1.isDesktop)(false);
+        (0, react_1.render)((0, jsx_runtime_1.jsx)(identity_screen_1.IdentityScreen, { path: "identity/activity" }));
+        await user_event_1.default.click(react_1.screen.getByRole("button", { name: "Add" }));
+        expect(react_1.screen.getByRole("link", { name: /Add person/ })).toBeInTheDocument();
+        expect(react_1.screen.getByRole("link", { name: /Create group/ })).toBeInTheDocument();
+    });
+});

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

@@ -0,0 +1,2 @@
+export { identityApp } from "../../system-apps/identity.app";
+import "./identity-screen";

package/dist/screens/identity/index.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.identityApp = void 0;
+var identity_app_1 = require("../../system-apps/identity.app");
+Object.defineProperty(exports, "identityApp", { enumerable: true, get: function () { return identity_app_1.identityApp; } });
+require("./identity-screen");

package/dist/screens/identity/invite-contact-panel.d.ts

@@ -0,0 +1,4 @@
+/** Issues a one-off contact invite and shows it as a QR code and link. */
+export declare function InviteContactPanel({ onClose }: {
+    onClose: () => void;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/screens/identity/invite-contact-panel.js

@@ -0,0 +1,30 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.InviteContactPanel = InviteContactPanel;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const loading_indicator_1 = require("../../components/loading-indicator");
+const invite_share_1 = require("../invites/invite-share");
+const invites_ipc_1 = require("../invites/invites-ipc");
+/** Issues a one-off contact invite and shows it as a QR code and link. */
+function InviteContactPanel({ onClose }) {
+    const [invite, setInvite] = (0, react_1.useState)(undefined);
+    const [error, setError] = (0, react_1.useState)("");
+    (0, react_1.useEffect)(() => {
+        let cancelled = false;
+        void (0, invites_ipc_1.inviteTools)()
+            .then((tools) => tools.createContactInvite({}))
+            .then(({ invite: created }) => {
+            if (!cancelled)
+                setInvite(created);
+        })
+            .catch((err) => {
+            if (!cancelled)
+                setError(err.message || "Could not create an invite.");
+        });
+        return () => {
+            cancelled = true;
+        };
+    }, []);
+    return ((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: "Invite someone" }), error ? (0, jsx_runtime_1.jsx)("div", { className: "alert alert-danger py-2", children: error }) : null, invite ? ((0, jsx_runtime_1.jsx)(invite_share_1.InviteShare, { invite: invite, description: "Send this link or show the QR. When they accept, you are connected \u2014 no need to be online at the same time.", shareText: "Connect with me on Peers:", onDone: onClose })) : !error ? ((0, jsx_runtime_1.jsx)(loading_indicator_1.LoadingIndicator, {})) : null] }) }));
+}

package/dist/screens/identity/profile-invite.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Reusable profile invite.
+ *
+ * Sharing it asks the other person to request a connection. Regenerating bumps
+ * the invite epoch and revokes outstanding links.
+ */
+export declare function ProfileInviteSection(): import("react/jsx-runtime").JSX.Element;