@wandelbots/wandelbots-js-react-components 5.4.1 → 5.4.2-pr.ci-pr-preview.586.f684aae

package/src/components/utils/interpolation.test.ts

@@ -578,7 +578,9 @@ describe("ValueInterpolator", () => {
     })
 
     // Clean up
-    interpolators.forEach((interpolator) => interpolator.destroy())
+    interpolators.forEach((interpolator) => {
+      interpolator.destroy()
+    })
   })
 
   it("should handle multiple interpolators using auto-interpolation without interference", async () => {
@@ -613,14 +615,14 @@ describe("ValueInterpolator", () => {
     interpolator3.startAutoInterpolation()
 
     // Wait for automatic interpolation to progress
-    await new Promise(resolve => setTimeout(resolve, 500))
+    await new Promise((resolve) => setTimeout(resolve, 500))
 
     // Check that all interpolators are moving independently
     const values1 = interpolator1.getCurrentValues()
     const values2 = interpolator2.getCurrentValues()
     const values3 = interpolator3.getCurrentValues()
 
-    console.log('Auto-interpolation values:', { values1, values2, values3 })
+    console.log("Auto-interpolation values:", { values1, values2, values3 })
 
     // All should have made significant progress toward their targets
     expect(values1[0]).toBeGreaterThan(1) // Moving toward 10
@@ -668,13 +670,18 @@ describe("ValueInterpolator", () => {
     for (let frame = 0; frame < 30; frame++) {
       manualInterpolator.update(1 / 60)
       manualValues.push(manualInterpolator.getCurrentValues()[0])
-      await new Promise(resolve => setTimeout(resolve, 16)) // ~60fps
+      await new Promise((resolve) => setTimeout(resolve, 16)) // ~60fps
     }
 
     // Check auto interpolator after same time
     const autoValue = autoInterpolator.getCurrentValues()[0]
 
-    console.log('Mixed mode - Manual final:', manualValues[manualValues.length - 1], 'Auto final:', autoValue)
+    console.log(
+      "Mixed mode - Manual final:",
+      manualValues[manualValues.length - 1],
+      "Auto final:",
+      autoValue,
+    )
 
     // Both should have made progress
     expect(manualValues[manualValues.length - 1]).toBeGreaterThan(0.5)
@@ -703,16 +710,16 @@ describe("ValueInterpolator", () => {
     for (let i = 0; i < 5; i++) {
       interpolator.startAutoInterpolation()
       expect(interpolator.isInterpolating()).toBe(true)
-      
+
       interpolator.stop()
       expect(interpolator.isInterpolating()).toBe(false)
-      
-      await new Promise(resolve => setTimeout(resolve, 10))
+
+      await new Promise((resolve) => setTimeout(resolve, 10))
     }
 
     // Final start
     interpolator.startAutoInterpolation()
-    await new Promise(resolve => setTimeout(resolve, 200))
+    await new Promise((resolve) => setTimeout(resolve, 200))
 
     // Should still be working correctly
     const finalValue = interpolator.getCurrentValues()[0]
@@ -728,7 +735,7 @@ describe("ValueInterpolator", () => {
     // useAutorun(() => {
     //   requestAnimationFrame(() => updateJoints(newJointValues))
     // })
-    
+
     const interpolator1 = new ValueInterpolator([0, 0, 0], {
       tension: 120,
       friction: 20,
@@ -749,12 +756,12 @@ describe("ValueInterpolator", () => {
 
     const interpolators = [interpolator1, interpolator2, interpolator3]
 
-    // Simulate the RobotAnimator pattern where multiple components 
+    // Simulate the RobotAnimator pattern where multiple components
     // schedule setTarget calls via requestAnimationFrame
     const targetSets = [
       [1, 2, 3],
-      [4, 5, 6], 
-      [7, 8, 9]
+      [4, 5, 6],
+      [7, 8, 9],
     ]
 
     // Schedule all setTarget calls via requestAnimationFrame (like RobotAnimator does)
@@ -765,20 +772,22 @@ describe("ValueInterpolator", () => {
     })
 
     // Wait for requestAnimationFrame calls to execute
-    await new Promise(resolve => setTimeout(resolve, 50))
+    await new Promise((resolve) => setTimeout(resolve, 50))
 
     // Now manually update all interpolators for several frames
     for (let frame = 0; frame < 30; frame++) {
-      interpolators.forEach(interpolator => {
+      interpolators.forEach((interpolator) => {
         interpolator.update(1 / 60)
       })
-      await new Promise(resolve => setTimeout(resolve, 16))
+      await new Promise((resolve) => setTimeout(resolve, 16))
     }
 
     // Check the results
-    const finalValues = interpolators.map(interpolator => interpolator.getCurrentValues())
-    
-    console.log('RAF setTarget pattern results:', finalValues)
+    const finalValues = interpolators.map((interpolator) =>
+      interpolator.getCurrentValues(),
+    )
+
+    console.log("RAF setTarget pattern results:", finalValues)
 
     // All should have made progress toward their respective targets
     expect(finalValues[0][0]).toBeGreaterThan(0.3) // Moving toward 1
@@ -790,13 +799,15 @@ describe("ValueInterpolator", () => {
     expect(finalValues[1][0]).not.toBeCloseTo(finalValues[2][0], 0)
 
     // Clean up
-    interpolators.forEach(interpolator => interpolator.destroy())
+    interpolators.forEach((interpolator) => {
+      interpolator.destroy()
+    })
   })
 
   it("should handle simultaneous setTarget calls without target blending interference", () => {
     // Test the specific case where setTarget is called on multiple interpolators
     // at nearly the same time (which could trigger the target blending bug)
-    
+
     const interpolator1 = new ValueInterpolator([0], {
       tension: 120,
       friction: 20,
@@ -813,7 +824,7 @@ describe("ValueInterpolator", () => {
     const now = performance.now()
     interpolator1.setTarget([10])
     interpolator2.setTarget([20])
-    
+
     // Verify the targets were set correctly (not blended)
     expect(interpolator1.getCurrentValues()[0]).toBe(0) // Should start at 0
     expect(interpolator2.getCurrentValues()[0]).toBe(0) // Should start at 0
@@ -825,12 +836,15 @@ describe("ValueInterpolator", () => {
     const values1 = interpolator1.getCurrentValues()[0]
     const values2 = interpolator2.getCurrentValues()[0]
 
-    console.log('Simultaneous setTarget - Values after 1 frame:', { values1, values2 })
+    console.log("Simultaneous setTarget - Values after 1 frame:", {
+      values1,
+      values2,
+    })
 
     // Both should be moving in the right direction
     expect(values1).toBeGreaterThan(0) // Moving toward 10
     expect(values2).toBeGreaterThan(0) // Moving toward 20
-    
+
     // Interpolator2 should be moving faster (higher target)
     expect(values2).toBeGreaterThan(values1)
 
@@ -873,11 +887,12 @@ describe("ValueInterpolator", () => {
     interpolator3.startAutoInterpolation()
 
     // Wait for REAL animation frames to process
-    await new Promise(resolve => {
+    await new Promise((resolve) => {
       let frameCount = 0
       const checkProgress = () => {
         frameCount++
-        if (frameCount >= 30) { // Wait for ~30 real frames
+        if (frameCount >= 30) {
+          // Wait for ~30 real frames
           resolve(undefined)
         } else {
           requestAnimationFrame(checkProgress)
@@ -891,7 +906,7 @@ describe("ValueInterpolator", () => {
     const values2 = interpolator2.getCurrentValues()[0]
     const values3 = interpolator3.getCurrentValues()[0]
 
-    console.log('Real RAF test results:', { values1, values2, values3 })
+    console.log("Real RAF test results:", { values1, values2, values3 })
 
     // All should have made significant progress
     expect(values1).toBeGreaterThan(1)
@@ -970,7 +985,7 @@ describe("ValueInterpolator", () => {
     const values1 = interpolator1.getCurrentValues()
     const values2 = interpolator2.getCurrentValues()
 
-    console.log('useFrame simulation results:', { values1, values2 })
+    console.log("useFrame simulation results:", { values1, values2 })
 
     // Both should have made good progress
     expect(values1[0]).toBeGreaterThan(0.5) // Moving toward 1
@@ -993,7 +1008,7 @@ describe("ValueInterpolator", () => {
   it("should handle CartesianJoggingAxisVisualization pattern with multiple components", async () => {
     // This test replicates the exact pattern from CartesianJoggingAxisVisualization
     // where multiple components watch the same MobX observable and call setTarget via RAF
-    
+
     const interpolator1 = new ValueInterpolator([0, 0, 0, 0, 0, 0, 1], {
       tension: 120,
       friction: 20,
@@ -1035,7 +1050,7 @@ describe("ValueInterpolator", () => {
     requestAnimationFrame(() => updateFlangePose3(pose3))
 
     // Wait for RAF calls to execute
-    await new Promise(resolve => setTimeout(resolve, 32))
+    await new Promise((resolve) => setTimeout(resolve, 32))
 
     // Now simulate useFrame updates for all three interpolators
     for (let frame = 0; frame < 30; frame++) {
@@ -1043,17 +1058,17 @@ describe("ValueInterpolator", () => {
       interpolator1.update(delta)
       interpolator2.update(delta)
       interpolator3.update(delta)
-      await new Promise(resolve => setTimeout(resolve, 16))
+      await new Promise((resolve) => setTimeout(resolve, 16))
     }
 
     const values1 = interpolator1.getCurrentValues()
     const values2 = interpolator2.getCurrentValues()
     const values3 = interpolator3.getCurrentValues()
 
-    console.log('CartesianJoggingAxisVisualization pattern results:')
-    console.log('Component 1:', values1.slice(0, 3))
-    console.log('Component 2:', values2.slice(0, 3))
-    console.log('Component 3:', values3.slice(0, 3))
+    console.log("CartesianJoggingAxisVisualization pattern results:")
+    console.log("Component 1:", values1.slice(0, 3))
+    console.log("Component 2:", values2.slice(0, 3))
+    console.log("Component 3:", values3.slice(0, 3))
 
     // Each interpolator should be moving toward its own target
     expect(values1[0]).toBeCloseTo(0.1, 1) // Should be close to target 0.1
@@ -1101,16 +1116,16 @@ describe("ValueInterpolator", () => {
     })
 
     // Wait for all RAF calls to execute
-    await new Promise(resolve => setTimeout(resolve, 100))
+    await new Promise((resolve) => setTimeout(resolve, 100))
 
     // Run interpolation for a while
     for (let frame = 0; frame < 50; frame++) {
       interpolator.update(1 / 60)
-      await new Promise(resolve => setTimeout(resolve, 16))
+      await new Promise((resolve) => setTimeout(resolve, 16))
     }
 
     const finalValues = interpolator.getCurrentValues()
-    console.log('Rapid pose updates result:', finalValues.slice(0, 3))
+    console.log("Rapid pose updates result:", finalValues.slice(0, 3))
 
     // Should converge toward the final target [0.15, 0.15, 0.15]
     expect(finalValues[0]).toBeCloseTo(0.15, 1)

package/src/components/utils/interpolation.ts

@@ -375,5 +375,6 @@ export function useInterpolation(
     }
   }, [])
 
+  // biome-ignore lint/style/noNonNullAssertion: pre-biome code
   return [interpolatorRef.current!]
 }

package/src/externalizeComponent.tsx

@@ -1,4 +1,6 @@
-import { type FC } from "react"
+/* biome-ignore-all lint/suspicious/noExplicitAny: pre-biome code */
+
+import type { FC } from "react"
 import { I18nextProvider } from "react-i18next"
 import { i18n } from "./i18n/config"
 

package/src/icons/DropdownArrowIcon.tsx

@@ -1,5 +1,4 @@
-import { SvgIcon, type SvgIconProps } from "@mui/material"
-
+import SvgIcon, { type SvgIconProps } from "@mui/material/SvgIcon"
 export const DropdownArrowIcon = (props: SvgIconProps) => {
   return (
     <SvgIcon {...props} viewBox="0 0 10 8">

package/src/lib/JoggerConnection.ts

@@ -57,7 +57,7 @@ export class JoggerConnection {
   ENDPOINT_TRAJECTORY = "/execution/trajectory"
   DEFAULT_MODE = "off" as JoggerMode
   DEFAULT_TCP: string | undefined = "Flange"
-  NO_TCP: string | undefined = undefined;
+  NO_TCP: string | undefined = undefined
   // DEFAULT_COORDINATE_SYSTEM = "world"
   DEFAULT_INIT_TIMEOUT = 5000
   DEFAULT_ORIENTATION = "coordsys" as JoggerOrientation
@@ -97,7 +97,6 @@ export class JoggerConnection {
     // Get matching motion stream
     const motionStream = await MotionStreamConnection.open(nova, motionGroupId)
 
-
     // Initialize jogger with options
     const jogger = new JoggerConnection(motionStream, options)
 
@@ -112,7 +111,10 @@ export class JoggerConnection {
     readonly motionStream: MotionStreamConnection,
     readonly options: JoggerConnectionOptions | undefined = {},
   ) {
-    this.tcp = options?.tcp || motionStream.motionGroup.tcp || this.getDefaultTcp(motionStream)
+    this.tcp =
+      options?.tcp ||
+      motionStream.motionGroup.tcp ||
+      this.getDefaultTcp(motionStream)
     // this.coordinateSystem = options?.coordinateSystem || this.DEFAULT_COORDINATE_SYSTEM
     this.orientation = options?.orientation || this.DEFAULT_ORIENTATION
     this.timeout = options?.timeout || this.DEFAULT_INIT_TIMEOUT
@@ -120,15 +122,16 @@ export class JoggerConnection {
     this.onError = options?.onError
   }
 
-  getDefaultTcp(motionStream: MotionStreamConnection){
+  getDefaultTcp(motionStream: MotionStreamConnection) {
     const firstJointType = motionStream.description.dh_parameters?.[0]?.type
-    if(
+    if (
       motionStream.joints.length < 6 &&
-      (firstJointType === JointTypeEnum.RevoluteJoint || firstJointType === JointTypeEnum.PrismaticJoint)
-    ){
-      return this.NO_TCP;
+      (firstJointType === JointTypeEnum.RevoluteJoint ||
+        firstJointType === JointTypeEnum.PrismaticJoint)
+    ) {
+      return this.NO_TCP
     }
-    return this.DEFAULT_TCP;
+    return this.DEFAULT_TCP
   }
 
   // Set a new tcp or other options. If current mode is jogging, will reinitialize the jogging websocket
@@ -297,8 +300,7 @@ export class JoggerConnection {
     joint,
     direction,
     velocityValue,
-    velocityUnit
-
+    velocityUnit,
   }: {
     /** Index of the joint to rotate */
     joint: number
@@ -307,7 +309,6 @@ export class JoggerConnection {
     /** Speed of the rotation, unit is currently unused, but i wanted it there to raise awareness that not everything here is rad/s*/
     velocityValue: number
     velocityUnit: "mm/s" | "rad/s"
-
   }) {
     if (!this.joggingSocket || this.mode !== "jogging") {
       throw new Error(
@@ -317,8 +318,7 @@ export class JoggerConnection {
 
     const velocity = new Array(this.numJoints).fill(0)
 
-    velocity[joint] =
-      direction === "-" ? - velocityValue : velocityValue
+    velocity[joint] = direction === "-" ? -velocityValue : velocityValue
 
     this.joggingSocket.sendJson({
       message_type: "JointVelocityRequest",
@@ -408,14 +408,14 @@ export class JoggerConnection {
     axis: "x" | "y" | "z"
     direction: "-" | "+"
     motion:
-    | {
-      type: "rotate"
-      distanceRads: number
-    }
-    | {
-      type: "translate"
-      distanceMm: number
-    }
+      | {
+          type: "rotate"
+          distanceRads: number
+        }
+      | {
+          type: "translate"
+          distanceMm: number
+        }
   }) {
     const commands: MotionCommand[] = []
 
@@ -577,8 +577,8 @@ export class JoggerConnection {
         } else {
           throw new Error(
             result?.add_trajectory_error?.message ||
-            result?.message ||
-            "Failed to execute trajectory, unknown error",
+              result?.message ||
+              "Failed to execute trajectory, unknown error",
           )
         }
       }

package/src/themes/createDarkTheme.ts

@@ -1,5 +1,4 @@
-import { createTheme, rgbToHex, type Theme } from "@mui/material"
-
+import { createTheme, type Theme } from "@mui/material/styles"
 export function createDarkTheme(): Theme {
   const baseTheme = createTheme({
     palette: {
@@ -338,7 +337,7 @@ export function createDarkTheme(): Theme {
         VelocitySlider: {
           sliderLegendColor: baseTheme.palette.text.primary,
         },
-      }
+      },
     },
   } as Theme
 }