fix(ui): harden public page components

packages/ui/components/MetricGrid.wrn

@@ -92,7 +92,9 @@ component MetricGrid {
               @action='forwardAction(item, itemIndex, event)'
             />
           {:empty}
-            <slot></slot>
+            <div class="wrn-metric-grid__empty" role="status">
+              <slot>No metrics are available.</slot>
+            </div>
           {/each}
         </div>
       </div>
@@ -100,6 +102,15 @@ component MetricGrid {
   }
 
   style {
+    .wrn-metric-grid__empty {
+      grid-column: 1 / -1;
+      padding: 1.25rem;
+      color: var(--wrn-color-text-muted);
+      background: var(--wrn-color-surface-soft);
+      border: 1px dashed var(--wrn-color-border);
+      border-radius: 0.9rem;
+      text-align: center;
+    }
     .wrn-metric-grid__frame {
       width: 100%;
       min-width: 0;