From 8eb3191b3f7ba653281ee0262e7afd41d66b247d Mon Sep 17 00:00:00 2001 From: "Daniel J. Geiger" <1852529+DanielJGeiger@users.noreply.github.com> Date: Fri, 22 Sep 2023 14:25:15 -0500 Subject: [PATCH] refactor: Move MathJax into `src/element/subtypes` for the `excalidraw-app` separation, maintaining lazy-loading of MathJax. --- src/charts.ts | 2 +- src/components/App.tsx | 3 +- src/components/PasteChartDialog.tsx | 2 +- src/components/Subtypes.tsx | 2 +- src/data/restore.ts | 2 +- src/element/mutateElement.ts | 2 +- src/element/newElement.ts | 2 +- .../subtypes/global.d.ts | 0 .../subtypes/index.ts} | 28 ++++++++----------- .../subtypes/mathjax/icon.tsx | 0 .../subtypes/mathjax/implementation.tsx | 6 +--- .../subtypes/mathjax/index.ts | 2 +- .../subtypes/mathjax/locales/en.json | 0 .../mathjax/tests/implementation.test.tsx | 6 ++-- .../subtypes/mathjax/types.ts | 2 +- .../index.ts => element/subtypes/use.ts} | 0 src/element/textElement.ts | 2 +- src/element/textWysiwyg.tsx | 2 +- src/excalidraw-app/index.tsx | 2 +- src/renderer/renderElement.ts | 2 +- src/tests/helpers/api.ts | 2 +- src/tests/subtypes.test.tsx | 2 +- src/types.ts | 2 +- 23 files changed, 32 insertions(+), 41 deletions(-) rename src/{excalidraw-app => element}/subtypes/global.d.ts (100%) rename src/{subtypes.ts => element/subtypes/index.ts} (95%) rename src/{excalidraw-app => element}/subtypes/mathjax/icon.tsx (100%) rename src/{excalidraw-app => element}/subtypes/mathjax/implementation.tsx (99%) rename src/{excalidraw-app => element}/subtypes/mathjax/index.ts (93%) rename src/{excalidraw-app => element}/subtypes/mathjax/locales/en.json (100%) rename src/{excalidraw-app => element}/subtypes/mathjax/tests/implementation.test.tsx (79%) rename src/{excalidraw-app => element}/subtypes/mathjax/types.ts (90%) rename src/{excalidraw-app/subtypes/index.ts => element/subtypes/use.ts} (100%) diff --git a/src/charts.ts b/src/charts.ts index 16e25873a..942cd0df8 100644 --- a/src/charts.ts +++ b/src/charts.ts @@ -12,7 +12,7 @@ import { newElement, newLinearElement, newTextElement } from "./element"; import { NonDeletedExcalidrawElement } from "./element/types"; import { randomId } from "./random"; import { AppState } from "./types"; -import { selectSubtype } from "./subtypes"; +import { selectSubtype } from "./element/subtypes"; export type ChartElements = readonly NonDeletedExcalidrawElement[]; diff --git a/src/components/App.tsx b/src/components/App.tsx index f7d923d19..60346dd92 100644 --- a/src/components/App.tsx +++ b/src/components/App.tsx @@ -278,7 +278,7 @@ import { prepareSubtype, selectSubtype, subtypeActionPredicate, -} from "../subtypes"; +} from "../element/subtypes"; import { dataURLToFile, generateIdFromFile, @@ -583,7 +583,6 @@ class App extends React.Component { this.actionManager.registerAction(createUndoAction(this.history)); this.actionManager.registerAction(createRedoAction(this.history)); - // Call `this.addSubtype()` here for `@excalidraw/excalidraw`-specific subtypes this.actionManager.registerActionPredicate(subtypeActionPredicate); } diff --git a/src/components/PasteChartDialog.tsx b/src/components/PasteChartDialog.tsx index b5da1bf68..2f9c6f8c8 100644 --- a/src/components/PasteChartDialog.tsx +++ b/src/components/PasteChartDialog.tsx @@ -10,7 +10,7 @@ import { useApp } from "./App"; import { Dialog } from "./Dialog"; import "./PasteChartDialog.scss"; -import { ensureSubtypesLoaded } from "../subtypes"; +import { ensureSubtypesLoaded } from "../element/subtypes"; import { isTextElement } from "../element"; import { getContainerElement, diff --git a/src/components/Subtypes.tsx b/src/components/Subtypes.tsx index 2a9adb089..7fc1540a9 100644 --- a/src/components/Subtypes.tsx +++ b/src/components/Subtypes.tsx @@ -9,7 +9,7 @@ import { isSubtypeAction, isValidSubtype, subtypeCollides, -} from "../subtypes"; +} from "../element/subtypes"; import { ExcalidrawElement, Theme } from "../element/types"; import { useExcalidrawActionManager, diff --git a/src/data/restore.ts b/src/data/restore.ts index 95060e2b6..dfa299429 100644 --- a/src/data/restore.ts +++ b/src/data/restore.ts @@ -36,7 +36,7 @@ import { LinearElementEditor } from "../element/linearElementEditor"; import { bumpVersion } from "../element/mutateElement"; import { getUpdatedTimestamp, updateActiveTool } from "../utils"; import { arrayToMap } from "../utils"; -import { isValidSubtype } from "../subtypes"; +import { isValidSubtype } from "../element/subtypes"; import { MarkOptional, Mutable } from "../utility-types"; import { detectLineHeight, diff --git a/src/element/mutateElement.ts b/src/element/mutateElement.ts index c3b83c625..856965613 100644 --- a/src/element/mutateElement.ts +++ b/src/element/mutateElement.ts @@ -7,7 +7,7 @@ import { getUpdatedTimestamp } from "../utils"; import { Mutable } from "../utility-types"; import { ShapeCache } from "../scene/ShapeCache"; import { maybeGetSubtypeProps } from "./newElement"; -import { getSubtypeMethods } from "../subtypes"; +import { getSubtypeMethods } from "./subtypes"; type ElementUpdate = Omit< Partial, diff --git a/src/element/newElement.ts b/src/element/newElement.ts index 5b96608cc..1f0b289e5 100644 --- a/src/element/newElement.ts +++ b/src/element/newElement.ts @@ -40,7 +40,7 @@ import { VERTICAL_ALIGN, } from "../constants"; import { MarkOptional, Merge, Mutable } from "../utility-types"; -import { getSubtypeMethods, isValidSubtype } from "../subtypes"; +import { getSubtypeMethods, isValidSubtype } from "./subtypes"; export const maybeGetSubtypeProps = ( obj: { diff --git a/src/excalidraw-app/subtypes/global.d.ts b/src/element/subtypes/global.d.ts similarity index 100% rename from src/excalidraw-app/subtypes/global.d.ts rename to src/element/subtypes/global.d.ts diff --git a/src/subtypes.ts b/src/element/subtypes/index.ts similarity index 95% rename from src/subtypes.ts rename to src/element/subtypes/index.ts index 12fbad83f..03b311a22 100644 --- a/src/subtypes.ts +++ b/src/element/subtypes/index.ts @@ -1,27 +1,23 @@ -import { - ExcalidrawElement, - ExcalidrawTextElement, - NonDeleted, -} from "./element/types"; -import { getNonDeletedElements } from "./element"; -import { getSelectedElements } from "./scene"; -import { AppState } from "./types"; -import { registerAuxLangData } from "./i18n"; +import { ExcalidrawElement, ExcalidrawTextElement, NonDeleted } from "../types"; +import { getNonDeletedElements } from "../"; +import { getSelectedElements } from "../../scene"; +import { AppState } from "../../types"; +import { registerAuxLangData } from "../../i18n"; -import { Action, ActionName, ActionPredicateFn } from "./actions/types"; +import { Action, ActionName, ActionPredicateFn } from "../../actions/types"; import { CustomShortcutName, registerCustomShortcuts, -} from "./actions/shortcuts"; -import { register } from "./actions/register"; -import { hasBoundTextElement, isTextElement } from "./element/typeChecks"; +} from "../../actions/shortcuts"; +import { register } from "../../actions/register"; +import { hasBoundTextElement, isTextElement } from "../typeChecks"; import { getBoundTextElement, getContainerElement, redrawTextBoundingBox, -} from "./element/textElement"; -import { ShapeCache } from "./scene/ShapeCache"; -import Scene from "./scene/Scene"; +} from "../textElement"; +import { ShapeCache } from "../../scene/ShapeCache"; +import Scene from "../../scene/Scene"; // Use "let" instead of "const" so we can dynamically add subtypes let subtypeNames: readonly Subtype[] = []; diff --git a/src/excalidraw-app/subtypes/mathjax/icon.tsx b/src/element/subtypes/mathjax/icon.tsx similarity index 100% rename from src/excalidraw-app/subtypes/mathjax/icon.tsx rename to src/element/subtypes/mathjax/icon.tsx diff --git a/src/excalidraw-app/subtypes/mathjax/implementation.tsx b/src/element/subtypes/mathjax/implementation.tsx similarity index 99% rename from src/excalidraw-app/subtypes/mathjax/implementation.tsx rename to src/element/subtypes/mathjax/implementation.tsx index 45818c345..3e12c6b1e 100644 --- a/src/excalidraw-app/subtypes/mathjax/implementation.tsx +++ b/src/element/subtypes/mathjax/implementation.tsx @@ -37,11 +37,7 @@ import { getNonDeletedElements, redrawTextBoundingBox } from "../../../element"; import { ButtonIconSelect } from "../../../components/ButtonIconSelect"; // Subtype imports -import { - SubtypeLoadedCb, - SubtypeMethods, - SubtypePrepFn, -} from "../../../subtypes"; +import { SubtypeLoadedCb, SubtypeMethods, SubtypePrepFn } from "../"; import { mathSubtypeIcon } from "./icon"; import { getMathSubtypeRecord } from "./types"; import { SubtypeButton } from "../../../components/Subtypes"; diff --git a/src/excalidraw-app/subtypes/mathjax/index.ts b/src/element/subtypes/mathjax/index.ts similarity index 93% rename from src/excalidraw-app/subtypes/mathjax/index.ts rename to src/element/subtypes/mathjax/index.ts index 31039cf03..8df4c8652 100644 --- a/src/excalidraw-app/subtypes/mathjax/index.ts +++ b/src/element/subtypes/mathjax/index.ts @@ -1,6 +1,6 @@ import { useEffect } from "react"; import { ExcalidrawImperativeAPI } from "../../../types"; -import { addSubtypeMethods } from "../../../subtypes"; +import { addSubtypeMethods } from "../"; import { getMathSubtypeRecord } from "./types"; import { prepareMathSubtype } from "./implementation"; diff --git a/src/excalidraw-app/subtypes/mathjax/locales/en.json b/src/element/subtypes/mathjax/locales/en.json similarity index 100% rename from src/excalidraw-app/subtypes/mathjax/locales/en.json rename to src/element/subtypes/mathjax/locales/en.json diff --git a/src/excalidraw-app/subtypes/mathjax/tests/implementation.test.tsx b/src/element/subtypes/mathjax/tests/implementation.test.tsx similarity index 79% rename from src/excalidraw-app/subtypes/mathjax/tests/implementation.test.tsx rename to src/element/subtypes/mathjax/tests/implementation.test.tsx index 940c69323..9aae70ff1 100644 --- a/src/excalidraw-app/subtypes/mathjax/tests/implementation.test.tsx +++ b/src/element/subtypes/mathjax/tests/implementation.test.tsx @@ -1,9 +1,9 @@ import { render } from "../../../../tests/test-utils"; import { API } from "../../../../tests/helpers/api"; -import ExcalidrawApp from "../../../"; +import ExcalidrawApp from "../../../../excalidraw-app"; -import { measureTextElement } from "../../../../element/textElement"; -import { ensureSubtypesLoaded } from "../../../../subtypes"; +import { measureTextElement } from "../../../textElement"; +import { ensureSubtypesLoaded } from "../../"; describe("mathjax", () => { it("text-only measurements match", async () => { diff --git a/src/excalidraw-app/subtypes/mathjax/types.ts b/src/element/subtypes/mathjax/types.ts similarity index 90% rename from src/excalidraw-app/subtypes/mathjax/types.ts rename to src/element/subtypes/mathjax/types.ts index 966f3c505..0a223efe8 100644 --- a/src/excalidraw-app/subtypes/mathjax/types.ts +++ b/src/element/subtypes/mathjax/types.ts @@ -1,5 +1,5 @@ import { getShortcutKey } from "../../../utils"; -import { SubtypeRecord } from "../../../subtypes"; +import { SubtypeRecord } from "../"; // Exports export const getMathSubtypeRecord = () => mathSubtype; diff --git a/src/excalidraw-app/subtypes/index.ts b/src/element/subtypes/use.ts similarity index 100% rename from src/excalidraw-app/subtypes/index.ts rename to src/element/subtypes/use.ts diff --git a/src/element/textElement.ts b/src/element/textElement.ts index a9a7ae565..a9f6a5a71 100644 --- a/src/element/textElement.ts +++ b/src/element/textElement.ts @@ -1,4 +1,4 @@ -import { getSubtypeMethods, SubtypeMethods } from "../subtypes"; +import { getSubtypeMethods, SubtypeMethods } from "./subtypes"; import { getFontString, arrayToMap, isTestEnv } from "../utils"; import { ExcalidrawElement, diff --git a/src/element/textWysiwyg.tsx b/src/element/textWysiwyg.tsx index f1d88ff4f..bb399d132 100644 --- a/src/element/textWysiwyg.tsx +++ b/src/element/textWysiwyg.tsx @@ -44,7 +44,7 @@ import { actionZoomIn, actionZoomOut } from "../actions/actionCanvas"; import App from "../components/App"; import { LinearElementEditor } from "./linearElementEditor"; import { parseClipboard } from "../clipboard"; -import { SubtypeMethods, getSubtypeMethods } from "../subtypes"; +import { SubtypeMethods, getSubtypeMethods } from "./subtypes"; const getTransform = ( offsetX: number, diff --git a/src/excalidraw-app/index.tsx b/src/excalidraw-app/index.tsx index 79f1445aa..82449fd6d 100644 --- a/src/excalidraw-app/index.tsx +++ b/src/excalidraw-app/index.tsx @@ -5,7 +5,7 @@ import { trackEvent } from "../analytics"; import { getDefaultAppState } from "../appState"; import { ErrorDialog } from "../components/ErrorDialog"; import { TopErrorBoundary } from "../components/TopErrorBoundary"; -import { useSubtypes } from "./subtypes"; +import { useSubtypes } from "../element/subtypes/use"; import { APP_NAME, EVENT, diff --git a/src/renderer/renderElement.ts b/src/renderer/renderElement.ts index 7d871c9b7..353d6c7ed 100644 --- a/src/renderer/renderElement.ts +++ b/src/renderer/renderElement.ts @@ -31,7 +31,7 @@ import { InteractiveCanvasAppState, } from "../types"; import { getDefaultAppState } from "../appState"; -import { getSubtypeMethods } from "../subtypes"; +import { getSubtypeMethods } from "../element/subtypes"; import { BOUND_TEXT_PADDING, FRAME_STYLE, diff --git a/src/tests/helpers/api.ts b/src/tests/helpers/api.ts index 1538f4a96..38a2630bc 100644 --- a/src/tests/helpers/api.ts +++ b/src/tests/helpers/api.ts @@ -23,7 +23,7 @@ import { prepareSubtype, selectSubtype, subtypeActionPredicate, -} from "../../subtypes"; +} from "../../element/subtypes"; import { maybeGetSubtypeProps, newEmbeddableElement, diff --git a/src/tests/subtypes.test.tsx b/src/tests/subtypes.test.tsx index 07cae3b56..00f05ce7c 100644 --- a/src/tests/subtypes.test.tsx +++ b/src/tests/subtypes.test.tsx @@ -12,7 +12,7 @@ import { isValidSubtype, selectSubtype, subtypeCollides, -} from "../subtypes"; +} from "../element/subtypes"; import { render } from "./test-utils"; import { API } from "./helpers/api"; diff --git a/src/types.ts b/src/types.ts index 46cf89711..86480dd7e 100644 --- a/src/types.ts +++ b/src/types.ts @@ -37,7 +37,7 @@ import { Subtype, SubtypePrepFn, SubtypeRecord, -} from "./subtypes"; +} from "./element/subtypes"; import type { FileSystemHandle } from "./data/filesystem"; import type { IMAGE_MIME_TYPES, MIME_TYPES } from "./constants"; import { ContextMenuItems } from "./components/ContextMenu";