Fleet console gap closures: critical tile, filters, policy card, action placement

frontend/src/api/index.js

@@ -159,6 +159,9 @@ export const endpointsApi = {
   dashboardSummary() {
     return api.get('/endpoints/dashboard/summary')
   },
+  dashboardStability() {
+    return api.get('/endpoints/dashboard/stability')
+  },
   list(params = {}) {
     return api.get('/endpoints', { params })
   },

frontend/src/components/AssetTriageBand.vue

@@ -36,6 +36,15 @@
       <span class="triage-label">Location</span>
       <span class="triage-value">{{ locationname }}</span>
     </div>
+
+    <!-- Actions that act on the THING, not on its record. A page fills this
+         with its own verbs - restart a PC, calibrate a measuring tool - so the
+         band stays generic while the button sits beside the state it changes
+         and the machine it would take down with it. Record actions (edit,
+         retire, print, back) stay in the page header where they belong. -->
+    <div v-if="$slots.actions" class="triage-actions">
+      <slot name="actions"></slot>
+    </div>
   </div>
 </template>
 
@@ -52,7 +61,7 @@
  * because a machine stops without it, and that fact was buried in the generic
  * relationships card near the bottom of the page.
  */
-import { ref, computed, onMounted, watch } from 'vue'
+import { ref, computed, onMounted, watch, useSlots } from 'vue'
 import api from '@/api'
 
 const props = defineProps({
@@ -67,7 +76,10 @@ const props = defineProps({
 
 const machines = ref([])
 
+const slots = useSlots()
+
 const hasAnything = computed(() =>
+  Boolean(slots.actions) ||
   Boolean(props.liveness) ||
   machines.value.length > 0 ||
   (props.accessmethods && props.accessmethods.length > 0) ||
@@ -122,6 +134,14 @@ function collect(edge, other, found) {
   gap: 0.3rem;
 }
 
+.triage-actions {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.5rem;
+  align-items: center;
+  margin-left: auto;
+}
+
 .triage-label {
   font-size: 0.72rem;
   letter-spacing: 0.06em;