@pascal-app/editor 1.0.7 → 1.1.1

package/src/components/editor/fit-scene-framing.test.ts

@@ -0,0 +1,318 @@
+import { describe, expect, test } from 'bun:test'
+import { CameraControlsImpl } from '@react-three/drei'
+import * as THREE from 'three'
+import {
+  computeFitSceneLookAt,
+  type PendingFitScene,
+  planFitSceneOnEvent,
+  planFitSceneOnOrbitResume,
+  planLevelFollow,
+} from './fit-scene-framing'
+
+const sampleBounds = {
+  center: [10, 20] as [number, number],
+  size: [30, 40] as [number, number],
+}
+
+describe('fit-scene framing', () => {
+  test('computes default look-at when bounds are null', () => {
+    expect(computeFitSceneLookAt(null)).toEqual({
+      eyeX: 20,
+      eyeY: 20,
+      eyeZ: 20,
+      targetX: 0,
+      targetY: 0,
+      targetZ: 0,
+      eyeHeight: 20,
+      fitSphere: { center: [0, 0, 0], radius: 15 },
+    })
+  })
+
+  test('computes orbit look-at from scene bounds', () => {
+    const lookAt = computeFitSceneLookAt(sampleBounds)
+    // Longer extent is depth=40 → distance=56, height=32
+    expect(lookAt).toEqual({
+      eyeX: 10 + 56 * 0.7,
+      eyeY: 32,
+      eyeZ: 20 + 56 * 0.7,
+      targetX: 10,
+      targetY: 0,
+      targetZ: 20,
+      eyeHeight: 32,
+      fitSphere: { center: [10, 0, 20], radius: 25 * 1.3 },
+    })
+  })
+
+  test('rests the pivot and lifts the eye by the level ground height', () => {
+    const lookAt = computeFitSceneLookAt(sampleBounds, 3)
+    expect(lookAt.targetY).toBe(3)
+    expect(lookAt.eyeY).toBe(35)
+    expect(lookAt.eyeHeight).toBe(32)
+    expect(computeFitSceneLookAt(null, 3)).toMatchObject({ eyeY: 23, targetY: 3 })
+  })
+
+  test('fits the orthographic sphere around the footprint at the pivot', () => {
+    const lookAt = computeFitSceneLookAt(sampleBounds, 3)
+    expect(lookAt.fitSphere.center).toEqual([lookAt.targetX, lookAt.targetY, lookAt.targetZ])
+    const [cx, cz] = sampleBounds.center
+    const [w, d] = sampleBounds.size
+    for (const [x, z] of [
+      [cx - w / 2, cz - d / 2],
+      [cx + w / 2, cz + d / 2],
+      [cx - w / 2, cz + d / 2],
+    ] as const) {
+      expect(Math.hypot(x - cx, z - cz)).toBeLessThan(lookAt.fitSphere.radius)
+    }
+    const lone = computeFitSceneLookAt({ center: [0, 0], size: [1, 0.2] })
+    expect(lone.fitSphere.radius).toBe(5)
+    expect(computeFitSceneLookAt(null, 3).fitSphere).toEqual({ center: [0, 3, 0], radius: 15 })
+  })
+
+  test('an orthographic camera fitted to the sphere shows the whole footprint whatever its zoom was', () => {
+    const previous = globalThis.DOMRect
+    globalThis.DOMRect ??= class {} as typeof DOMRect
+    CameraControlsImpl.install({ THREE })
+    const camera = new THREE.OrthographicCamera(-8, 8, 5, -5, 0.1, 1000)
+    const control = new CameraControlsImpl(camera)
+    const bounds = { center: [60, -20] as [number, number], size: [80, 30] as [number, number] }
+    try {
+      // The previous project left the camera zoomed in on a small room.
+      control.zoomTo(12, false)
+      const lookAt = computeFitSceneLookAt(bounds)
+      control.setLookAt(
+        lookAt.eyeX,
+        lookAt.eyeY,
+        lookAt.eyeZ,
+        lookAt.targetX,
+        lookAt.targetY,
+        lookAt.targetZ,
+        false,
+      )
+      const sphere = new THREE.Sphere(
+        new THREE.Vector3(...lookAt.fitSphere.center),
+        lookAt.fitSphere.radius,
+      )
+      control.fitToSphere(sphere, false)
+      control.update(0)
+      camera.updateMatrixWorld(true)
+
+      const target = control.getTarget(new THREE.Vector3())
+      expect(target.toArray()).toEqual([lookAt.targetX, lookAt.targetY, lookAt.targetZ])
+      const [cx, cz] = bounds.center
+      const [w, d] = bounds.size
+      for (const x of [cx - w / 2, cx + w / 2])
+        for (const z of [cz - d / 2, cz + d / 2]) {
+          const projected = new THREE.Vector3(x, 0, z).project(camera)
+          expect(Math.abs(projected.x)).toBeLessThanOrEqual(1)
+          expect(Math.abs(projected.y)).toBeLessThanOrEqual(1)
+        }
+    } finally {
+      control.dispose()
+      globalThis.DOMRect = previous
+    }
+  })
+
+  test('applies immediately when orbit controls are live', () => {
+    const plan = planFitSceneOnEvent({
+      isPreviewMode: false,
+      isFirstPersonMode: false,
+      hasControls: true,
+      bounds: sampleBounds,
+    })
+
+    expect(plan).toEqual({
+      action: 'apply',
+      lookAt: computeFitSceneLookAt(sampleBounds),
+    })
+  })
+
+  test('ignores fit-scene while preview mode is active', () => {
+    const plan = planFitSceneOnEvent({
+      isPreviewMode: true,
+      isFirstPersonMode: false,
+      hasControls: true,
+      bounds: sampleBounds,
+    })
+    expect(plan).toEqual({ action: 'ignore' })
+  })
+
+  test('queues fit-scene while first-person is active (scene-ready during FP)', () => {
+    const plan = planFitSceneOnEvent({
+      isPreviewMode: false,
+      isFirstPersonMode: true,
+      hasControls: false,
+      bounds: sampleBounds,
+    })
+
+    expect(plan).toEqual({
+      action: 'queue',
+      pending: { bounds: sampleBounds },
+    })
+  })
+
+  test('queues fit-scene when orbit controls are not mounted yet', () => {
+    const plan = planFitSceneOnEvent({
+      isPreviewMode: false,
+      isFirstPersonMode: false,
+      hasControls: false,
+      bounds: sampleBounds,
+    })
+
+    expect(plan).toEqual({
+      action: 'queue',
+      pending: { bounds: sampleBounds },
+    })
+  })
+
+  test('scene-ready during first-person then return to orbit applies the pending frame', () => {
+    // Mirrors the blocking lifecycle: fit arrives while FP is active, then
+    // orbit remounts and the queued frame must still apply.
+    let pending: PendingFitScene | null = null
+
+    const duringFirstPerson = planFitSceneOnEvent({
+      isPreviewMode: false,
+      isFirstPersonMode: true,
+      hasControls: false,
+      bounds: sampleBounds,
+    })
+    expect(duringFirstPerson.action).toBe('queue')
+    if (duringFirstPerson.action === 'queue') {
+      pending = duringFirstPerson.pending
+    }
+
+    // Still in first-person: controls are not ready, keep the pending frame.
+    expect(
+      planFitSceneOnOrbitResume({
+        isPreviewMode: false,
+        isFirstPersonMode: true,
+        hasControls: false,
+        pending,
+      }),
+    ).toEqual({ action: 'noop' })
+
+    // Leave first-person; orbit controls remount and can apply the frame.
+    const afterOrbitResume = planFitSceneOnOrbitResume({
+      isPreviewMode: false,
+      isFirstPersonMode: false,
+      hasControls: true,
+      pending,
+    })
+
+    expect(afterOrbitResume).toEqual({
+      action: 'apply',
+      lookAt: computeFitSceneLookAt(sampleBounds),
+    })
+  })
+
+  test('latest fit-scene while first-person wins when orbit resumes', () => {
+    let pending: PendingFitScene | null = null
+    const first = planFitSceneOnEvent({
+      isPreviewMode: false,
+      isFirstPersonMode: true,
+      hasControls: false,
+      bounds: null,
+    })
+    if (first.action === 'queue') pending = first.pending
+
+    const secondBounds = {
+      center: [0, 0] as [number, number],
+      size: [10, 10] as [number, number],
+    }
+    const second = planFitSceneOnEvent({
+      isPreviewMode: false,
+      isFirstPersonMode: true,
+      hasControls: false,
+      bounds: secondBounds,
+    })
+    if (second.action === 'queue') pending = second.pending
+
+    expect(
+      planFitSceneOnOrbitResume({
+        isPreviewMode: false,
+        isFirstPersonMode: false,
+        hasControls: true,
+        pending,
+      }),
+    ).toEqual({
+      action: 'apply',
+      lookAt: computeFitSceneLookAt(secondBounds),
+    })
+  })
+
+  test('does not flush a pending frame into preview mode', () => {
+    expect(
+      planFitSceneOnOrbitResume({
+        isPreviewMode: true,
+        isFirstPersonMode: false,
+        hasControls: true,
+        pending: { bounds: sampleBounds },
+      }),
+    ).toEqual({ action: 'noop' })
+  })
+})
+
+describe('level follow', () => {
+  type Inputs = { levelId: string | null; levelMode: string; camera: object; sceneEmpty: boolean }
+
+  // The effect's bookkeeping: one instance per mounted CustomCameraControls.
+  function mountLevelFollow(initial: Inputs) {
+    let firstLoad = true
+    let previous = { ...initial }
+    return (next: Inputs) => {
+      const plan = planLevelFollow({
+        firstLoad,
+        sceneEmpty: next.sceneEmpty,
+        levelChanged: previous.levelId !== next.levelId,
+        modeChanged: previous.levelMode !== next.levelMode,
+        cameraChanged: previous.camera !== next.camera,
+      })
+      firstLoad = false
+      previous = { ...next }
+      return plan
+    }
+  }
+
+  const perspective = {}
+  const loaded: Inputs = {
+    levelId: 'level_1',
+    levelMode: 'stacked',
+    camera: perspective,
+    sceneEmpty: false,
+  }
+
+  test('an empty first load takes the default pose', () => {
+    const run = mountLevelFollow({ ...loaded, levelId: null, sceneEmpty: true })
+    expect(run({ ...loaded, levelId: null, sceneEmpty: true })).toBe('default-pose')
+  })
+
+  test('a remount over a loaded scene rests the fresh pivot on the level', () => {
+    const run = mountLevelFollow(loaded)
+    expect(run(loaded)).toBe('rest-pivot')
+    expect(run(loaded)).toBe('none')
+  })
+
+  test('a level-mode change pans the pivot', () => {
+    const run = mountLevelFollow(loaded)
+    run(loaded)
+    expect(run({ ...loaded, levelMode: 'exploded' })).toBe('rest-pivot')
+  })
+
+  test('the first pick after a site-phase load pans to the level', () => {
+    const site = { ...loaded, levelId: null }
+    const run = mountLevelFollow(site)
+    run(site)
+    expect(run(loaded)).toBe('rest-pivot')
+  })
+
+  test('re-picking the same level does not move the pivot', () => {
+    const run = mountLevelFollow(loaded)
+    run(loaded)
+    expect(run({ ...loaded })).toBe('none')
+  })
+
+  test('a camera swap re-rests the new controls pivot', () => {
+    const run = mountLevelFollow(loaded)
+    run(loaded)
+    expect(run({ ...loaded, camera: {} })).toBe('rest-pivot')
+  })
+})

