@wandelbots/wandelbots-js-react-components 2.41.0-pr.feature-seperate-timer.383.38eb55e → 2.41.0-pr.feature-seperate-timer.383.35a3a58

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wandelbots/wandelbots-js-react-components",
-  "version": "2.41.0-pr.feature-seperate-timer.383.38eb55e",
+  "version": "2.41.0-pr.feature-seperate-timer.383.35a3a58",
   "description": "React UI toolkit for building applications on top of the Wandelbots platform",
   "type": "module",
   "sideEffects": false,
@@ -59,8 +59,8 @@
     "@rollup/plugin-node-resolve": "^16.0.0",
     "@rollup/plugin-terser": "^0.4.4",
     "@rollup/plugin-typescript": "^12.1.2",
-    "@storybook/addon-docs": "^9.1.3",
-    "@storybook/react-vite": "^9.1.3",
+    "@storybook/addon-docs": "^9.1.6",
+    "@storybook/react-vite": "^9.1.6",
     "@storybook/test-runner": "^0.23.0",
     "@svgr/rollup": "^8.1.0",
     "@testing-library/jest-dom": "^6.6.3",
@@ -72,7 +72,7 @@
     "@vitejs/plugin-react": "^4.3.4",
     "@wandelbots/nova-js": "^2.1.0",
     "add": "^2.0.6",
-    "eslint-plugin-storybook": "^9.1.3",
+    "eslint-plugin-storybook": "^9.1.6",
     "glob": "^11.0.1",
     "http-server": "^14.1.1",
     "husky": "^9.1.7",
@@ -95,7 +95,7 @@
     "rollup-plugin-peer-deps-external": "^2.2.4",
     "rollup-plugin-postcss": "^4.0.2",
     "semantic-release": "^24.2.3",
-    "storybook": "^9.1.3",
+    "storybook": "^9.1.6",
     "storybook-preset-inline-svg": "^1.0.1",
     "three": "^0.174.0",
     "three-stdlib": "^2.35.14",

package/src/components/jogging/PoseCartesianValues.tsx

@@ -2,36 +2,13 @@ import { Button, Stack, Typography } from "@mui/material"
 import { poseToWandelscriptString } from "@wandelbots/nova-js"
 import type {
   ConnectedMotionGroup,
-  MotionGroupStateResponse,
   MotionStreamConnection,
 } from "@wandelbots/nova-js/v1"
 import { observer } from "mobx-react-lite"
 import { useRef, useState } from "react"
 import { externalizeComponent } from "../../externalizeComponent"
 import { CopyableText } from "../CopyableText"
