♻️ refactor(frontend): split HealthDashboard into smart wrapper + dumb View for state-based stories

User feedback (PR #32 commit, T13 follow-up): HealthDashboard.stories.ts could not
demonstrate Loading or Error states because the component used useFetch internally
and didn't accept props. Same limitation made unit-testing the rendering branches
impossible without mocking the Nuxt fetch layer.

Split into 2 files (SRP / DDD modular per code-reviewer skill):

- HealthDashboardView.vue (NEW): pure presentational, accepts data/pending/error
  as props. Adds explicit data-testid="health-loading" + "health-error" so e2e and
  unit tests can target each branch.
- HealthDashboard.vue (REFACTORED): now a thin smart wrapper that calls
  useFetch('/api/healthz') and forwards data/pending/error to HealthDashboardView.

Stories:
- HealthDashboardView.stories.ts (NEW): 4 stories — Healthy, Loading, ErrorState,
  HealthyHighUptime. Reviewers can now see all branches without running the backend.
- HealthDashboard.stories.ts: still has the Default story for the wrapper (smoke).

Tooling:
- shims-vue.d.ts: Vue file module declaration with permissive any-typing for the
  DefineComponent. Required because Vue 3 strict TS + Storybook propagates prop
  types poorly through .vue imports otherwise (false-positive TS2353 errors).

Backwards compatibility:
- pages/index.vue still imports <HealthDashboard /> (unchanged).
- All existing data-testid attributes preserved (health-dashboard, health-info,
  health-status). The new health-loading and health-error testids are additive.
- The Playwright tests from PR #32 continue to pass without modification.

🤖 Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

frontend/components/HealthDashboard.stories.ts

@@ -5,6 +5,16 @@ const meta: Meta<typeof HealthDashboard> = {
   title: 'Components/HealthDashboard',
   component: HealthDashboard,
   tags: ['autodocs'],
+  parameters: {
+    docs: {
+      description: {
+        component:
+          'Smart wrapper that calls /api/healthz internally and delegates rendering to HealthDashboardView. ' +
+          'For state-by-state previews (Healthy, Loading, Error), see ' +
+          '[HealthDashboardView stories](?path=/docs/components-healthdashboardview--docs).',
+      },
+    },
+  },
 }
 export default meta
 
@@ -14,20 +24,3 @@ type Story = StoryObj<typeof meta>
 export const Default: Story = {
   args: {},
 }
-
-// Documents the loading/error visuals so reviewers see them in Storybook
-// without needing a backend down. The component currently doesn't accept overrides
-// because it uses useFetch internally - this story is a placeholder for a future
-// refactor that exposes data/pending/error as props for testability.
-export const DocumentationStub: Story = {
-  args: {},
-  parameters: {
-    docs: {
-      description: {
-        story:
-          'Renders the same as Default. The HealthDashboard fetches /api/healthz internally, so loading/error states only appear when the backend is down or slow. ' +
-          'Future improvement: accept healthData/pending/error as props for easy state-based stories. Until then, see frontend/docs/e2e/ for screenshots of both healthy and error states.',
-      },
-    },
-  },
-}