@viamrobotics/motion-tools 1.13.0 → 1.14.0

package/dist/hooks/useDrawAPI.svelte.js

@@ -39,7 +39,7 @@ const tryParse = (json) => {
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 const lowercaseKeys = (obj) => {
     if (Array.isArray(obj)) {
-        return obj.map(lowercaseKeys);
+        return obj.map((item) => lowercaseKeys(item));
     }
     else if (obj && typeof obj === 'object' && obj.constructor === Object) {
         return Object.fromEntries(Object.entries(obj).map(([k, v]) => [k.toLowerCase(), lowercaseKeys(v)]));

package/dist/hooks/useFramelessComponents.svelte.js

@@ -12,7 +12,7 @@ export const provideFramelessComponents = () => {
             .map((component) => component.name) ?? [];
         const fragmentComponentsWithNoFrame = [];
         for (const fragmentComponentName of Object.keys(partConfig.componentNameToFragmentId)) {
-            if (frames.current.find((frame) => frame.referenceFrame === fragmentComponentName)) {
+            if (frames.current.some((frame) => frame.referenceFrame === fragmentComponentName)) {
                 continue;
             }
             fragmentComponentsWithNoFrame.push(fragmentComponentName);

package/dist/hooks/useFrames.svelte.js

@@ -1,6 +1,7 @@
 import { getContext, setContext, untrack } from 'svelte';
 import { MachineConnectionEvent, Transform } from '@viamrobotics/sdk';
 import { useRobotClient, createRobotQuery, useMachineStatus, useConnectionStatus, } from '@viamrobotics/svelte-sdk';
+import {} from 'koota';
 import { useLogs } from './useLogs.svelte';
 import { resourceNameToColor } from '../color';
 import { useEnvironment } from './useEnvironment.svelte';
@@ -8,6 +9,7 @@ import { createPose } from '../transform';
 import { useResourceByName } from './useResourceByName.svelte';
 import { traits, useWorld } from '../ecs';
 import { useConfigFrames } from './useConfigFrames.svelte';
+import { updateGeometryTrait } from '../ecs/traits';
 const key = Symbol('frames-context');
 export const provideFrames = (partID) => {
     const configFrames = useConfigFrames();
@@ -68,72 +70,76 @@ export const provideFrames = (partID) => {
         }
     });
     $effect.pre(() => {
-        for (const frame of current) {
-            if (frame === undefined) {
-                continue;
-            }
-            const name = frame.referenceFrame;
-            const parent = frame.poseInObserverFrame?.referenceFrame;
-            const pose = createPose(frame.poseInObserverFrame?.pose);
-            const center = frame.physicalObject?.center
-                ? createPose(frame.physicalObject.center)
-                : undefined;
-            const resourceName = resourceByName.current[frame.referenceFrame];
-            const color = resourceNameToColor(resourceName);
-            const existing = entities.get(name);
-            if (existing) {
-                if (!parent || parent === 'world') {
-                    existing.remove(traits.Parent);
+        const currentResourcesByName = resourceByName.current;
+        const currentPartID = partID();
+        // We only want to update whenever "current" or "resourceByName.current" changes
+        // eslint-disable-next-line @typescript-eslint/no-unused-expressions
+        current.length;
+        untrack(() => {
+            const active = {};
+            for (const frame of current) {
+                const name = frame.referenceFrame;
+                const entityKey = `${currentPartID}:${name}`;
+                active[entityKey] = true;
+                const parent = frame.poseInObserverFrame?.referenceFrame;
+                const pose = createPose(frame.poseInObserverFrame?.pose);
+                const center = frame.physicalObject?.center
+                    ? createPose(frame.physicalObject.center)
+                    : undefined;
+                const resourceName = currentResourcesByName[frame.referenceFrame];
+                const color = resourceNameToColor(resourceName);
+                const existing = entities.get(entityKey);
+                if (existing) {
+                    if (!parent || parent === 'world') {
+                        existing.remove(traits.Parent);
+                    }
+                    else if (parent && existing.has(traits.Parent)) {
+                        existing.set(traits.Parent, parent);
+                    }
+                    else {
+                        existing.add(traits.Parent(parent));
+                    }
+                    if (color) {
+                        existing.set(traits.Color, color);
+                    }
+                    if (center) {
+                        existing.set(traits.Center, center);
+                    }
+                    updateGeometryTrait(existing, frame.physicalObject);
+                    existing.set(traits.EditedPose, pose);
+                    continue;
                 }
-                else if (parent && existing.has(traits.Parent)) {
-                    existing.set(traits.Parent, parent);
-                }
-                else {
-                    existing.add(traits.Parent(parent));
+                const entityTraits = [
+                    traits.Name(name),
+                    traits.Pose(pose),
+                    traits.EditedPose(pose),
+                    traits.FramesAPI,
+                    traits.ShowAxesHelper,
+                ];
+                if (parent && parent !== 'world') {
+                    entityTraits.push(traits.Parent(parent));
                 }
                 if (color) {
-                    existing.set(traits.Color, color);
+                    entityTraits.push(traits.Color(color));
                 }
                 if (center) {
-                    existing.set(traits.Center, center);
+                    entityTraits.push(traits.Center(center));
                 }
-                existing.remove(traits.Box, traits.Sphere, traits.BufferGeometry, traits.Capsule);
                 if (frame.physicalObject) {
-                    const geometry = traits.Geometry(frame.physicalObject);
-                    existing.add(geometry);
+                    entityTraits.push(traits.Geometry(frame.physicalObject));
                 }
-                existing.set(traits.EditedPose, pose);
-                continue;
-            }
-            const entityTraits = [
-                traits.Name(name),
-                traits.Pose(pose),
-                traits.EditedPose(pose),
-                traits.FramesAPI,
-                traits.ShowAxesHelper,
-            ];
-            if (parent && parent !== 'world') {
-                entityTraits.push(traits.Parent(parent));
+                const entity = world.spawn(...entityTraits);
+                entities.set(entityKey, entity);
             }
-            if (color) {
-                entityTraits.push(traits.Color(color));
-            }
-            if (center) {
-                entityTraits.push(traits.Center(center));
-            }
-            if (frame.physicalObject) {
-                entityTraits.push(traits.Geometry(frame.physicalObject));
-            }
-            const entity = world.spawn(...entityTraits);
-            entities.set(name, entity);
-        }
-        // Clean up non-active entities
-        for (const [name, entity] of entities) {
-            if (!frames[name]) {
-                entity?.destroy();
-                entities.delete(name);
+            // Clean up non-active entities
+            for (const [entityKey, entity] of entities) {
+                if (!active[entityKey]) {
+                    entity?.destroy();
+                    entities.delete(entityKey);
+                    continue;
+                }
             }
-        }
+        });
     });
     setContext(key, {
         get current() {

package/dist/hooks/useGeometries.svelte.js

@@ -11,6 +11,7 @@ import {} from 'koota';
 import { createPose } from '../transform';
 import { RefetchRates } from '../components/overlay/RefreshRate.svelte';
 import { useEnvironment } from './useEnvironment.svelte';
+import { updateGeometryTrait } from '../ecs/traits';
 const key = Symbol('geometries-context');
 const colorUtil = new Color();
 export const provideGeometries = (partID) => {
@@ -39,6 +40,7 @@ export const provideGeometries = (partID) => {
     const gripperQueries = $derived(gripperClients.map((client) => [client.current?.name, createResourceQuery(client, 'getGeometries', () => options)]));
     const cameraQueries = $derived(cameraClients.map((client) => [client.current?.name, createResourceQuery(client, 'getGeometries', () => options)]));
     const gantryQueries = $derived(gantryClients.map((client) => [client.current?.name, createResourceQuery(client, 'getGeometries', () => options)]));
+    const queries = $derived([...armQueries, ...gripperQueries, ...cameraQueries, ...gantryQueries]);
     $effect(() => {
         if (interval === RefetchRates.FPS_30 || interval === RefetchRates.FPS_60) {
             return logs.add(`Fetching geometries every ${interval}ms...`);
@@ -56,49 +58,70 @@ export const provideGeometries = (partID) => {
             });
         }
     });
-    const queries = $derived([...armQueries, ...gripperQueries, ...cameraQueries, ...gantryQueries]);
     const entities = new Map();
+    const queryEntityKeys = new Map();
     $effect(() => {
-        const active = {};
+        const activeQueryKeys = new Set();
+        const currentPartID = partID();
         for (const [name, query] of queries) {
-            untrack(() => {
-                $effect(() => {
-                    if (name && query.data) {
-                        let index = 0;
-                        for (const geometry of query.data) {
-                            index += 1;
-                            const resourceName = resources.current[name];
-                            const label = geometry.label ? geometry.label : `${name} geometry ${index}`;
-                            active[`${name}:${label}`] = true;
-                            const pose = createPose(geometry.center);
-                            const subtype = resourceName?.subtype;
-                            const existing = entities.get(`${name}:${label}`);
-                            if (existing) {
-                                existing.set(traits.Pose, pose);
-                                continue;
-                            }
-                            const entityTraits = [
-                                traits.Parent(name),
-                                traits.Name(label),
-                                traits.Pose(pose),
-                                traits.GeometriesAPI,
-                                traits.Geometry(geometry),
-                            ];
-                            if (subtype) {
-                                entityTraits.push(traits.Color(subtype ? colorUtil.set(resourceColors[subtype]) : undefined));
-                            }
-                            const entity = world.spawn(...entityTraits);
-                            entities.set(`${name}:${label}`, entity);
+            if (!name) {
+                continue;
+            }
+            const queryKey = `${currentPartID}:${name}`;
+            activeQueryKeys.add(queryKey);
+            $effect(() => {
+                const nextKeys = new Set();
+                const resourceName = resources.current[name];
+                const subtype = resourceName?.subtype;
+                if (query.data) {
+                    let index = 0;
+                    for (const geometry of query.data) {
+                        index += 1;
+                        const label = geometry.label || `${name} geometry ${index}`;
+                        const entityKey = `${currentPartID}:${name}:${label}`;
+                        nextKeys.add(entityKey);
+                        const center = createPose(geometry.center);
+                        const existing = entities.get(entityKey);
+                        if (existing) {
+                            existing.set(traits.Center, center);
+                            updateGeometryTrait(existing, geometry);
+                            continue;
+                        }
+                        const entityTraits = [
+                            traits.Parent(name),
+                            traits.Name(label),
+                            traits.Center(center),
+                            traits.GeometriesAPI,
+                            traits.Geometry(geometry),
+                        ];
+                        if (subtype) {
+                            entityTraits.push(traits.Color(subtype ? colorUtil.set(resourceColors[subtype]) : undefined));
                         }
+                        const entity = world.spawn(...entityTraits);
+                        entities.set(entityKey, entity);
                     }
-                });
+                }
+                const prevKeys = queryEntityKeys.get(queryKey) ?? new Set();
+                // Remove entities no longer present for this specific query
+                for (const key of prevKeys) {
+                    if (!nextKeys.has(key)) {
+                        entities.get(key)?.destroy();
+                        entities.delete(key);
+                    }
+                }
+                queryEntityKeys.set(queryKey, nextKeys);
             });
         }
-        // Clean up non-active entities
-        for (const [label, entity] of entities) {
-            if (!active[label]) {
-                entity?.destroy();
-                entities.delete(label);
+        // Clean up owners whose queries disappeared entirely
+        for (const [queryKey, keys] of queryEntityKeys) {
+            if (!activeQueryKeys.has(queryKey)) {
+                for (const key of keys) {
+                    const entity = entities.get(key);
+                    if (entity && world.has(entity))
+                        entity.destroy();
+                    entities.delete(key);
+                }
+                queryEntityKeys.delete(queryKey);
             }
         }
     });

package/dist/hooks/useLinked.svelte.js

@@ -18,11 +18,12 @@ export const provideLinkedEntities = () => {
             linkedEntities = linkedEntities.filter((e) => e !== target);
         }
     });
+    const unsub = () => {
+        unsubAdd();
+        unsubRemove();
+    };
     $effect(() => {
-        return () => {
-            unsubAdd();
-            unsubRemove();
-        };
+        return unsub;
     });
     setContext(linkedKey, {
         get current() {

package/dist/hooks/usePartConfig.svelte.js

@@ -79,16 +79,16 @@ export const providePartConfig = (partID, params) => {
         const existingFrameIndex = fragmentMod.mods.findLastIndex(
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
         (mod) => mod?.['$set']?.[modSetPath] !== undefined);
-        if (existingFrameIndex !== -1) {
+        if (existingFrameIndex === -1) {
+            fragmentMod.mods.push(frame);
+        }
+        else {
             const existingGeometry = fragmentMod.mods[existingFrameIndex]['$set']?.[modSetPath].geometry;
             if (existingGeometry && !frameGeometry) {
                 frame['$set'][modSetPath].geometry = existingGeometry;
             }
             fragmentMod.mods[existingFrameIndex] = frame;
         }
-        else {
-            fragmentMod.mods.push(frame);
-        }
         config.set(newConfig);
     };
     const updatePartFrame = (componentName, referenceFrame, pose, geometry) => {
@@ -127,11 +127,10 @@ export const providePartConfig = (partID, params) => {
     const deletePartFrame = (componentName) => {
         const newConfig = getCurrent();
         const component = newConfig?.components?.find(({ name }) => name === componentName);
-        if (!component) {
-            return;
+        if (component) {
+            delete component.frame;
+            config.set(newConfig);
         }
-        delete component.frame;
-        config.set(newConfig);
     };
     const deleteFragmentFrame = (fragmentId, componentName) => {
         const newConfig = getCurrent();
@@ -168,29 +167,29 @@ export const providePartConfig = (partID, params) => {
         },
         updateFrame: (componentName, referenceFrame, framePosition, frameGeometry) => {
             const fragmentId = config.componentNameToFragmentId[componentName];
-            if (fragmentId !== undefined) {
-                updateFragmentFrame(fragmentId, componentName, referenceFrame, framePosition, frameGeometry);
+            if (fragmentId === undefined) {
+                updatePartFrame(componentName, referenceFrame, framePosition, frameGeometry);
             }
             else {
-                updatePartFrame(componentName, referenceFrame, framePosition, frameGeometry);
+                updateFragmentFrame(fragmentId, componentName, referenceFrame, framePosition, frameGeometry);
             }
         },
         deleteFrame: (componentName) => {
             const fragmentId = config.componentNameToFragmentId[componentName];
-            if (fragmentId !== undefined) {
-                deleteFragmentFrame(fragmentId, componentName);
+            if (fragmentId === undefined) {
+                deletePartFrame(componentName);
             }
             else {
-                deletePartFrame(componentName);
+                deleteFragmentFrame(fragmentId, componentName);
             }
         },
         createFrame: (componentName) => {
             const fragmentId = config.componentNameToFragmentId[componentName];
-            if (fragmentId !== undefined) {
-                createFragmentFrame(fragmentId, componentName);
+            if (fragmentId === undefined) {
+                createPartFrame(componentName);
             }
             else {
-                createPartFrame(componentName);
+                createFragmentFrame(fragmentId, componentName);
             }
         },
         save: () => config.save?.(),

package/dist/hooks/usePointcloudObjects.svelte.js

@@ -9,6 +9,7 @@ import { createBufferGeometry, updateBufferGeometry } from '../attribute';
 import { useEnvironment } from './useEnvironment.svelte';
 import { RefetchRates } from '../components/overlay/RefreshRate.svelte';
 import { createPose } from '../transform';
+import { updateGeometryTrait } from '../ecs/traits';
 const key = Symbol('pointcloud-object-context');
 export const providePointcloudObjects = (partID) => {
     const world = useWorld();
@@ -47,18 +48,18 @@ export const providePointcloudObjects = (partID) => {
      */
     $effect(() => {
         for (const [name, query] of propQueries) {
-            if (name && query.data?.objectPointCloudsSupported === false) {
-                if (disabledVisionServices.get(name) === undefined) {
-                    disabledVisionServices.set(name, true);
-                }
+            if (name &&
+                query.data?.objectPointCloudsSupported === false &&
+                disabledVisionServices.get(name) === undefined) {
+                disabledVisionServices.set(name, true);
             }
         }
     });
     const logs = useLogs();
     const interval = $derived(refreshRates.get(RefreshRates.pointclouds));
     const options = $derived({
-        enabled: interval !== -1,
-        refetchInterval: (interval === 0 ? false : interval),
+        enabled: interval !== RefetchRates.OFF,
+        refetchInterval: (interval === RefetchRates.MANUAL ? false : interval),
     });
     const queries = $derived(enabledClients.map((client) => [
         client.current.name,
@@ -79,73 +80,117 @@ export const providePointcloudObjects = (partID) => {
         }
     });
     const entities = new Map();
+    const queryEntityKeys = new Map();
+    const destroyEntity = (key) => {
+        const entity = entities.get(key);
+        if (entity) {
+            if (world.has(entity))
+                entity.destroy();
+            entities.delete(key);
+        }
+    };
     $effect(() => {
-        const active = {};
+        const currentPartID = partID();
+        const activeQueryKeys = new Set();
         for (const [name, query] of queries) {
-            untrack(() => {
-                $effect(() => {
-                    const { data } = query;
-                    if (!data || data.length === 0)
-                        return;
-                    let index = 0;
-                    for (const { geometries: geometriesInFrame, pointCloud } of data) {
-                        if (pointCloud.length > 0) {
-                            parsePcdInWorker(pointCloud).then(({ positions, colors }) => {
-                                const poincloudLabel = `${name} pointcloud ${index + 1}`;
-                                const existing = entities.get(poincloudLabel);
-                                if (existing) {
-                                    const geometry = existing.get(traits.BufferGeometry);
-                                    if (geometry) {
-                                        updateBufferGeometry(geometry, positions, colors);
-                                    }
-                                }
-                                else {
-                                    const geometry = createBufferGeometry(positions, colors);
-                                    const entity = world.spawn(traits.Name(poincloudLabel), traits.BufferGeometry(geometry), traits.Points);
-                                    entities.set(poincloudLabel, entity);
-                                }
-                            });
+            const queryKey = `${currentPartID}:${name}`;
+            activeQueryKeys.add(queryKey);
+            $effect(() => {
+                const { data } = query;
+                let disposed = false;
+                const nextKeys = new Set();
+                const reconcileRemovedKeys = () => {
+                    const prevKeys = queryEntityKeys.get(queryKey) ?? new Set();
+                    for (const key of prevKeys) {
+                        if (!nextKeys.has(key)) {
+                            destroyEntity(key);
                         }
-                        if (geometriesInFrame) {
-                            let geometryIndex = 0;
-                            for (const geometry of geometriesInFrame.geometries) {
-                                const geometryLabel = `${name} pointcloud ${index} geometry ${geometryIndex + 1}`;
-                                const pose = createPose(geometry.center);
-                                active[geometryLabel] = true;
-                                const existing = entities.get(geometryLabel);
-                                if (existing) {
-                                    existing.set(traits.Pose, pose);
+                    }
+                    queryEntityKeys.set(queryKey, new Set(nextKeys));
+                };
+                if (!data || data.length === 0) {
+                    reconcileRemovedKeys();
+                    return () => {
+                        disposed = true;
+                    };
+                }
+                let index = 0;
+                for (const { geometries: geometriesInFrame, pointCloud } of data) {
+                    if (pointCloud.length > 0) {
+                        const pointcloudLabel = `${name} pointcloud ${index + 1}`;
+                        nextKeys.add(pointcloudLabel);
+                        parsePcdInWorker(pointCloud)
+                            .then(({ positions, colors }) => {
+                            if (disposed) {
+                                return;
+                            }
+                            if (!nextKeys.has(pointcloudLabel)) {
+                                return;
+                            }
+                            const existing = entities.get(pointcloudLabel);
+                            if (existing) {
+                                const geometry = existing.get(traits.BufferGeometry);
+                                if (geometry) {
+                                    updateBufferGeometry(geometry, positions, colors);
                                 }
-                                else {
-                                    const entityTraits = [
-                                        traits.Name(geometryLabel),
-                                        traits.Pose(pose),
-                                        traits.GeometriesAPI,
-                                        traits.Geometry(geometry),
-                                        traits.Opacity(0.2),
-                                        traits.Color({ r: 0, g: 1, b: 0 }),
-                                    ];
-                                    if (geometriesInFrame.referenceFrame) {
-                                        entityTraits.push(traits.Parent(geometriesInFrame.referenceFrame));
-                                    }
-                                    const entity = world.spawn(...entityTraits);
-                                    entities.set(geometryLabel, entity);
+                            }
+                            else {
+                                const geometry = createBufferGeometry(positions, colors);
+                                const entity = world.spawn(traits.Name(pointcloudLabel), traits.BufferGeometry(geometry), traits.Points);
+                                entities.set(pointcloudLabel, entity);
+                            }
+                        })
+                            .catch((error) => {
+                            if (disposed) {
+                                return;
+                            }
+                            logs.add(error?.reason ?? error?.message ?? 'Failed to parse pointcloud', 'error');
+                        });
+                    }
+                    if (geometriesInFrame) {
+                        let geometryIndex = 0;
+                        for (const geometry of geometriesInFrame.geometries) {
+                            const geometryLabel = `${name} pointcloud ${index + 1} geometry ${geometryIndex + 1}`;
+                            nextKeys.add(geometryLabel);
+                            const center = createPose(geometry.center);
+                            const existing = entities.get(geometryLabel);
+                            if (existing) {
+                                existing.set(traits.Center, center);
+                                updateGeometryTrait(existing, geometry);
+                            }
+                            else {
+                                const entityTraits = [
+                                    traits.Name(geometryLabel),
+                                    traits.Center(center),
+                                    traits.GeometriesAPI,
+                                    traits.Geometry(geometry),
+                                    traits.Opacity(0.2),
+                                    traits.Color({ r: 0, g: 1, b: 0 }),
+                                ];
+                                if (geometriesInFrame.referenceFrame) {
+                                    entityTraits.push(traits.Parent(geometriesInFrame.referenceFrame));
                                 }
-                                geometryIndex += 1;
+                                const entity = world.spawn(...entityTraits);
+                                entities.set(geometryLabel, entity);
                             }
+                            geometryIndex += 1;
                         }
-                        index += 1;
                     }
-                });
+                    index += 1;
+                }
+                reconcileRemovedKeys();
+                return () => {
+                    disposed = true;
+                };
             });
         }
-        // Clean up old entities
-        for (const [label, entity] of entities) {
-            if (!active[label]) {
-                if (world.has(entity)) {
-                    entity.destroy();
+        // cleanup queries that disappeared entirely
+        for (const [queryKey, keys] of queryEntityKeys) {
+            if (!activeQueryKeys.has(queryKey)) {
+                for (const key of keys) {
+                    destroyEntity(key);
                 }
-                entities.delete(label);
+                queryEntityKeys.delete(queryKey);
             }
         }
     });