From 504ae524401ddd2574ffa942d5665422f252bc52 Mon Sep 17 00:00:00 2001
From: williambza <william.brander@gmail.com>
Date: Wed, 17 Jun 2026 11:21:40 +0200
Subject: [PATCH 01/13] Show user permissions if available

---
 .../configuration/UserPermissions.vue         | 124 ++++++++++++++++++
 src/Frontend/src/resources/RootUrls.ts        |   2 +
 src/Frontend/src/router/config.ts             |   5 +
 src/Frontend/src/router/routeLinks.ts         |   1 +
 .../src/stores/EnvironmentAndVersionsStore.ts |   2 +
 .../src/stores/UserPermissionsStore.ts        |  50 +++++++
 src/Frontend/src/views/ConfigurationView.vue  |  15 +++
 7 files changed, 199 insertions(+)
 create mode 100644 src/Frontend/src/components/configuration/UserPermissions.vue
 create mode 100644 src/Frontend/src/stores/UserPermissionsStore.ts

diff --git a/src/Frontend/src/components/configuration/UserPermissions.vue b/src/Frontend/src/components/configuration/UserPermissions.vue
new file mode 100644
index 0000000000..11b542a712
--- /dev/null
+++ b/src/Frontend/src/components/configuration/UserPermissions.vue
@@ -0,0 +1,124 @@
+<script setup lang="ts">
+import { onMounted } from "vue";
+import { faCheck, faTimes } from "@fortawesome/free-solid-svg-icons";
+import FAIcon from "@/components/FAIcon.vue";
+import LoadingSpinner from "@/components/LoadingSpinner.vue";
+import { useUserPermissionsStore } from "@/stores/UserPermissionsStore";
+
+const store = useUserPermissionsStore();
+
+onMounted(async () => {
+  await store.refresh();
+});
+</script>
+
+<template>
+  <section name="user-permissions">
+    <div class="box">
+      <LoadingSpinner v-if="store.loading" />
+      <div v-else-if="store.error" class="alert alert-danger">{{ store.error }}</div>
+      <template v-else-if="store.summary && store.descriptor">
+        <div class="row">
+          <div class="col-12">
+            <h3>Permissions Summary</h3>
+            <table class="table permissions-table">
+              <thead>
+                <tr>
+                  <th>Area</th>
+                  <th class="text-center">Read</th>
+                  <th class="text-center">Write</th>
+                </tr>
+              </thead>
+              <tbody>
+                <tr>
+                  <td>Failed Messages</td>
+                  <td class="text-center">
+                    <FAIcon :icon="store.summary.failed_messages_read ? faCheck : faTimes" :class="store.summary.failed_messages_read ? 'icon-granted' : 'icon-denied'" />
+                  </td>
+                  <td class="text-center">
+                    <FAIcon :icon="store.summary.failed_messages_write ? faCheck : faTimes" :class="store.summary.failed_messages_write ? 'icon-granted' : 'icon-denied'" />
+                  </td>
+                </tr>
+                <tr>
+                  <td>Auditing</td>
+                  <td class="text-center">
+                    <FAIcon :icon="store.summary.auditing_read ? faCheck : faTimes" :class="store.summary.auditing_read ? 'icon-granted' : 'icon-denied'" />
+                  </td>
+                  <td class="text-center">—</td>
+                </tr>
+                <tr>
+                  <td>Monitoring</td>
+                  <td class="text-center">
+                    <FAIcon :icon="store.summary.monitoring_read ? faCheck : faTimes" :class="store.summary.monitoring_read ? 'icon-granted' : 'icon-denied'" />
+                  </td>
+                  <td class="text-center">
+                    <FAIcon :icon="store.summary.monitoring_write ? faCheck : faTimes" :class="store.summary.monitoring_write ? 'icon-granted' : 'icon-denied'" />
+                  </td>
+                </tr>
+                <tr>
+                  <td>Admin</td>
+                  <td class="text-center">
+                    <FAIcon :icon="store.summary.admin_read ? faCheck : faTimes" :class="store.summary.admin_read ? 'icon-granted' : 'icon-denied'" />
+                  </td>
+                  <td class="text-center">
+                    <FAIcon :icon="store.summary.admin_write ? faCheck : faTimes" :class="store.summary.admin_write ? 'icon-granted' : 'icon-denied'" />
+                  </td>
+                </tr>
+              </tbody>
+            </table>
+          </div>
+        </div>
+        <div class="row">
+          <div class="col-12">
+            <h3>All Permissions</h3>
+            <p class="user-label">User: {{ store.descriptor.user }}</p>
+            <ul class="permissions-list">
+              <li v-for="permission in store.descriptor.permissions" :key="permission">{{ permission }}</li>
+            </ul>
+          </div>
+        </div>
+      </template>
+    </div>
+  </section>
+</template>
+
+<style scoped>
+.permissions-table {
+  max-width: 480px;
+}
+
+.permissions-table th,
+.permissions-table td {
+  padding: 10px 16px;
+}
+
+.icon-granted {
+  color: #28a745;
+}
+
+.icon-denied {
+  color: #dc3545;
+}
+
+.user-label {
+  color: #666;
+  margin-bottom: 12px;
+}
+
+.permissions-list {
+  list-style: none;
+  padding: 0;
+  margin: 0;
+  font-family: monospace;
+  font-size: 13px;
+}
+
+.permissions-list li {
+  padding: 4px 0;
+  border-bottom: 1px solid #f0f0f0;
+}
+
+.permissions-list li:last-child {
+  border-bottom: none;
+}
+</style>
diff --git a/src/Frontend/src/resources/RootUrls.ts b/src/Frontend/src/resources/RootUrls.ts
index 5c18ca5c65..7826ba27a2 100644
--- a/src/Frontend/src/resources/RootUrls.ts
+++ b/src/Frontend/src/resources/RootUrls.ts
@@ -17,4 +17,6 @@ export default interface RootUrls {
   event_log_items: string;
   archived_groups_url: string;
   get_archive_group: string;
+  mypermissions_all?: string;
+  mypermissions_summary?: string;
 }
diff --git a/src/Frontend/src/router/config.ts b/src/Frontend/src/router/config.ts
index 9e4f579db0..10ed24d8e2 100644
--- a/src/Frontend/src/router/config.ts
+++ b/src/Frontend/src/router/config.ts
@@ -206,6 +206,11 @@ const config: RouteItem[] = [
         path: routeLinks.configuration.endpointConnection.template,
         component: () => import("@/components/configuration/EndpointConnection.vue"),
       },
+      {
+        title: "User Permissions",
+        path: routeLinks.configuration.userPermissions.template,
+        component: () => import("@/components/configuration/UserPermissions.vue"),
+      },
       {
         title: "Usage Setup",
         path: routeLinks.throughput.setup.root,
diff --git a/src/Frontend/src/router/routeLinks.ts b/src/Frontend/src/router/routeLinks.ts
index 64ee77620c..f2e957c9b4 100644
--- a/src/Frontend/src/router/routeLinks.ts
+++ b/src/Frontend/src/router/routeLinks.ts
@@ -51,6 +51,7 @@ const configurationLinks = (root: string) => {
     retryRedirects: createLink("retry-redirects"),
     connections: createLink("connections"),
     endpointConnection: createLink("endpoint-connection"),
+    userPermissions: createLink("user-permissions"),
   };
 };
 
