@structured-id/ui-core 4.13.0 → 4.14.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@structured-id/ui-core",
-  "version": "4.13.0",
+  "version": "4.14.0",
   "type": "module",
   "publishConfig": {
     "access": "public",
@@ -42,8 +42,8 @@
     "@protobuf-ts/grpcweb-transport": "^2.11.1",
     "@protobuf-ts/runtime": "^2.11.1",
     "@protobuf-ts/runtime-rpc": "^2.11.1",
-    "@structured-id/ids": "^0.3.0",
-    "@structured-id/proto": "^0.11.0",
+    "@structured-id/ids": "^0.4.0",
+    "@structured-id/proto": "^0.12.0",
     "@structured-world/structured-email-address-ts": "^0.0.22",
     "@structured-world/structured-public-domains": "0.0.x",
     "libphonenumber-js": "^1.13.15"

package/src/profile/components/SessionList.vue

@@ -9,7 +9,7 @@
     </div>
 
     <q-list v-else-if="sessions.length > 0" separator>
-      <q-item v-for="session in sessions" :key="session.id">
+      <q-item v-for="session in sessions" :key="session.id.toString()">
         <q-item-section avatar>
           <q-icon :name="deviceIcon(session.userAgent)" size="sm" />
         </q-item-section>
@@ -37,7 +37,7 @@
             dense
             color="negative"
             icon="sym_o_logout"
-            :loading="revoking === session.id"
+            :loading="revoking?.equals(session.id) ?? false"
             @click="$emit('revoke', session.id)"
           />
         </q-item-section>
@@ -49,23 +49,24 @@
 </template>
 
 <script setup lang="ts">
-import type { Session } from "@structured-id/proto/sid/v1/identity/identity";
+import type { SessionId } from "@structured-id/ids";
 import { Timestamp } from "@structured-id/proto/google/protobuf/timestamp";
+import type { Session } from "../composables/useIdentityApi";
 
-defineProps<{
+const props = defineProps<{
   sessions: Session[];
   loading: boolean;
   error: string | null;
-  revoking: string | null;
-  currentSessionId?: string;
+  revoking: SessionId | null;
+  currentSessionId?: SessionId;
 }>();
 
 defineEmits<{
-  revoke: [sessionId: string];
+  revoke: [sessionId: SessionId];
 }>();
 
 function isCurrentSession(session: Session): boolean {
-  return false; // Overridden via currentSessionId prop comparison
+  return props.currentSessionId?.equals(session.id) ?? false;
 }
 
 function deviceIcon(userAgent: string | undefined): string {

package/src/profile/composables/useIdentityApi.test.ts

@@ -0,0 +1,166 @@
+import { describe, it, expect, vi, beforeEach } from "vitest";
+import {
+  CredentialId,
+  DeviceId,
+  IdError,
+  MissingIdError,
+  PrincipalId,
+  ProfileEmailId,
+  ProfileId,
+  SessionId,
+} from "@structured-id/ids";
+import {
+  fetchCredentials,
+  fetchCurrentProfile,
+  fetchPrincipals,
+  fetchSessions,
+  removePrincipal,
+  revokeCredential,
+  revokeSession,
+  updateCredentialLabel,
+  updateProfile,
+} from "./useIdentityApi";
+
+// Every IdentityService method the tests call, keyed by its client method name.
+const rpc: Record<string, ReturnType<typeof vi.fn>> = {};
+
+vi.mock("../../index", () => ({
+  getAccountTransport: vi.fn(),
+}));
+
+vi.mock("@structured-id/proto/sid/v1/identity/identity.client", () => ({
+  // Called with `new`: a constructor mock must be a `function`, not an arrow.
+  IdentityServiceClient: vi.fn().mockImplementation(function () {
+    return new Proxy(
+      {},
+      { get: (_target, name: string) => (rpc[name] ??= vi.fn()) },
+    );
+  }),
+}));
+
+vi.mock("../auth", () => ({
+  authMeta: () => ({}),
+}));
+
+const PROFILE = ProfileId.parse("0192f3a4-7c1e-7b2a-9d4e-3f5a6b7c8d20");
+const SESSION = SessionId.parse("0192f3a4-7c1e-7b2a-9d4e-3f5a6b7c8d21");
+const DEVICE = DeviceId.parse("0192f3a4-7c1e-7b2a-9d4e-3f5a6b7c8d22");
+const CRED = CredentialId.parse("0192f3a4-7c1e-7b2a-9d4e-3f5a6b7c8d23");
+const PRINCIPAL = PrincipalId.parse("0192f3a4-7c1e-7b2a-9d4e-3f5a6b7c8d24");
+const EMAIL = ProfileEmailId.parse("0192f3a4-7c1e-7b2a-9d4e-3f5a6b7c8d25");
+const MALFORMED = { value: new Uint8Array(15) };
+
+/** The RPC `name` answers `response` once. */
+function answers(name: string, response: object) {
+  rpc[name] ??= vi.fn();
+  rpc[name].mockResolvedValueOnce({ response });
+}
+
+/** The request the RPC `name` was last called with. */
+function sent(name: string): unknown {
+  return rpc[name].mock.calls.at(-1)?.[0];
+}
+
+beforeEach(() => {
+  for (const fn of Object.values(rpc)) fn.mockReset();
+});
+
+describe("own listings", () => {
+  // Regression: the page sent the BFF subject as its ProfileId. A
+  // self-service listing names no Profile; the server resolves the
+  // caller's own from its session.
+  it("names no Profile", async () => {
+    answers("listSessions", { sessions: [] });
+    answers("listCredentials", { credentials: [] });
+    answers("listPrincipals", { principals: [] });
+    await fetchSessions();
+    await fetchCredentials();
+    await fetchPrincipals();
+    expect(sent("listSessions")).toEqual({});
+    expect(sent("listCredentials")).toEqual({});
+    expect(sent("listPrincipals")).toEqual({});
+  });
+
+  it("reads each listed reference", async () => {
+    answers("listSessions", {
+      sessions: [
+        { id: SESSION.toWire(), deviceId: DEVICE.toWire() },
+        { id: SESSION.toWire() },
+      ],
+    });
+    const [onDevice, without] = await fetchSessions();
+    expect(onDevice.id.equals(SESSION)).toBe(true);
+    expect(onDevice.deviceId?.equals(DEVICE)).toBe(true);
+    expect(without.deviceId).toBeUndefined();
+
+    answers("listPrincipals", {
+      principals: [{ id: PRINCIPAL.toWire(), sourceEmailId: EMAIL.toWire() }],
+    });
+    const [principal] = await fetchPrincipals();
+    expect(principal.id.equals(PRINCIPAL)).toBe(true);
+    expect(principal.sourceEmailId?.equals(EMAIL)).toBe(true);
+  });
+
+  // An answer that owes a reference and carries a missing or malformed one
+  // fails here, not on a page that would act on it.
+  it("refuses a missing or malformed reference", async () => {
+    answers("listCredentials", { credentials: [{}] });
+    await expect(fetchCredentials()).rejects.toBeInstanceOf(MissingIdError);
+    answers("listSessions", { sessions: [{ id: MALFORMED }] });
+    await expect(fetchSessions()).rejects.toBeInstanceOf(IdError);
+    answers("listPrincipals", {
+      principals: [{ id: PRINCIPAL.toWire(), sourceEmailId: MALFORMED }],
+    });
+    await expect(fetchPrincipals()).rejects.toBeInstanceOf(IdError);
+  });
+});
+
+describe("profile", () => {
+  it("updates the profile it fetched, by its typed id", async () => {
+    answers("getCurrentProfile", { profile: { id: PROFILE.toWire() } });
+    const own = await fetchCurrentProfile();
+    expect(own.id.equals(PROFILE)).toBe(true);
+
+    answers("updateProfile", { profile: { id: PROFILE.toWire() } });
+    await updateProfile(own.id, { givenName: "Alicia" });
+    expect(sent("updateProfile")).toMatchObject({
+      id: { value: PROFILE.toBytes() },
+      givenName: "Alicia",
+    });
+  });
+
+  it("refuses an answer without its profile", async () => {
+    answers("getCurrentProfile", {});
+    await expect(fetchCurrentProfile()).rejects.toBeInstanceOf(TypeError);
+  });
+});
+
+describe("record actions", () => {
+  it("name each record by its binary identifier", async () => {
+    answers("revokeSession", {});
+    await revokeSession(SESSION);
+    expect(sent("revokeSession")).toEqual({
+      sessionId: { value: SESSION.toBytes() },
+    });
+
+    answers("revokeCredential", {});
+    await revokeCredential(CRED);
+    expect(sent("revokeCredential")).toEqual({
+      credentialId: { value: CRED.toBytes() },
+    });
+
+    answers("updateCredential", { credential: { id: CRED.toWire() } });
+    const renamed = await updateCredentialLabel(CRED, "laptop");
+    expect(sent("updateCredential")).toEqual({
+      credentialId: { value: CRED.toBytes() },
+      label: "laptop",
+    });
+    expect(renamed.id.equals(CRED)).toBe(true);
+
+    answers("removePrincipal", {});
+    await removePrincipal(PRINCIPAL);
+    expect(sent("removePrincipal")).toEqual({
+      principalId: { value: PRINCIPAL.toBytes() },
+    });
+  });
+});

package/src/profile/composables/useIdentityApi.ts

@@ -4,15 +4,28 @@
  * The account API through the BFF (`getAccountTransport`), which adds the
  * session's Bearer token. Shared between profile-ui-ce, profile-ui-ee, and
  * frontend.
+ *
+ * Self-service listings name no Profile: the server resolves the caller's
+ * own from its session, so the page never needs its own ProfileId.
  */
 import type { RpcTransport } from "@protobuf-ts/runtime-rpc";
+import {
+  CredentialId,
+  DeviceId,
+  PrincipalId,
+  ProfileEmailId,
+  ProfileId,
+  SessionId,
+  optional,
+  required,
+} from "@structured-id/ids";
 import { getAccountTransport } from "../../index";
 import { IdentityServiceClient } from "@structured-id/proto/sid/v1/identity/identity.client";
 import {
-  type Profile,
-  type Session,
-  type Credential,
-  type Principal,
+  type Profile as WireProfile,
+  type Session as WireSession,
+  type Credential as WireCredential,
+  type Principal as WirePrincipal,
   ProfileStatus,
   PrincipalType,
   CredentialType,
@@ -20,6 +33,7 @@ import {
 } from "@structured-id/proto/sid/v1/identity/identity";
 import { Timestamp } from "@structured-id/proto/google/protobuf/timestamp";
 import { authMeta } from "../auth";
+import type { WithId } from "./useAuthApi";
 
 function client(transport?: RpcTransport): IdentityServiceClient {
   return new IdentityServiceClient(transport ?? getAccountTransport());
@@ -27,22 +41,36 @@ function client(transport?: RpcTransport): IdentityServiceClient {
 
 // ── Profile ──
 
-export type { Profile, Principal };
+/** A Profile as answered, its id read into a typed identifier. */
+export type Profile = WithId<WireProfile, "id", ProfileId>;
+
+function profile(wire: WireProfile | undefined): Profile {
+  if (!wire) throw new TypeError("the answer carries no profile");
+  return { ...wire, id: required(ProfileId, wire.id) };
+}
 
-export async function fetchCurrentProfile(): Promise<Profile> {
-  const { response } = await client().getCurrentProfile(
+/**
+ * The signed-in user's own profile. `transport`: the sign-in surface's
+ * transport when a sign-in step reads it; the account API otherwise.
+ */
+export async function fetchCurrentProfile(
+  transport?: RpcTransport,
+): Promise<Profile> {
+  const { response } = await client(transport).getCurrentProfile(
     {},
     { meta: authMeta() },
   );
-  return response.profile!;
+  return profile(response.profile);
 }
 
 /**
+ * Update the profile `id` (the one {@link fetchCurrentProfile} answered).
+ *
  * `transport`: the sign-in surface's transport when a sign-in step (a
  * required profile update) makes the call; the account API otherwise.
  */
 export async function updateProfile(
-  id: string,
+  id: ProfileId,
   update: {
     givenName?: string;
     familyName?: string;
@@ -53,7 +81,7 @@ export async function updateProfile(
 ): Promise<Profile> {
   const { response } = await client(transport).updateProfile(
     {
-      id,
+      id: id.toWire(),
       givenName: update.givenName,
       familyName: update.familyName,
       middleName: update.middleName,
@@ -61,66 +89,93 @@ export async function updateProfile(
     },
     { meta: authMeta() },
   );
-  return response.profile!;
+  return profile(response.profile);
 }
 
 // ── Sessions ──
 
-export type { Session };
+/** A session as answered, with its own and its device's typed ids. */
+export type Session = WithId<
+  WithId<WireSession, "id", SessionId>,
+  "deviceId",
+  DeviceId | undefined
+>;
+
+/** The caller's own sessions. */
+export async function fetchSessions(): Promise<Session[]> {
+  const { response } = await client().listSessions({}, { meta: authMeta() });
+  return response.sessions.map((s) => ({
+    ...s,
+    id: required(SessionId, s.id),
+    deviceId: optional(DeviceId, s.deviceId),
+  }));
+}
 
-export async function fetchSessions(profileId: string): Promise<Session[]> {
-  const { response } = await client().listSessions(
-    { profileId },
+export async function revokeSession(id: SessionId): Promise<void> {
+  await client().revokeSession(
+    { sessionId: id.toWire() },
     { meta: authMeta() },
   );
-  return response.sessions;
-}
-
-export async function revokeSession(sessionId: string): Promise<void> {
-  await client().revokeSession({ sessionId }, { meta: authMeta() });
 }
 
 // ── Credentials ──
 
-export type { Credential };
+/** A credential as answered, its id read into a typed identifier. */
+export type Credential = WithId<WireCredential, "id", CredentialId>;
 
-export async function fetchCredentials(
-  profileId: string,
-): Promise<Credential[]> {
-  const { response } = await client().listCredentials(
-    { profileId },
-    { meta: authMeta() },
-  );
-  return response.credentials;
+function credential(wire: WireCredential | undefined): Credential {
+  if (!wire) throw new TypeError("the answer carries no credential");
+  return { ...wire, id: required(CredentialId, wire.id) };
 }
 
-export async function revokeCredential(credentialId: string): Promise<void> {
-  await client().revokeCredential({ credentialId }, { meta: authMeta() });
+/** The caller's own credentials. */
+export async function fetchCredentials(): Promise<Credential[]> {
+  const { response } = await client().listCredentials({}, { meta: authMeta() });
+  return response.credentials.map(credential);
+}
+
+export async function revokeCredential(id: CredentialId): Promise<void> {
+  await client().revokeCredential(
+    { credentialId: id.toWire() },
+    { meta: authMeta() },
+  );
 }
 
 export async function updateCredentialLabel(
-  credentialId: string,
+  id: CredentialId,
   label: string,
 ): Promise<Credential> {
   const { response } = await client().updateCredential(
-    { credentialId, label },
+    { credentialId: id.toWire(), label },
     { meta: authMeta() },
   );
-  return response.credential!;
+  return credential(response.credential);
 }
 
 // ── Principals ──
 
-export async function fetchPrincipals(profileId: string): Promise<Principal[]> {
-  const { response } = await client().listPrincipals(
-    { profileId },
-    { meta: authMeta() },
-  );
-  return response.principals;
+/** A login handle as answered, with its own and its contact's typed ids. */
+export type Principal = WithId<
+  WithId<WirePrincipal, "id", PrincipalId>,
+  "sourceEmailId",
+  ProfileEmailId | undefined
+>;
+
+/** The caller's own login handles. */
+export async function fetchPrincipals(): Promise<Principal[]> {
+  const { response } = await client().listPrincipals({}, { meta: authMeta() });
+  return response.principals.map((p) => ({
+    ...p,
+    id: required(PrincipalId, p.id),
+    sourceEmailId: optional(ProfileEmailId, p.sourceEmailId),
+  }));
 }
 
-export async function removePrincipal(principalId: string): Promise<void> {
-  await client().removePrincipal({ principalId }, { meta: authMeta() });
+export async function removePrincipal(id: PrincipalId): Promise<void> {
+  await client().removePrincipal(
+    { principalId: id.toWire() },
+    { meta: authMeta() },
+  );
 }
 
 // Re-export enums and Timestamp for convenience

package/src/profile/composables/useLoginSuccess.test.ts

@@ -101,7 +101,7 @@ describe("useLoginSuccess (BFF cookie mode)", () => {
 
   it("calls checkBffSession and populates auth store on success", async () => {
     mockCheckBffSession.mockResolvedValue({
-      sub: "profile-uuid-1",
+      sub: "subject-1",
       name: "Alice Smith",
       email: "alice@example.com",
       preferred_username: "alice",
@@ -114,7 +114,6 @@ describe("useLoginSuccess (BFF cookie mode)", () => {
 
     expect(mockCheckBffSession).toHaveBeenCalled();
     expect(auth.isAuthenticated).toBe(true);
-    expect(auth.profileId).toBe("profile-uuid-1");
     expect(auth.displayName).toBe("Alice Smith");
     expect(auth.email).toBe("alice@example.com");
   });

package/src/profile/composables/useSecurityLevel.test.ts

@@ -20,8 +20,6 @@ function makeCred(
   opts?: { attachment?: AuthenticatorAttachment; backupState?: boolean },
 ): Credential {
   const cred: Credential = {
-    id: "cred-1",
-    profileId: "",
     type,
     data: new Uint8Array(),
     info: { oneofKind: undefined },

package/src/stores/auth.test.ts

@@ -11,7 +11,6 @@ describe("useAuthStore (BFF cookie session)", () => {
     const store = useAuthStore();
     expect(store.isAuthenticated).toBe(false);
     expect(store.sessionValid).toBe(false);
-    expect(store.profileId).toBeNull();
     expect(store.displayName).toBeNull();
     expect(store.email).toBeNull();
   });
@@ -19,7 +18,7 @@ describe("useAuthStore (BFF cookie session)", () => {
   it("setBffSession sets sessionValid and profile data", () => {
     const store = useAuthStore();
     store.setBffSession({
-      sub: "profile-uuid-123",
+      sub: "subject-123",
       email: "alice@example.com",
       name: "Alice Smith",
       preferred_username: "alice",
@@ -28,18 +27,20 @@ describe("useAuthStore (BFF cookie session)", () => {
 
     expect(store.isAuthenticated).toBe(true);
     expect(store.sessionValid).toBe(true);
-    expect(store.profileId).toBe("profile-uuid-123");
     expect(store.displayName).toBe("Alice Smith");
     expect(store.email).toBe("alice@example.com");
     expect(store.preferredUsername).toBe("alice");
   });
 
-  it("setBffSession handles null/missing optional fields", () => {
+  // Regression: the userinfo `sub` was kept as the user's ProfileId, though
+  // it is the subject this application knows the user by. The store keeps
+  // no Profile id at all.
+  it("never reads the subject as a Profile id", () => {
     const store = useAuthStore();
-    store.setBffSession({ sub: "uuid-456" });
+    store.setBffSession({ sub: "subject-456" });
 
     expect(store.isAuthenticated).toBe(true);
-    expect(store.profileId).toBe("uuid-456");
+    expect("profileId" in store).toBe(false);
     expect(store.displayName).toBeNull();
     expect(store.email).toBeNull();
     expect(store.preferredUsername).toBeNull();
@@ -47,15 +48,13 @@ describe("useAuthStore (BFF cookie session)", () => {
 
   it("setProfile updates display data", () => {
     const store = useAuthStore();
-    store.setBffSession({ sub: "uuid-1" });
+    store.setBffSession({ sub: "subject-1" });
 
     store.setProfile({
-      id: "uuid-1",
       displayName: "Bob Jones",
       email: "bob@example.com",
     });
 
-    expect(store.profileId).toBe("uuid-1");
     expect(store.displayName).toBe("Bob Jones");
     expect(store.email).toBe("bob@example.com");
   });
@@ -63,7 +62,7 @@ describe("useAuthStore (BFF cookie session)", () => {
   it("logout clears all state", () => {
     const store = useAuthStore();
     store.setBffSession({
-      sub: "uuid-1",
+      sub: "subject-1",
       name: "Alice",
       email: "alice@example.com",
       preferred_username: "alice",
@@ -73,7 +72,6 @@ describe("useAuthStore (BFF cookie session)", () => {
 
     expect(store.isAuthenticated).toBe(false);
     expect(store.sessionValid).toBe(false);
-    expect(store.profileId).toBeNull();
     expect(store.displayName).toBeNull();
     expect(store.email).toBeNull();
     expect(store.preferredUsername).toBeNull();

package/src/stores/auth.ts

@@ -24,9 +24,11 @@ export const useAuthStore = defineStore("auth", () => {
   const sessionId = ref<string | null>(null);
 
   // ── Profile info (populated from BFF /auth/userinfo) ──────────────
+  //
+  // No Profile id: the userinfo `sub` is the subject this application
+  // knows the user by, not a ProfileId, and self-service calls name no
+  // Profile at all.
 
-  /** Profile ID of the authenticated user (= sub from BFF userinfo). */
-  const profileId = ref<string | null>(null);
   /** Display name. */
   const displayName = ref<string | null>(null);
   /** Email address. */
@@ -46,7 +48,6 @@ export const useAuthStore = defineStore("auth", () => {
    */
   function setBffSession(info: BffUserInfo): void {
     sessionValid.value = true;
-    profileId.value = info.sub;
     displayName.value = info.name ?? null;
     email.value = info.email ?? null;
     preferredUsername.value = info.preferred_username ?? null;
@@ -56,11 +57,9 @@ export const useAuthStore = defineStore("auth", () => {
    * Update profile display data (e.g., after profile edit).
    */
   function setProfile(profile: {
-    id: string;
     displayName?: string | null;
     email?: string | null;
   }): void {
-    profileId.value = profile.id;
     displayName.value = profile.displayName ?? null;
     email.value = profile.email ?? null;
   }
@@ -71,7 +70,6 @@ export const useAuthStore = defineStore("auth", () => {
   function logout(): void {
     sessionValid.value = false;
     sessionId.value = null;
-    profileId.value = null;
     displayName.value = null;
     email.value = null;
     preferredUsername.value = null;
@@ -80,7 +78,6 @@ export const useAuthStore = defineStore("auth", () => {
   return {
     sessionValid,
     sessionId,
-    profileId,
     displayName,
     email,
     preferredUsername,

package/src/types/auth.ts

@@ -4,8 +4,6 @@ export interface AuthState {
   sessionValid: boolean;
   /** Server-side session identifier (for step-up, session management). */
   sessionId: string | null;
-  /** Profile ID of the authenticated user (UUID). */
-  profileId: string | null;
   /** Display name of the authenticated user. */
   displayName: string | null;
   /** Email address (may be null if not in session claims). */