@viamrobotics/motion-tools 0.11.8 → 0.12.0

package/dist/components/Tree/Settings.svelte

@@ -6,7 +6,7 @@
 	import { useSettings } from '../../hooks/useSettings.svelte'
 	import { useResourceNames } from '@viamrobotics/svelte-sdk'
 	import { usePartID } from '../../hooks/usePartID.svelte'
-	import { useMachineSettings } from '../../hooks/useMachineSettings.svelte'
+	import { RefreshRates, useMachineSettings } from '../../hooks/useMachineSettings.svelte'
 
 	const partID = usePartID()
 	const cameras = useResourceNames(() => partID.current, 'camera')
@@ -22,9 +22,15 @@
 	<div class="flex h-100 flex-col gap-2 overflow-scroll p-3">
 		<h3 class="text-sm"><strong>Machine connection</strong></h3>
 
-		<RefreshRate name="Geometries" />
-		<RefreshRate name="Poses" />
-		<RefreshRate name="Pointclouds" />
+		<RefreshRate
+			id={RefreshRates.poses}
+			label="Poses"
+			allowLive
+		/>
+		<RefreshRate
+			id={RefreshRates.pointclouds}
+			label="Pointclouds"
+		/>
 		<div>
 			<div>Enabled pointcloud cameras</div>
 			{#each cameras.current as camera (camera)}

package/dist/components/Tree/TreeContainer.svelte

@@ -10,6 +10,7 @@
 	import Logs from './Logs.svelte'
 	import { useDraggable } from '../../hooks/useDraggable.svelte'
 	import { useWorldStates } from '../../hooks/useWorldState.svelte'
+	import Widgets from './Widgets.svelte'
 
 	const { ...rest } = $props()
 
@@ -55,4 +56,5 @@
 
 	<Logs />
 	<Settings />
+	<Widgets />
 </div>

package/dist/components/Tree/Widgets.svelte

@@ -0,0 +1,24 @@
+<script lang="ts">
+	import { Switch } from '@viamrobotics/prime-core'
+	import Drawer from './Drawer.svelte'
+	import { useSettings } from '../../hooks/useSettings.svelte'
+
+	const settings = useSettings()
+</script>
+
+<Drawer
+	name="Widgets"
+	defaultOpen
+>
+	<div class="flex h-24 flex-col gap-2 overflow-scroll p-3">
+		<div class="flex items-center justify-between gap-4 py-2">
+			Arm positions
+			<Switch
+				bind:on={settings.current.enableArmPositionsWidget}
+				on:change={(event) => {
+					settings.current.enableArmPositionsWidget = event.detail
+				}}
+			/>
+		</div>
+	</div>
+</Drawer>

package/dist/components/Tree/Widgets.svelte.d.ts

@@ -0,0 +1,18 @@
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
+    };
+    z_$$bindings?: Bindings;
+}
+declare const Widgets: $$__sveltets_2_IsomorphicComponent<Record<string, never>, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, string>;
+type Widgets = InstanceType<typeof Widgets>;
+export default Widgets;

package/dist/components/WorldObjects.svelte

@@ -5,13 +5,14 @@
 	import { useGeometries } from '../hooks/useGeometries.svelte'
 	import { usePointClouds } from '../hooks/usePointclouds.svelte'
 	import { useDrawAPI } from '../hooks/useDrawAPI.svelte'
+	import { useWorldStates } from '../hooks/useWorldState.svelte'
+	import { useArrows } from '../hooks/useArrows.svelte'
 	import Pose from './Pose.svelte'
 	import Frame from './Frame.svelte'
 	import Line from './Line.svelte'
 	import Pointcloud from './Pointcloud.svelte'
 	import Model from './WorldObject.svelte'
 	import Label from './Label.svelte'
-	import { useWorldStates } from '../hooks/useWorldState.svelte'
 	import WorldState from './WorldState.svelte'
 
 	const points = usePointClouds()
@@ -19,6 +20,7 @@
 	const frames = useFrames()
 	const geometries = useGeometries()
 	const worldStates = useWorldStates()