diff --git a/src/Frontend/src/stores/EnvironmentAndVersionsStore.ts b/src/Frontend/src/stores/EnvironmentAndVersionsStore.ts
index 0f15264f93..3e797116cf 100644
--- a/src/Frontend/src/stores/EnvironmentAndVersionsStore.ts
+++ b/src/Frontend/src/stores/EnvironmentAndVersionsStore.ts
@@ -17,6 +17,7 @@ export const useEnvironmentAndVersionsStore = defineStore("EnvironmentAndVersion
     is_compatible_with_sc: true,
     sp_version: window.defaultConfig && window.defaultConfig.version ? window.defaultConfig.version : "1.2.0",
     supportsArchiveGroups: false,
+    supportsUserPermissions: false,
     endpoints_error_url: "",
     known_endpoints_url: "",
     endpoints_message_search_url: "",
@@ -56,6 +57,7 @@ export const useEnvironmentAndVersionsStore = defineStore("EnvironmentAndVersion
     const [products, scVer] = await Promise.all([productsResult, scResult, mResult]);
     if (scVer) {
       environment.supportsArchiveGroups = !!scVer.archived_groups_url;
+      environment.supportsUserPermissions = !!scVer.mypermissions_all && !!scVer.mypermissions_summary;
       environment.is_compatible_with_sc = isSupported(environment.sc_version, environment.minimum_supported_sc_version);
       environment.endpoints_error_url = scVer && scVer.endpoints_error_url;
       environment.known_endpoints_url = scVer && scVer.known_endpoints_url;
diff --git a/src/Frontend/src/stores/UserPermissionsStore.ts b/src/Frontend/src/stores/UserPermissionsStore.ts
new file mode 100644
index 0000000000..fd3c1f41e4
--- /dev/null
+++ b/src/Frontend/src/stores/UserPermissionsStore.ts
@@ -0,0 +1,50 @@
+import { acceptHMRUpdate, defineStore } from "pinia";
+import { ref } from "vue";
+import serviceControlClient from "@/components/serviceControlClient";
+
+interface PermissionsSummary {
+  failed_messages_read: boolean;
+  failed_messages_write: boolean;
+  auditing_read: boolean;
+  monitoring_read: boolean;
+  monitoring_write: boolean;
+  admin_read: boolean;
+  admin_write: boolean;
+}
+
+interface PermissionsDescriptor {
+  user: string;
+  permissions: string[];
+}
+
+export const useUserPermissionsStore = defineStore("UserPermissionsStore", () => {
+  const summary = ref<PermissionsSummary | null>(null);
+  const descriptor = ref<PermissionsDescriptor | null>(null);
+  const loading = ref(false);
+  const error = ref<string | null>(null);
+
+  async function refresh() {
+    loading.value = true;
+    error.value = null;
+    try {
+      const [summaryResult, descriptorResult] = await Promise.all([
+        serviceControlClient.fetchTypedFromServiceControl<PermissionsSummary>("my/permissions"),
+        serviceControlClient.fetchTypedFromServiceControl<PermissionsDescriptor>("my/permissions/all"),
+      ]);
+      summary.value = summaryResult[1];
+      descriptor.value = descriptorResult[1];
+    } catch {
+      error.value = "Failed to load user permissions";
+    } finally {
+      loading.value = false;
+    }
+  }
+
+  return { summary, descriptor, loading, error, refresh };
+});
+
+export type { PermissionsSummary, PermissionsDescriptor };
+
+if (import.meta.hot) {
+  import.meta.hot.accept(acceptHMRUpdate(useUserPermissionsStore, import.meta.hot));
+}
diff --git a/src/Frontend/src/views/ConfigurationView.vue b/src/Frontend/src/views/ConfigurationView.vue
index ecb4b8e438..8fe60293f2 100644
--- a/src/Frontend/src/views/ConfigurationView.vue
+++ b/src/Frontend/src/views/ConfigurationView.vue
@@ -11,6 +11,8 @@ import useThroughputStoreAutoRefresh from "@/composables/useThroughputStoreAutoR
 import useConnectionsAndStatsAutoRefresh from "@/composables/useConnectionsAndStatsAutoRefresh";
 import { useRedirectsStore } from "@/stores/RedirectsStore";
 import { useLicenseStore } from "@/stores/LicenseStore";
+import { useAuthStore } from "@/stores/AuthStore";
+import { useEnvironmentAndVersionsStore } from "@/stores/EnvironmentAndVersionsStore";
 
 const { store: throughputStore } = useThroughputStoreAutoRefresh();
 const { hasErrors } = storeToRefs(throughputStore);
@@ -19,6 +21,9 @@ const connectionState = connectionStore.connectionState;
 const redirectsStore = useRedirectsStore();
 const licenseStore = useLicenseStore();
 const { licenseStatus } = licenseStore;
+const authStore = useAuthStore();
+const environmentStore = useEnvironmentAndVersionsStore();
+const { environment } = storeToRefs(environmentStore);
 
 onMounted(async () => {
   if (notConnected.value) {
@@ -96,6 +101,16 @@ function preventIfDisabled(e: Event) {
               </RouterLink>
             </h5>
           </template>
+          <h5
+            v-if="environment.supportsUserPermissions && authStore.authEnabled"
+            :class="{ active: isRouteSelected(routeLinks.configuration.userPermissions.link), disabled: notConnected }"
+            @click.capture="preventIfDisabled"
+            class="nav-item"
+            role="tab"
+            aria-label="user-permissions"
+          >
+            <RouterLink :to="routeLinks.configuration.userPermissions.link">User Permissions</RouterLink>
+          </h5>
         </div>
       </div>
     </div>

From 9d1aa0681961ed432ca104e0ad7214ed135dd7f9 Mon Sep 17 00:00:00 2001
From: williambza <william.brander@gmail.com>
Date: Fri, 19 Jun 2026 10:20:04 +0200
Subject: [PATCH 02/13] Only show permissions tab if auth is enabled

---
 src/Frontend/src/App.vue                     | 14 ++++++++++-
 src/Frontend/src/components/PageHeader.vue   | 25 ++++++++++++++------
 src/Frontend/src/views/ConfigurationView.vue | 20 +++++++++-------
 3 files changed, 43 insertions(+), 16 deletions(-)

diff --git a/src/Frontend/src/App.vue b/src/Frontend/src/App.vue
index de55293cb5..20ce9d5768 100644
--- a/src/Frontend/src/App.vue
+++ b/src/Frontend/src/App.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { computed } from "vue";
+import { computed, watch } from "vue";
 import { RouterView, useRoute } from "vue-router";
 import PageFooter from "./components/PageFooter.vue";
 import PageHeader from "./components/PageHeader.vue";
@@ -8,11 +8,23 @@ import LicenseNotifications from "@/components/LicenseNotifications.vue";
 import BackendChecksNotifications from "@/components/BackendChecksNotifications.vue";
 import { storeToRefs } from "pinia";
 import { useAuthStore } from "@/stores/AuthStore";
+import { useUserPermissionsStore } from "@/stores/UserPermissionsStore";
 
 const authStore = useAuthStore();
 const route = useRoute();
 const { isAuthenticated, authEnabled } = storeToRefs(authStore);
 
+const permissionsStore = useUserPermissionsStore();
+watch(
+  [authEnabled, isAuthenticated],
+  ([enabled, authenticated]) => {
+    if (enabled && authenticated) {
+      permissionsStore.refresh();
+    }
+  },
+  { immediate: true }
+);
+
 // Check if the current route allows anonymous access (e.g., logged-out page)
 const isAnonymousRoute = computed(() => route.meta?.allowAnonymous === true);
 const shouldShowApp = computed(() => !authEnabled.value || isAuthenticated.value || isAnonymousRoute.value);
diff --git a/src/Frontend/src/components/PageHeader.vue b/src/Frontend/src/components/PageHeader.vue
index 093cff518f..8c2b520641 100644
--- a/src/Frontend/src/components/PageHeader.vue
+++ b/src/Frontend/src/components/PageHeader.vue
@@ -15,24 +15,35 @@ import AuditMenuItem from "./audit/AuditMenuItem.vue";
 import monitoringClient from "@/components/monitoring/monitoringClient";
 import UserProfileMenuItem from "@/components/UserProfileMenuItem.vue";
 import { useAuthStore } from "@/stores/AuthStore";
+import { useUserPermissionsStore } from "@/stores/UserPermissionsStore";
 import { storeToRefs } from "pinia";
+import type { PermissionsSummary } from "@/stores/UserPermissionsStore";
 
 const isMonitoringEnabled = monitoringClient.isMonitoringEnabled;
 
 const authStore = useAuthStore();
 const { authEnabled, isAuthenticated } = storeToRefs(authStore);
 
+const permissionsStore = useUserPermissionsStore();
+const { summary } = storeToRefs(permissionsStore);
+
+const shouldGate = computed(() => authEnabled.value && isAuthenticated.value && summary.value !== null);
+
+function has(flag: keyof PermissionsSummary): boolean {
+  return !shouldGate.value || summary.value?.[flag] === true;
+}
+
 // prettier-ignore
 const menuItems = computed(
   () => [
   DashboardMenuItem,
-  HeartbeatsMenuItem,
-  ...(isMonitoringEnabled ? [MonitoringMenuItem] : []),
-  AuditMenuItem,
-  FailedMessagesMenuItem,
-  CustomChecksMenuItem,
-  EventsMenuItem,
-  ThroughputMenuItem,
+  ...(has("failed_messages_read") ? [HeartbeatsMenuItem] : []),
+  ...(isMonitoringEnabled && has("monitoring_read") ? [MonitoringMenuItem] : []),
+  ...(has("auditing_read") ? [AuditMenuItem] : []),
+  ...(has("failed_messages_read") ? [FailedMessagesMenuItem] : []),
+  ...(has("failed_messages_read") ? [CustomChecksMenuItem] : []),
+  ...(has("failed_messages_read") ? [EventsMenuItem] : []),
+  ...(has("failed_messages_read") ? [ThroughputMenuItem] : []),
   ConfigurationMenuItem,
   FeedbackButton,
 ]);
diff --git a/src/Frontend/src/views/ConfigurationView.vue b/src/Frontend/src/views/ConfigurationView.vue
index 8fe60293f2..2690b48180 100644
--- a/src/Frontend/src/views/ConfigurationView.vue
+++ b/src/Frontend/src/views/ConfigurationView.vue
@@ -12,7 +12,7 @@ import useConnectionsAndStatsAutoRefresh from "@/composables/useConnectionsAndSt
 import { useRedirectsStore } from "@/stores/RedirectsStore";
 import { useLicenseStore } from "@/stores/LicenseStore";
 import { useAuthStore } from "@/stores/AuthStore";
-import { useEnvironmentAndVersionsStore } from "@/stores/EnvironmentAndVersionsStore";
+import { useUserPermissionsStore } from "@/stores/UserPermissionsStore";
 
 const { store: throughputStore } = useThroughputStoreAutoRefresh();
 const { hasErrors } = storeToRefs(throughputStore);
@@ -22,8 +22,11 @@ const redirectsStore = useRedirectsStore();
 const licenseStore = useLicenseStore();
 const { licenseStatus } = licenseStore;
 const authStore = useAuthStore();
-const environmentStore = useEnvironmentAndVersionsStore();
-const { environment } = storeToRefs(environmentStore);
+
+const permissionsStore = useUserPermissionsStore();
+const { summary: permSummary } = storeToRefs(permissionsStore);
+const shouldGateConfig = computed(() => authStore.authEnabled && permSummary.value !== null);
+const hasAdminRead = computed(() => !shouldGateConfig.value || permSummary.value?.admin_read === true);
 
 onMounted(async () => {
   if (notConnected.value) {
@@ -59,11 +62,12 @@ function preventIfDisabled(e: Event) {
     <div class="row">
       <div class="col-sm-12">
         <div class="nav tabs">
-          <h5 :class="{ active: isRouteSelected(routeLinks.configuration.license.link), disabled: notConnected }" @click.capture="preventIfDisabled" class="nav-item" role="tab" aria-label="license">
+          <h5 v-if="hasAdminRead" :class="{ active: isRouteSelected(routeLinks.configuration.license.link), disabled: notConnected }" @click.capture="preventIfDisabled" class="nav-item" role="tab" aria-label="license">
             <RouterLink :to="routeLinks.configuration.license.link">License</RouterLink>
             <exclamation-mark :type="convertToWarningLevel(licenseStatus.warningLevel)" />
           </h5>
           <h5
+            v-if="hasAdminRead"
             :class="{ active: isRouteSelected(routeLinks.throughput.setup.root) || isRouteSelected(routeLinks.throughput.setup.mask.link) || isRouteSelected(routeLinks.throughput.setup.diagnostics.link), disabled: notConnected }"
             @click.capture="preventIfDisabled"
             class="nav-item"
@@ -74,13 +78,13 @@ function preventIfDisabled(e: Event) {
             <exclamation-mark :type="WarningLevel.Danger" v-if="hasErrors" />
           </h5>
           <template v-if="!licenseStatus.isExpired">
-            <h5 :class="{ active: isRouteSelected(routeLinks.configuration.massTransitConnector.link), disabled: notConnected }" @click.capture="preventIfDisabled" class="nav-item" role="tab" aria-label="mass-transit-connector">
+            <h5 v-if="hasAdminRead" :class="{ active: isRouteSelected(routeLinks.configuration.massTransitConnector.link), disabled: notConnected }" @click.capture="preventIfDisabled" class="nav-item" role="tab" aria-label="mass-transit-connector">
               <RouterLink :to="routeLinks.configuration.massTransitConnector.link">MassTransit Connector</RouterLink>
             </h5>
-            <h5 :class="{ active: isRouteSelected(routeLinks.configuration.healthCheckNotifications.link), disabled: notConnected }" @click.capture="preventIfDisabled" class="nav-item" role="tab" aria-label="health-check-notifications">
+            <h5 v-if="hasAdminRead" :class="{ active: isRouteSelected(routeLinks.configuration.healthCheckNotifications.link), disabled: notConnected }" @click.capture="preventIfDisabled" class="nav-item" role="tab" aria-label="health-check-notifications">
               <RouterLink :to="routeLinks.configuration.healthCheckNotifications.link">Health Check Notifications</RouterLink>
             </h5>
-            <h5 :class="{ active: isRouteSelected(routeLinks.configuration.retryRedirects.link), disabled: notConnected }" @click.capture="preventIfDisabled" class="nav-item" role="tab" aria-label="retry-redirects">
+            <h5 v-if="hasAdminRead" :class="{ active: isRouteSelected(routeLinks.configuration.retryRedirects.link), disabled: notConnected }" @click.capture="preventIfDisabled" class="nav-item" role="tab" aria-label="retry-redirects">
               <RouterLink :to="routeLinks.configuration.retryRedirects.link">Retry Redirects ({{ redirectsStore.redirects.total }})</RouterLink>
             </h5>
             <h5 :class="{ active: isRouteSelected(routeLinks.configuration.connections.link) }" class="nav-item" role="tab" aria-label="connections">
@@ -102,7 +106,7 @@ function preventIfDisabled(e: Event) {
             </h5>
           </template>
           <h5
-            v-if="environment.supportsUserPermissions && authStore.authEnabled"
+            v-if="authStore.authEnabled"
             :class="{ active: isRouteSelected(routeLinks.configuration.userPermissions.link), disabled: notConnected }"
             @click.capture="preventIfDisabled"
             class="nav-item"

From 3196821b8158f8a1bba2466d5f75f243fd969d57 Mon Sep 17 00:00:00 2001
From: williambza <william.brander@gmail.com>
Date: Fri, 19 Jun 2026 11:23:35 +0200
Subject: [PATCH 03/13] Fix lint errors

---
 src/Frontend/src/components/PageHeader.vue   |  3 +-
 src/Frontend/src/views/ConfigurationView.vue | 65 ++++++++++++++++----
 2 files changed, 53 insertions(+), 15 deletions(-)

diff --git a/src/Frontend/src/components/PageHeader.vue b/src/Frontend/src/components/PageHeader.vue
index 8c2b520641..26aa848787 100644
--- a/src/Frontend/src/components/PageHeader.vue
+++ b/src/Frontend/src/components/PageHeader.vue
@@ -15,9 +15,8 @@ import AuditMenuItem from "./audit/AuditMenuItem.vue";
 import monitoringClient from "@/components/monitoring/monitoringClient";
 import UserProfileMenuItem from "@/components/UserProfileMenuItem.vue";
 import { useAuthStore } from "@/stores/AuthStore";
-import { useUserPermissionsStore } from "@/stores/UserPermissionsStore";
+import { useUserPermissionsStore, type PermissionsSummary } from "@/stores/UserPermissionsStore";
 import { storeToRefs } from "pinia";
-import type { PermissionsSummary } from "@/stores/UserPermissionsStore";
 
 const isMonitoringEnabled = monitoringClient.isMonitoringEnabled;
 
diff --git a/src/Frontend/src/views/ConfigurationView.vue b/src/Frontend/src/views/ConfigurationView.vue
index 2690b48180..78dba05aa1 100644
--- a/src/Frontend/src/views/ConfigurationView.vue
+++ b/src/Frontend/src/views/ConfigurationView.vue
@@ -78,22 +78,68 @@ function preventIfDisabled(e: Event) {
             <exclamation-mark :type="WarningLevel.Danger" v-if="hasErrors" />
           </h5>
           <template v-if="!licenseStatus.isExpired">
-            <h5 v-if="hasAdminRead" :class="{ active: isRouteSelected(routeLinks.configuration.massTransitConnector.link), disabled: notConnected }" @click.capture="preventIfDisabled" class="nav-item" role="tab" aria-label="mass-transit-connector">
+            <h5
+              v-if="hasAdminRead"
+              :class="{
+                active: isRouteSelected(routeLinks.configuration.massTransitConnector.link),
+                disabled: notConnected,
+              }"
+              @click.capture="preventIfDisabled"
+              class="nav-item"
+              role="tab"
+              aria-label="mass-transit-connector"
+            >
               <RouterLink :to="routeLinks.configuration.massTransitConnector.link">MassTransit Connector</RouterLink>
             </h5>
-            <h5 v-if="hasAdminRead" :class="{ active: isRouteSelected(routeLinks.configuration.healthCheckNotifications.link), disabled: notConnected }" @click.capture="preventIfDisabled" class="nav-item" role="tab" aria-label="health-check-notifications">
+            <h5
+              v-if="hasAdminRead"
+              :class="{
+                active: isRouteSelected(routeLinks.configuration.healthCheckNotifications.link),
+                disabled: notConnected,
+              }"
+              @click.capture="preventIfDisabled"
+              class="nav-item"
+              role="tab"
+              aria-label="health-check-notifications"
+            >
               <RouterLink :to="routeLinks.configuration.healthCheckNotifications.link">Health Check Notifications</RouterLink>
             </h5>
-            <h5 v-if="hasAdminRead" :class="{ active: isRouteSelected(routeLinks.configuration.retryRedirects.link), disabled: notConnected }" @click.capture="preventIfDisabled" class="nav-item" role="tab" aria-label="retry-redirects">
+            <h5
+              v-if="hasAdminRead"
+              :class="{
+                active: isRouteSelected(routeLinks.configuration.retryRedirects.link),
+                disabled: notConnected,
+              }"
+              @click.capture="preventIfDisabled"
+              class="nav-item"
+              role="tab"
+              aria-label="retry-redirects"
+            >
               <RouterLink :to="routeLinks.configuration.retryRedirects.link">Retry Redirects ({{ redirectsStore.redirects.total }})</RouterLink>
             </h5>
-            <h5 :class="{ active: isRouteSelected(routeLinks.configuration.connections.link) }" class="nav-item" role="tab" aria-label="connections">
+            <h5
+              :class="{
+                active: isRouteSelected(routeLinks.configuration.connections.link),
+              }"
+              class="nav-item"
+              role="tab"
+              aria-label="connections"
+            >
               <RouterLink :to="routeLinks.configuration.connections.link">
                 Connections
                 <exclamation-mark v-if="connectionStore.displayConnectionsWarning" :type="WarningLevel.Danger" />
               </RouterLink>
             </h5>
-            <h5 :class="{ active: isRouteSelected(routeLinks.configuration.endpointConnection.link), disabled: notConnected }" @click.capture="preventIfDisabled" class="nav-item" role="tab" aria-label="endpoint-connection">
+            <h5
+              :class="{
+                active: isRouteSelected(routeLinks.configuration.endpointConnection.link),
+                disabled: notConnected,
+              }"
+              @click.capture="preventIfDisabled"
+              class="nav-item"
+              role="tab"
+              aria-label="endpoint-connection"
+            >
               <RouterLink :to="routeLinks.configuration.endpointConnection.link">Endpoint Connection</RouterLink>
             </h5>
           </template>
@@ -105,14 +151,7 @@ function preventIfDisabled(e: Event) {
               </RouterLink>
             </h5>
           </template>
-          <h5
-            v-if="authStore.authEnabled"
-            :class="{ active: isRouteSelected(routeLinks.configuration.userPermissions.link), disabled: notConnected }"
-            @click.capture="preventIfDisabled"
-            class="nav-item"
-            role="tab"
-            aria-label="user-permissions"
-          >
+          <h5 v-if="authStore.authEnabled" :class="{ active: isRouteSelected(routeLinks.configuration.userPermissions.link), disabled: notConnected }" @click.capture="preventIfDisabled" class="nav-item" role="tab" aria-label="user-permissions">
             <RouterLink :to="routeLinks.configuration.userPermissions.link">User Permissions</RouterLink>
           </h5>
         </div>

From bb064fee056e89b9a95593c88a32753837a624aa Mon Sep 17 00:00:00 2001
From: williambza <william.brander@gmail.com>
Date: Fri, 19 Jun 2026 11:30:46 +0200
Subject: [PATCH 04/13] Fix audit errors

---
 src/Frontend/package-lock.json | 242 ++++++++++++++++-----------------
 src/Frontend/package.json      |   2 +-
 2 files changed, 118 insertions(+), 126 deletions(-)

diff --git a/src/Frontend/package-lock.json b/src/Frontend/package-lock.json
index 2fe418e694..a4987b58e0 100644
--- a/src/Frontend/package-lock.json
+++ b/src/Frontend/package-lock.json
@@ -64,7 +64,7 @@
         "prettier": "3.8.3",
         "typescript": "6.0.3",
         "typescript-eslint": "8.60.0",
-        "vite": "8.0.14",
+        "vite": "8.0.16",
         "vite-plugin-checker": "0.14.1",
         "vite-plugin-vue-devtools": "8.1.2",
         "vitest": "4.1.7",
@@ -1016,24 +1016,22 @@
       "license": "MIT"
     },
     "node_modules/@emnapi/core": {
-      "version": "1.9.2",
-      "resolved": "https://registry.npmjs.org/@emnapi/core/-/core-1.9.2.tgz",
-      "integrity": "sha512-UC+ZhH3XtczQYfOlu3lNEkdW/p4dsJ1r/bP7H8+rhao3TTTMO1ATq/4DdIi23XuGoFY+Cz0JmCbdVl0hz9jZcA==",
+      "version": "1.10.0",
+      "resolved": "https://registry.npmjs.org/@emnapi/core/-/core-1.10.0.tgz",
+      "integrity": "sha512-yq6OkJ4p82CAfPl0u9mQebQHKPJkY7WrIuk205cTYnYe+k2Z8YBh11FrbRG/H6ihirqcacOgl2BIO8oyMQLeXw==",
       "license": "MIT",
       "optional": true,
-      "peer": true,
       "dependencies": {
         "@emnapi/wasi-threads": "1.2.1",
         "tslib": "^2.4.0"
       }
     },
     "node_modules/@emnapi/runtime": {
-      "version": "1.9.2",
-      "resolved": "https://registry.npmjs.org/@emnapi/runtime/-/runtime-1.9.2.tgz",
-      "integrity": "sha512-3U4+MIWHImeyu1wnmVygh5WlgfYDtyf0k8AbLhMFxOipihf6nrWC4syIm/SwEeec0mNSafiiNnMJwbza/Is6Lw==",
+      "version": "1.10.0",
+      "resolved": "https://registry.npmjs.org/@emnapi/runtime/-/runtime-1.10.0.tgz",
+      "integrity": "sha512-ewvYlk86xUoGI0zQRNq/mC+16R1QeDlKQy21Ki3oSYXNgLb45GV1P6A0M+/s6nyCuNDqe5VpaY84BzXGwVbwFA==",
       "license": "MIT",
       "optional": true,
-      "peer": true,
       "dependencies": {
         "tslib": "^2.4.0"
       }
@@ -1559,13 +1557,13 @@
       }
     },
     "node_modules/@napi-rs/wasm-runtime": {
-      "version": "1.1.4",
-      "resolved": "https://registry.npmjs.org/@napi-rs/wasm-runtime/-/wasm-runtime-1.1.4.tgz",
-      "integrity": "sha512-3NQNNgA1YSlJb/kMH1ildASP9HW7/7kYnRI2szWJaofaS1hWmbGI4H+d3+22aGzXXN9IJ+n+GiFVcGipJP18ow==",
+      "version": "1.1.5",
+      "resolved": "https://registry.npmjs.org/@napi-rs/wasm-runtime/-/wasm-runtime-1.1.5.tgz",
+      "integrity": "sha512-AWPoBRJ9tsnVhor4sjO7rkni+7p+2IAEFj6cx06UgP10jkQHqay/36uRV/bFkgrh18D9vb4cr8Q0Pthskgzy+Q==",
       "license": "MIT",
       "optional": true,
       "dependencies": {
-        "@tybys/wasm-util": "^0.10.1"
+        "@tybys/wasm-util": "^0.10.2"
       },
       "funding": {
         "type": "github",
@@ -1609,9 +1607,9 @@
       "license": "MIT"
     },
     "node_modules/@oxc-project/types": {
-      "version": "0.132.0",
-      "resolved": "https://registry.npmjs.org/@oxc-project/types/-/types-0.132.0.tgz",
-      "integrity": "sha512-FESMOxil5Se014ui/Eq8fT5uHJo6nIRwH0PfJrZJXs6Gek3ZVFOrpUv3YIZT20m+extU98Hg1Ym72U58rlsxUQ==",
+      "version": "0.133.0",
+      "resolved": "https://registry.npmjs.org/@oxc-project/types/-/types-0.133.0.tgz",
+      "integrity": "sha512-KzkdCd6Uxqnf6l3HOw1xfatAlUURA0g14cvBYFyJ5SaNOQbOUvBr9PKArcPcrNIeRsBdgcUzOGrhKveVpvOIGA==",
       "devOptional": true,
       "license": "MIT",
       "funding": {
@@ -1662,9 +1660,9 @@
       }
     },
     "node_modules/@rolldown/binding-android-arm64": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/@rolldown/binding-android-arm64/-/binding-android-arm64-1.0.2.tgz",
-      "integrity": "sha512-ZS4D1JPGn/MYQN/SYDWftIE/nVsM8j/AFOYEzAoOE2O3NktQOZru+/vYXGbR/qtdLdIfGCP0lcoJiYVzsEz+iQ==",
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-android-arm64/-/binding-android-arm64-1.0.3.tgz",
+      "integrity": "sha512-454rs7jHngixp/NMxd5srYD57OnzSlZ/eFTETjORQHLwJG1lRtmNOJcBerZlfu4GjKqeq8aCCIQrMdHyhI51Hw==",
       "cpu": [
         "arm64"
       ],
@@ -1678,9 +1676,9 @@
       }
     },
     "node_modules/@rolldown/binding-darwin-arm64": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/@rolldown/binding-darwin-arm64/-/binding-darwin-arm64-1.0.2.tgz",
-      "integrity": "sha512-vdFA9+C/rekyGce7WqHs/xoT0ioZEWaOFyZLIV1mEeNFaFDUQrPIo8Vs2GvJ6eetb3rzDUtUBgzto3ExpXJB3w==",
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-darwin-arm64/-/binding-darwin-arm64-1.0.3.tgz",
+      "integrity": "sha512-PcAhP+ynjURNyy8SKGl5DQP94aGuB/7JrXJb/t7P+hanXvQVMWzUvRRhBAcg/lNRadBhoUPqSoP4xw5tR/KBEA==",
       "cpu": [
         "arm64"
       ],
@@ -1694,9 +1692,9 @@
       }
     },
     "node_modules/@rolldown/binding-darwin-x64": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/@rolldown/binding-darwin-x64/-/binding-darwin-x64-1.0.2.tgz",
-      "integrity": "sha512-BewSOwTHazv77DTYiAZXSqqKZ4KP/KonFisDMVU7PImxoWfB2aepnPhd2E4SWz3zDzYgDNbs6jBmTdgNnF02GA==",
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-darwin-x64/-/binding-darwin-x64-1.0.3.tgz",
+      "integrity": "sha512-9YpfeUvSE2RS7wysJ81uOZkXJz7f7Q55H2Gvp3VEw/EsahqDtrphrZ0EwDLK5vvKOzaCrBsjF8JmnMLcUt78Gg==",
       "cpu": [
         "x64"
       ],
@@ -1710,9 +1708,9 @@
       }
     },
     "node_modules/@rolldown/binding-freebsd-x64": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/@rolldown/binding-freebsd-x64/-/binding-freebsd-x64-1.0.2.tgz",
-      "integrity": "sha512-m41o7M0YWtUdqk61Tb+jnKb2rN++iRdIASlExkUoKfIAH30DOHCB8fVLzSUpbWHHU8esmEioY62PxzexE8MBuA==",
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-freebsd-x64/-/binding-freebsd-x64-1.0.3.tgz",
+      "integrity": "sha512-yB1IlAsSNHncV6SCTL27/MVGR5htvQsoGxIv5KMGXALp+Ll1wYsn+x98M9MW7qa+NdSbvrrY7ANI4wLJ0n1e6g==",
       "cpu": [
         "x64"
       ],
@@ -1726,9 +1724,9 @@
       }
     },
     "node_modules/@rolldown/binding-linux-arm-gnueabihf": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-arm-gnueabihf/-/binding-linux-arm-gnueabihf-1.0.2.tgz",
-      "integrity": "sha512-jcojB9H7W/jS29pMKWAK1N+fU99vXodHDTatS3b3y/XSOCiHo0kkA74pL3jJmkoQtYpOCxDvaKs1fo2Ij/1X5w==",
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-arm-gnueabihf/-/binding-linux-arm-gnueabihf-1.0.3.tgz",
+      "integrity": "sha512-Yi30IVAAfLUCy2MseFjbB1jAMDl1VMCAas5StnYp8da9+CKvMd2H2cbEjWcw5NPaPqzvYkVIaF1nNUG+b7u/sw==",
       "cpu": [
         "arm"
       ],
@@ -1742,12 +1740,15 @@
       }
     },
     "node_modules/@rolldown/binding-linux-arm64-gnu": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-arm64-gnu/-/binding-linux-arm64-gnu-1.0.2.tgz",
