@7365admin1/layer-common 4.82.1-staging.469 → 4.82.1-staging.471

package/components/Layout/Header.vue

@@ -10,6 +10,8 @@
     application has loaded and the route the router is on. It fetches nothing
     and navigates nowhere; it is a label.
   -->
+  <!-- Seven365 staff view: persistent banner with Exit (only while one is open). -->
+  <StaffViewBanner />
   <v-app-bar
     :height="58"
     flat

package/components/MemberMain.vue

@@ -374,7 +374,7 @@
                       v-model="selectedRole"
                       :items="pickerRoles"
                       item-value="_id"
-                      item-title="name"
+                      :item-title="roleLabel"
                       density="comfortable"
                       :rules="[requiredRule]"
                       :error-messages="
@@ -427,6 +427,7 @@ import {
   safeReturnTo,
   limitedSites,
   withCurrentRole,
+  roleLabel,
 } from "../utils/role";
 import { formatLastActive } from "../utils/last-active";
 import { formatMemberDate, memberAccess, memberPerson } from "../utils/member-row";

package/components/RolePermissionMain.vue

@@ -58,6 +58,8 @@
             else. Two kinds share that list and they are governed differently,
             so the row has to say which it is.
           -->
+          <!-- "Admin · St. Regis Residences": names are unique per site (2026-10-01) -->
+          <template #item.name="{ item }">{{ roleLabel(item) }}</template>
           <template #item.scope="{ item }">
             <StatusChip
               :dot="false"
@@ -164,7 +166,7 @@
                 <v-select
                   v-model="memberReassignments[member._id]"
                   :items="deletionPreview.replacementRoles"
-                  item-title="name"
+                  :item-title="roleLabel"
                   item-value="_id"
                   label="Reassign role"
                   density="comfortable"
@@ -204,7 +206,7 @@
 
 <script setup lang="ts">
 // Relative import: this layer's `utils/` is not auto-imported into consumers.
