@jskit-ai/workspaces-web 0.1.14 → 0.1.15

package/package.descriptor.mjs

@@ -1,7 +1,7 @@
 export default Object.freeze({
   packageVersion: 1,
   packageId: "@jskit-ai/workspaces-web",
-  version: "0.1.14",
+  version: "0.1.15",
   kind: "runtime",
   description: "Workspace web module: workspace selector, tools widget, workspace surfaces, and members/settings UI.",
   dependsOn: [
@@ -33,19 +33,30 @@ export default Object.freeze({
   metadata: {
     apiSummary: {
       surfaces: [
+        {
+          subpath: "./client",
+          summary: "Exports workspaces-web client provider registration surface."
+        },
         {
           subpath: "./client/providers/WorkspacesWebClientProvider",
           summary: "Exports workspaces-web client provider class."
+        },
+        {
+          subpath: "./client/composables/useWorkspaceRouteContext",
+          summary: "Exports workspace route context composable."
         }
       ],
       containerTokens: {
         server: [],
         client: [
-          "users.web.workspace.selector",
-          "users.web.workspace.tools.widget",
-          "users.web.workspace-settings.menu-item",
-          "users.web.workspace-members.menu-item",
-          "users.web.members-admin.element"
+          "workspaces.web.profile.menu.surface-switch-item",
+          "workspaces.web.workspace.selector",
+          "workspaces.web.workspace.tools.widget",
+          "workspaces.web.workspace-settings.menu-item",
+          "workspaces.web.workspace-members.menu-item",
+          "workspaces.web.members-admin.element",
+          "workspaces.web.bootstrap-placement.runtime",
+          "workspaces.web.account-settings.section.invites"
         ]
       }
     },
@@ -61,46 +72,55 @@ export default Object.freeze({
         ],
         contributions: [
           {
-            id: "users.workspace.selector",
+            id: "workspaces.profile.menu.surface-switch",
+            target: "auth-profile-menu:primary-menu",
+            surfaces: ["*"],
+            order: 100,
+            componentToken: "workspaces.web.profile.menu.surface-switch-item",
+            when: "auth.authenticated === true",
+            source: "mutations.text#workspaces-web-profile-surface-switch-placement"
+          },
+          {
+            id: "workspaces.workspace.selector",
             target: "shell-layout:top-left",
             surfaces: ["*"],
             order: 200,
-            componentToken: "users.web.workspace.selector",
+            componentToken: "workspaces.web.workspace.selector",
             when: "auth.authenticated === true",
-            source: "mutations.text#users-web-placement-block"
+            source: "mutations.text#workspaces-web-placement-block"
           },
           {
-            id: "users.account.invites.cue",
+            id: "workspaces.account.invites.cue",
             target: "shell-layout:top-right",
             surfaces: ["*"],
             order: 850,
             componentToken: "local.main.account.pending-invites.cue",
             when: "auth.authenticated === true",
-            source: "mutations.text#users-web-placement-block"
+            source: "mutations.text#workspaces-web-placement-block"
           },
           {
-            id: "users.workspace.tools.widget",
+            id: "workspaces.workspace.tools.widget",
             target: "shell-layout:top-right",
             surfaces: ["admin"],
             order: 900,
-            componentToken: "users.web.workspace.tools.widget",
-            source: "mutations.text#users-web-placement-block"
+            componentToken: "workspaces.web.workspace.tools.widget",
+            source: "mutations.text#workspaces-web-placement-block"
           },
           {
-            id: "users.workspace.menu.workspace-settings",
+            id: "workspaces.workspace.menu.workspace-settings",
             target: "workspace-tools:primary-menu",
             surfaces: ["admin"],
             order: 100,
-            componentToken: "users.web.workspace-settings.menu-item",
-            source: "mutations.text#users-web-placement-block"
+            componentToken: "workspaces.web.workspace-settings.menu-item",
+            source: "mutations.text#workspaces-web-placement-block"
           },
           {
-            id: "users.workspace.menu.members",
+            id: "workspaces.workspace.menu.members",
             target: "workspace-tools:primary-menu",
             surfaces: ["admin"],
             order: 200,
-            componentToken: "users.web.workspace-members.menu-item",
-            source: "mutations.text#users-web-placement-block"
+            componentToken: "workspaces.web.workspace-members.menu-item",
+            source: "mutations.text#workspaces-web-placement-block"
           },
         ]
       }
@@ -109,8 +129,9 @@ export default Object.freeze({
   mutations: {
     dependencies: {
       runtime: {
-        "@jskit-ai/workspaces-core": "0.1.14",
-        "@jskit-ai/users-web": "0.1.53"
+        "@jskit-ai/workspaces-core": "0.1.15",
+        "@jskit-ai/users-web": "0.1.54",
+        "vuetify": "^4.0.0"
       },
       dev: {}
     },
@@ -243,11 +264,26 @@ export default Object.freeze({
         op: "append-text",
         file: "src/placement.js",
         position: "bottom",
-        skipIfContains: "id: \"users.workspace.selector\"",
-        value: "\naddPlacement({\n  id: \"users.workspace.selector\",\n  target: \"shell-layout:top-left\",\n  surfaces: [\"*\"],\n  order: 200,\n  componentToken: \"users.web.workspace.selector\",\n  props: {\n    allowOnNonWorkspaceSurface: true,\n    targetSurfaceId: \"app\"\n  },\n  when: ({ auth }) => {\n    return Boolean(auth?.authenticated);\n  }\n});\n\naddPlacement({\n  id: \"users.account.invites.cue\",\n  target: \"shell-layout:top-right\",\n  surfaces: [\"*\"],\n  order: 850,\n  componentToken: \"local.main.account.pending-invites.cue\",\n  when: ({ auth }) => Boolean(auth?.authenticated)\n});\n\naddPlacement({\n  id: \"users.workspace.tools.widget\",\n  target: \"shell-layout:top-right\",\n  surfaces: [\"admin\"],\n  order: 900,\n  componentToken: \"users.web.workspace.tools.widget\"\n});\n\naddPlacement({\n  id: \"users.workspace.menu.workspace-settings\",\n  target: \"workspace-tools:primary-menu\",\n  surfaces: [\"admin\"],\n  order: 100,\n  componentToken: \"users.web.workspace-settings.menu-item\"\n});\n\naddPlacement({\n  id: \"users.workspace.menu.members\",\n  target: \"workspace-tools:primary-menu\",\n  surfaces: [\"admin\"],\n  order: 200,\n  componentToken: \"users.web.workspace-members.menu-item\"\n});\n",
+        skipIfContains: "id: \"workspaces.profile.menu.surface-switch\"",
+        value:
+          "\naddPlacement({\n  id: \"workspaces.profile.menu.surface-switch\",\n  target: \"auth-profile-menu:primary-menu\",\n  surfaces: [\"*\"],\n  order: 100,\n  componentToken: \"workspaces.web.profile.menu.surface-switch-item\",\n  when: ({ auth }) => Boolean(auth?.authenticated)\n});\n",
+        reason: "Append workspaces-web profile surface switch placement into app-owned placement registry.",
+        category: "workspaces-web",
+        id: "workspaces-web-profile-surface-switch-placement",
+        when: {
+          config: "tenancyMode",
+          in: ["personal", "workspaces"]
+        }
+      },
+      {
+        op: "append-text",
+        file: "src/placement.js",
+        position: "bottom",
+        skipIfContains: "id: \"workspaces.workspace.selector\"",
+        value: "\naddPlacement({\n  id: \"workspaces.workspace.selector\",\n  target: \"shell-layout:top-left\",\n  surfaces: [\"*\"],\n  order: 200,\n  componentToken: \"workspaces.web.workspace.selector\",\n  props: {\n    allowOnNonWorkspaceSurface: true,\n    targetSurfaceId: \"app\"\n  },\n  when: ({ auth }) => {\n    return Boolean(auth?.authenticated);\n  }\n});\n\naddPlacement({\n  id: \"workspaces.account.invites.cue\",\n  target: \"shell-layout:top-right\",\n  surfaces: [\"*\"],\n  order: 850,\n  componentToken: \"local.main.account.pending-invites.cue\",\n  when: ({ auth }) => Boolean(auth?.authenticated)\n});\n\naddPlacement({\n  id: \"workspaces.workspace.tools.widget\",\n  target: \"shell-layout:top-right\",\n  surfaces: [\"admin\"],\n  order: 900,\n  componentToken: \"workspaces.web.workspace.tools.widget\"\n});\n\naddPlacement({\n  id: \"workspaces.workspace.menu.workspace-settings\",\n  target: \"workspace-tools:primary-menu\",\n  surfaces: [\"admin\"],\n  order: 100,\n  componentToken: \"workspaces.web.workspace-settings.menu-item\"\n});\n\naddPlacement({\n  id: \"workspaces.workspace.menu.members\",\n  target: \"workspace-tools:primary-menu\",\n  surfaces: [\"admin\"],\n  order: 200,\n  componentToken: \"workspaces.web.workspace-members.menu-item\"\n});\n",
         reason: "Append workspace placement entries into app-owned placement registry.",
         category: "workspaces-web",
-        id: "users-web-placement-block",
+        id: "workspaces-web-placement-block",
         when: {
           config: "tenancyMode",
           in: ["personal", "workspaces"]

package/package.json

@@ -1,15 +1,25 @@
 {
   "name": "@jskit-ai/workspaces-web",
-  "version": "0.1.14",
+  "version": "0.1.15",
   "type": "module",
   "scripts": {
     "test": "node --test"
   },
   "exports": {
     "./client": "./src/client/index.js",
-    "./client/providers/WorkspacesWebClientProvider": "./src/client/providers/WorkspacesWebClientProvider.js"
+    "./client/providers/WorkspacesWebClientProvider": "./src/client/providers/WorkspacesWebClientProvider.js",
+    "./client/components/WorkspaceMembersClientElement": "./src/client/components/WorkspaceMembersClientElement.vue",
+    "./client/composables/useWorkspaceRouteContext": "./src/client/composables/useWorkspaceRouteContext.js"
   },
   "dependencies": {
-    "@jskit-ai/users-web": "0.1.53"
+    "@tanstack/vue-query": "5.92.12",
+    "@mdi/js": "^7.4.47",
+    "@jskit-ai/http-runtime": "0.1.38",
+    "@jskit-ai/kernel": "0.1.39",
+    "@jskit-ai/shell-web": "0.1.38",
+    "@jskit-ai/users-core": "0.1.49",
+    "@jskit-ai/users-web": "0.1.54",
+    "@jskit-ai/workspaces-core": "0.1.15",
+    "vuetify": "^4.0.0"
   }
 }

package/src/client/account-settings/accountSettingsInvitesRuntime.js

@@ -0,0 +1,88 @@
+import { resolveErrorStatusCode } from "../support/runtimeNormalization.js";
+
+function createAccountSettingsInvitesRuntime({
+  invitesAvailable,
+  isResolvingInvite,
+  inviteAction,
+  redeemInviteModel,
+  redeemInviteCommand,
+  pendingInvites,
+  pendingInvitesModel,
+  pendingInvitesView,
+  openWorkspace,
+  reportAccountFeedback
+} = {}) {
+  async function respondToInvite(invite, decision) {
+    if (!invitesAvailable.value) {
+      return;
+    }
+
+    const token = String(invite?.token || "").trim();
+    const normalizedDecision = String(decision || "").trim().toLowerCase();
+    if (!token || (normalizedDecision !== "accept" && normalizedDecision !== "refuse")) {
+      return;
+    }
+    if (isResolvingInvite.value) {
+      return;
+    }
+
+    inviteAction.value = {
+      token,
+      decision: normalizedDecision
+    };
+    redeemInviteModel.token = token;
+    redeemInviteModel.decision = normalizedDecision;
+
+    try {
+      await redeemInviteCommand.run();
+      pendingInvitesModel.pendingInvites = pendingInvites.value.filter((entry) => entry.token !== token);
+      await pendingInvitesView.refresh();
+
+      if (normalizedDecision === "accept") {
+        const nextWorkspaceSlug = String(invite?.workspaceSlug || "").trim();
+        if (nextWorkspaceSlug) {
+          await openWorkspace(nextWorkspaceSlug);
+          return;
+        }
+      }
+
+      reportAccountFeedback({
+        message: normalizedDecision === "accept" ? "Invitation accepted." : "Invitation refused.",
+        severity: "success",
+        channel: "snackbar",
+        dedupeKey: `users-web.account-settings-runtime:invite-${normalizedDecision}:${token}`
+      });
+    } catch (error) {
+      const statusCode = resolveErrorStatusCode(error);
+      const fallbackMessage = normalizedDecision === "accept"
+        ? "Unable to accept invitation."
+        : "Unable to refuse invitation.";
+      reportAccountFeedback({
+        message: statusCode === 404
+          ? "Invitation no longer exists."
+          : String(error?.message || fallbackMessage),
+        severity: "error",
+        channel: "banner",
+        dedupeKey: `users-web.account-settings-runtime:invite-${normalizedDecision}-error:${token}`
+      });
+    } finally {
+      inviteAction.value = {
+        token: "",
+        decision: ""
+      };
+      redeemInviteModel.token = "";
+      redeemInviteModel.decision = "";
+    }
+  }
+
+  return Object.freeze({
+    accept(invite) {
+      return respondToInvite(invite, "accept");
+    },
+    refuse(invite) {
+      return respondToInvite(invite, "refuse");
+    }
+  });
+}
+
+export { createAccountSettingsInvitesRuntime };

package/src/client/account-settings/useAccountSettingsInvitesSectionRuntime.js

@@ -0,0 +1,217 @@
+import { computed, reactive, ref } from "vue";
+import { useRoute, useRouter } from "vue-router";
+import {
+  useWebPlacementContext,
+  resolveSurfaceNavigationTargetFromPlacementContext
+} from "@jskit-ai/shell-web/client/placement";
+import { useShellWebErrorRuntime } from "@jskit-ai/shell-web/client/error";
+import { ROUTE_VISIBILITY_PUBLIC } from "@jskit-ai/kernel/shared/support/visibility";
+import { useCommand } from "@jskit-ai/users-web/client/composables/useCommand";
+import { usePaths } from "@jskit-ai/users-web/client/composables/usePaths";
+import { useView } from "@jskit-ai/users-web/client/composables/useView";
+import { normalizeRecordId } from "@jskit-ai/kernel/shared/support/normalize";
+import { useWorkspaceSurfaceId } from "../composables/useWorkspaceSurfaceId.js";
+import { createAccountSettingsInvitesRuntime } from "./accountSettingsInvitesRuntime.js";
+
+function normalizePendingInvite(entry) {
+  if (!entry || typeof entry !== "object") {
+    return null;
+  }
+
+  const id = normalizeRecordId(entry.id, { fallback: null });
+  const workspaceId = normalizeRecordId(entry.workspaceId, { fallback: null });
+  if (!id || !workspaceId) {
+    return null;
+  }
+
+  const workspaceSlug = String(entry.workspaceSlug || "").trim();
+  if (!workspaceSlug) {
+    return null;
+  }
+
+  const token = String(entry.token || "").trim();
+  if (!token) {
+    return null;
+  }
+
+  return {
+    id,
+    token,
+    workspaceId,
+    workspaceSlug,
+    workspaceName: String(entry.workspaceName || workspaceSlug).trim() || workspaceSlug,
+    workspaceAvatarUrl: String(entry.workspaceAvatarUrl || "").trim(),
+    roleSid: String(entry.roleSid || "member").trim().toLowerCase() || "member",
+    status: String(entry.status || "pending").trim().toLowerCase() || "pending",
+    expiresAt: String(entry.expiresAt || "").trim()
+  };
+}
+
+function useAccountSettingsInvitesSectionRuntime() {
+  const route = useRoute();
+  const router = useRouter();
+  const { context: placementContext } = useWebPlacementContext();
+  const errorRuntime = useShellWebErrorRuntime();
+  const paths = usePaths();
+
+  const pendingInvitesQueryKey = ["workspaces-web", "account-settings", "pending-invites"];
+  const pendingInvitesModel = reactive({
+    pendingInvites: [],
+    workspaceInvitesEnabled: false
+  });
+  const inviteAction = ref({
+    token: "",
+    decision: ""
+  });
+  const redeemInviteModel = reactive({
+    token: "",
+    decision: ""
+  });
+
+  function reportAccountFeedback({
+    message,
+    severity = "error",
+    channel = "banner",
+    dedupeKey = ""
+  } = {}) {
+    const normalizedMessage = String(message || "").trim();
+    if (!normalizedMessage) {
+      return;
+    }
+
+    errorRuntime.report({
+      source: "workspaces-web.account-settings-invites",
+      message: normalizedMessage,
+      severity,
+      channel,
+      dedupeKey: dedupeKey || `workspaces-web.account-settings-invites:${severity}:${normalizedMessage}`,
+      dedupeWindowMs: 3000
+    });
+  }
+
+  const pendingInvitesView = useView({
+    ownershipFilter: ROUTE_VISIBILITY_PUBLIC,
+    apiSuffix: "/bootstrap",
+    queryKeyFactory: () => pendingInvitesQueryKey,
+    realtime: {
+      event: "workspace.invitations.pending.changed"
+    },
+    fallbackLoadError: "Unable to load invitations.",
+    model: pendingInvitesModel,
+    mapLoadedToModel: (model, payload = {}) => {
+      model.workspaceInvitesEnabled = payload?.app?.features?.workspaceInvites === true;
+      model.pendingInvites = model.workspaceInvitesEnabled
+        ? (Array.isArray(payload?.pendingInvites) ? payload.pendingInvites : [])
+          .map(normalizePendingInvite)
+          .filter(Boolean)
+        : [];
+    }
+  });
+
+  const redeemInviteCommand = useCommand({
+    ownershipFilter: ROUTE_VISIBILITY_PUBLIC,
+    apiSuffix: "/workspace/invitations/redeem",
+    writeMethod: "POST",
+    fallbackRunError: "Unable to respond to invitation.",
+    suppressSuccessMessage: true,
+    model: redeemInviteModel,
+    buildRawPayload: (model) => ({
+      token: String(model.token || "").trim(),
+      decision: String(model.decision || "").trim().toLowerCase()
+    }),
+    messages: {
+      error: "Unable to respond to invitation."
+    }
+  });
+
+  const invitesAvailable = computed(() => pendingInvitesModel.workspaceInvitesEnabled === true);
+  const loadingInvites = computed(() => Boolean(pendingInvitesView.isLoading));
+  const refreshingInvites = computed(() => Boolean(pendingInvitesView.isRefetching));
+  const pendingInvites = computed(() =>
+    Array.isArray(pendingInvitesModel.pendingInvites) ? pendingInvitesModel.pendingInvites : []
+  );
+  const isResolvingInvite = computed(() => Boolean(redeemInviteCommand.isRunning.value));
+
+  const { workspaceSurfaceId } = useWorkspaceSurfaceId({
+    route,
+    placementContext
+  });
+
+  function workspaceHomePath(workspaceSlug) {
+    const normalizedSlug = String(workspaceSlug || "").trim();
+    if (!normalizedSlug || !workspaceSurfaceId.value) {
+      return "";
+    }
+
+    return paths.page("/", {
+      surface: workspaceSurfaceId.value,
+      params: {
+        workspaceSlug: normalizedSlug
+      }
+    });
+  }
+
+  async function openWorkspace(workspaceSlug) {
+    const targetPath = workspaceHomePath(workspaceSlug);
+    if (!targetPath) {
+      reportAccountFeedback({
+        message: "Workspace surface is not configured.",
+        severity: "error",
+        channel: "banner",
+        dedupeKey: "workspaces-web.account-settings-invites:workspace-surface-missing"
+      });
+      return;
+    }
+
+    try {
+      const navigationTarget = resolveSurfaceNavigationTargetFromPlacementContext(placementContext.value, {
+        path: targetPath,
+        surfaceId: workspaceSurfaceId.value
+      });
+      if (navigationTarget.sameOrigin) {
+        await router.push(navigationTarget.href);
+      } else if (typeof window === "object" && window?.location && typeof window.location.assign === "function") {
+        window.location.assign(navigationTarget.href);
+      } else {
+        throw new Error("Cross-origin navigation is unavailable in this environment.");
+      }
+    } catch (error) {
+      reportAccountFeedback({
+        message: String(error?.message || "Unable to open workspace."),
+        severity: "error",
+        channel: "banner",
+        dedupeKey: `workspaces-web.account-settings-invites:open-workspace:${String(workspaceSlug || "").trim()}`
+      });
+    }
+  }
+
+  const invitesRuntime = createAccountSettingsInvitesRuntime({
+    invitesAvailable,
+    isResolvingInvite,
+    inviteAction,
+    redeemInviteModel,
+    redeemInviteCommand,
+    pendingInvites,
+    pendingInvitesModel,
+    pendingInvitesView,
+    openWorkspace,
+    reportAccountFeedback
+  });
+
+  return Object.freeze({
+    isAvailable: invitesAvailable,
+    items: pendingInvites,
+    isLoading: loadingInvites,
+    isRefetching: refreshingInvites,
+    isResolving: isResolvingInvite,
+    action: inviteAction,
+    accept(invite) {
+      return invitesRuntime.accept(invite);
+    },
+    refuse(invite) {
+      return invitesRuntime.refuse(invite);
+    }
+  });
+}
+
+export { useAccountSettingsInvitesSectionRuntime };

package/src/client/components/AccountSettingsInvitesSection.vue

@@ -0,0 +1,72 @@
+<script setup>
+import { useAccountSettingsInvitesSectionRuntime } from "../account-settings/useAccountSettingsInvitesSectionRuntime.js";
+
+const invites = useAccountSettingsInvitesSectionRuntime();
+</script>
+
+<template>
+  <v-card rounded="lg" elevation="0" border>
+    <v-card-item>
+      <v-card-title class="text-subtitle-1">Invitations</v-card-title>
+      <v-card-subtitle>Accept or refuse workspace invitations.</v-card-subtitle>
+    </v-card-item>
+    <v-divider />
+    <v-card-text>
+      <template v-if="invites.isLoading.value">
+        <v-skeleton-loader type="text@2, list-item-two-line@3" />
+      </template>
+
+      <template v-else-if="invites.items.value.length < 1">
+        <v-progress-linear v-if="invites.isRefetching.value" indeterminate class="mb-4" />
+        <p class="text-body-2 text-medium-emphasis mb-0">No pending invitations.</p>
+      </template>
+
+      <template v-else>
+        <v-progress-linear v-if="invites.isRefetching.value" indeterminate class="mb-4" />
+        <v-list density="comfortable" class="pa-0">
+          <v-list-item
+            v-for="invite in invites.items.value"
+            :key="invite.id"
+            :title="invite.workspaceName"
+            :subtitle="`/${invite.workspaceSlug} • role: ${invite.roleSid}`"
+            class="px-0"
+          >
+            <template #prepend>
+              <v-avatar color="warning" size="28">
+                <span class="text-caption font-weight-bold">?</span>
+              </v-avatar>
+            </template>
+            <template #append>
+              <div class="d-flex ga-2">
+                <v-btn
+                  size="small"
+                  variant="text"
+                  color="error"
+                  :loading="invites.action.value.token === invite.token && invites.action.value.decision === 'refuse'"
+                  :disabled="
+                    invites.isRefetching.value || (invites.isResolving.value && invites.action.value.token !== invite.token)
+                  "
+                  @click="invites.refuse(invite)"
+                >
+                  Refuse
+                </v-btn>
+                <v-btn
+                  size="small"
+                  variant="tonal"
+                  color="primary"
+                  :loading="invites.action.value.token === invite.token && invites.action.value.decision === 'accept'"
+                  :disabled="
+                    invites.isRefetching.value || (invites.isResolving.value && invites.action.value.token !== invite.token)
+                  "
+                  @click="invites.accept(invite)"
+                >
+                  Join
+                </v-btn>
+              </div>
+            </template>
+          </v-list-item>
+        </v-list>
+      </template>
+    </v-card-text>
+  </v-card>
+</template>