-      "integrity": "sha512-1jn6qDU5iiOgFgygDzKUuKP0maTi0/f1+sBLgvij/76C77Nm3ts6ufz9Bjg5q5dduxiUIxtq86JIoBvo1xQ4Ig==",
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-arm64-gnu/-/binding-linux-arm64-gnu-1.0.3.tgz",
+      "integrity": "sha512-jsO7R8To+AdlYgUmN5sHSCZbfhtMBkO0WUx8iORQnPcMMdgr7qM2DQmMwgabs3GhNztdmoKkMKQFHD6DTMCIQw==",
       "cpu": [
         "arm64"
       ],
+      "libc": [
+        "glibc"
+      ],
       "license": "MIT",
       "optional": true,
       "os": [
@@ -1758,12 +1759,15 @@
       }
     },
     "node_modules/@rolldown/binding-linux-arm64-musl": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-arm64-musl/-/binding-linux-arm64-musl-1.0.2.tgz",
-      "integrity": "sha512-QVLO/czFMdoMFSqlX3bcswcJNm/23r+qoa/jgtmFc/qEp6/jXmIkDjF/XIo8dPfGaiwy1xfQn8o77L79GeXFgw==",
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-arm64-musl/-/binding-linux-arm64-musl-1.0.3.tgz",
+      "integrity": "sha512-VWkUHwWriDciit80wleYwKILoR/KMvxh/IdwS/paX+ZgpuRpCrKLUdadJbc0NpBEiyhpYawsJ73j9aCvOH+f7Q==",
       "cpu": [
         "arm64"
       ],