package/src/components/editor/fit-scene-framing.ts

@@ -0,0 +1,142 @@
+export type FitSceneBounds = {
+  center: [number, number]
+  size: [number, number]
+} | null
+
+export type FitSceneLookAt = {
+  eyeX: number
+  eyeY: number
+  eyeZ: number
+  targetX: number
+  targetY: number
+  targetZ: number
+  /** The eye's height above `targetY`, before any keep-over-ground lift. */
+  eyeHeight: number
+  /**
+   * What an orthographic camera fits its zoom to: `setLookAt` leaves the
+   * previous project's zoom in place. Centred on the target, so fitting it
+   * does not move the pivot.
+   */
+  fitSphere: { center: [number, number, number]; radius: number }
+}
+
+// The empty-editor pose shows the default ±15 m site.
+const DEFAULT_FIT_RADIUS = 15
+// Margin around the footprint, as the frame-node path uses for orthographic fits.
+const FIT_SPHERE_MARGIN = 1.3
+// Keeps a lone wall from filling the viewport, like the perspective 15 m floor.
+const MIN_FIT_RADIUS = 5
+
+export type PendingFitScene = {
+  bounds: FitSceneBounds
+}
+
+export type FitSceneEventPlan =
+  | { action: 'ignore' }
+  | { action: 'apply'; lookAt: FitSceneLookAt }
+  | { action: 'queue'; pending: PendingFitScene }
+
+export type FitSceneResumePlan = { action: 'noop' } | { action: 'apply'; lookAt: FitSceneLookAt }
+
+/**
+ * Compute the orbit look-at used by `camera-controls:fit-scene`, resting the
+ * pivot at `groundY` (the selected level's orbit height).
+ * Null bounds restore the empty-editor default pose.
+ */
+export function computeFitSceneLookAt(bounds: FitSceneBounds, groundY = 0): FitSceneLookAt {
+  if (!bounds) {
+    return {
+      eyeX: 20,
+      eyeY: 20 + groundY,
+      eyeZ: 20,
+      targetX: 0,
+      targetY: groundY,
+      targetZ: 0,
+      eyeHeight: 20,
+      fitSphere: { center: [0, groundY, 0], radius: DEFAULT_FIT_RADIUS },
+    }
+  }
+
+  const [cx, cz] = bounds.center
+  const [w, d] = bounds.size
+  // Use the longer horizontal extent to size the orbit radius so the whole
+  // footprint sits in view regardless of aspect ratio.
+  const maxExtent = Math.max(w, d)
+  const distance = Math.max(maxExtent * 1.4, 15)
+  const height = Math.max(maxExtent * 0.8, 10)
+  return {
+    eyeX: cx + distance * 0.7,
+    eyeY: height + groundY,
+    eyeZ: cz + distance * 0.7,
+    targetX: cx,
+    targetY: groundY,
+    targetZ: cz,
+    eyeHeight: height,
+    fitSphere: {
+      center: [cx, groundY, cz],
+      radius: Math.max((Math.hypot(w, d) / 2) * FIT_SPHERE_MARGIN, MIN_FIT_RADIUS),
+    },
+  }
+}
+
+/**
+ * Decide what to do when a fit-scene event arrives.
+ * First-person (and briefly-unmounted orbit controls) must queue the frame
+ * so it can apply once orbit is back.
+ */
+export function planFitSceneOnEvent(input: {
+  isPreviewMode: boolean
+  isFirstPersonMode: boolean
+  hasControls: boolean
+  bounds: FitSceneBounds
+  groundY?: number
+}): FitSceneEventPlan {
+  if (input.isPreviewMode) return { action: 'ignore' }
+
+  const pending: PendingFitScene = { bounds: input.bounds }
+  if (input.isFirstPersonMode || !input.hasControls) {
+    return { action: 'queue', pending }
+  }
+
+  return { action: 'apply', lookAt: computeFitSceneLookAt(input.bounds, input.groundY) }
+}
+
+/**
+ * Flush a queued load frame once orbit controls can apply it. The ground is
+ * read at flush time: the selected level may have changed while it waited.
+ */
+export function planFitSceneOnOrbitResume(input: {
+  isPreviewMode: boolean
+  isFirstPersonMode: boolean
+  hasControls: boolean
+  pending: PendingFitScene | null
+  groundY?: number
+}): FitSceneResumePlan {
+  if (!input.pending || input.isPreviewMode || input.isFirstPersonMode || !input.hasControls) {
+    return { action: 'noop' }
+  }
+
+  return { action: 'apply', lookAt: computeFitSceneLookAt(input.pending.bounds, input.groundY) }
+}
+
+export type LevelFollowPlan = 'none' | 'default-pose' | 'rest-pivot'
+
+/**
+ * What the level-follow effect does with the orbit pivot.
+ *
+ * Only a scene-less first run takes the default pose. A first run over a
+ * loaded scene is a fresh controls instance (mount, leaving XR, error-boundary
+ * recovery) whose pivot sits at the origin, so it is rested on the level like
+ * a camera change; on a real load the later scene-ready fit still wins.
+ * Afterwards the pivot follows level, level-mode and camera changes only.
+ */
+export function planLevelFollow(input: {
+  firstLoad: boolean
+  sceneEmpty: boolean
+  levelChanged: boolean
+  modeChanged: boolean
+  cameraChanged: boolean
+}): LevelFollowPlan {
+  if (input.firstLoad) return input.sceneEmpty ? 'default-pose' : 'rest-pivot'
+  return input.levelChanged || input.modeChanged || input.cameraChanged ? 'rest-pivot' : 'none'
+}

