From bb96f322c68f1565d714e5d6964ef9596c6b7366 Mon Sep 17 00:00:00 2001 From: "Daniel J. Geiger" <1852529+DanielJGeiger@users.noreply.github.com> Date: Thu, 26 Jan 2023 19:31:09 -0600 Subject: [PATCH] Simplify per review comments. --- src/actions/register.ts | 10 ++------- src/components/Actions.tsx | 5 ----- src/components/App.tsx | 27 ++----------------------- src/components/LayerUI.tsx | 4 ---- src/components/MobileMenu.tsx | 3 --- src/components/ToolButton.tsx | 6 ------ src/packages/excalidraw/example/App.tsx | 25 ++++++++++++++++++++++- 7 files changed, 28 insertions(+), 52 deletions(-) diff --git a/src/actions/register.ts b/src/actions/register.ts index e25dc93b4..ccc9cdbf9 100644 --- a/src/actions/register.ts +++ b/src/actions/register.ts @@ -1,14 +1,8 @@ -import { Action, isActionName } from "./types"; +import { Action } from "./types"; -let actions: readonly Action[] = []; -let customActions: readonly Action[] = []; -export const getCustomActions = () => customActions; -export const getActions = () => actions; +export let actions: readonly Action[] = []; export const register = (action: T) => { - if (!isActionName(action.name)) { - customActions = customActions.concat(action); - } actions = actions.concat(action); return action as T & { keyTest?: unknown extends T["keyTest"] ? never : T["keyTest"]; diff --git a/src/components/Actions.tsx b/src/components/Actions.tsx index 7e3899979..e70e69f01 100644 --- a/src/components/Actions.tsx +++ b/src/components/Actions.tsx @@ -212,14 +212,12 @@ export const ShapesSwitcher = ({ setAppState, onImageAction, appState, - onContextMenu, }: { canvas: HTMLCanvasElement | null; activeTool: AppState["activeTool"]; setAppState: React.Component["setState"]; onImageAction: (data: { pointerType: PointerType | null }) => void; appState: AppState; - onContextMenu?: (event: React.MouseEvent, source: string) => void; }) => ( <> {SHAPES.map(({ value, icon, key, numericKey, fillable }, index) => { @@ -270,9 +268,6 @@ export const ShapesSwitcher = ({ onImageAction({ pointerType }); } }} - onContextMenu={(event, source) => { - onContextMenu && onContextMenu(event, source); - }} /> ); })} diff --git a/src/components/App.tsx b/src/components/App.tsx index f544c5f3d..7ac179cb9 100644 --- a/src/components/App.tsx +++ b/src/components/App.tsx @@ -38,7 +38,7 @@ import { } from "../actions"; import { createRedoAction, createUndoAction } from "../actions/actionHistory"; import { ActionManager } from "../actions/manager"; -import { getActions } from "../actions/register"; +import { actions } from "../actions/register"; import { ActionResult } from "../actions/types"; import { trackEvent } from "../analytics"; import { @@ -479,7 +479,7 @@ class App extends React.Component { onSceneUpdated: this.onSceneUpdated, }); this.history = new History(); - this.actionManager.registerAll(getActions()); + this.actionManager.registerAll(actions); this.actionManager.registerActionGuards(); this.actionManager.registerAction(createUndoAction(this.history)); @@ -595,7 +595,6 @@ class App extends React.Component { renderTopRightUI={renderTopRightUI} renderCustomStats={renderCustomStats} renderCustomSidebar={this.props.renderSidebar} - onContextMenu={this.handleCustomContextMenu} showExitZenModeBtn={ typeof this.props?.zenModeEnabled === "undefined" && this.state.zenModeEnabled @@ -5994,28 +5993,6 @@ class App extends React.Component { } }; - private handleCustomContextMenu = ( - event: React.MouseEvent, - source: string, - ) => { - event.preventDefault(); - - const container = this.excalidrawContainerRef.current!; - const { top: offsetTop, left: offsetLeft } = - container.getBoundingClientRect(); - const left = event.clientX - offsetLeft; - const top = event.clientY - offsetTop; - this.setState({}, () => { - this.setState({ - contextMenu: { - top, - left, - items: this.getContextMenuItems("custom", source), - }, - }); - }); - }; - private handleCanvasContextMenu = ( event: React.PointerEvent, ) => { diff --git a/src/components/LayerUI.tsx b/src/components/LayerUI.tsx index 120d2cd9c..3defb2947 100644 --- a/src/components/LayerUI.tsx +++ b/src/components/LayerUI.tsx @@ -79,7 +79,6 @@ interface LayerUIProps { onImageAction: (data: { insertOnCanvasDirectly: boolean }) => void; renderWelcomeScreen: boolean; children?: React.ReactNode; - onContextMenu?: (event: React.MouseEvent, source: string) => void; } const LayerUI = ({ @@ -106,7 +105,6 @@ const LayerUI = ({ onImageAction, renderWelcomeScreen, children, - onContextMenu, }: LayerUIProps) => { const device = useDevice(); @@ -335,7 +333,6 @@ const LayerUI = ({ insertOnCanvasDirectly: pointerType !== "mouse", }); }} - onContextMenu={onContextMenu} /> @@ -431,7 +428,6 @@ const LayerUI = ({ renderSidebars={renderSidebars} device={device} renderMenu={renderMenu} - onContextMenu={onContextMenu} welcomeScreenCenter={WelcomeScreenComponents.Center} /> )} diff --git a/src/components/MobileMenu.tsx b/src/components/MobileMenu.tsx index fa5fd3c32..7c814f53e 100644 --- a/src/components/MobileMenu.tsx +++ b/src/components/MobileMenu.tsx @@ -46,7 +46,6 @@ type MobileMenuProps = { renderSidebars: () => JSX.Element | null; device: Device; renderMenu: () => React.ReactNode; - onContextMenu?: (event: React.MouseEvent, source: string) => void; welcomeScreenCenter: UIWelcomeScreenComponents["Center"]; }; @@ -65,7 +64,6 @@ export const MobileMenu = ({ renderSidebars, device, renderMenu, - onContextMenu, welcomeScreenCenter, }: MobileMenuProps) => { const renderToolbar = () => { @@ -89,7 +87,6 @@ export const MobileMenu = ({ insertOnCanvasDirectly: pointerType !== "mouse", }); }} - onContextMenu={onContextMenu} /> diff --git a/src/components/ToolButton.tsx b/src/components/ToolButton.tsx index 9ea45385d..446d154df 100644 --- a/src/components/ToolButton.tsx +++ b/src/components/ToolButton.tsx @@ -26,7 +26,6 @@ type ToolButtonBaseProps = { selected?: boolean; className?: string; isLoading?: boolean; - onContextMenu?(event: React.MouseEvent, source: string): void; }; type ToolButtonProps = @@ -158,11 +157,6 @@ export const ToolButton = React.forwardRef((props: ToolButtonProps, ref) => { lastPointerTypeRef.current = null; }); }} - onContextMenu={(event) => { - if (props.onContextMenu !== undefined) { - props.onContextMenu(event, props.name ?? ""); - } - }} > - data === undefined || data.source === "editor-current-shape", + data === undefined || data.source === "custom", contextItemLabel: "labels.untitled", }; const exampleEnableFn: EnableFn = (elements, appState, actionName) => @@ -164,6 +165,28 @@ export default function App() { }} /> )} +