
Introducing independent change detection for appState and elements Generalizing object change, cleanup, refactoring, comments, solving typing issues Shaping increment, change, delta hierarchy Structural clone of elements Introducing store and incremental API Disabling buttons for canvas actions, smaller store and changes improvements Update history entry based on latest changes, iterate through the stack for visible changes to limit empty commands Solving concurrency issues, solving (partly) linear element issues, introducing commitToStore breaking change Fixing existing tests, updating snapshots Trying to be smarter on the appstate change detection Extending collab test, refactoring action / updateScene params, bugfixes Resetting snapshots Resetting snapshots UI / API tests for history - WIP Changing actions related to the observed appstate to at least update the store snapshot - WIP Adding skipping of snapshot update flag for most no-breaking changes compatible solution Ignoring uncomitted elements from local async actions, updating store directly in updateScene Bound element issues - WIP
73 lines
2.0 KiB
TypeScript
73 lines
2.0 KiB
TypeScript
import { HamburgerMenuIcon, palette } from "../components/icons";
|
|
import { ToolButton } from "../components/ToolButton";
|
|
import { t } from "../i18n";
|
|
import { showSelectedShapeActions, getNonDeletedElements } from "../element";
|
|
import { register } from "./register";
|
|
import { KEYS } from "../keys";
|
|
import { StoreAction } from "./types";
|
|
|
|
export const actionToggleCanvasMenu = register({
|
|
name: "toggleCanvasMenu",
|
|
trackEvent: { category: "menu" },
|
|
perform: (_, appState) => ({
|
|
appState: {
|
|
...appState,
|
|
openMenu: appState.openMenu === "canvas" ? null : "canvas",
|
|
},
|
|
storeAction: StoreAction.NONE,
|
|
}),
|
|
PanelComponent: ({ appState, updateData }) => (
|
|
<ToolButton
|
|
type="button"
|
|
icon={HamburgerMenuIcon}
|
|
aria-label={t("buttons.menu")}
|
|
onClick={updateData}
|
|
selected={appState.openMenu === "canvas"}
|
|
/>
|
|
),
|
|
});
|
|
|
|
export const actionToggleEditMenu = register({
|
|
name: "toggleEditMenu",
|
|
trackEvent: { category: "menu" },
|
|
perform: (_elements, appState) => ({
|
|
appState: {
|
|
...appState,
|
|
openMenu: appState.openMenu === "shape" ? null : "shape",
|
|
},
|
|
storeAction: StoreAction.NONE,
|
|
}),
|
|
PanelComponent: ({ elements, appState, updateData }) => (
|
|
<ToolButton
|
|
visible={showSelectedShapeActions(
|
|
appState,
|
|
getNonDeletedElements(elements),
|
|
)}
|
|
type="button"
|
|
icon={palette}
|
|
aria-label={t("buttons.edit")}
|
|
onClick={updateData}
|
|
selected={appState.openMenu === "shape"}
|
|
/>
|
|
),
|
|
});
|
|
|
|
export const actionShortcuts = register({
|
|
name: "toggleShortcuts",
|
|
viewMode: true,
|
|
trackEvent: { category: "menu", action: "toggleHelpDialog" },
|
|
perform: (_elements, appState, _, { focusContainer }) => {
|
|
if (appState.openDialog === "help") {
|
|
focusContainer();
|
|
}
|
|
return {
|
|
appState: {
|
|
...appState,
|
|
openDialog: appState.openDialog === "help" ? null : "help",
|
|
},
|
|
storeAction: StoreAction.NONE,
|
|
};
|
|
},
|
|
keyTest: (event) => event.key === KEYS.QUESTION_MARK,
|
|
});
|