Add dataset library, extract-to-dataset, and render-time reference resolution

src/app/components/LivePreview.tsx

@@ -16,12 +16,14 @@
  */
 
 import { useEffect, useRef } from 'react';
+import { useShallow } from 'zustand/react/shallow';
 import type { VisualizationSpec } from 'vega-embed';
 import type { FitMode } from '@core/rendering';
-import { prepareSpecForRender } from '@core/rendering';
+import { DatasetNotFoundError, prepareSpecForRender } from '@core/rendering';
 import { chartConfigFor } from '@core/vega-themes';
 import { renderSpec, type RenderHandle } from '../services/chart-renderer';
 import { useAppStore } from '../stores/AppStore';
+import { useDatasetStore } from '../stores/DatasetStore';
 import { usePreviewStore } from '../stores/PreviewStore';
 import { selectShownText, useSnippetStore } from '../stores/SnippetStore';
 import { SegmentedControl, type SegmentedOption } from './SegmentedControl';
@@ -73,6 +75,9 @@ export function LivePreview() {
   const shownText = useSnippetStore(selectShownText);
   const fitMode = useAppStore((s) => s.previewFitMode);
   const uiTheme = useAppStore((s) => s.uiTheme);
+  // Datasets feed reference resolution (spec §04 step 1). Re-rendering on a
+  // dataset change keeps a referencing chart live as its data is edited.
+  const datasets = useDatasetStore(useShallow((s) => s.datasets));
   const error = usePreviewStore((s) => s.error);
   const setError = usePreviewStore((s) => s.setError);
 
@@ -107,7 +112,7 @@ export function LivePreview() {
 
         const mine = ++generationRef.current;
         try {
-          const prepared = prepareSpecForRender(parsed, { fitMode });
+          const prepared = prepareSpecForRender(parsed, { fitMode, datasets });
           const config = chartConfigFor(uiTheme);
           handleRef.current?.destroy();
           handleRef.current = null;
@@ -126,17 +131,27 @@ export function LivePreview() {
           setError(null);
         } catch (e) {
           if (mine === generationRef.current) {
-            setError(
-              `Rendering error: ${(e as Error).message}. ` +
-                `Check your JSON syntax and that the spec is valid Vega-Lite.`,
-            );
+            // A missing dataset reference is not a JSON/spec problem, so it gets a
+            // tailored, fixable message instead of the generic syntax hint (council:
+            // GOV.UK error-message + NN/g #9 — name the problem, give the real fix).
+            if (e instanceof DatasetNotFoundError) {
+              setError(
+                `Dataset "${e.datasetName}" not found. Create it from Datasets ` +
+                  `(⌘/Ctrl+K), or check the dataset name in your spec.`,
+              );
+            } else {
+              setError(
+                `Rendering error: ${(e as Error).message}. ` +
+                  `Check your JSON syntax and that the spec is valid Vega-Lite.`,
+              );
+            }
           }
         }
       })();
     }, RENDER_DEBOUNCE_MS);
 
     return () => clearTimeout(timer);
-  }, [shownText, fitMode, uiTheme, setError]);
+  }, [shownText, fitMode, uiTheme, datasets, setError]);
 
   // Re-fit the chart when its container resizes (e.g. a pane drag). Vega doesn't
   // observe the element, so we do: one observer on the stable host node for the