package/src/components/editor/floating-action-menu.tsx

@@ -14,6 +14,7 @@ import {
   getWallThickness,
   isCurvedWall,
   isDerivedNode,
+  isNodeDuplicable,
   isRegistryMovable,
   isRegistrySelectable,
   isSplineFence,
@@ -29,6 +30,7 @@ import {
   type WallNode,
 } from '@pascal-app/core'
 import { useViewer } from '@pascal-app/viewer'
+import { LocalizedHtml as Html } from '@pascal-app/viewer/ui'
 import { useFrame } from '@react-three/fiber'
 import { useCallback, useMemo, useRef } from 'react'
 import * as THREE from 'three'
@@ -53,7 +55,6 @@ import useInteractionScope, {
 } from '../../store/use-interaction-scope'
 import { IconRefGlyph } from '../ui/icon-ref'
 import { duplicateNodeAndPickUp } from './duplicate-node'
-import { Html } from './localized-html'
 import { formatMeasurement, MeasurementPill } from './measurement-pill'
 import { NodeActionMenu } from './node-action-menu'
 import { startZoneRoomTransform } from './room-controls'
@@ -284,7 +285,7 @@ function getHeightPillDimensions(node: WallNode | FenceNode): {
 } {
   if (node.type === 'wall') {
     return {
-      height: getWallEffectiveHeightForNodes(node, useScene.getState().nodes),
+      height: getWallEffectiveHeightForNodes(node, useScene.getState().nodes, 0),
       length: getWallCurveLength(node),
       thickness: getWallThickness(node),
     }
@@ -423,7 +424,7 @@ export function FloatingActionMenu() {
         | undefined
       const fallbackHeight =
         node.type === 'wall'
-          ? getWallEffectiveHeightForNodes(node, useScene.getState().nodes)
+          ? getWallEffectiveHeightForNodes(node, useScene.getState().nodes, 0)
           : FENCE_DEFAULT_HEIGHT
       const liveHeight = override?.height ?? node.height ?? fallbackHeight
       pillHeightRef.current.textContent = `H ${formatMeasurement(liveHeight, unit, metricNotation)}`
@@ -681,6 +682,7 @@ export function FloatingActionMenu() {
                 onDelete={handleDelete}
                 onDuplicate={
                   node &&
+                  isNodeDuplicable(node as AnyNode) &&
                   node.type !== 'spawn' &&
                   !DELETE_ONLY_TYPES.includes(node.type) &&
                   !HOLE_TYPES.includes(node.type)

package/src/components/editor/floating-building-action-menu.tsx

@@ -2,12 +2,12 @@
 
 import { type BuildingNode, sceneRegistry, useScene } from '@pascal-app/core'
 import { useViewer } from '@pascal-app/viewer'
+import { LocalizedHtml as Html } from '@pascal-app/viewer/ui'
 import { useFrame } from '@react-three/fiber'
 import { useCallback, useRef } from 'react'
 import * as THREE from 'three'
 import { sfxEmitter } from '../../lib/sfx-bus'
 import useEditor from '../../store/use-editor'
-import { Html } from './localized-html'
 import { NodeActionMenu } from './node-action-menu'
 
 export function FloatingBuildingActionMenu() {

package/src/components/editor/floor-openings-overlay.tsx

@@ -5,6 +5,7 @@ import {
   type AnyNodeId,
   type FloorOpeningNode,
   resolveCeilingHeight,
+  roomFloorElevation,
   sceneRegistry,
   useScene,
 } from '@pascal-app/core'
@@ -24,7 +25,6 @@ import { useCeilingEditSession } from '../../lib/ceiling-edit-session'
 import { EDITOR_LAYER } from '../../lib/constants'
 import { openingRoom, roomSurfaceOpenings, useFloorEditSession } from '../../lib/floor-edit-session'
 import { useOpeningDraft } from '../../lib/floor-opening-draft'
-import { roomFloorElevation } from '../../lib/room-handle-drag'
 import { PolygonEditor } from '../tools/shared/polygon-editor'
 
 // The openings of the room being edited ("Edit floor", "Edit ceiling", or a

package/src/components/editor/floor-region-controls.tsx

@@ -3,12 +3,19 @@
 import {
   containsPoint,
   emitter,
+  formatAreaLabel,
   type MultiPolygon,
   resolveCeilingHeight,
+  roomFloorElevation,
   sceneRegistry,
   useScene,
 } from '@pascal-app/core'
-import { getSceneTheme, setSurfaceRaycastLayers, useViewer } from '@pascal-app/viewer'
+import {
+  getSceneTheme,
+  isTypingTarget,
+  setSurfaceRaycastLayers,
+  useViewer,
+} from '@pascal-app/viewer'
 import { useFrame, useThree } from '@react-three/fiber'
 import { Pentagon, Square } from 'lucide-react'
 import { useEffect, useMemo, useRef } from 'react'
@@ -60,21 +67,18 @@ import {
 } from '../../lib/floor-region-session'
 import { type FloorRegionPoint, snapFloorRegionPoint } from '../../lib/floor-region-snap'
 import { clientToPlan } from '../../lib/floorplan/plan-coords'
-import { formatAreaLabel } from '../../lib/measurements'
 import {
   cancelMezzanineDraft,
   mezzanineDraftActive,
   useMezzanineDraft,
 } from '../../lib/mezzanine-draft'
 import { usePaintRegionMode } from '../../lib/paint-region-mode'
-import { roomFloorElevation } from '../../lib/room-handle-drag'
 import {
   cancelTerraceDraft,
   terraceDraftActive,
   toggleTerraceShape,
   useTerraceDraft,
 } from '../../lib/terrace-draft'
-import { isTypingTarget } from '../../lib/typing-target'
 import useEditor from '../../store/use-editor'
 import { useFloorplanRender } from '../editor-2d/floorplan-render-context'
 import { usePaintTint } from '../tools/paint-region/use-paint-tint'

package/src/components/editor/floorplan-navigation-presentation.test.ts

@@ -2,13 +2,11 @@ import { describe, expect, test } from 'bun:test'
 import {
   canApplyFloorplanNavigationSync,
   canZoomFloorplanDuringNavigation,
-  createFloorplanNavigationSyncScheduler,
   finalizeFloorplanNavigation,
   flushFloorplanRotationPresentationRestore,
   getFloorplanRotationOverscanViewBox,
   queueFloorplanRotationPresentationRestore,
   resolveFloorplanPresentationViewBox,
-  setFloorplanCompassRotation,
 } from './floorplan-navigation-presentation'
 
 describe('floorplan navigation presentation', () => {
@@ -60,16 +58,6 @@ describe('floorplan navigation presentation', () => {
     expect(canApplyFloorplanNavigationSync(false)).toBe(true)
   })
 
-  test('updates the compass presentation on every live rotation frame', () => {
-    const compass = { style: { transform: '' } }
-
-    setFloorplanCompassRotation(compass, 0.25)
-    expect(compass.style.transform).toBe('rotate(0.25deg)')
-
-    setFloorplanCompassRotation(compass, 0.5)
-    expect(compass.style.transform).toBe('rotate(0.5deg)')
-  })
-
   test('keeps the rotation preview in place until the committed state is ready to paint', () => {
     const pending = { current: null }
     const svg = {
@@ -111,32 +99,4 @@ describe('floorplan navigation presentation', () => {
 
     expect(calls).toEqual(['zoom', 'pan', 'rotation:42'])
   })
-
-  test('coalesces a camera pose stream into one settled React commit', () => {
-    const presented: number[] = []
-    const committed: number[] = []
-    let scheduled: (() => void) | null = null
-    const scheduler = createFloorplanNavigationSyncScheduler<number>({
-      applyPresentation: (pose) => presented.push(pose),
-      commit: (pose) => committed.push(pose),
-      schedule: (callback) => {
-        scheduled = callback
-        return 1 as unknown as ReturnType<typeof globalThis.setTimeout>
-      },
-      cancel: () => {
-        scheduled = null
-      },
-    })
-
-    for (let pose = 1; pose <= 30; pose += 1) {
-      scheduler.update(pose)
-    }
-
-    expect(presented).toHaveLength(30)
-    expect(committed).toEqual([])
-
-    const settle = scheduled as (() => void) | null
-    settle?.()
-    expect(committed).toEqual([30])
-  })
 })