@viamrobotics/motion-tools 1.18.0 → 1.19.0

package/dist/draw.js

@@ -1,6 +1,6 @@
 import { Vector3, Vector4 } from 'three';
 import { NURBSCurve } from 'three/addons/curves/NURBSCurve.js';
-import { createBufferGeometry, updateBufferGeometry } from './attribute';
+import { createBufferGeometry, preAllocateBufferGeometry, updateBufferGeometry, writeBufferGeometryRange, } from './attribute';
 import { asFloat32Array, asOpacity, asRGB, inMeters, isSingleColor, isVertexColors, STRIDE, } from './buffer';
 import { traits } from './ecs';
 import { parsePcdInWorker } from './loaders/pcd';
@@ -38,9 +38,7 @@ export const drawTransform = (world, { referenceFrame, poseInObserverFrame, phys
     }
     if (options.removable)
         entityTraits.push(traits.Removable);
-    const parent = poseInObserverFrame?.referenceFrame;
-    if (parent && parent !== 'world')
-        entityTraits.push(traits.Parent(parent));
+    entityTraits.push(...traits.getParentTrait(poseInObserverFrame?.referenceFrame));
     const parsedMetadata = metadataFromStruct(metadata?.fields);
     if (parsedMetadata.showAxesHelper)
         entityTraits.push(traits.ShowAxesHelper);
@@ -68,10 +66,7 @@ export const drawDrawing = (world, drawing, api, options = { removable: true })
     const { referenceFrame, poseInObserverFrame, physicalObject, metadata } = drawing;
     if (physicalObject?.geometryType?.case === 'model')
         return drawModel(world, drawing, api, options);
-    const entity = world.spawn(traits.Name(referenceFrame), traits.Pose(createPose(poseInObserverFrame?.pose)), api);
-    const parent = poseInObserverFrame?.referenceFrame;
-    if (parent && parent !== 'world')
-        entity.add(traits.Parent(parent));
+    const entity = world.spawn(traits.Name(referenceFrame), traits.Pose(createPose(poseInObserverFrame?.pose)), api, ...traits.getParentTrait(poseInObserverFrame?.referenceFrame));
     if (options.removable)
         entity.add(traits.Removable);
     if (metadata?.showAxesHelper)
@@ -83,9 +78,7 @@ export const drawDrawing = (world, drawing, api, options = { removable: true })
 };
 export const updateTransform = (entity, { poseInObserverFrame, physicalObject, metadata }, options = { removable: true }) => {
     entity.set(traits.Pose, createPose(poseInObserverFrame?.pose));
-    const parent = poseInObserverFrame?.referenceFrame;
-    if (parent && parent !== 'world')
-        entity.set(traits.Parent, parent);
+    traits.setParentTrait(entity, poseInObserverFrame?.referenceFrame);
     if (physicalObject) {
         traits.updateGeometryTrait(entity, physicalObject);
         const center = physicalObject.center;
@@ -96,31 +89,33 @@ export const updateTransform = (entity, { poseInObserverFrame, physicalObject, m
             entity.remove(traits.Center);
         }
     }
-    const parsedMetadata = metadataFromStruct(metadata?.fields);
-    if (parsedMetadata.showAxesHelper)
+    updateMetadata(entity, metadataFromStruct(metadata?.fields), {
+        pointCloud: isPointCloud(physicalObject?.geometryType),
+    });
+    if (options.removable)
+        entity.add(traits.Removable);
+    if (!options.removable)
+        entity.remove(traits.Removable);
+};
+export const updateMetadata = (entity, metadata, { pointCloud = false } = {}) => {
+    if (metadata.showAxesHelper)
         entity.add(traits.ShowAxesHelper);
     else
         entity.remove(traits.ShowAxesHelper);
-    if (parsedMetadata.invisible)
+    if (metadata.invisible)
         entity.add(traits.Invisible);
     else
         entity.remove(traits.Invisible);
-    const { colors, opacities } = parsedMetadata;
+    const { colors, opacities } = metadata;
     if (colors) {
-        if (isPointCloud(physicalObject?.geometryType)) {
-            updateColors(entity, parsedMetadata);
+        if (pointCloud) {
+            updateColors(entity, metadata);
         }
         else {
-            addColorTraits(entity, colors);
+            setColorTraits(entity, colors);
         }
     }
-    const opacity = asOpacity(opacities, DEFAULT_OPACITY);
-    if (opacity < 1)
-        entity.add(traits.Opacity(opacity));
-    if (options.removable)
-        entity.add(traits.Removable);
-    if (!options.removable)
-        entity.remove(traits.Removable);
+    entity.set(traits.Opacity, asOpacity(opacities, DEFAULT_OPACITY));
 };
 export const updateDrawing = (world, entities, drawing, api, options = { removable: true }) => {
     const { poseInObserverFrame, physicalObject, metadata } = drawing;
@@ -137,9 +132,7 @@ export const updateDrawing = (world, entities, drawing, api, options = { removab
     if (!world.has(entity))
         return entities;
     entity.set(traits.Pose, createPose(poseInObserverFrame?.pose));
-    const parent = poseInObserverFrame?.referenceFrame;
-    if (parent && parent !== 'world')
-        entity.set(traits.Parent, parent);
+    traits.setParentTrait(entity, poseInObserverFrame?.referenceFrame);
     if (metadata?.showAxesHelper)
         entity.add(traits.ShowAxesHelper);
     if (!metadata?.showAxesHelper)
@@ -181,15 +174,30 @@ const applyShape = (entity, { physicalObject, metadata }) => {
         }
         case 'points': {
             const positions = asFloat32Array(geometryType.value.positions, inMeters);
+            const total = metadata?.chunks?.total;
             const center = physicalObject?.center;
             if (center)
                 entity.add(traits.Center(center));
             addColorTraits(entity, colors ?? DEFAULT_POINTS_COLORS);
             entity.add(traits.PointSize(geometryType.value.pointSize ?? DEFAULT_POINT_SIZE));
-            entity.add(traits.BufferGeometry(createBufferGeometry(positions, {
-                colors: isVertexColors(colors) ? colors : undefined,
+            const vertexColors = isVertexColors(colors) ? colors : undefined;
+            const pointsMetadata = {
+                colors: vertexColors,
                 colorFormat: metadata?.colorFormat ?? ColorFormat.UNSPECIFIED,
-            })));
+                opacities: metadata?.opacities,
+            };
+            if (total !== undefined && total > 0) {
+                const allocMetadata = {
+                    ...pointsMetadata,
+                    colors: vertexColors ? new Uint8Array(0) : undefined,
+                };
+                const geometry = preAllocateBufferGeometry(total, STRIDE.POSITIONS, allocMetadata);
+                writeBufferGeometryRange(geometry, positions, 0, pointsMetadata);
+                entity.add(traits.BufferGeometry(geometry));
+            }
+            else {
+                entity.add(traits.BufferGeometry(createBufferGeometry(positions, pointsMetadata)));
+            }
             entity.add(traits.Points);
             break;
         }
@@ -237,7 +245,6 @@ const applyShape = (entity, { physicalObject, metadata }) => {
 };
 const drawModel = (world, { referenceFrame, poseInObserverFrame, physicalObject, metadata }, api, { removable = true }) => {
     const entities = [];
-    const parent = poseInObserverFrame?.referenceFrame;
     const geometryType = physicalObject?.geometryType;
     if (geometryType?.case !== 'model')
         return entities;
@@ -245,9 +252,8 @@ const drawModel = (world, { referenceFrame, poseInObserverFrame, physicalObject,
         traits.Name(referenceFrame),
         traits.Pose(createPose(poseInObserverFrame?.pose)),
         api,
+        ...traits.getParentTrait(poseInObserverFrame?.referenceFrame),
     ];
-    if (parent && parent !== 'world')
-        baseTraits.push(traits.Parent(parent));
     if (removable)
         baseTraits.push(traits.Removable);
     if (metadata?.invisible)
@@ -292,10 +298,19 @@ const parsePointCloud = (world, entity, pointCloud, metadata) => {
         let vertexColors = pointcloud.colors;
         if (colors && colors.length > 0)
             vertexColors = parseColors(colors, numPoints);
-        const geometry = createBufferGeometry(pointcloud.positions, {
-            colors: vertexColors ?? undefined,
-            colorFormat,
-        });
+        const total = metadata.chunks?.total;
+        const chunkMetadata = { colors: vertexColors ?? undefined, colorFormat };
+        let geometry;
+        if (total !== undefined && total > numPoints) {
+            geometry = preAllocateBufferGeometry(total, STRIDE.POSITIONS, {
+                ...chunkMetadata,
+                colors: vertexColors ? new Uint8Array(0) : undefined,
+            });
+            writeBufferGeometryRange(geometry, pointcloud.positions, 0, chunkMetadata);
+        }
+        else {
+            geometry = createBufferGeometry(pointcloud.positions, chunkMetadata);
+        }
         entity.add(traits.BufferGeometry(geometry));
         entity.add(traits.Points);
     });
@@ -408,7 +423,7 @@ const updateShape = (entity, { physicalObject, metadata }) => {
         }
     }
 };
-const addColorTraits = (entity, colors) => {
+export const addColorTraits = (entity, colors) => {
     if (isVertexColors(colors)) {
         entity.add(traits.Colors(colors));
     }
@@ -416,13 +431,20 @@ const addColorTraits = (entity, colors) => {
         entity.add(traits.Color(asRGB(colors, rgb)));
     }
 };
-const setColorTraits = (entity, colors) => {
+export const setColorTraits = (entity, colors) => {
     if (isVertexColors(colors)) {
-        entity.set(traits.Colors, colors);
+        if (entity.has(traits.Colors))
+            entity.set(traits.Colors, colors);
+        else
+            entity.add(traits.Colors(colors));
         entity.remove(traits.Color);
     }
     else {
-        entity.set(traits.Color, asRGB(colors, rgb));
+        const color = asRGB(colors, rgb);
+        if (entity.has(traits.Color))
+            entity.set(traits.Color, color);
+        else
+            entity.add(traits.Color(color));
         entity.remove(traits.Colors);
     }
 };

package/dist/ecs/traits.d.ts

@@ -1,6 +1,6 @@
 import type { GLTF as ThreeGltf } from 'three/examples/jsm/loaders/GLTFLoader.js';
 import { Geometry as ViamGeometry } from '@viamrobotics/sdk';
-import { type Entity } from 'koota';
+import { type ConfigurableTrait, type Entity } from 'koota';
 import { BufferGeometry as ThreeBufferGeometry } from 'three';
 export declare const Name: import("koota").Trait<() => string>;
 export declare const Parent: import("koota").Trait<() => string>;
@@ -170,13 +170,21 @@ export declare const DotColors: import("koota").Trait<() => Uint8Array<ArrayBuff
  */
 export declare const DotSize: import("koota").Trait<() => number>;
 export declare const ReferenceFrame: import("koota").Trait<() => boolean>;
+/**
+ * Tracks chunk loading progress for progressively-loaded entities.
+ * `loaded` is the number of elements received so far; `total` is the target.
+ */
+export declare const ChunkProgress: import("koota").Trait<{
+    loaded: number;
+    total: number;
+}>;
 /**
  * Interaction layers for entities
  */
 export type InteractionLayerValue = 'selectTool';
 export declare const SelectToolInteractionLayer: import("koota").Trait<() => boolean>;
 /**
- * This entity can be safetly removed from the scene by the user
+ * This entity can be safely removed from the scene by the user
  */
 export declare const Removable: import("koota").Trait<() => boolean>;
 export declare const Geometry: (geometry: ViamGeometry) => import("koota").Trait<() => boolean> | [import("koota").Trait<{
@@ -198,4 +206,6 @@ export declare const Geometry: (geometry: ViamGeometry) => import("koota").Trait
 }>, Partial<{
     r: number;
 }>] | [import("koota").Trait<() => ThreeBufferGeometry<import("three").NormalBufferAttributes, import("three").BufferGeometryEventMap>>, ThreeBufferGeometry<import("three").NormalBufferAttributes, import("three").BufferGeometryEventMap>];
+export declare const getParentTrait: (parent: string | undefined) => ConfigurableTrait[];
+export declare const setParentTrait: (entity: Entity, parent: string | undefined) => void;
 export declare const updateGeometryTrait: (entity: Entity, geometry?: ViamGeometry) => void;

package/dist/ecs/traits.js

@@ -124,9 +124,14 @@ export const DotColors = trait(() => new Uint8Array());
  */
 export const DotSize = trait(() => 10);
 export const ReferenceFrame = trait(() => true);
+/**
+ * Tracks chunk loading progress for progressively-loaded entities.
+ * `loaded` is the number of elements received so far; `total` is the target.
+ */
+export const ChunkProgress = trait({ loaded: 0, total: 0 });
 export const SelectToolInteractionLayer = trait(() => true);
 /**
- * This entity can be safetly removed from the scene by the user
+ * This entity can be safely removed from the scene by the user
  */
 export const Removable = trait(() => true);
 export const Geometry = (geometry) => {
@@ -144,6 +149,19 @@ export const Geometry = (geometry) => {
     }
     return ReferenceFrame;
 };
+export const getParentTrait = (parent) => !parent || parent === 'world' ? [] : [Parent(parent)];
+export const setParentTrait = (entity, parent) => {
+    if (!parent || parent === 'world') {
+        entity.remove(Parent);
+        return;
+    }
+    if (entity.has(Parent)) {
+        entity.set(Parent, parent);
+    }
+    else {
+        entity.add(Parent(parent));
+    }
+};
 export const updateGeometryTrait = (entity, geometry) => {
     if (!geometry) {
         entity.remove(Box, Capsule, Sphere, BufferGeometry);

package/dist/hooks/useDrawAPI.svelte.js

@@ -127,9 +127,7 @@ export const provideDrawAPI = () => {
             const existing = entities.get(name);
             if (existing) {
                 existing.set(traits.Pose, pose);
-                if (parent && parent !== 'world') {
-                    existing.set(traits.Parent, parent);
-                }
+                traits.setParentTrait(existing, parent);
                 continue;
             }
             const geometryTrait = () => {
@@ -144,10 +142,7 @@ export const provideDrawAPI = () => {
                 }
                 return traits.ReferenceFrame;
             };
-            const entityTraits = [];
-            if (parent && parent !== 'world') {
-                entityTraits.push(traits.Parent(parent));
-            }
+            const entityTraits = [...traits.getParentTrait(parent)];
             if (frame.geometry) {
                 entityTraits.push(geometryTrait());
             }
@@ -181,11 +176,15 @@ export const provideDrawAPI = () => {
             }
             return traits.ReferenceFrame;
         };
-        const entityTraits = [];
-        if (parent && parent !== 'world') {
-            entityTraits.push(traits.Parent(parent));
-        }
-        entityTraits.push(traits.Name(data.label ?? ++geometryIndex), traits.Pose(pose), traits.Color(colorUtil.set(color)), geometryTrait(), traits.DrawAPI, traits.Removable);
+        const entityTraits = [
+            traits.Name(data.label ?? ++geometryIndex),
+            ...traits.getParentTrait(parent),
+            traits.Pose(pose),
+            traits.Color(colorUtil.set(color)),
+            geometryTrait(),
+            traits.DrawAPI,
+            traits.Removable,
+        ];
         const entity = world.spawn(...entityTraits);
         entities.set(name, entity);
     };

package/dist/hooks/useFrames.svelte.js

@@ -2,17 +2,18 @@ import { MachineConnectionEvent, Transform } from '@viamrobotics/sdk';
 import { createRobotQuery, useConnectionStatus, useMachineStatus, useRobotClient, } from '@viamrobotics/svelte-sdk';
 import {} from 'koota';
 import { getContext, setContext, untrack } from 'svelte';
-import { resourceNameToColor } from '../color';
+import { resourceNameToColor, subtypeToColor } from '../color';
 import { traits, useWorld } from '../ecs';
-import { updateGeometryTrait } from '../ecs/traits';
 import { createPose } from '../transform';
 import { useConfigFrames } from './useConfigFrames.svelte';
 import { useEnvironment } from './useEnvironment.svelte';
 import { useLogs } from './useLogs.svelte';
+import { usePartConfig } from './usePartConfig.svelte';
 import { useResourceByName } from './useResourceByName.svelte';
 const key = Symbol('frames-context');
 export const provideFrames = (partID) => {
     const configFrames = useConfigFrames();
+    const partConfig = usePartConfig();
     const environment = useEnvironment();
     const world = useWorld();
     const resourceByName = useResourceByName();
@@ -20,6 +21,7 @@ export const provideFrames = (partID) => {
     const connectionStatus = useConnectionStatus(partID);
     const machineStatus = useMachineStatus(partID);
     const logs = useLogs();
+    const pendingSaveKey = $derived(`viam-pending-save-revision:${partID()}`);
     let didRecentlyEdit = $state(false);
     const isEditMode = $derived(environment.current.viewerMode === 'edit');
     const query = createRobotQuery(client, 'frameSystemConfig', () => ({
@@ -37,14 +39,19 @@ export const provideFrames = (partID) => {
     });
     const frames = $derived.by(() => {
         const frames = {};
-        for (const { frame } of query.data ?? []) {
-            if (frame === undefined) {
-                continue;
+        if (!partConfig.hasPendingSave) {
+            for (const { frame } of query.data ?? []) {
+                if (frame === undefined) {
+                    continue;
+                }
+                frames[frame.referenceFrame] = frame;
             }
-            frames[frame.referenceFrame] = frame;
         }
-        // Let config frames take priority if the user has made edits
-        if (didRecentlyEdit || connectionStatus.current === MachineConnectionEvent.DISCONNECTED) {
+        // Let config frames take priority if the user has made edits,
+        // has a pending save, or is disconnected
+        if (didRecentlyEdit ||
+            partConfig.hasPendingSave ||
+            connectionStatus.current === MachineConnectionEvent.DISCONNECTED) {
             const mergedFrames = {
                 ...frames,
                 ...configFrames.current,
@@ -71,6 +78,45 @@ export const provideFrames = (partID) => {
             untrack(() => query.refetch());
         }
     });
+    $effect(() => {
+        const key = pendingSaveKey;
+        const storedRevision = sessionStorage.getItem(key);
+        if (!storedRevision) {
+            return;
+        }
+        if (!revision) {
+            if (!partConfig.hasPendingSave) {
+                partConfig.setPendingSave();
+            }
+            return;
+        }
+        if (revision === storedRevision) {
+            if (!partConfig.hasPendingSave) {
+                partConfig.setPendingSave();
+            }
+            return;
+        }
+        sessionStorage.removeItem(key);
+        partConfig.clearPendingSave();
+        didRecentlyEdit = true;
+    });
+    $effect(() => {
+        if (partConfig.hasPendingSave && revision) {
+            sessionStorage.setItem(pendingSaveKey, revision);
+        }
+    });
+    const componentSubtypeByName = $derived.by(() => {
+        const result = {};
+        for (const { name, api } of partConfig.current.components ?? []) {
+            if (api) {
+                const subtype = api.split(':').at(-1);
+                if (subtype) {
+                    result[name] = subtype;
+                }
+            }
+        }
+        return result;
+    });
     $effect(() => {
         if (isEditMode) {
             didRecentlyEdit = true;
@@ -79,6 +125,7 @@ export const provideFrames = (partID) => {
     $effect.pre(() => {
         const currentResourcesByName = resourceByName.current;
         const currentPartID = partID();
+        const currentComponentSubtypeByName = componentSubtypeByName;
         // We only want to update whenever "current" or "resourceByName.current" changes
         // eslint-disable-next-line @typescript-eslint/no-unused-expressions
         current.length;
@@ -94,25 +141,18 @@ export const provideFrames = (partID) => {
                     ? createPose(frame.physicalObject.center)
                     : undefined;
                 const resourceName = currentResourcesByName[frame.referenceFrame];
-                const color = resourceNameToColor(resourceName);
+                const color = resourceNameToColor(resourceName) ??
+                    subtypeToColor(currentComponentSubtypeByName[frame.referenceFrame]);
                 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));
-                    }
+                    traits.setParentTrait(existing, parent);
                     if (color) {
                         existing.set(traits.Color, color);
                     }
                     if (center) {
                         existing.set(traits.Center, center);
                     }
-                    updateGeometryTrait(existing, frame.physicalObject);
+                    traits.updateGeometryTrait(existing, frame.physicalObject);
                     existing.set(traits.EditedPose, pose);
                     continue;
                 }
@@ -122,10 +162,8 @@ export const provideFrames = (partID) => {
                     traits.EditedPose(pose),
                     traits.FramesAPI,
                     traits.ShowAxesHelper,
+                    ...traits.getParentTrait(parent),
                 ];
-                if (parent && parent !== 'world') {
-                    entityTraits.push(traits.Parent(parent));
-                }
                 if (color) {
                     entityTraits.push(traits.Color(color));
                 }

package/dist/hooks/useGeometries.svelte.js

@@ -1,4 +1,4 @@
-import { ArmClient, CameraClient, GantryClient, GripperClient } from '@viamrobotics/sdk';
+import { ArmClient, BaseClient, CameraClient, GantryClient, GripperClient } from '@viamrobotics/sdk';
 import { createResourceClient, createResourceQuery, useResourceNames, } from '@viamrobotics/svelte-sdk';
 import {} from 'koota';
 import { getContext, setContext, untrack } from 'svelte';
@@ -20,12 +20,14 @@ export const provideGeometries = (partID) => {
     const world = useWorld();
     const logs = useLogs();
     const arms = useResourceNames(partID, 'arm');
+    const bases = useResourceNames(partID, 'base');
     const cameras = useResourceNames(partID, 'camera');
     const grippers = useResourceNames(partID, 'gripper');
     const gantries = useResourceNames(partID, 'gantry');
     const settings = useSettings();
     const { refreshRates } = $derived(settings.current);
     const armClients = $derived(arms.current.map((arm) => createResourceClient(ArmClient, partID, () => arm.name)));
+    const baseClients = $derived(bases.current.map((base) => createResourceClient(BaseClient, partID, () => base.name)));
     const gripperClients = $derived(grippers.current.map((gripper) => createResourceClient(GripperClient, partID, () => gripper.name)));
     const cameraClients = $derived(cameras.current.map((camera) => createResourceClient(CameraClient, partID, () => camera.name)));
     const gantryClients = $derived(gantries.current.map((gantry) => createResourceClient(GantryClient, partID, () => gantry.name)));
@@ -35,10 +37,17 @@ export const provideGeometries = (partID) => {
         refetchInterval: interval === RefetchRates.MANUAL ? false : interval,
     });
     const armQueries = $derived(armClients.map((client) => [client.current?.name, createResourceQuery(client, 'getGeometries', () => options)]));
+    const baseQueries = $derived(baseClients.map((client) => [client.current?.name, createResourceQuery(client, 'getGeometries', () => options)]));
     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]);
+    const queries = $derived([
+        ...armQueries,
+        ...baseQueries,
+        ...gripperQueries,
+        ...cameraQueries,
+        ...gantryQueries,
+    ]);
     $effect(() => {
         if (interval === RefetchRates.FPS_30 || interval === RefetchRates.FPS_60) {
             return logs.add(`Fetching geometries every ${interval}ms...`);

package/dist/hooks/useLogs.svelte.js

@@ -44,11 +44,11 @@ export const provideLogs = () => {
                 }
                 if (logs.length > 200) {
                     const log = logs.pop();
-                    if (log && level === 'error') {
+                    if (log?.level === 'error') {
                         errors.splice(errors.indexOf(log), 1);
                     }
-                    else if (log && level === 'warn') {
-                        warnings.splice(errors.indexOf(log), 1);
+                    else if (log?.level === 'warn') {
+                        warnings.splice(warnings.indexOf(log), 1);
                     }
                 }
             });

package/dist/hooks/usePartConfig.svelte.d.ts

@@ -3,6 +3,7 @@ import { type Frame } from '../frame';
 export interface PartConfig {
     components: {
         name: string;
+        api?: string;
         frame?: Frame;
     }[];
     fragment_mods?: {
@@ -13,6 +14,7 @@ export interface PartConfig {
 interface PartConfigContext {
     current: PartConfig;
     isDirty: boolean;
+    hasPendingSave: boolean;
     hasEditPermissions: boolean;
     componentNameToFragmentId: Record<string, string>;
     updateFrame: (componentName: string, referenceFrame: string, pose: Pose, geometry?: Frame['geometry']) => void;
@@ -20,6 +22,8 @@ interface PartConfigContext {
     createFrame: (componentName: string) => void;
     save: () => void;
     discardChanges: () => void;
+    clearPendingSave: () => void;
+    setPendingSave: () => void;
 }
 export declare const providePartConfig: (partID: () => string, params: () => AppEmbeddedPartConfigProps | undefined) => void;
 export declare const usePartConfig: () => PartConfigContext;

package/dist/hooks/usePartConfig.svelte.js

@@ -94,7 +94,6 @@ export const providePartConfig = (partID, params) => {
     const updatePartFrame = (componentName, referenceFrame, pose, geometry) => {
         const newConfig = getCurrent();
         const component = newConfig.components?.find(({ name }) => name === componentName);
-        console.log('hi', newConfig, componentName);
         if (!component) {
             return;
         }
@@ -162,6 +161,9 @@ export const providePartConfig = (partID, params) => {
         get isDirty() {
             return config.isDirty;
         },
+        get hasPendingSave() {
+            return config.hasPendingSave;
+        },
         get hasEditPermissions() {
             return config.hasEditPermissions;
         },
@@ -194,6 +196,8 @@ export const providePartConfig = (partID, params) => {
         },
         save: () => config.save?.(),
         discardChanges: () => config.discardChanges?.(),
+        clearPendingSave: () => config.clearPendingSave(),
+        setPendingSave: () => config.setPendingSave(),
     });
 };
 export const usePartConfig = () => {
@@ -202,6 +206,7 @@ export const usePartConfig = () => {
 const useEmbeddedPartConfig = (props) => {
     return {
         hasEditPermissions: true,
+        hasPendingSave: false,
         get isDirty() {
             return props.isDirty;
         },
@@ -215,6 +220,8 @@ const useEmbeddedPartConfig = (props) => {
             const struct = Struct.fromJson(config);
             return props.setLocalPartConfig(struct);
         },
+        clearPendingSave() { },
+        setPendingSave() { },
     };
 };
 const useStandalonePartConfig = (partID) => {
@@ -222,21 +229,25 @@ const useStandalonePartConfig = (partID) => {
         refetchInterval: false,
     });
     const partName = $derived(partQuery.data?.part?.name);
+    // Use part.robotConfig (the stored Struct config) as the authoritative source.
+    // configJson is the compiled running config from the robot daemon and may be empty
+    // even when the stored config exists and the API key has edit permissions.
+    let networkPartConfig = $derived(partQuery.data?.part?.robotConfig);
+    let current = $state.raw();
+    let isDirty = $state(false);
+    let hasPendingSave = $state(false);
+    const hasEditPermissions = $derived(networkPartConfig !== undefined);
     const configJSON = $derived.by(() => {
-        if (!partQuery.data?.configJson) {
+        if (!networkPartConfig) {
             return undefined;
         }
         try {
-            return JSON.parse(partQuery.data.configJson);
+            return networkPartConfig.toJson();
         }
         catch {
             return undefined;
         }
     });
-    let networkPartConfig = $derived(configJSON ? Struct.fromJson(configJSON) : undefined);
-    let current = $state.raw();
-    let isDirty = $state(false);
-    const hasEditPermissions = $derived(networkPartConfig !== undefined);
     const fragmentQueries = $derived((configJSON?.fragments ?? []).map((fragmentId) => {
         const id = typeof fragmentId === 'string' ? fragmentId : fragmentId.id;
         return createAppQuery('getFragment', () => [id], { refetchInterval: false });
@@ -263,8 +274,7 @@ const useStandalonePartConfig = (partID) => {
         return results;
     });
     $effect.pre(() => {
-        if (!networkPartConfig) {
-            // no config returned here indicates this api key has no permission to update config
+        if (!networkPartConfig || isDirty) {
             return;
         }
         current = networkPartConfig;
@@ -277,6 +287,9 @@ const useStandalonePartConfig = (partID) => {
         get isDirty() {
             return isDirty;
         },
+        get hasPendingSave() {
+            return hasPendingSave;
+        },
         get hasEditPermissions() {
             return hasEditPermissions;
         },
@@ -294,10 +307,17 @@ const useStandalonePartConfig = (partID) => {
             networkPartConfig = current;
             await updateRobotPartMutation.mutateAsync([partID(), partName, current]);
             isDirty = false;
+            hasPendingSave = true;
         },
         discardChanges() {
             current = networkPartConfig;
             isDirty = false;
         },
+        clearPendingSave() {
+            hasPendingSave = false;
+        },
+        setPendingSave() {
+            hasPendingSave = true;
+        },
     };
 };