+      "libc": [
+        "musl"
+      ],
       "license": "MIT",
       "optional": true,
       "os": [
@@ -1774,12 +1778,15 @@
       }
     },
     "node_modules/@rolldown/binding-linux-ppc64-gnu": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-ppc64-gnu/-/binding-linux-ppc64-gnu-1.0.2.tgz",
-      "integrity": "sha512-hgO5Abm0w5UL6FEa2iFnZqo2KlK7TQ5QhV5x09hujBf7t5KzHQ1VmfPuTpqRy/rNlSxua3eWH374xxiVrP+lcA==",
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-ppc64-gnu/-/binding-linux-ppc64-gnu-1.0.3.tgz",
+      "integrity": "sha512-5f1laC0SlIR0yDbFCd8acUhvJIag6N3zC5P7oUPN6wX0aOma+uKJ0wBDH5aq7I1PVI2ttTlhJwzwRIBnLiSGEg==",
       "cpu": [
         "ppc64"
       ],
+      "libc": [
+        "glibc"
+      ],
       "license": "MIT",
       "optional": true,
       "os": [
@@ -1790,12 +1797,15 @@
       }
     },
     "node_modules/@rolldown/binding-linux-s390x-gnu": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-s390x-gnu/-/binding-linux-s390x-gnu-1.0.2.tgz",
-      "integrity": "sha512-fy8rXxuYEu602abC8MUNaPjYLIFzReOaEIEMKMUa0rFEUxNpVXhs15KSSQ4qlqSaM7B6rcj9rDZgADh/IGDzLQ==",
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-s390x-gnu/-/binding-linux-s390x-gnu-1.0.3.tgz",
+      "integrity": "sha512-Iq4ko0r4XsgbrF/LunNgHtAGLRRVE2kXonAXQ/MV0mC6jQpMOhW1SvtZja2EhC/kd05++bP78dsqBeIQyYJ6Yg==",
       "cpu": [
         "s390x"
       ],
+      "libc": [
+        "glibc"
+      ],
       "license": "MIT",
       "optional": true,
       "os": [
@@ -1806,12 +1816,15 @@
       }
     },
     "node_modules/@rolldown/binding-linux-x64-gnu": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-x64-gnu/-/binding-linux-x64-gnu-1.0.2.tgz",
-      "integrity": "sha512-0+bOkiQ779+r1WpoHOWHqncvyySci0vKph+myNDYb+im6meJAzHQXay6oEgnkHuUGouM1LKTZwqKpBow6Kj7CQ==",
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-x64-gnu/-/binding-linux-x64-gnu-1.0.3.tgz",
+      "integrity": "sha512-B8m6tD5+/N5FeNQFbKlLA/2yVq9ycQP1SeedyEYYKWBNR3ZQbkvIUcNnDNM03lO1l5F2roiiFJGgvoLLyZXtSg==",
       "cpu": [
         "x64"
       ],
+      "libc": [
+        "glibc"
+      ],
       "license": "MIT",
       "optional": true,
       "os": [
@@ -1822,12 +1835,15 @@
       }
     },
     "node_modules/@rolldown/binding-linux-x64-musl": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-x64-musl/-/binding-linux-x64-musl-1.0.2.tgz",
-      "integrity": "sha512-mjSkrzZK5Qsl0a9d1JgILOiuZOSDTVdKENcSXBoqbzSrspLR/4/IRVDo5wd2GgZjNss/viBFJdeq+j7qH2nypw==",
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-x64-musl/-/binding-linux-x64-musl-1.0.3.tgz",
+      "integrity": "sha512-pSdpdUJHkuCxun9LE7jvgUB9qsRgaiyNNCX7m/AvHTcq67AiT/Yhoxvw5zPfhrM8k/BfP8ce/hMOpthKDpEUow==",
       "cpu": [
         "x64"
       ],
+      "libc": [
+        "musl"
+      ],
       "license": "MIT",
       "optional": true,
       "os": [
@@ -1838,9 +1854,9 @@
       }
     },
     "node_modules/@rolldown/binding-openharmony-arm64": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/@rolldown/binding-openharmony-arm64/-/binding-openharmony-arm64-1.0.2.tgz",
-      "integrity": "sha512-1v5vHasdfQAZoEHakBV72LIFAC9JjnymsiKxp+GEr/ma3+NJCPSaYK+qavInOovJkgwFrs7GccX2d6IgDA3Z5w==",
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-openharmony-arm64/-/binding-openharmony-arm64-1.0.3.tgz",
+      "integrity": "sha512-OXXS3RKJgX2uLwM+gYyuH5omcH8fL1LJs96pZGgtetVCahON57+d4SJHzTgZiOjxgGkSnpXpOsWuPDGAKAigEg==",
       "cpu": [
         "arm64"
       ],
@@ -1854,9 +1870,9 @@
       }
     },
     "node_modules/@rolldown/binding-wasm32-wasi": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/@rolldown/binding-wasm32-wasi/-/binding-wasm32-wasi-1.0.2.tgz",
-      "integrity": "sha512-mb1VobWn6NheziTk5/WEaR6AKVbrwT5sOi6C7zk3gy/pD1qtJfU1j4PgTo2NJnOtbL9Dl3Aeei8w9jJ7qC2jZQ==",
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-wasm32-wasi/-/binding-wasm32-wasi-1.0.3.tgz",
+      "integrity": "sha512-JTtb8BWFynicNSoPrehsCzBtOKjZ6jhMiPFEmOiuXg1Fl8dn2KHQob+GuPSGR0dryQa1PQJbzjF3dqO/whhjLg==",
       "cpu": [
         "wasm32"
       ],
@@ -1871,31 +1887,10 @@
         "node": "^20.19.0 || >=22.12.0"
       }
     },
-    "node_modules/@rolldown/binding-wasm32-wasi/node_modules/@emnapi/core": {
-      "version": "1.10.0",
-      "resolved": "https://registry.npmjs.org/@emnapi/core/-/core-1.10.0.tgz",
-      "integrity": "sha512-yq6OkJ4p82CAfPl0u9mQebQHKPJkY7WrIuk205cTYnYe+k2Z8YBh11FrbRG/H6ihirqcacOgl2BIO8oyMQLeXw==",
-      "license": "MIT",
-      "optional": true,
-      "dependencies": {
-        "@emnapi/wasi-threads": "1.2.1",
-        "tslib": "^2.4.0"
-      }
-    },
-    "node_modules/@rolldown/binding-wasm32-wasi/node_modules/@emnapi/runtime": {
-      "version": "1.10.0",
-      "resolved": "https://registry.npmjs.org/@emnapi/runtime/-/runtime-1.10.0.tgz",
-      "integrity": "sha512-ewvYlk86xUoGI0zQRNq/mC+16R1QeDlKQy21Ki3oSYXNgLb45GV1P6A0M+/s6nyCuNDqe5VpaY84BzXGwVbwFA==",
-      "license": "MIT",
-      "optional": true,
-      "dependencies": {
-        "tslib": "^2.4.0"
-      }
-    },
     "node_modules/@rolldown/binding-win32-arm64-msvc": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/@rolldown/binding-win32-arm64-msvc/-/binding-win32-arm64-msvc-1.0.2.tgz",
