mirror of
https://github.com/storytold/artcraft.git
synced 2026-11-12 21:02:14 +00:00
Tanish Manku
72071c0066
Two related session-boundary bugs in ControlPanelSceneObject — both caused N undo entries per user gesture instead of one. Bug A (color picker): - Native <input type="color"> fires onChange on every slider pixel while the dialog is open, not just on commit. The previous one-shot setObjectColor recorded one ColorAction per fire, so a single white→red pick became dozens of micro-entries. Ctrl+Z reverted only the last micro-step → user reported "undo doesn't work." - Fix: add ColorSession to actions/setObjectColor (apply/commit pair). Panel opens it on input.onFocus, applies on onChange (visual feedback only), commits on onBlur (one entry per pick). Bug B (panel transform inputs — keystrokes AND scrub drags): - The panel's [currentSceneObject] useEffect cleanup was committing the transform session on every frame the selected obj's transform changed. The chain: panel writes to engine -> next frame editor.ts:744 sees getSelectedSum changed -> updateSelectedUI() pushes a fresh objectPanel into Zustand -> currentSceneObject reference changes -> useEffect cleanup fires -> commitPanelTransform. Result: one entry per keystroke, dozens per scrub drag. - Fix: track lastUuidRef. Commit the session only when the selection uuid actually changes (real boundary), not on every same-uuid re-push. Move the unmount-commit into a separate effect. Both fixes use the same shape: a session ref opened on first edit and committed at a properly-throttled boundary (focus/blur for color, uuid-change/unmount for transform). Mirrors the engine-side TransformAction begin/commit pattern.
Frontend
This is an nx monorepo that can contain multiple apps and shared libraries.
All commands to run these projects are performed from this directory.
Install dependencies
npm install
Editor2d
Run dev server:
nx dev editor2d
artcraft
Run dev server:
nx dev artcraft
call when starting on main or a new branch:
./clean_modules
The names for @frontend and @storyteller come from the package.json file in the libs folder.
import { Login } from "@frontend/login";
import { api } from "@storyteller/api";
For shared UI components, import from @storyteller/ui-[componentname].
import { Button } from "@storyteller/ui-button";
import { Modal } from "@storyteller/ui-modal";
building:
npx nx build artcraft
npx nx build editor2d
dev:
npx nx dev artcraft
npx nx dev editor2d
# component build
1.
npx nx g @nx/react:library libs/components/toaster --import-path=@storyteller/ui-toaster --bundler=vite
npm install
2.import it first in code
3.nx sync
4.nx build
or
# frontend build
in frontend folder
% nx build -project type
% nx build artcraft
% nx dev artcraft