+	const batchedArrow = useArrows()
 </script>
 
 {#each frames.current as object (object.uuid)}
@@ -78,14 +80,12 @@
 	</Portal>
 {/each}
 
-{#if drawAPI.poses.length > 0}
-	<T
-		name={drawAPI.object3ds.batchedArrow.object3d.name}
-		is={drawAPI.object3ds.batchedArrow.object3d}
-		dispose={false}
-		bvh={{ enabled: false }}
-	/>
-{/if}
+<T
+	name={batchedArrow.object3d.name}
+	is={batchedArrow.object3d}
+	dispose={false}
+	bvh={{ enabled: false }}
+/>
 
 {#each drawAPI.meshes as object (object.uuid)}
 	<Portal id={object.referenceFrame}>

package/dist/components/shared/Table.svelte

@@ -0,0 +1,37 @@
+<script lang="ts">
+	import type { Snippet } from 'svelte'
+
+	interface Props {
+		children?: Snippet
+	}
+
+	const { children }: Props = $props()
+</script>
+
+<table class="motion-tools-table">
+	{@render children?.()}
+</table>
+
+<style>
+	@reference "../../../app.css";
+
+	.motion-tools-table {
+		@apply w-full table-auto;
+	}
+	.motion-tools-table :global(thead) {
+		@apply border-light bg-light border;
+	}
+	.motion-tools-table :global(thead th) {
+		@apply border-light text-subtle-1 border px-2.5 py-1 text-xs font-normal whitespace-nowrap;
+	}
+	.motion-tools-table :global(thead th abbr) {
+		@apply text-disabled;
+	}
+
+	.motion-tools-table :global(tbody) {
+		@apply border-light border;
+	}
+	.motion-tools-table :global(tbody th) {
+		@apply border-light font-roboto-mono text-default h-[40px] gap-2 border px-1.5 text-center text-xs font-normal;
+	}
+</style>

package/dist/components/shared/Table.svelte.d.ts

@@ -0,0 +1,7 @@
+import type { Snippet } from 'svelte';
+interface Props {
+    children?: Snippet;
+}
+declare const Table: import("svelte").Component<Props, {}, "">;
+type Table = ReturnType<typeof Table>;
+export default Table;

package/dist/components/weblab/WeblabActive.svelte

@@ -0,0 +1,20 @@
+<script lang="ts">
+	import { useWeblabs } from '../../hooks/useWeblabs.svelte'
+	import type { Snippet } from 'svelte'
+
+	interface Props {
+		experiment: string
+		children: Snippet
+	}
+	let { experiment, children }: Props = $props()
+
+	const { weblab } = useWeblabs()
+
+	$effect.pre(() => {
+		weblab.load([experiment])
+	})
+</script>
+
+{#if weblab.isActive(experiment)}
+	{@render children()}
+{/if}

package/dist/components/weblab/WeblabActive.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { Snippet } from 'svelte';
+interface Props {
+    experiment: string;
+    children: Snippet;
+}
+declare const WeblabActive: import("svelte").Component<Props, {}, "">;
+type WeblabActive = ReturnType<typeof WeblabActive>;
+export default WeblabActive;

package/dist/components/weblab/WeblabProvider.svelte

@@ -0,0 +1,8 @@
+<script lang="ts">
+	import { provideWeblabs } from '../../hooks/useWeblabs.svelte'
+
+	let { children } = $props()
+	provideWeblabs()
+</script>
+
+{@render children()}

package/dist/components/weblab/WeblabProvider.svelte.d.ts

@@ -0,0 +1,5 @@
+declare const WeblabProvider: import("svelte").Component<{
+    children: any;
+}, {}, "">;
+type WeblabProvider = ReturnType<typeof WeblabProvider>;
+export default WeblabProvider;

package/dist/components/widgets/ArmPositions.svelte

@@ -0,0 +1,76 @@
+<script lang="ts">
+	import { formatNumeric } from '../../format'
+	import Table from '../shared/Table.svelte'
+	import { useDraggable } from '../../hooks/useDraggable.svelte'
+	import { useArmClient } from '../../hooks/useArmClient.svelte'
+	import { Icon, Label, Select } from '@viamrobotics/prime-core'
+
+	const { ...rest } = $props()
+
+	const draggable = useDraggable('arm-current-positions')
+	const armClient = useArmClient()
+
+	let selectedArm = $state(armClient.names[0])
+
+	const positions = $derived(armClient.currentPositions[selectedArm])
+</script>
+
+<div
+	class="bg-extralight border-medium absolute top-0 left-0 z-1000 m-2 overflow-y-auto border text-xs"
+	style:transform="translate({draggable.current.x}px, {draggable.current.y}px)"
+	{...rest}
+>
+	<div class="flex min-w-0 flex-col">
+		<div class="flex w-full items-center justify-between">
+			<div class="border-medium flex w-full items-center gap-1 border-b p-2">
+				<button
+					onmousedown={draggable.onDragStart}
+					onmouseup={draggable.onDragEnd}
+				>
+					<Icon name="drag" />
+				</button>
+				<h3>Arm positions</h3>
+			</div>
+		</div>
+
+		<div class="flex flex-col gap-2 p-2">
+			<Label>
+				Select arm
+				<Select
+					slot="input"
+					value={selectedArm}
+					name="arm"
+					on:change={(event) => {
+						selectedArm = (event.target as HTMLSelectElement).value
+					}}
+				>
+					{#each armClient.names as name (name)}
+						<option value={name}>{name}</option>
+					{/each}
+				</Select>
+			</Label>
+			<Table>
+				<thead>
+					<tr>
+						<th> Joint </th>
+						<th>Position (degrees)</th>
+					</tr>
+				</thead>
+				<tbody>
+					{#if positions}
+						{#each positions as position, index ([position, index])}
+							<tr>
+								<th> {index} </th>
+								<th> {formatNumeric(position)} </th>
+							</tr>
+						{/each}
+					{:else}
+						<tr>
+							<th colspan="2"> No positions </th>
+						</tr>
+					{/if}
+				</tbody>
+			</Table>
+		</div>
+	</div>
+</div>

package/dist/components/widgets/ArmPositions.svelte.d.ts

@@ -0,0 +1,3 @@
+declare const ArmPositions: import("svelte").Component<Record<string, any>, {}, "">;
+type ArmPositions = ReturnType<typeof ArmPositions>;
+export default ArmPositions;

package/dist/format.d.ts

@@ -0,0 +1 @@
+export declare const formatNumeric: (value?: number, decimals?: number) => string;

package/dist/format.js

@@ -0,0 +1,15 @@
+export const formatNumeric = (value, decimals = 2) => {
+    if (value === undefined) {
+        return '––';
+    }
+    if (isNaN(value)) {
+        return 'NaN';
+    }
+    if (value === Number.POSITIVE_INFINITY) {
+        return '+∞';
+    }
+    if (value === Number.NEGATIVE_INFINITY) {
+        return '-∞';
+    }
+    return value.toFixed(decimals);
+};

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

@@ -0,0 +1,7 @@
+interface Context {
+    names: string[];
+    currentPositions: Record<string, number[] | undefined>;
+}
+export declare const provideArmClient: (partID: () => string) => void;
+export declare const useArmClient: () => Context;
+export {};

package/dist/hooks/useArmClient.svelte.js

@@ -0,0 +1,36 @@
+import { ArmClient, ArmJointPositions } from '@viamrobotics/sdk';
+import { createResourceClient, createResourceQuery, useResourceNames, } from '@viamrobotics/svelte-sdk';
+import { getContext, setContext } from 'svelte';
+const key = Symbol('arm-client-context');
+export const provideArmClient = (partID) => {
+    const arms = useResourceNames(partID, 'arm');
+    const clients = $state({});
+    const options = { refetchInterval: 500 };
+    const jointPositionsQueries = $state({});
+    const names = $derived(arms.current.map((arm) => arm.name));
+    const currentPositions = $derived(Object.fromEntries(Object.entries(jointPositionsQueries).map(([name, query]) => [name, query.data?.values])));
+    $effect(() => {
+        for (const arm of arms.current) {
+            const client = createResourceClient(ArmClient, partID, () => arm.name);
+            if (client.current && !clients[arm.name])
+                clients[arm.name] = { current: client.current };
+        }
+    });
+    $effect(() => {
+        for (const client of Object.values(clients)) {
+            const query = createResourceQuery(client, 'getJointPositions', options);
+            jointPositionsQueries[client.current.name] = query.current;
+        }
+    });
+    setContext(key, {
+        get names() {
+            return names;
+        },
+        get currentPositions() {
+            return currentPositions;
+        },
+    });
+};
+export const useArmClient = () => {
+    return getContext(key);
+};

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

@@ -0,0 +1,3 @@
+import { BatchedArrow } from '../lib';
+export declare const provideArrows: () => void;
+export declare const useArrows: () => BatchedArrow;

package/dist/hooks/useArrows.svelte.js

@@ -0,0 +1,9 @@
+import { BatchedArrow } from '../lib';
+import { getContext, setContext } from 'svelte';
+const key = Symbol('arrow-context');
+export const provideArrows = () => {
+    setContext(key, new BatchedArrow());
+};
+export const useArrows = () => {
+    return getContext(key);
+};

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

@@ -1,5 +1,4 @@
 import { Vector3 } from 'three';
-import { BatchedArrow } from '../three/BatchedArrow';
 import { WorldObject, type PointsGeometry } from '../WorldObject.svelte';
 type ConnectionStatus = 'connecting' | 'open' | 'closed';
 interface Context {
@@ -11,9 +10,6 @@ interface Context {
     nurbs: WorldObject[];
     models: WorldObject[];
     connectionStatus: ConnectionStatus;
-    object3ds: {
-        batchedArrow: BatchedArrow;
-    };
     camera: {
         position: Vector3;
         lookAt: Vector3;

package/dist/hooks/useDrawAPI.svelte.js

@@ -3,8 +3,8 @@ import { Color, Vector3, Vector4 } from 'three';
 import { NURBSCurve } from 'three/addons/curves/NURBSCurve.js';
 import { parsePcdInWorker } from '../loaders/pcd';
 import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader.js';
-import { BatchedArrow } from '../three/BatchedArrow';
 import { WorldObject } from '../WorldObject.svelte';
+import { useArrows } from './useArrows.svelte';
 const key = Symbol('draw-api-context-key');
 const tryParse = (json) => {
     try {
@@ -49,13 +49,16 @@ export const provideDrawAPI = () => {
     const color = new Color();
     const direction = new Vector3();
     const origin = new Vector3();
-    const vec3 = new Vector3();
     const loader = new GLTFLoader();
+    const batchedArrow = useArrows();
     const drawPCD = async (buffer) => {
         const { positions, colors } = await parsePcdInWorker(new Uint8Array(buffer));
         points.push(new WorldObject(`points ${++pointsIndex}`, undefined, undefined, {
-            case: 'points',
-            value: positions,
+            center: undefined,
+            geometryType: {
+                case: 'points',
+                value: positions,
+            },
         }, colors ? { colors } : undefined));
     };
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -65,24 +68,28 @@ export const provideDrawAPI = () => {
             result.pose = data.center;
             return;
         }
-        let geometry;
+        const geometry = {
+            label: data.label,
+            center: undefined,
+            geometryType: {
+                case: undefined,
+            },
+        };
         if ('mesh' in data) {
-            geometry = {
-                case: 'mesh',
-                value: { contentType: '', mesh: data.mesh.mesh },
-            };
+            geometry.geometryType.case = 'mesh';
+            geometry.geometryType.value = data.mesh;
         }
         else if ('box' in data) {
-            geometry = { case: 'box', value: data.box };
+            geometry.geometryType.case = 'box';
+            geometry.geometryType.value = data.box;
         }
         else if ('sphere' in data) {
-            geometry = { case: 'sphere', value: data.sphere };
+            geometry.geometryType.case = 'sphere';
+            geometry.geometryType.value = data.sphere;
         }
         else if ('capsule' in data) {
-            geometry = { case: 'capsule', value: data.capsule };
-        }
-        else {
-            geometry = { case: undefined, value: undefined };
+            geometry.geometryType.case = 'capsule';
+            geometry.geometryType.value = data.capsule;
         }
         const object = new WorldObject(data.label ?? ++geometryIndex, data.center, parent, geometry, {
             color,
@@ -97,10 +104,9 @@ export const provideDrawAPI = () => {
         }
         const controlPoints = data.ControlPts.map((point) => new Vector4(point.x / 1000, point.y / 1000, point.z / 1000));
         const curve = new NURBSCurve(data.Degree, data.Knots, controlPoints);
-        const object = new WorldObject(data.name, data.pose, data.parent, { case: 'line', value: new Float32Array() }, { color, points: curve.getPoints(200) });
+        const object = new WorldObject(data.name, data.pose, data.parent, { center: undefined, geometryType: { case: 'line', value: new Float32Array() } }, { color, points: curve.getPoints(200) });
         nurbs.push(object);
     };
-    const batchedArrow = new BatchedArrow();
     const drawPoses = async (reader) => {
         // Read counts
         const nPoints = reader.read();
@@ -120,12 +126,8 @@ export const provideDrawAPI = () => {
         for (let i = 0, j = 0, l = nextPoses.length; i < l; i += 6, j += 3) {
             origin.set(nextPoses[i], nextPoses[i + 1], nextPoses[i + 2]).multiplyScalar(0.001);
             direction.set(nextPoses[i + 3], nextPoses[i + 4], nextPoses[i + 5]);
-            if (arrowHeadAtPose === 1) {
-                // Compute the base position so the arrow ends at the origin
-                origin.sub(vec3.copy(direction).multiplyScalar(length));
-            }
             color.set(colors[j], colors[j + 1], colors[j + 2]);
-            const arrowId = batchedArrow.addArrow(direction, origin, length, color);
+            const arrowId = batchedArrow.addArrow(direction, origin, length, color, arrowHeadAtPose === 1);
             poses.push(new WorldObject(`pose ${++poseIndex}`, undefined, undefined, undefined, {
                 getBoundingBoxAt(box3) {
                     return batchedArrow.getBoundingBoxAt(arrowId, box3);
@@ -188,8 +190,11 @@ export const provideDrawAPI = () => {
                     color: new Color(r, g, b).convertLinearToSRGB(),
                 };
         points.push(new WorldObject(label, undefined, undefined, {
-            case: 'points',
-            value: positions,
+            center: undefined,
+            geometryType: {
+                case: 'points',
+                value: positions,
+            },
         }, metadata));
     };
     const drawLine = async (reader) => {
@@ -222,8 +227,11 @@ export const provideDrawAPI = () => {
             points.push(new Vector3(positions[i], positions[i + 1], positions[i + 2]));
         }
         lines.push(new WorldObject(label, undefined, undefined, {
-            case: 'line',
-            value: positions,
+            center: undefined,
+            geometryType: {
+                case: 'line',
+                value: positions,
+            },
         }, {
             points,
             color: lineR === -1 ? undefined : new Color().setRGB(lineR, lineG, lineB),
@@ -400,9 +408,6 @@ export const provideDrawAPI = () => {
         get connectionStatus() {
             return connectionStatus;
         },
-        object3ds: {
-            batchedArrow,
-        },
         get camera() {
             return camera;
         },

package/dist/hooks/useFrames.svelte.js

@@ -24,14 +24,11 @@ export const provideFrames = (partID) => {
             }
             const resourceName = resourceNames.current.find((item) => item.name === frame.referenceFrame);
             const frameName = frame.referenceFrame ? frame.referenceFrame : 'Unnamed frame';
-            objects.push(new WorldObject(frameName, frame.poseInObserverFrame?.pose, frame.poseInObserverFrame?.referenceFrame));
-            if (frame.physicalObject?.geometryType) {
-                objects.push(new WorldObject(`${frameName} ${frame.physicalObject.geometryType.case}`, frame.physicalObject.center, frameName, frame.physicalObject.geometryType, resourceName
-                    ? {
-                        color: resourceColors[resourceName.subtype],
-                    }
-                    : undefined));
-            }
+            objects.push(new WorldObject(frameName, frame.poseInObserverFrame?.pose, frame.poseInObserverFrame?.referenceFrame, frame.physicalObject, resourceName
+                ? {
+                    color: resourceColors[resourceName.subtype],
+                }
+                : undefined));
         }
         return objects;
     });

package/dist/hooks/useGeometries.svelte.js

@@ -3,7 +3,7 @@ import { createQueries, queryOptions } from '@tanstack/svelte-query';
 import { createResourceClient, useResourceNames } from '@viamrobotics/svelte-sdk';
 import { setContext, getContext } from 'svelte';
 import { fromStore, toStore } from 'svelte/store';
-import { useMachineSettings } from './useMachineSettings.svelte';
+import { useMachineSettings, RefreshRates } from './useMachineSettings.svelte';
 import { WorldObject } from '../WorldObject.svelte';
 import { usePersistentUUIDs } from './usePersistentUUIDs.svelte';
 import { useLogs } from './useLogs.svelte';
@@ -20,11 +20,8 @@ export const provideGeometries = (partID) => {
     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 clients = $derived([...armClients, ...gripperClients, ...cameraClients]);
-    if (!refreshRates.has('Geometries')) {
-        refreshRates.set('Geometries', 1000);
-    }
     const options = $derived.by(() => {
-        const interval = refreshRates.get('Geometries');
+        const interval = refreshRates.get(RefreshRates.poses);
         const results = [];
         for (const client of clients) {
             const options = queryOptions({
@@ -51,9 +48,9 @@ export const provideGeometries = (partID) => {
         for (const query of queries.current) {
             if (!query.data)
                 continue;
-            for (const { center, label, geometryType } of query.data.geometries) {
+            for (const geometry of query.data.geometries) {
                 const resourceName = resourceNames.current.find((item) => item.name === query.data.name);
-                const worldObject = new WorldObject(label ? label : 'Unnamed geometry', center, query.data.name, geometryType, resourceName
+                const worldObject = new WorldObject(geometry.label ? geometry.label : `${query.data.name} geometry`, undefined, query.data.name, geometry, resourceName
                     ? { color: resourceColors[resourceName.subtype] }
                     : undefined);
                 results.push(worldObject);

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

@@ -1,4 +1,8 @@
 import { SvelteMap } from 'svelte/reactivity';
+export declare const RefreshRates: {
+    readonly poses: "poses";
+    readonly pointclouds: "pointclouds";
+};
 type Context = {
     refreshRates: SvelteMap<string, number>;
     disabledCameras: SvelteMap<string, boolean>;

package/dist/hooks/useMachineSettings.svelte.js

@@ -4,6 +4,10 @@ import { SvelteMap } from 'svelte/reactivity';
 const key = Symbol('polling-rate-context');
 const refreshRatesKey = 'polling-rate';
 const disabledCamerasKey = 'disabled-cameras';
+export const RefreshRates = {
+    poses: 'poses',
+    pointclouds: 'pointclouds',
+};
 const setFromEntries = (map, entries) => {
     if (entries) {
         for (const [key, value] of entries) {
@@ -12,7 +16,10 @@ const setFromEntries = (map, entries) => {
     }
 };
 export const provideMachineSettings = () => {
-    const refreshRates = new SvelteMap();
+    const refreshRates = new SvelteMap([
+        [RefreshRates.poses, 1000],
+        [RefreshRates.pointclouds, -1],
+    ]);
     const disabledCameras = new SvelteMap();
     get(refreshRatesKey).then((entries) => {
         setFromEntries(refreshRates, entries);

package/dist/hooks/usePointclouds.svelte.js

@@ -4,7 +4,7 @@ import { setContext, getContext } from 'svelte';
 import { fromStore, toStore } from 'svelte/store';
 import { createResourceClient, useResourceNames } from '@viamrobotics/svelte-sdk';
 import { parsePcdInWorker } from '../loaders/pcd';
-import { useMachineSettings } from './useMachineSettings.svelte';
+import { RefreshRates, useMachineSettings } from './useMachineSettings.svelte';
 import { WorldObject } from '../WorldObject.svelte';
 import { usePersistentUUIDs } from './usePersistentUUIDs.svelte';
 import { useLogs } from './useLogs.svelte';
@@ -13,12 +13,9 @@ export const providePointclouds = (partID) => {
     const logs = useLogs();
     const { refreshRates, disabledCameras } = useMachineSettings();
     const cameras = useResourceNames(partID, 'camera');
-    if (!refreshRates.has('Pointclouds')) {
-        refreshRates.set('Pointclouds', -1);
-    }
     const clients = $derived(cameras.current.map((camera) => createResourceClient(CameraClient, partID, () => camera.name)));
     const options = $derived.by(() => {
-        const interval = refreshRates.get('Pointclouds');
+        const interval = refreshRates.get(RefreshRates.pointclouds);
         const results = [];
         for (const cameraClient of clients) {
             const name = cameraClient.current?.name ?? '';
@@ -37,7 +34,7 @@ export const providePointclouds = (partID) => {
                     if (!response)
                         return null;
                     const { positions, colors } = await parsePcdInWorker(new Uint8Array(response));
-                    return new WorldObject(`${name}:pointcloud`, undefined, name, { case: 'points', value: positions }, colors ? { colors } : undefined);
+                    return new WorldObject(`${name}:pointcloud`, undefined, name, { center: undefined, geometryType: { case: 'points', value: positions } }, colors ? { colors } : undefined);
                 },
             });
             results.push(options);