-      "integrity": "sha512-SqKonF56vA/L2yHwHYcEp2P34URpOZ7d1fS635cTkpDnUtEGdUbhI6NzsPdqeSWvAAeGDrxjWjNmibDIdFf9/A==",
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-win32-arm64-msvc/-/binding-win32-arm64-msvc-1.0.3.tgz",
+      "integrity": "sha512-gEdFFEN70A/jxb2svrWsN3aDL7OUtmvlOy+6fa2jxG8K0wQ1ZbdeLGnidov6Yu5/733dI5ySfzFlQ/cb0bSz1g==",
       "cpu": [
         "arm64"
       ],
@@ -1909,9 +1904,9 @@
       }
     },
     "node_modules/@rolldown/binding-win32-x64-msvc": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/@rolldown/binding-win32-x64-msvc/-/binding-win32-x64-msvc-1.0.2.tgz",
-      "integrity": "sha512-v7qRI7gXLRINcOGXt+7YmAZ6iFuyZVMIoXAxhd8oP+DR9dLfL9GfNIx7PLMxmhZdvq8waUJBQiWN9EKNy+TRBQ==",
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-win32-x64-msvc/-/binding-win32-x64-msvc-1.0.3.tgz",
+      "integrity": "sha512-eXB7CHuaQdqmJcc3koCNtNPmT/bj2gc999kUFgBxG8Ac0NdgXc4rkCHhqrgrhN3zddvvvrgzj1e90SuSfmyIXA==",
       "cpu": [
         "x64"
       ],
@@ -2074,9 +2069,9 @@
       "license": "MIT"
     },
     "node_modules/@tybys/wasm-util": {
-      "version": "0.10.1",
-      "resolved": "https://registry.npmjs.org/@tybys/wasm-util/-/wasm-util-0.10.1.tgz",
-      "integrity": "sha512-9tTaPJLSiejZKx+Bmog4uSubteqTvFrVrURwkmHixBo0G4seD0zUxp98E1DzUBJxLQ3NPwXrGKDiVjwx/DpPsg==",
+      "version": "0.10.2",
+      "resolved": "https://registry.npmjs.org/@tybys/wasm-util/-/wasm-util-0.10.2.tgz",
+      "integrity": "sha512-RoBvJ2X0wuKlWFIjrwffGw1IqZHKQqzIchKaadZZfnNpsAYp2mM0h36JtPCjNDAHGgYez/15uMBpfGwchhiMgg==",
       "license": "MIT",
       "optional": true,
       "dependencies": {
@@ -3348,9 +3343,9 @@
       }
     },
     "node_modules/brace-expansion": {
-      "version": "5.0.5",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-5.0.5.tgz",
-      "integrity": "sha512-VZznLgtwhn+Mact9tfiwx64fA9erHH/MCXEUfB/0bX/6Fz6ny5EGTXYltMocqg4xFAQZtnO3DHWWXi8RiuN7cQ==",
+      "version": "5.0.6",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-5.0.6.tgz",
+      "integrity": "sha512-kLpxurY4Z4r9sgMsyG0Z9uzsBlgiU/EFKhj/h91/8yHu0edo7XuixOIH3VcJ8kkxs6/jPzoI6U9Vj3WqbMQ94g==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -5488,14 +5483,11 @@
       }
     },
     "node_modules/js-cookie": {
-      "version": "3.0.5",
-      "resolved": "https://registry.npmjs.org/js-cookie/-/js-cookie-3.0.5.tgz",
-      "integrity": "sha512-cEiJEAEoIbWfCZYKWhVwFuvPX1gETRYPw6LlaTKoxD3s2AkXzkCjnp6h0V77ozyqj0jakteJ4YqDJT830+lVGw==",
+      "version": "3.0.8",
+      "resolved": "https://registry.npmjs.org/js-cookie/-/js-cookie-3.0.8.tgz",
+      "integrity": "sha512-yeJd4aNAdYZQjaon2bpD/Gb0B/omw7HQOsynXXcOiWVCacbBcPlgn8S/d1X6blFSaHao7ozqtW7NZW19xpCtIw==",
       "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=14"
-      }
+      "license": "MIT"
     },
     "node_modules/js-tokens": {
       "version": "4.0.0",
@@ -6846,13 +6838,13 @@
       "license": "MIT"
     },
     "node_modules/rolldown": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/rolldown/-/rolldown-1.0.2.tgz",