-import { useAutorun } from "../utils/hooks"
-
-/** Minimal interface for what PoseCartesianValues needs from motion stream */
-type MotionStateProvider = {
-  rapidlyChangingMotionState: MotionGroupStateResponse
-}
-
-/** Creates a motion state provider from either a MotionStreamConnection or ConnectedMotionGroup */
-function createMotionStateProvider(
-  motionStream?: MotionStreamConnection,
-  connectedMotionGroup?: ConnectedMotionGroup,
-): MotionStateProvider | undefined {
-  if (motionStream) {
-    return motionStream
-  }
-  if (connectedMotionGroup) {
-    return {
-      rapidlyChangingMotionState:
-        connectedMotionGroup.rapidlyChangingMotionState,
-    }
-  }
-  return undefined
-}
+import { useAnimationFrame } from "../utils/hooks"
 
 export type PoseCartesianValuesProps = {
   /** Either a MotionStreamConnection or ConnectedMotionGroup */
@@ -50,20 +27,17 @@ export const PoseCartesianValues = externalizeComponent(
       const poseHolderRef = useRef<HTMLDivElement>(null)
       const [copyMessage, setCopyMessage] = useState("")
 
-      const activeMotionStream = createMotionStateProvider(
-        motionStream,
-        connectedMotionGroup,
-      )
-
-      if (!activeMotionStream) {
+      if (!motionStream && !connectedMotionGroup) {
         throw new Error(
           "PoseCartesianValues requires either motionStream or connectedMotionGroup prop",
         )
       }
 
       function getCurrentPoseString() {
-        if (!activeMotionStream) return ""
-        const tcpPose = activeMotionStream.rapidlyChangingMotionState.tcp_pose
+        const tcpPose = motionStream
+          ? motionStream.rapidlyChangingMotionState.tcp_pose
+          : connectedMotionGroup?.rapidlyChangingMotionState.tcp_pose
+
         if (!tcpPose) return ""
         return poseToWandelscriptString(tcpPose)
       }
@@ -79,24 +53,16 @@ export const PoseCartesianValues = externalizeComponent(
         }
       }
 
-      useAutorun(() => {
-        if (!poseHolderRef.current || !activeMotionStream) {
+      useAnimationFrame(() => {
+        if (!poseHolderRef.current) {
+          return
+        }
+        const newPoseContent = getCurrentPoseString()
+        if (poseHolderRef.current.textContent === newPoseContent) {
           return
         }
 
-        const tcpPose = activeMotionStream.rapidlyChangingMotionState.tcp_pose
-        if (!tcpPose) return
-
-        const newPoseContent = poseToWandelscriptString(tcpPose)
-
-        requestAnimationFrame(() => {
-          if (
-            poseHolderRef.current &&
-            poseHolderRef.current.textContent !== newPoseContent
-          ) {
-            poseHolderRef.current.textContent = newPoseContent
-          }
-        })
+        poseHolderRef.current.textContent = newPoseContent
       })
 
       return (

package/src/components/jogging/PoseJointValues.tsx

@@ -1,36 +1,13 @@
 import { Button, Stack, Typography } from "@mui/material"
 import type {
   ConnectedMotionGroup,
-  MotionGroupStateResponse,
   MotionStreamConnection,
 } from "@wandelbots/nova-js/v1"
 import { observer } from "mobx-react-lite"
 import { useRef, useState } from "react"
 import { externalizeComponent } from "../../externalizeComponent"
 import { CopyableText } from "../CopyableText"
-import { useAutorun } from "../utils/hooks"
-
-/** Minimal interface for what PoseJointValues needs from motion stream */
-type MotionStateProvider = {
-  rapidlyChangingMotionState: MotionGroupStateResponse
-}
-
-/** Creates a motion state provider from either a MotionStreamConnection or ConnectedMotionGroup */
-function createMotionStateProvider(
-  motionStream?: MotionStreamConnection,
-  connectedMotionGroup?: ConnectedMotionGroup,
-): MotionStateProvider | undefined {
-  if (motionStream) {
-    return motionStream
-  }
-  if (connectedMotionGroup) {
-    return {
-      rapidlyChangingMotionState:
-        connectedMotionGroup.rapidlyChangingMotionState,
-    }
-  }
-  return undefined
-}
+import { useAnimationFrame } from "../utils/hooks"
 
 export type PoseJointValuesProps = {
   /** Either a MotionStreamConnection or ConnectedMotionGroup */
@@ -49,21 +26,19 @@ export const PoseJointValues = externalizeComponent(
       const poseHolderRef = useRef<HTMLDivElement>(null)
       const [copyMessage, setCopyMessage] = useState("")
 
-      const activeMotionStream = createMotionStateProvider(
-        motionStream,
-        connectedMotionGroup,
-      )
-
-      if (!activeMotionStream) {
+      if (!motionStream && !connectedMotionGroup) {
         throw new Error(
           "PoseJointValues requires either motionStream or connectedMotionGroup prop",
         )
       }
 
       function getCurrentPoseString() {
-        if (!activeMotionStream) return ""
-        const { joints } =
-          activeMotionStream.rapidlyChangingMotionState.state.joint_position
+        const joints = motionStream
+          ? motionStream.rapidlyChangingMotionState.state.joint_position.joints
+          : connectedMotionGroup?.rapidlyChangingMotionState.state
+              .joint_position.joints
+
+        if (!joints) return ""
         return `[${joints.map((j: number) => parseFloat(j.toFixed(4))).join(", ")}]`
       }
 
@@ -78,23 +53,16 @@ export const PoseJointValues = externalizeComponent(
         }
       }
 
-      useAutorun(() => {
-        if (!poseHolderRef.current || !activeMotionStream) {
+      useAnimationFrame(() => {
+        if (!poseHolderRef.current) {
+          return
+        }
+        const newPoseContent = getCurrentPoseString()
+        if (poseHolderRef.current.textContent === newPoseContent) {
           return
         }
 
-        const { joints } =
-          activeMotionStream.rapidlyChangingMotionState.state.joint_position
-        const newPoseContent = `[${joints.map((j: number) => parseFloat(j.toFixed(4))).join(", ")}]`
-
-        requestAnimationFrame(() => {
-          if (
-            poseHolderRef.current &&
-            poseHolderRef.current.textContent !== newPoseContent
-          ) {
-            poseHolderRef.current.textContent = newPoseContent
-          }
-        })
+        poseHolderRef.current.textContent = newPoseContent
       })
 
       return (