Deploy hyper3labs/HyperView-VisA-Manufacturing from Hyper3Labs/hyperview-spaces@f672a3d

.hyperview/extensions/manufacturing-readout/panel.js

@@ -1,9 +1,10 @@
 const sdk = globalThis.HyperViewPanelSDK;
-if (!sdk) throw new Error("HyperViewPanelSDK is not available on window.");
+if (!sdk || sdk.version !== "2") {
+  throw new Error("HyperViewPanelSDK v2 is not available on window.");
+}
 
-const { React, components, hooks } = sdk;
-const { Panel } = components;
-const { usePanelCommands, usePanelProps, usePanelRuntimeState } = hooks;
+const { React, hooks } = sdk;
+const { useActiveLayout, useCommandClient, usePanelActions, usePanelState } = hooks;
 
 const colors = {
   panelBg: "#10151f",
@@ -476,17 +477,27 @@ function WalkthroughCard({ item, models, onSelectQuery, loadingKey, activeModelK
 }
 
 export default function ManufacturingPanel() {
-  const props = usePanelProps() || {};
-  const commands = usePanelCommands();
-  const runtimeState = usePanelRuntimeState ? usePanelRuntimeState() : {};
+  const { props = {}, state = {}, patchState } = usePanelState();
+  const { runCommand } = useCommandClient();
+  const { setActiveLayout } = useActiveLayout();
+  const { focusPanel } = usePanelActions();
   const models = normalizeModels(props.models);
   const examples = Array.isArray(props.examples) ? props.examples : [];
   const primaryExample = examples.find((item) => item.id === "fryum") || examples[0] || null;
   const [loadingKey, setLoadingKey] = React.useState(null);
   const [panelError, setPanelError] = React.useState(null);
-  const [activeChoice, setActiveChoice] = React.useState(null);
-  const [activeModelKey, setActiveModelKey] = React.useState(null);
-  const statusChoice = choiceFromSimilarity(runtimeState.activeSimilarityQuery, examples, models) || activeChoice;
+  const activeModelKey = typeof state.activeModelKey === "string" ? state.activeModelKey : null;
+  const activeSampleId = typeof state.activeSampleId === "string" ? state.activeSampleId : null;
+  const statusChoice = choiceFromSimilarity(
+    activeSampleId
+      ? {
+          anchor_sample_id: activeSampleId,
+          source: `manufacturing-demo:${activeModelKey || ""}`,
+        }
+      : null,
+    examples,
+    models,
+  );
 
   const onSelectQuery = React.useCallback(
     async (sampleId, model) => {
@@ -494,35 +505,23 @@ export default function ManufacturingPanel() {
         setPanelError("Could not show neighbors: this example is missing a query or layout key.");
         return;
       }
-      if (!commands) {
-        setPanelError("Could not show neighbors: HyperView panel commands are unavailable in this panel host.");
-        return;
-      }
       const choiceKey = `${sampleId}:${model.key}`;
       const item = examples.find((example) => example.queryId === sampleId);
       const metric = advantageMetric(model.key, item?.id);
-      const nextChoice = {
-        modelKey: model.key,
-        modelName: model.displayName,
-        queryLabel: title(item?.queryLabel || "fryum"),
-        metricLine: metric?.line || null,
-      };
       setPanelError(null);
-      setActiveModelKey(model.key);
-      setActiveChoice(nextChoice);
       setLoadingKey(choiceKey);
       try {
-        await commands.setActiveLayout(model.layoutKey, { persist: true });
-        await commands.showSimilar({
-          sampleId,
-          layoutKey: model.layoutKey,
-          k: 10,
-          source: `manufacturing-demo:${model.key}`,
-          focus: "samples",
-          persist: true,
+        await setActiveLayout(model.layoutKey);
+        await runCommand("collection.neighbors.create", {
+          args: {
+            sample_id: sampleId,
+            layout_key: model.layoutKey,
+            k: 10,
+            source: `manufacturing-demo:${model.key}`,
+          },
         });
-        setActiveChoice(nextChoice);
-        setActiveModelKey(model.key);
+        await patchState({ activeModelKey: model.key, activeSampleId: sampleId });
+        await focusPanel("manufacturing-neighbors");
       } catch (error) {
         const message = error instanceof Error ? error.message : String(error);
         setPanelError(`Could not show neighbors: ${message}`);
@@ -530,11 +529,11 @@ export default function ManufacturingPanel() {
         setLoadingKey(null);
       }
     },
-    [commands, examples],
+    [examples, focusPanel, patchState, runCommand, setActiveLayout],
   );
 
   return React.createElement(
-    Panel,
+    "main",
     {
       style: {
         background: colors.panelBg,

README.md

@@ -56,7 +56,7 @@ Run locally from the HyperView repo:
 
 ```bash
 VISA_SAMPLES_PER_CATEGORY=12 HYPERVIEW_PORT=6265 \
-  uv run python hyperview-spaces/spaces/manufacturing-visa-reference-clip-hyper3clip/demo.py
+  uv run python hyperview-spaces/demos/manufacturing-visa-reference-clip-hyper3clip/demo.py
 ```
 
 The Docker image installs the bundled latest HyperView wheel for this repo and

demo.py

@@ -17,7 +17,6 @@ from typing import Any
 from PIL import Image, ImageOps
 
 import hyperview as hv
-from hyperview.core.dataset import Sample
 
 SPACE_DIR = Path(__file__).resolve().parent
 SPACE_HOST = os.environ.get("HYPERVIEW_HOST", "127.0.0.1")
@@ -249,7 +248,7 @@ def select_visa_records() -> list[dict[str, Any]]:
 def add_visa_samples(dataset: hv.Dataset) -> None:
     existing_ids = {sample.id for sample in dataset.samples}
     media_dir = media_root()
-    samples: list[Sample] = []
+    samples: list[hv.Sample] = []
     for record in select_visa_records():
         sample_id = safe_sample_id(record["category"], record["split_name"], record["row_index"], record["defect_label"])
         destination = Path(record["local_path"]) if record.get("local_path") else media_dir / f"{sample_id}.jpg"
@@ -265,7 +264,7 @@ def add_visa_samples(dataset: hv.Dataset) -> None:
             "source_dataset": "BrachioLab/visa",
         }
         samples.append(
-            Sample(
+                hv.Sample(
                 id=sample_id,
                 filepath=str(destination),
                 label=record["category"],