-      "integrity": "sha512-oZx5zVDtVB44AW3eaifgDml1gWRDZGvjcfdxonE4swNPG98PrrXjaO/KrnUjzlMnztCCRVlUueA1kCXhARGk6g==",
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/rolldown/-/rolldown-1.0.3.tgz",
+      "integrity": "sha512-i00lAJ2ks1BYr7rjNjKC7BcqAS7nVfiT3QX1SI5aY+AFHblCmaUf9OE9dbdzDvW6dJxbi2ZCZiy9v3CcwOiX3g==",
       "devOptional": true,
       "license": "MIT",
       "dependencies": {
-        "@oxc-project/types": "=0.132.0",
+        "@oxc-project/types": "=0.133.0",
         "@rolldown/pluginutils": "^1.0.0"
       },
       "bin": {
@@ -6862,21 +6854,21 @@
         "node": "^20.19.0 || >=22.12.0"
       },
       "optionalDependencies": {
-        "@rolldown/binding-android-arm64": "1.0.2",
-        "@rolldown/binding-darwin-arm64": "1.0.2",
-        "@rolldown/binding-darwin-x64": "1.0.2",
-        "@rolldown/binding-freebsd-x64": "1.0.2",
-        "@rolldown/binding-linux-arm-gnueabihf": "1.0.2",
-        "@rolldown/binding-linux-arm64-gnu": "1.0.2",
-        "@rolldown/binding-linux-arm64-musl": "1.0.2",
-        "@rolldown/binding-linux-ppc64-gnu": "1.0.2",
-        "@rolldown/binding-linux-s390x-gnu": "1.0.2",
-        "@rolldown/binding-linux-x64-gnu": "1.0.2",
-        "@rolldown/binding-linux-x64-musl": "1.0.2",
-        "@rolldown/binding-openharmony-arm64": "1.0.2",
-        "@rolldown/binding-wasm32-wasi": "1.0.2",
-        "@rolldown/binding-win32-arm64-msvc": "1.0.2",
-        "@rolldown/binding-win32-x64-msvc": "1.0.2"
+        "@rolldown/binding-android-arm64": "1.0.3",
+        "@rolldown/binding-darwin-arm64": "1.0.3",
+        "@rolldown/binding-darwin-x64": "1.0.3",
+        "@rolldown/binding-freebsd-x64": "1.0.3",
+        "@rolldown/binding-linux-arm-gnueabihf": "1.0.3",
+        "@rolldown/binding-linux-arm64-gnu": "1.0.3",
+        "@rolldown/binding-linux-arm64-musl": "1.0.3",
+        "@rolldown/binding-linux-ppc64-gnu": "1.0.3",
+        "@rolldown/binding-linux-s390x-gnu": "1.0.3",
+        "@rolldown/binding-linux-x64-gnu": "1.0.3",
+        "@rolldown/binding-linux-x64-musl": "1.0.3",
+        "@rolldown/binding-openharmony-arm64": "1.0.3",
+        "@rolldown/binding-wasm32-wasi": "1.0.3",
+        "@rolldown/binding-win32-arm64-msvc": "1.0.3",
+        "@rolldown/binding-win32-x64-msvc": "1.0.3"
       }
     },
     "node_modules/run-applescript": {
@@ -7285,9 +7277,9 @@
       }
     },
     "node_modules/tinyglobby": {
-      "version": "0.2.16",
-      "resolved": "https://registry.npmjs.org/tinyglobby/-/tinyglobby-0.2.16.tgz",
-      "integrity": "sha512-pn99VhoACYR8nFHhxqix+uvsbXineAasWm5ojXoN8xEwK5Kd3/TrhNn1wByuD52UxWRLy8pu+kRMniEi6Eq9Zg==",
+      "version": "0.2.17",
+      "resolved": "https://registry.npmjs.org/tinyglobby/-/tinyglobby-0.2.17.tgz",
+      "integrity": "sha512-wXR/dYpcqKmfWpEdZjiKJOwCNFndD0DMnrW/cYjVGttEkBfVgcLFHoNrlj47mjOVic9yyNu65alsgF4NQyTa2g==",
       "license": "MIT",
       "dependencies": {
         "fdir": "^6.5.0",
@@ -7468,9 +7460,9 @@
       "license": "MIT"
     },
     "node_modules/undici": {
-      "version": "7.25.0",
-      "resolved": "https://registry.npmjs.org/undici/-/undici-7.25.0.tgz",
-      "integrity": "sha512-xXnp4kTyor2Zq+J1FfPI6Eq3ew5h6Vl0F/8d9XU5zZQf1tX9s2Su1/3PiMmUANFULpmksxkClamIZcaUqryHsQ==",
+      "version": "7.28.0",
+      "resolved": "https://registry.npmjs.org/undici/-/undici-7.28.0.tgz",
+      "integrity": "sha512-cRZYrTDwWznlnRiPjggAGxZXanty6M8RV1ff8Wm4LWXBp7/IG8v5DnOm74DtUBp9OONpK75YlPnIjQqX0dBDtA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -7586,17 +7578,17 @@
       "license": "MIT"
     },
     "node_modules/vite": {
-      "version": "8.0.14",
-      "resolved": "https://registry.npmjs.org/vite/-/vite-8.0.14.tgz",
-      "integrity": "sha512-s4BJJ+5y1pYL6Otw51FHhVJQhPnuRinKig64g/1+EUNaJsd3gCKdD31IPFvswUgW9/60QT9oFHbZHbQK5imcxw==",
+      "version": "8.0.16",
+      "resolved": "https://registry.npmjs.org/vite/-/vite-8.0.16.tgz",
+      "integrity": "sha512-h9bXPmJichP5fLmVQo3PyaGSDE2n3aPuomeAlVRm0JLmt4rY6zmPKd59HYI4LNW8oTK7tlTsuC7l/m7awx9Jcw==",
       "devOptional": true,
       "license": "MIT",
       "dependencies": {
         "lightningcss": "^1.32.0",
         "picomatch": "^4.0.4",
         "postcss": "^8.5.15",
-        "rolldown": "1.0.2",
-        "tinyglobby": "^0.2.16"
+        "rolldown": "1.0.3",
+        "tinyglobby": "^0.2.17"
       },
       "bin": {
         "vite": "bin/vite.js"
diff --git a/src/Frontend/package.json b/src/Frontend/package.json
index 81bdfa7fda..94d3cf9dce 100644
--- a/src/Frontend/package.json
+++ b/src/Frontend/package.json
@@ -76,7 +76,7 @@
     "prettier": "3.8.3",
     "typescript": "6.0.3",
     "typescript-eslint": "8.60.0",
-    "vite": "8.0.14",
+    "vite": "8.0.16",
     "vite-plugin-checker": "0.14.1",
     "vite-plugin-vue-devtools": "8.1.2",
     "vitest": "4.1.7",

From fdf6d75109e884c65decb8cf7091900770f020d7 Mon Sep 17 00:00:00 2001
From: Ramon Smits <ramon.smits@gmail.com>
Date: Fri, 19 Jun 2026 12:17:08 +0200
Subject: [PATCH 05/13] =?UTF-8?q?=F0=9F=90=9B=20Gate=20Throughput=20menu?=
 =?UTF-8?q?=20on=20admin=5Fread?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Throughput is an admin resource server-side (ServiceControl bundles
error:throughput: under the admin permission group, alongside licensing,
notifications and redirects), so the top-nav Throughput item must gate on
admin_read rather than failed_messages_read. This matches the existing
'Usage Setup' configuration tab, which already gates on admin_read.
---
 src/Frontend/src/components/PageHeader.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/Frontend/src/components/PageHeader.vue b/src/Frontend/src/components/PageHeader.vue
index 26aa848787..eed60b2778 100644
--- a/src/Frontend/src/components/PageHeader.vue
+++ b/src/Frontend/src/components/PageHeader.vue
@@ -42,7 +42,7 @@ const menuItems = computed(
   ...(has("failed_messages_read") ? [FailedMessagesMenuItem] : []),
   ...(has("failed_messages_read") ? [CustomChecksMenuItem] : []),
   ...(has("failed_messages_read") ? [EventsMenuItem] : []),
-  ...(has("failed_messages_read") ? [ThroughputMenuItem] : []),
+  ...(has("admin_read") ? [ThroughputMenuItem] : []),
   ConfigurationMenuItem,
   FeedbackButton,
 ]);

From 0fab204fb974f12c5fdf09e1600720599ab26f9b Mon Sep 17 00:00:00 2001
From: Ramon Smits <ramon.smits@gmail.com>
Date: Fri, 19 Jun 2026 12:17:44 +0200
Subject: [PATCH 06/13] =?UTF-8?q?=F0=9F=90=9B=20Gate=20user-permissions=20?=
 =?UTF-8?q?feature=20on=20supportsUserPermissions=20capability?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The supportsUserPermissions flag was computed in EnvironmentAndVersionsStore
but never consumed. Older ServiceControl versions do not expose the
my/permissions endpoints, so without this guard the app would attempt to
fetch permissions (and show the User Permissions tab) against an instance
that returns 404.

- App.vue only triggers permissionsStore.refresh() when the capability is
  present; the watch now also reacts to the flag becoming available.
- ConfigurationView only renders the User Permissions tab when ServiceControl
  advertises the endpoints, in addition to auth being enabled.
---
 src/Frontend/src/App.vue                     | 8 +++++---
 src/Frontend/src/views/ConfigurationView.vue | 4 +++-
 2 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/src/Frontend/src/App.vue b/src/Frontend/src/App.vue
index 20ce9d5768..567f2973e6 100644
--- a/src/Frontend/src/App.vue
+++ b/src/Frontend/src/App.vue
@@ -9,16 +9,18 @@ import BackendChecksNotifications from "@/components/BackendChecksNotifications.
 import { storeToRefs } from "pinia";
 import { useAuthStore } from "@/stores/AuthStore";
 import { useUserPermissionsStore } from "@/stores/UserPermissionsStore";
+import { useEnvironmentAndVersionsStore } from "@/stores/EnvironmentAndVersionsStore";
 
 const authStore = useAuthStore();
 const route = useRoute();
 const { isAuthenticated, authEnabled } = storeToRefs(authStore);
 
 const permissionsStore = useUserPermissionsStore();
+const environmentStore = useEnvironmentAndVersionsStore();
 watch(
-  [authEnabled, isAuthenticated],
-  ([enabled, authenticated]) => {
-    if (enabled && authenticated) {
+  [authEnabled, isAuthenticated, () => environmentStore.environment.supportsUserPermissions],
+  ([enabled, authenticated, supported]) => {
+    if (enabled && authenticated && supported) {
       permissionsStore.refresh();
     }
   },
diff --git a/src/Frontend/src/views/ConfigurationView.vue b/src/Frontend/src/views/ConfigurationView.vue
index 78dba05aa1..aa06643a85 100644
--- a/src/Frontend/src/views/ConfigurationView.vue
+++ b/src/Frontend/src/views/ConfigurationView.vue
@@ -13,6 +13,7 @@ import { useRedirectsStore } from "@/stores/RedirectsStore";
 import { useLicenseStore } from "@/stores/LicenseStore";
 import { useAuthStore } from "@/stores/AuthStore";
 import { useUserPermissionsStore } from "@/stores/UserPermissionsStore";
+import { useEnvironmentAndVersionsStore } from "@/stores/EnvironmentAndVersionsStore";
 
 const { store: throughputStore } = useThroughputStoreAutoRefresh();
 const { hasErrors } = storeToRefs(throughputStore);
@@ -22,6 +23,7 @@ const redirectsStore = useRedirectsStore();
 const licenseStore = useLicenseStore();
 const { licenseStatus } = licenseStore;
 const authStore = useAuthStore();
+const environmentStore = useEnvironmentAndVersionsStore();
 
 const permissionsStore = useUserPermissionsStore();
 const { summary: permSummary } = storeToRefs(permissionsStore);
@@ -151,7 +153,7 @@ function preventIfDisabled(e: Event) {
               </RouterLink>
             </h5>
           </template>
-          <h5 v-if="authStore.authEnabled" :class="{ active: isRouteSelected(routeLinks.configuration.userPermissions.link), disabled: notConnected }" @click.capture="preventIfDisabled" class="nav-item" role="tab" aria-label="user-permissions">
+          <h5 v-if="authStore.authEnabled && environmentStore.environment.supportsUserPermissions" :class="{ active: isRouteSelected(routeLinks.configuration.userPermissions.link), disabled: notConnected }" @click.capture="preventIfDisabled" class="nav-item" role="tab" aria-label="user-permissions">
             <RouterLink :to="routeLinks.configuration.userPermissions.link">User Permissions</RouterLink>
           </h5>
         </div>

From 955951a16180cd2de1538c53471055b3b418e730 Mon Sep 17 00:00:00 2001
From: Ramon Smits <ramon.smits@gmail.com>
Date: Fri, 19 Jun 2026 12:17:59 +0200
Subject: [PATCH 07/13] =?UTF-8?q?=E2=99=BB=EF=B8=8F=20Dedupe=20concurrent?=
 =?UTF-8?q?=20permission=20refreshes?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

App.vue's auth watch and the User Permissions view's onMounted both call
refresh() on load, firing two identical pairs of requests. Share a single
in-flight promise so concurrent callers reuse the same request; the slot is
released once it settles, so later refreshes still re-fetch.
---
 src/Frontend/src/stores/UserPermissionsStore.ts | 11 ++++++++++-
 1 file changed, 10 insertions(+), 1 deletion(-)

diff --git a/src/Frontend/src/stores/UserPermissionsStore.ts b/src/Frontend/src/stores/UserPermissionsStore.ts
index fd3c1f41e4..05feb55424 100644
--- a/src/Frontend/src/stores/UserPermissionsStore.ts
+++ b/src/Frontend/src/stores/UserPermissionsStore.ts
@@ -23,7 +23,16 @@ export const useUserPermissionsStore = defineStore("UserPermissionsStore", () =>
   const loading = ref(false);
   const error = ref<string | null>(null);
 
-  async function refresh() {
+  // Multiple callers can request a refresh in the same tick (the App-level watch
+  // and the User Permissions view's onMounted). Share a single in-flight request
+  // so they don't trigger duplicate fetches.
+  let inFlight: Promise<void> | null = null;
+
+  function refresh() {
+    return (inFlight ??= load().finally(() => (inFlight = null)));
+  }
+
+  async function load() {
     loading.value = true;
     error.value = null;
     try {

From c07bdccc25a431dc4dea5ee00ea22786e9f6675e Mon Sep 17 00:00:00 2001
From: Ramon Smits <ramon.smits@gmail.com>
Date: Fri, 19 Jun 2026 12:20:38 +0200
Subject: [PATCH 08/13] =?UTF-8?q?=E2=99=BB=EF=B8=8F=20Extract=20shared=20u?=
 =?UTF-8?q?sePermissionGate=20composable?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

PageHeader and ConfigurationView each defined their own permission gate.
The two predicates had drifted: PageHeader required authEnabled &&
isAuthenticated && summary, while ConfigurationView omitted isAuthenticated.
Extract a single usePermissionGate composable exposing has(flag) so both
views share identical, fail-open gating logic.
---
 src/Frontend/src/components/PageHeader.vue    | 11 ++--------
 .../src/composables/usePermissionGate.ts      | 22 +++++++++++++++++++
 src/Frontend/src/views/ConfigurationView.vue  | 17 +++++++++-----
 3 files changed, 35 insertions(+), 15 deletions(-)
 create mode 100644 src/Frontend/src/composables/usePermissionGate.ts

diff --git a/src/Frontend/src/components/PageHeader.vue b/src/Frontend/src/components/PageHeader.vue
index eed60b2778..b5c8102113 100644
--- a/src/Frontend/src/components/PageHeader.vue
+++ b/src/Frontend/src/components/PageHeader.vue
@@ -15,7 +15,7 @@ import AuditMenuItem from "./audit/AuditMenuItem.vue";
 import monitoringClient from "@/components/monitoring/monitoringClient";
 import UserProfileMenuItem from "@/components/UserProfileMenuItem.vue";
 import { useAuthStore } from "@/stores/AuthStore";
-import { useUserPermissionsStore, type PermissionsSummary } from "@/stores/UserPermissionsStore";
+import usePermissionGate from "@/composables/usePermissionGate";
 import { storeToRefs } from "pinia";
 
 const isMonitoringEnabled = monitoringClient.isMonitoringEnabled;
@@ -23,14 +23,7 @@ const isMonitoringEnabled = monitoringClient.isMonitoringEnabled;
 const authStore = useAuthStore();
 const { authEnabled, isAuthenticated } = storeToRefs(authStore);
 
-const permissionsStore = useUserPermissionsStore();
-const { summary } = storeToRefs(permissionsStore);
-
-const shouldGate = computed(() => authEnabled.value && isAuthenticated.value && summary.value !== null);
-
-function has(flag: keyof PermissionsSummary): boolean {
-  return !shouldGate.value || summary.value?.[flag] === true;
-}
+const { has } = usePermissionGate();
 
 // prettier-ignore
 const menuItems = computed(
diff --git a/src/Frontend/src/composables/usePermissionGate.ts b/src/Frontend/src/composables/usePermissionGate.ts
new file mode 100644
index 0000000000..516a3abee5
--- /dev/null
+++ b/src/Frontend/src/composables/usePermissionGate.ts
@@ -0,0 +1,22 @@
+import { computed } from "vue";
+import { storeToRefs } from "pinia";
+import { useAuthStore } from "@/stores/AuthStore";
+import { useUserPermissionsStore, type PermissionsSummary } from "@/stores/UserPermissionsStore";
+
+// Centralises the "should this UI element be shown for the current user" decision.
+// Gating only kicks in once authorization is enabled, the user is authenticated and
+// the permission summary has loaded; otherwise everything is shown (fail-open) so the
+// UI is unchanged for unauthenticated/older-ServiceControl setups. Server-side checks
+// remain the real enforcement — this only hides UI the user cannot use anyway.
+export default function usePermissionGate() {
+  const { authEnabled, isAuthenticated } = storeToRefs(useAuthStore());
+  const { summary } = storeToRefs(useUserPermissionsStore());
+
+  const shouldGate = computed(() => authEnabled.value && isAuthenticated.value && summary.value !== null);
+
+  function has(flag: keyof PermissionsSummary): boolean {
+    return !shouldGate.value || summary.value?.[flag] === true;
+  }
+
+  return { has, shouldGate };
+}
diff --git a/src/Frontend/src/views/ConfigurationView.vue b/src/Frontend/src/views/ConfigurationView.vue
index aa06643a85..0dd4f7ea68 100644
--- a/src/Frontend/src/views/ConfigurationView.vue
+++ b/src/Frontend/src/views/ConfigurationView.vue
@@ -12,7 +12,7 @@ import useConnectionsAndStatsAutoRefresh from "@/composables/useConnectionsAndSt
 import { useRedirectsStore } from "@/stores/RedirectsStore";
 import { useLicenseStore } from "@/stores/LicenseStore";
 import { useAuthStore } from "@/stores/AuthStore";
-import { useUserPermissionsStore } from "@/stores/UserPermissionsStore";
+import usePermissionGate from "@/composables/usePermissionGate";
 import { useEnvironmentAndVersionsStore } from "@/stores/EnvironmentAndVersionsStore";
 
 const { store: throughputStore } = useThroughputStoreAutoRefresh();
@@ -25,10 +25,8 @@ const { licenseStatus } = licenseStore;
 const authStore = useAuthStore();
 const environmentStore = useEnvironmentAndVersionsStore();
 
-const permissionsStore = useUserPermissionsStore();
-const { summary: permSummary } = storeToRefs(permissionsStore);
-const shouldGateConfig = computed(() => authStore.authEnabled && permSummary.value !== null);
-const hasAdminRead = computed(() => !shouldGateConfig.value || permSummary.value?.admin_read === true);
+const { has } = usePermissionGate();
+const hasAdminRead = computed(() => has("admin_read"));
 
 onMounted(async () => {
   if (notConnected.value) {
@@ -153,7 +151,14 @@ function preventIfDisabled(e: Event) {
               </RouterLink>
             </h5>
           </template>
-          <h5 v-if="authStore.authEnabled && environmentStore.environment.supportsUserPermissions" :class="{ active: isRouteSelected(routeLinks.configuration.userPermissions.link), disabled: notConnected }" @click.capture="preventIfDisabled" class="nav-item" role="tab" aria-label="user-permissions">
+          <h5
+            v-if="authStore.authEnabled && environmentStore.environment.supportsUserPermissions"
+            :class="{ active: isRouteSelected(routeLinks.configuration.userPermissions.link), disabled: notConnected }"
+            @click.capture="preventIfDisabled"
+            class="nav-item"
+            role="tab"
+            aria-label="user-permissions"
+          >
             <RouterLink :to="routeLinks.configuration.userPermissions.link">User Permissions</RouterLink>
           </h5>
         </div>

From 421103fd3046bb401832d3a781d60582f0ead07d Mon Sep 17 00:00:00 2001
From: Ramon Smits <ramon.smits@gmail.com>
Date: Fri, 19 Jun 2026 12:46:33 +0200
Subject: [PATCH 09/13] =?UTF-8?q?=E2=99=BB=EF=B8=8F=20Fetch=20permissions?=
 =?UTF-8?q?=20via=20discovered=20root=20URLs?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The permission endpoint paths were hardcoded in UserPermissionsStore even
though ServiceControl advertises them (mypermissions_summary/mypermissions_all)
in its root document. Expose those URLs from EnvironmentAndVersionsStore and
fetch them through a new serviceControlClient.fetchTypedFromUrl() helper, so
the frontend follows the server's routing instead of duplicating path knowledge.
---
 src/Frontend/src/components/serviceControlClient.ts    | 9 +++++++--
 src/Frontend/src/stores/EnvironmentAndVersionsStore.ts | 4 ++++
 src/Frontend/src/stores/UserPermissionsStore.ts        | 6 ++++--
 3 files changed, 15 insertions(+), 4 deletions(-)

diff --git a/src/Frontend/src/components/serviceControlClient.ts b/src/Frontend/src/components/serviceControlClient.ts
index 40ad24c535..9db92f3f7b 100644
--- a/src/Frontend/src/components/serviceControlClient.ts
+++ b/src/Frontend/src/components/serviceControlClient.ts
@@ -29,8 +29,13 @@ class ServiceControlClient {
     }
   }
 
-  public async fetchTypedFromServiceControl<T>(suffix: string, signal?: AbortSignal): Promise<[Response, T]> {
-    const response = await authFetch(`${this.url}${suffix}`, { signal });
+  public fetchTypedFromServiceControl<T>(suffix: string, signal?: AbortSignal): Promise<[Response, T]> {
+    return this.fetchTypedFromUrl<T>(`${this.url}${suffix}`, signal);
+  }
+
+  // Fetch from an absolute URL, e.g. one discovered from the ServiceControl root document.
+  public async fetchTypedFromUrl<T>(url: string, signal?: AbortSignal): Promise<[Response, T]> {
+    const response = await authFetch(url, { signal });
     if (!response.ok) throw new HttpError(response.status, response.statusText ?? "No response");
     const data = await response.json();
 
diff --git a/src/Frontend/src/stores/EnvironmentAndVersionsStore.ts b/src/Frontend/src/stores/EnvironmentAndVersionsStore.ts
index 3e797116cf..1ce6b4f097 100644
--- a/src/Frontend/src/stores/EnvironmentAndVersionsStore.ts
+++ b/src/Frontend/src/stores/EnvironmentAndVersionsStore.ts
@@ -18,6 +18,8 @@ export const useEnvironmentAndVersionsStore = defineStore("EnvironmentAndVersion
     sp_version: window.defaultConfig && window.defaultConfig.version ? window.defaultConfig.version : "1.2.0",
     supportsArchiveGroups: false,
     supportsUserPermissions: false,
+    mypermissions_all_url: "",
+    mypermissions_summary_url: "",
     endpoints_error_url: "",
     known_endpoints_url: "",
     endpoints_message_search_url: "",
@@ -58,6 +60,8 @@ export const useEnvironmentAndVersionsStore = defineStore("EnvironmentAndVersion
     if (scVer) {
       environment.supportsArchiveGroups = !!scVer.archived_groups_url;
       environment.supportsUserPermissions = !!scVer.mypermissions_all && !!scVer.mypermissions_summary;
+      environment.mypermissions_all_url = scVer.mypermissions_all ?? "";
+      environment.mypermissions_summary_url = scVer.mypermissions_summary ?? "";
       environment.is_compatible_with_sc = isSupported(environment.sc_version, environment.minimum_supported_sc_version);
       environment.endpoints_error_url = scVer && scVer.endpoints_error_url;
       environment.known_endpoints_url = scVer && scVer.known_endpoints_url;
diff --git a/src/Frontend/src/stores/UserPermissionsStore.ts b/src/Frontend/src/stores/UserPermissionsStore.ts
index 05feb55424..1c2df3d1f5 100644
--- a/src/Frontend/src/stores/UserPermissionsStore.ts
+++ b/src/Frontend/src/stores/UserPermissionsStore.ts
@@ -1,6 +1,7 @@
 import { acceptHMRUpdate, defineStore } from "pinia";
 import { ref } from "vue";
 import serviceControlClient from "@/components/serviceControlClient";
+import { useEnvironmentAndVersionsStore } from "@/stores/EnvironmentAndVersionsStore";
 
 interface PermissionsSummary {
   failed_messages_read: boolean;
@@ -35,10 +36,11 @@ export const useUserPermissionsStore = defineStore("UserPermissionsStore", () =>
   async function load() {
     loading.value = true;
     error.value = null;
+    const { environment } = useEnvironmentAndVersionsStore();
     try {
       const [summaryResult, descriptorResult] = await Promise.all([
-        serviceControlClient.fetchTypedFromServiceControl<PermissionsSummary>("my/permissions"),
-        serviceControlClient.fetchTypedFromServiceControl<PermissionsDescriptor>("my/permissions/all"),
+        serviceControlClient.fetchTypedFromUrl<PermissionsSummary>(environment.mypermissions_summary_url),
+        serviceControlClient.fetchTypedFromUrl<PermissionsDescriptor>(environment.mypermissions_all_url),
       ]);
       summary.value = summaryResult[1];
       descriptor.value = descriptorResult[1];

From 66cc9ef672ddd8c8c01dd1e42509bd45a42899d4 Mon Sep 17 00:00:00 2001
From: Ramon Smits <ramon.smits@gmail.com>
Date: Fri, 19 Jun 2026 12:46:49 +0200
Subject: [PATCH 10/13] =?UTF-8?q?=F0=9F=90=9B=20Log=20permission=20load=20?=
 =?UTF-8?q?failures?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The catch block discarded the underlying error, leaving no diagnostic trail
when permissions fail to load. Log it via the shared logger (as the other
stores do) while still surfacing the friendly message to the user.
---
 src/Frontend/src/stores/UserPermissionsStore.ts | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/Frontend/src/stores/UserPermissionsStore.ts b/src/Frontend/src/stores/UserPermissionsStore.ts
index 1c2df3d1f5..434adaa32b 100644
--- a/src/Frontend/src/stores/UserPermissionsStore.ts
+++ b/src/Frontend/src/stores/UserPermissionsStore.ts
@@ -2,6 +2,7 @@ import { acceptHMRUpdate, defineStore } from "pinia";
 import { ref } from "vue";
 import serviceControlClient from "@/components/serviceControlClient";
 import { useEnvironmentAndVersionsStore } from "@/stores/EnvironmentAndVersionsStore";
+import logger from "@/logger";
 
 interface PermissionsSummary {
   failed_messages_read: boolean;
@@ -44,7 +45,8 @@ export const useUserPermissionsStore = defineStore("UserPermissionsStore", () =>
       ]);
       summary.value = summaryResult[1];
       descriptor.value = descriptorResult[1];
-    } catch {
+    } catch (err) {
+      logger.error("Failed to load user permissions", err);
       error.value = "Failed to load user permissions";
     } finally {
       loading.value = false;

From 5fba84ee2f3b1f3f56da8ca4e38878a01f2ad5d4 Mon Sep 17 00:00:00 2001
From: Ramon Smits <ramon.smits@gmail.com>
Date: Fri, 19 Jun 2026 12:47:41 +0200
Subject: [PATCH 11/13] =?UTF-8?q?=F0=9F=92=84=20Use=20Bootstrap=20text-suc?=
 =?UTF-8?q?cess/text-danger=20for=20permission=20icons?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Replace the bespoke .icon-granted/.icon-denied rules (hardcoded hex colours)
with the standard Bootstrap utility classes already used elsewhere for
granted/denied FAIcons (StatusIcon, EndpointInstances, ConnectionResultView).
---
 .../configuration/UserPermissions.vue         | 22 ++++++-------------
 1 file changed, 7 insertions(+), 15 deletions(-)

diff --git a/src/Frontend/src/components/configuration/UserPermissions.vue b/src/Frontend/src/components/configuration/UserPermissions.vue
index 11b542a712..973b7b1cc2 100644
--- a/src/Frontend/src/components/configuration/UserPermissions.vue
+++ b/src/Frontend/src/components/configuration/UserPermissions.vue
@@ -33,35 +33,35 @@ onMounted(async () => {
                 <tr>
                   <td>Failed Messages</td>
                   <td class="text-center">
-                    <FAIcon :icon="store.summary.failed_messages_read ? faCheck : faTimes" :class="store.summary.failed_messages_read ? 'icon-granted' : 'icon-denied'" />
+                    <FAIcon :icon="store.summary.failed_messages_read ? faCheck : faTimes" :class="store.summary.failed_messages_read ? 'text-success' : 'text-danger'" />
                   </td>
                   <td class="text-center">
-                    <FAIcon :icon="store.summary.failed_messages_write ? faCheck : faTimes" :class="store.summary.failed_messages_write ? 'icon-granted' : 'icon-denied'" />
+                    <FAIcon :icon="store.summary.failed_messages_write ? faCheck : faTimes" :class="store.summary.failed_messages_write ? 'text-success' : 'text-danger'" />
                   </td>
                 </tr>
                 <tr>
                   <td>Auditing</td>
                   <td class="text-center">
-                    <FAIcon :icon="store.summary.auditing_read ? faCheck : faTimes" :class="store.summary.auditing_read ? 'icon-granted' : 'icon-denied'" />
+                    <FAIcon :icon="store.summary.auditing_read ? faCheck : faTimes" :class="store.summary.auditing_read ? 'text-success' : 'text-danger'" />
                   </td>
                   <td class="text-center">—</td>
                 </tr>
                 <tr>
                   <td>Monitoring</td>
                   <td class="text-center">
-                    <FAIcon :icon="store.summary.monitoring_read ? faCheck : faTimes" :class="store.summary.monitoring_read ? 'icon-granted' : 'icon-denied'" />
+                    <FAIcon :icon="store.summary.monitoring_read ? faCheck : faTimes" :class="store.summary.monitoring_read ? 'text-success' : 'text-danger'" />
                   </td>
                   <td class="text-center">
-                    <FAIcon :icon="store.summary.monitoring_write ? faCheck : faTimes" :class="store.summary.monitoring_write ? 'icon-granted' : 'icon-denied'" />
+                    <FAIcon :icon="store.summary.monitoring_write ? faCheck : faTimes" :class="store.summary.monitoring_write ? 'text-success' : 'text-danger'" />
                   </td>
                 </tr>
                 <tr>
                   <td>Admin</td>
                   <td class="text-center">
-                    <FAIcon :icon="store.summary.admin_read ? faCheck : faTimes" :class="store.summary.admin_read ? 'icon-granted' : 'icon-denied'" />
+                    <FAIcon :icon="store.summary.admin_read ? faCheck : faTimes" :class="store.summary.admin_read ? 'text-success' : 'text-danger'" />
                   </td>
                   <td class="text-center">
-                    <FAIcon :icon="store.summary.admin_write ? faCheck : faTimes" :class="store.summary.admin_write ? 'icon-granted' : 'icon-denied'" />
+                    <FAIcon :icon="store.summary.admin_write ? faCheck : faTimes" :class="store.summary.admin_write ? 'text-success' : 'text-danger'" />
                   </td>
                 </tr>
               </tbody>
@@ -92,14 +92,6 @@ onMounted(async () => {
   padding: 10px 16px;
 }
 
-.icon-granted {
-  color: #28a745;
-}
-
-.icon-denied {
-  color: #dc3545;
-}
-
 .user-label {
   color: #666;
   margin-bottom: 12px;

From 04524d19a212cadea1af36a8e79f69d6414b8f88 Mon Sep 17 00:00:00 2001
From: Ramon Smits <ramon.smits@gmail.com>
Date: Fri, 19 Jun 2026 15:43:48 +0200
Subject: [PATCH 12/13] =?UTF-8?q?=E2=9C=85=20Test=20usePermissionGate=20fa?=
 =?UTF-8?q?il-open=20and=20per-flag=20gating?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Covers the gate's core contract: it fails open (shows everything) when
authorization is disabled, when the user is unauthenticated, or while the
summary is still loading; and gates per flag once enabled, authenticated and
loaded. Also asserts it reacts to summary updates.
---
 .../src/composables/usePermissionGate.spec.ts | 75 +++++++++++++++++++
 1 file changed, 75 insertions(+)
 create mode 100644 src/Frontend/src/composables/usePermissionGate.spec.ts

diff --git a/src/Frontend/src/composables/usePermissionGate.spec.ts b/src/Frontend/src/composables/usePermissionGate.spec.ts
new file mode 100644
index 0000000000..a76ed96c60
--- /dev/null
+++ b/src/Frontend/src/composables/usePermissionGate.spec.ts
@@ -0,0 +1,75 @@
+import { describe, test, expect, beforeEach } from "vitest";
+import { createTestingPinia } from "@pinia/testing";
+import { setActivePinia } from "pinia";
+import usePermissionGate from "@/composables/usePermissionGate";
+import { useAuthStore } from "@/stores/AuthStore";
+import { useUserPermissionsStore, type PermissionsSummary } from "@/stores/UserPermissionsStore";
+
+const summaryWith = (overrides: Partial<PermissionsSummary> = {}): PermissionsSummary => ({
+  failed_messages_read: false,
+  failed_messages_write: false,
+  auditing_read: false,
+  monitoring_read: false,
+  monitoring_write: false,
+  admin_read: false,
+  admin_write: false,
+  ...overrides,
+});
+
+describe("usePermissionGate", () => {
+  beforeEach(() => {
+    setActivePinia(createTestingPinia({ stubActions: false }));
+  });
+
+  function withState(opts: { authEnabled: boolean; isAuthenticated: boolean; summary: PermissionsSummary | null }) {
+    const auth = useAuthStore();
+    auth.authEnabled = opts.authEnabled;
+    auth.isAuthenticated = opts.isAuthenticated;
+    useUserPermissionsStore().summary = opts.summary;
+    return usePermissionGate();
+  }
+
+  test("fails open (shows everything) when authorization is disabled", () => {
+    const { has, shouldGate } = withState({ authEnabled: false, isAuthenticated: true, summary: summaryWith() });
+
+    expect(shouldGate.value).toBe(false);
+    expect(has("admin_read")).toBe(true);
+    expect(has("failed_messages_read")).toBe(true);
+  });
+
+  test("fails open when the user is not authenticated", () => {
+    const { has, shouldGate } = withState({ authEnabled: true, isAuthenticated: false, summary: summaryWith() });
+
+    expect(shouldGate.value).toBe(false);
+    expect(has("admin_read")).toBe(true);
+  });
+
+  test("fails open while the permission summary has not loaded yet", () => {
+    const { has, shouldGate } = withState({ authEnabled: true, isAuthenticated: true, summary: null });
+
+    expect(shouldGate.value).toBe(false);
+    expect(has("admin_read")).toBe(true);
+  });
+
+  test("gates per flag once enabled, authenticated and loaded", () => {
+    const { has, shouldGate } = withState({ authEnabled: true, isAuthenticated: true, summary: summaryWith({ admin_read: true }) });
+
+    expect(shouldGate.value).toBe(true);
+    expect(has("admin_read")).toBe(true);
+    expect(has("failed_messages_read")).toBe(false);
+  });
+
+  test("reacts to the summary being updated", () => {
+    const auth = useAuthStore();
+    auth.authEnabled = true;
+    auth.isAuthenticated = true;
+    const permissions = useUserPermissionsStore();
+    permissions.summary = summaryWith();
+
+    const { has } = usePermissionGate();
+    expect(has("monitoring_read")).toBe(false);
+
+    permissions.summary = summaryWith({ monitoring_read: true });
+    expect(has("monitoring_read")).toBe(true);
+  });
+});

From d14a57343445085017387c38a69e1407a31b67b2 Mon Sep 17 00:00:00 2001
From: Ramon Smits <ramon.smits@gmail.com>
Date: Fri, 19 Jun 2026 15:44:36 +0200
Subject: [PATCH 13/13] =?UTF-8?q?=E2=9C=85=20Test=20UserPermissionsStore?=
 =?UTF-8?q?=20load,=20error=20and=20dedupe=20behaviour?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Covers: a successful refresh fetches the discovered root URLs and populates
summary+descriptor; a failed request sets the friendly error and logs the
cause; and concurrent refresh() calls share one in-flight request (two
endpoint calls, not four) while still re-fetching once settled.
---
 .../src/stores/UserPermissionsStore.spec.ts   | 89 +++++++++++++++++++
 1 file changed, 89 insertions(+)
 create mode 100644 src/Frontend/src/stores/UserPermissionsStore.spec.ts

diff --git a/src/Frontend/src/stores/UserPermissionsStore.spec.ts b/src/Frontend/src/stores/UserPermissionsStore.spec.ts
new file mode 100644
index 0000000000..e73270c92b
--- /dev/null
+++ b/src/Frontend/src/stores/UserPermissionsStore.spec.ts
@@ -0,0 +1,89 @@
+import { describe, test, expect, beforeEach, vi } from "vitest";
+import { createTestingPinia } from "@pinia/testing";
+import { setActivePinia } from "pinia";
+
+vi.mock("@/components/serviceControlClient", () => ({
+  default: { fetchTypedFromUrl: vi.fn() },
+}));
+
+import serviceControlClient from "@/components/serviceControlClient";
+import logger from "@/logger";
+import { useUserPermissionsStore } from "@/stores/UserPermissionsStore";
+import { useEnvironmentAndVersionsStore } from "@/stores/EnvironmentAndVersionsStore";
+
+const summaryUrl = "http://localhost/my/permissions";
+const allUrl = "http://localhost/my/permissions/all";
+
+const fetchTypedFromUrl = vi.mocked(serviceControlClient.fetchTypedFromUrl);
+
+const summaryData = { failed_messages_read: true, failed_messages_write: false, auditing_read: true, monitoring_read: false, monitoring_write: false, admin_read: false, admin_write: false };
+const descriptorData = { user: "alice", permissions: ["error:messages:view", "audit:view"] };
+
+function ok<T>(data: T): [Response, T] {
+  return [{} as Response, data];
+}
+
+function setup() {
+  setActivePinia(createTestingPinia({ stubActions: false }));
+  const environment = useEnvironmentAndVersionsStore().environment;
+  environment.mypermissions_summary_url = summaryUrl;
+  environment.mypermissions_all_url = allUrl;
+  return useUserPermissionsStore();
+}
+
+describe("UserPermissionsStore", () => {
+  beforeEach(() => {
+    fetchTypedFromUrl.mockReset();
+  });
+
+  test("refresh fetches the discovered URLs and populates summary and descriptor", async () => {
+    const store = setup();
+    fetchTypedFromUrl.mockImplementation((url: string) => Promise.resolve(url === summaryUrl ? ok(summaryData) : ok(descriptorData)));
+
+    await store.refresh();
+
+    expect(fetchTypedFromUrl).toHaveBeenCalledWith(summaryUrl);
+    expect(fetchTypedFromUrl).toHaveBeenCalledWith(allUrl);
+    expect(store.summary).toEqual(summaryData);
+    expect(store.descriptor).toEqual(descriptorData);
+    expect(store.error).toBeNull();
+    expect(store.loading).toBe(false);
+  });
+
+  test("refresh records an error and logs when a request fails", async () => {
+    const store = setup();
+    const loggerError = vi.spyOn(logger, "error").mockImplementation(() => {});
+    const failure = new Error("boom");
+    fetchTypedFromUrl.mockRejectedValue(failure);
+
+    await store.refresh();
+
+    expect(store.summary).toBeNull();
+    expect(store.error).toBe("Failed to load user permissions");
+    expect(store.loading).toBe(false);
+    expect(loggerError).toHaveBeenCalledWith("Failed to load user permissions", failure);
+    loggerError.mockRestore();
+  });
+
+  test("concurrent refreshes share a single in-flight request", async () => {
+    const store = setup();
+    let resolveSummary: (value: [Response, typeof summaryData]) => void = () => {};
+    const pendingSummary = new Promise<[Response, typeof summaryData]>((resolve) => (resolveSummary = resolve));
+    fetchTypedFromUrl.mockImplementation((url: string) => (url === summaryUrl ? pendingSummary : Promise.resolve(ok(descriptorData))));
+
+    const first = store.refresh();
+    const second = store.refresh();
+
+    // One load in flight => two endpoint calls (summary + descriptor), not four.
+    expect(fetchTypedFromUrl).toHaveBeenCalledTimes(2);
+
+    resolveSummary(ok(summaryData));
+    await Promise.all([first, second]);
+
+    expect(store.summary).toEqual(summaryData);
+
+    // Once settled the in-flight slot is released, so a later refresh fetches again.
+    await store.refresh();
+    expect(fetchTypedFromUrl).toHaveBeenCalledTimes(4);
+  });
+});