-import { safeReturnTo, showSiteField } from "../utils/role";
+import { roleLabel, safeReturnTo, showSiteField } from "../utils/role";
 import { holdsPermission } from "../utils/permission-spellings";
 import {
   catalogueForOrg,

package/components/StaffViewBanner.vue

@@ -0,0 +1,67 @@
+<!--
+  "SEVEN365 STAFF VIEW" BANNER (owner, 2026-10-01).
+
+  Shown on every page of every app while this sign-in has a staff view open
+  (the server holds it against the session - see `useStaffView`). It cannot be
+  dismissed: the only ways out are Exit here, or signing out, and both end the
+  view on the server.
+-->
+<template>
+  <v-system-bar
+    v-if="staffView"
+    :height="36"
+    color="warning"
+    class="staff-view-banner"
+    data-test="staff-view-banner"
+    role="status"
+  >
+    <v-icon icon="mdi-shield-account" size="18" class="me-2" />
+    <span class="staff-view-banner__text">
+      Seven365 staff view — {{ staffView.orgName || "Client" }}<template v-if="staffView.siteName"> · {{ staffView.siteName }}</template>
+    </span>
+    <v-spacer />
+    <v-btn
+      size="small"
+      variant="flat"
+      color="surface"
+      :loading="leaving"
+      data-test="staff-view-exit"
+      @click="exit"
+    >
+      Exit
+    </v-btn>
+  </v-system-bar>
+</template>
+
+<script setup lang="ts">
+const { staffView, loadStaffView, exitStaffView } = useStaffView();
+const { APP_ORG } = useRuntimeConfig().public;
+const leaving = ref(false);
+
+onMounted(() => {
+  loadStaffView().catch(() => undefined);
+});
+
+async function exit() {
+  leaving.value = true;
+  try {
+    const org = await exitStaffView();
+    // Back to the console page staff opened it from.
+    window.location.href = `${APP_ORG}/super-admin/client-details${org ? `?org=${org}` : ""}`;
+  } catch {
+    leaving.value = false;
+  }
+}
+</script>
+
+<style scoped>
+.staff-view-banner {
+  font-weight: 600;
+  z-index: 1010;
+}
+.staff-view-banner__text {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+</style>

package/composables/useStaffView.ts

@@ -0,0 +1,49 @@
+/**
+ * "OPEN AS SEVEN365 STAFF" (owner, 2026-10-01).
+ *
+ * The server holds the open view against the session (`staff-view:<sid>`), so
+ * this only READS it - nothing here can open one or widen anything. Read once
+ * per page load; Exit clears it on the server and here.
+ */
+const BASE = "/api/users/staff-access";
+
+/** What a staff member is given inside the client they opened: full setup, like the client's owner. */
+export const STAFF_VIEW_ROLE = Object.freeze({
+  name: "Seven365 staff",
+  permissions: ["*"],
+}) as unknown as TRole;
+
+/** Does the open view cover this route's organisation? */
+export function staffViewCovers(view: TStaffView | null | undefined, org: string): boolean {
+  return !!view?.org && !!org && view.org === org;
+}
+
+export default function useStaffView() {
+  const staffView = useState<TStaffView | null>("staff-view", () => null);
+  const staffViewLoaded = useState<boolean>("staff-view-loaded", () => false);
+
+  async function loadStaffView(force = false): Promise<TStaffView | null> {
+    if (staffViewLoaded.value && !force) return staffView.value;
+    try {
+      const res = await useNuxtApp().$api<{ view?: TStaffView | null }>(`${BASE}/view`, {
+        method: "GET",
+        timeout: 5000,
+      });
+      staffView.value = res?.view ?? null;
+    } catch {
+      // No view is the safe answer: staff simply see what they saw before.
+      staffView.value = null;
+    }
+    staffViewLoaded.value = true;
+    return staffView.value;
+  }
+
+  async function exitStaffView(): Promise<string> {
+    const org = staffView.value?.org ?? "";
+    await useNuxtApp().$api(`${BASE}/view/exit`, { method: "POST" });
+    staffView.value = null;
+    return org;
+  }
+
+  return { staffView, staffViewLoaded, loadStaffView, exitStaffView };
+}

package/package.json

@@ -2,7 +2,7 @@
   "name": "@7365admin1/layer-common",
   "license": "MIT",
   "type": "module",
-  "version": "4.82.1-staging.469",
+  "version": "4.82.1-staging.471",
   "author": "7365admin1",
   "main": "./nuxt.config.ts",
   "//files": "What a consumer extending this layer actually loads. Without this npm ships the whole working tree - the changesets, the CI workflows, the render harness in tools/ and any scratch directory that happened to exist at publish time. Nuxt resolves a layer by directory, so every runtime directory below has to stay listed; adding a new top-level runtime directory means adding it here too.",

package/plugins/API.ts

@@ -1,7 +1,9 @@
 import { isPermissionRefusal } from "../utils/permission-refusal";
+import { accessSuspendedMessage, SIGNIN_NOTICE_COOKIE } from "../utils/access-suspended";
 
 export default defineNuxtPlugin((nuxtApp) => {
   const { cookieConfig } = useRuntimeConfig().public;
+  let signingOut = false;
 
   const api = $fetch.create({
     baseURL: "/",
@@ -32,6 +34,20 @@ export default defineNuxtPlugin((nuxtApp) => {
     // 401 + "You do not have permission ..." (vehicle writes and every other
     // `requireSiteReach` gate). See utils/permission-refusal.ts.
     onResponseError({ response }) {
+      // Every membership suspended (2026-10-01): the server already ended the
+      // session. Sign out here and let the sign-in page say why, once.
+      const suspended = accessSuspendedMessage((response as any)?._data);
+      if (suspended && import.meta.client && !signingOut) {
+        signingOut = true;
+        void nuxtApp.runWithContext(() => {
+          useCookie(SIGNIN_NOTICE_COOKIE, { ...cookieConfig, maxAge: 300 }).value = suspended;
+          for (const name of ["sid", "user", "organization"]) useCookie(name, cookieConfig).value = null;
+          const { APP_MAIN, APP_NAME } = useRuntimeConfig().public as Record<string, string>;
+          if (String(APP_NAME ?? "").toLowerCase() === "main" || !APP_MAIN) return navigateTo("/sign-in");
+          window.location.href = `${APP_MAIN}/sign-in`;
+        });
+        return;
+      }
       if (!isPermissionRefusal(response?.status, (response as any)?._data)) return;
       if (!import.meta.client) return;
       const refresh = (nuxtApp as any).$refreshAppRole;

package/plugins/secure-member.client.ts

@@ -1,5 +1,6 @@
 import { z } from "zod";
 import { routeDenied } from "../utils/module-routes.ts";
+import useStaffView, { STAFF_VIEW_ROLE, staffViewCovers } from "../composables/useStaffView.ts";
 
 const hexSchema = z
   .string()
@@ -63,6 +64,13 @@ export default defineNuxtPlugin(() => {
   const { userAppRole, userAppRoleStatus, userAppModulesDenied, id, orgNature } =
     useLocalSetup();
 
+  // "Open as Seven365 staff": the server holds the view against the session.
+  // While it covers the route's organisation, staff work there with full setup
+  // rights instead of their own (absent) membership. Nothing is written.
+  const { loadStaffView } = useStaffView();
+  let staffViewActive = false;
+  let lastStaffOrg = "";
+
   // Resolved once per signed-in session, not once per navigation. Keyed by the
   // user cookie so signing in as somebody else re-resolves.
   // Keyed by user AND the site the role was resolved AT, so switching site
@@ -87,8 +95,8 @@ export default defineNuxtPlugin(() => {
   // both do -- and that is a real answer ("no organisation role"), not an error.
   // Treating it as an error is what would bounce those accounts off their own
   // pages; leaving it unanswered is what let gates fail open.
-  async function resolveAppRole(userId: string, site: string) {
-    const key = `${userId}|${site}`;
+  async function resolveAppRole(userId: string, site: string, staffOrg = "") {
+    const key = `${userId}|${site}${staffOrg ? `|staff:${staffOrg}` : ""}`;
     if (resolvedFor === key) return;
     if (inFlight) {
       // A lookup for the SAME key is the one we want: await it and stop, which
@@ -105,15 +113,25 @@ export default defineNuxtPlugin(() => {
     // question, so the resolved role stays on screen and nothing flickers.
     if (resolvedFor === null || SEND_SITE) userAppRoleStatus.value = "loading";
     inFlightKey = key;
-    inFlight = run(userId, site).finally(() => {
+    inFlight = run(userId, site, staffOrg).finally(() => {
       inFlight = null;
     });
     return inFlight;
   }
 
-  async function run(userId: string, site: string) {
+  async function run(userId: string, site: string, staffOrg = "") {
     const APP = useRuntimeConfig().public.APP;
 
+    staffViewActive = !!staffOrg;
+    if (staffOrg) {
+      hasMemberDocument = true;
+      id.value = staffOrg;
+      userAppRole.value = STAFF_VIEW_ROLE;
+      resolvedFor = `${userId}|${site}|staff:${staffOrg}`;
+      userAppRoleStatus.value = "resolved";
+      return;
+    }
+
     try {
       // The org query is not sent: without it the server's site rule answers
       // with the membership pinned to `site` or, failing that, with exactly the
@@ -157,7 +175,8 @@ export default defineNuxtPlugin(() => {
   // that is not a list all mean nothing is denied -- never "hide everything".
   // It never touches the role or its status.
   async function resolveDenied(userId: string, site: string) {
-    if (!hasMemberDocument) {
+    // Seven365 staff are not capped by the client's module list.
+    if (!hasMemberDocument || staffViewActive) {
       deniedFor = deniedWanted = null;
       userAppModulesDenied.value = [];
       return;
@@ -192,8 +211,13 @@ export default defineNuxtPlugin(() => {
     // default open granted everything, gates that fail closed denied everything.
     // Awaited, so no gate is ever evaluated against an unresolved role.
     const site = idParam(to.params.site);
+    const routeOrg = idParam(to.params.org) || idParam(to.params.organization);
+    // Only an organisation's pages can be opened as staff, so only they ask.
+    const view = userId && routeOrg ? await bounded(loadStaffView()).catch(() => null) : null;
+    const staffOrg = staffViewCovers(view, routeOrg) ? routeOrg : "";
+    lastStaffOrg = staffOrg;
 
-    if (userId) await resolveAppRole(userId, site);
+    if (userId) await resolveAppRole(userId, site, staffOrg);
     if (userId) await resolveDenied(userId, site);
     else if (userAppModulesDenied.value.length) {
       // Signed out: never carry the previous person's list.
@@ -268,7 +292,7 @@ export default defineNuxtPlugin(() => {
     const site = idParam(router.currentRoute.value.params.site);
 
     refreshing = (async () => {
-      await run(userId, site);
+      await run(userId, site, lastStaffOrg);
       deniedFor = null;
       await resolveDenied(userId, site);
     })()

package/types/staff-view.d.ts

@@ -0,0 +1,10 @@
+/** "Open as Seven365 staff": the client/site a staff session has open (core `staff-view.util.ts`). */
+declare type TStaffView = {
+  user: string;
+  org: string;
+  orgName: string;
+  site: string;
+  siteName: string;
+  app: string;
+  startedAt: string;
+};

package/utils/access-suspended.ts

@@ -0,0 +1,18 @@
+/**
+ * Suspended = no access (owner 2026-10-01). When every membership of the
+ * signed-in person is suspended the API answers any request with 401 +
+ * `code: "ACCESS_SUSPENDED"` and the message "Your access has been suspended
+ * by <org>. Contact your administrator." (core `suspendedSessionGuard`). The
+ * session is already dead server-side; the app signs out and the sign-in page
+ * (web-app-main) shows the message once, from this cookie.
+ */
+export const ACCESS_SUSPENDED_CODE = "ACCESS_SUSPENDED";
+export const SIGNIN_NOTICE_COOKIE = "signin-notice";
+
+export function accessSuspendedMessage(data: unknown): string | null {
+  const body = data as { code?: unknown; message?: unknown } | null | undefined;
+  if (body?.code !== ACCESS_SUSPENDED_CODE) return null;
+  return typeof body.message === "string" && body.message
+    ? body.message
+    : "Your access has been suspended. Contact your administrator.";
+}

package/utils/role.ts

@@ -9,6 +9,19 @@
 export const showSiteField = (siteState: boolean, type: string): boolean =>
   siteState && type !== "admin";
 
+/**
+ * A role's name with its site, "Admin · St. Regis Residences" (owner
+ * 2026-10-01: role names are unique per SITE, so two sites may both have an
+ * "Admin" - two independent roles - and every list that can show both must
+ * say which is which). Organisation-level roles (no site) show the name alone.
+ * `siteName` comes from the role list (`GET /api/roles`, core 2026-10-01).
+ */
+export function roleLabel(role: { name?: unknown; siteName?: unknown; site?: unknown } | null | undefined): string {
+  const name = typeof role?.name === "string" ? role.name : "";
+  const site = typeof role?.siteName === "string" ? role.siteName.trim() : "";
+  return role?.site && site ? `${name} · ${site}` : name;
+}
+
 /**
  * The Assign Role picker's list, with the member's CURRENT role always in it.
  *
@@ -50,13 +63,13 @@ export function memberRoleChip(
   const limited = limitedSites(item);
   if (orgLevel && limited.length) {
     return {
-      text: limited.map((l) => `${l.roleName || "No role"} (${l.siteName || "a site"})`).join(", "),
+      text: limited.map((l) => `${l.roleName || "No role"} · ${l.siteName || "a site"}`).join(", "),
       tone: "info",
     };
   }
   if (orgLevel && item?.roleState === "other-site") {
     const site = typeof item?.roleSiteName === "string" && item.roleSiteName ? item.roleSiteName : "";
-    return { text: site ? `${name || "Role"} (${site})` : name || "Role", tone: "info" };
+    return { text: site ? `${name || "Role"} · ${site}` : name || "Role", tone: "info" };
   }
   switch (item?.roleState) {
     case "missing":