Fix stale identifier flags: refresh composable on Settings toggle

The identifier-flags composable fetched settings once and cached them in a
module singleton, so toggling an identifier in Settings (gauge/maintenance/FQDN
per asset type) did not take effect on already-open asset views until a full
page reload. Disabled identifiers kept showing.

- identifierSettings.js: extract applySetting/fetchFlags; export
  reloadIdentifierFlags() and setIdentifierFlag(name, assettype, enabled) to
  mutate the shared reactive state.
- SystemSettings.vue: push each successful matrix toggle into the shared state
  via setIdentifierFlag so dependent views react immediately.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

frontend/src/composables/identifierSettings.js

@@ -14,28 +14,48 @@ const state = reactive({
 
 let inflight = null
 
-function loadFlags() {
+const KEY_RE = /^identifier_(.+?)(?:_(equipment|computer|printer|network_device))?_enabled$/
-  if (!state.loaded && !inflight) {
+
-    inflight = settingsApi.list()
+function applySetting(key, value) {
-      .then(({ data }) => {
+  const match = KEY_RE.exec(key)
-        ;(data.data || []).forEach(s => {
+  if (!match) return
-          const match = /^identifier_(.+?)(?:_(equipment|computer|printer|network_device))?_enabled$/.exec(s.key)
+  const name = match[1]
-          if (!match) return
+  const assettype = match[2]
-          const name = match[1]
+  if (assettype) {
-          const assettype = match[2]
+    if (!state.scope[name]) state.scope[name] = {}
-          if (assettype) {
+    state.scope[name][assettype] = value !== false
-            if (!state.scope[name]) state.scope[name] = {}
+  } else {
-            state.scope[name][assettype] = s.value !== false
+    state.legacy[name] = value !== false
-          } else {
-            state.legacy[name] = s.value !== false
-          }
-        })
-        state.loaded = true
-      })
-      .catch(() => { state.loaded = true })
   }
 }
 
+function fetchFlags() {
+  inflight = settingsApi.list()
+    .then(({ data }) => {
+      ;(data.data || []).forEach(s => applySetting(s.key, s.value))
+      state.loaded = true
+    })
+    .catch(() => { state.loaded = true })
+    .finally(() => { inflight = null })
+  return inflight
+}
+
+function loadFlags() {
+  if (!state.loaded && !inflight) fetchFlags()
+}
+
+// Re-read flags from the server. Call after an identifier setting changes so
+// other open views pick it up without a full page reload.
+export function reloadIdentifierFlags() {
+  return fetchFlags()
+}
+
+// Optimistically update one flag in the shared state (e.g. right after a
+// Settings toggle) so dependent views react immediately.
+export function setIdentifierFlag(name, assettype, enabled) {
+  applySetting(`identifier_${name}_${assettype}_enabled`, enabled)
+}
+
 // True when identifier `name` should show on `assettype`. Per-type flag wins,
 // then the legacy global flag, then default-on.
 function isEnabled(name, assettype) {

frontend/src/views/settings/SystemSettings.vue

@@ -423,6 +423,7 @@
 <script setup>
 import { ref, reactive, onMounted, computed } from 'vue'
 import { settingsApi } from '../../api'
+import { setIdentifierFlag } from '../../composables/identifierSettings'
 
 const settings = reactive({
   // Zabbix
@@ -577,6 +578,9 @@ async function toggleIdentifier(name, assettype) {
       }
     }
     identifierMatrix[key] = newValue
+    // Push into the shared composable so open asset views react without a
+    // full page reload (the composable otherwise fetches only once).
+    setIdentifierFlag(name, assettype, newValue)
     success.value = 'Setting saved'
     setTimeout(() => { success.value = '' }, 2000)
   } catch (e) {