Skip to content

Commit 9bcac1a

Browse files
authored
Remove JS module import prefixes and use absolute paths to the frontend directory (#3924)
* Remove JS module import prefixes * Fix code review mistakes
1 parent ed7987c commit 9bcac1a

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

80 files changed

+574
-658
lines changed

frontend/branding-installer.js

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,6 @@ import https from "https";
77
import path from "path";
88
import { fileURLToPath } from "url";
99
import zlib from "zlib";
10-
1110
import * as tar from "tar";
1211

1312
const __filename = fileURLToPath(import.meta.url);

frontend/eslint.config.js

Lines changed: 25 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,17 @@ import pluginSvelte from "eslint-plugin-svelte";
66
import globals from "globals";
77
import ts from "typescript-eslint";
88

9+
const importOrder = {
10+
alphabetize: { order: "asc", caseInsensitive: true },
11+
"newlines-between": "never",
12+
warnOnUnassignedImports: true,
13+
pathGroups: [
14+
{ pattern: "/**", group: "internal" },
15+
{ pattern: "/../**", group: "internal" },
16+
],
17+
pathGroupsExcludedImportTypes: [],
18+
};
19+
920
export default defineConfig([
1021
js.configs.recommended,
1122
ts.configs.recommended,
@@ -52,7 +63,15 @@ export default defineConfig([
5263
"no-bitwise": "off",
5364
"no-shadow": "off",
5465
"no-use-before-define": "off",
55-
"no-restricted-imports": ["error", { patterns: [".*", "!@graphite/*"] }],
66+
"no-restricted-imports": [
67+
"error",
68+
{
69+
patterns: [
70+
{ group: ["./**", "../**"], message: "\nImports must be absolute (e.g. '/src/<subpath>') not relative (e.g. './<subpath>')." },
71+
{ group: ["src/**", "assets/**", "wasm/**"], message: "\nLocal imports must start with '/' (e.g. '/src/<subpath>' not 'src/<subpath>')." },
72+
],
73+
},
74+
],
5675

5776
// TypeScript plugin config (for TS-specific linting)
5877
"@typescript-eslint/indent": "off",
@@ -95,17 +114,13 @@ export default defineConfig([
95114
"import/prefer-default-export": "off",
96115
"import/no-relative-packages": "error",
97116
"import/no-named-as-default-member": "off",
98-
"import/order": [
99-
"error",
100-
{
101-
alphabetize: { order: "asc", caseInsensitive: true },
102-
pathGroups: [{ pattern: "**/*.svelte", group: "unknown", position: "after" }],
103-
"newlines-between": "always-and-inside-groups",
104-
warnOnUnassignedImports: true,
105-
},
106-
],
117+
"import/order": ["error", importOrder],
107118
},
108119
},
120+
{
121+
files: ["**/icons.ts"],
122+
rules: { "import/order": ["error", { ...importOrder, "newlines-between": "ignore" }] },
123+
},
109124
{
110125
files: ["**/*.svelte"],
111126
languageOptions: {

frontend/src/App.svelte

Lines changed: 5 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,12 @@
11
<script lang="ts">
22
import { onMount, onDestroy } from "svelte";
3-
4-
import init, { EditorHandle, receiveNativeMessage } from "@graphite/../wasm/pkg/graphite_wasm";
5-
import type { FrontendMessage } from "@graphite/../wasm/pkg/graphite_wasm";
6-
import { loadDemoArtwork } from "@graphite/utility-functions/network";
7-
import { operatingSystem } from "@graphite/utility-functions/platform";
3+
import Editor from "/src/components/Editor.svelte";
84
import { createSubscriptionsRouter } from "/src/subscriptions-router";
95
import type { MessageName, SubscriptionsRouter } from "/src/subscriptions-router";
10-
11-
import Editor from "@graphite/components/Editor.svelte";
6+
import { loadDemoArtwork } from "/src/utility-functions/network";
7+
import { operatingSystem } from "/src/utility-functions/platform";
8+
import init, { EditorHandle, receiveNativeMessage } from "/wasm/pkg/graphite_wasm";
9+
import type { FrontendMessage } from "/wasm/pkg/graphite_wasm";
1210
1311
let subscriptions: SubscriptionsRouter | undefined = undefined;
1412
let editor: EditorHandle | undefined = undefined;

frontend/src/components/Editor.svelte

Lines changed: 21 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,22 @@
11
<script lang="ts">
22
import { onMount, onDestroy, setContext } from "svelte";
3-
4-
import type { EditorHandle } from "@graphite/../wasm/pkg/graphite_wasm";
5-
import { createClipboardManager, destroyClipboardManager } from "@graphite/managers/clipboard";
6-
import { createFontsManager, destroyFontsManager } from "@graphite/managers/fonts";
7-
import { createHyperlinkManager, destroyHyperlinkManager } from "@graphite/managers/hyperlink";
8-
import { createInputManager, destroyInputManager } from "@graphite/managers/input";
9-
import { createLocalizationManager, destroyLocalizationManager } from "@graphite/managers/localization";
10-
import { createPanicManager, destroyPanicManager } from "@graphite/managers/panic";
11-
import { createPersistenceManager, destroyPersistenceManager } from "@graphite/managers/persistence";
12-
import { createAppWindowStore, destroyAppWindowStore } from "@graphite/stores/app-window";
13-
import { createDialogStore, destroyDialogStore } from "@graphite/stores/dialog";
14-
import { createDocumentStore, destroyDocumentStore } from "@graphite/stores/document";
15-
import { createFullscreenStore, destroyFullscreenStore } from "@graphite/stores/fullscreen";
16-
import { createNodeGraphStore, destroyNodeGraphStore } from "@graphite/stores/node-graph";
17-
import { createPortfolioStore, destroyPortfolioStore } from "@graphite/stores/portfolio";
18-
import { createTooltipStore, destroyTooltipStore } from "@graphite/stores/tooltip";
3+
import MainWindow from "/src/components/window/MainWindow.svelte";
4+
import { createClipboardManager, destroyClipboardManager } from "/src/managers/clipboard";
5+
import { createFontsManager, destroyFontsManager } from "/src/managers/fonts";
6+
import { createHyperlinkManager, destroyHyperlinkManager } from "/src/managers/hyperlink";
7+
import { createInputManager, destroyInputManager } from "/src/managers/input";
8+
import { createLocalizationManager, destroyLocalizationManager } from "/src/managers/localization";
9+
import { createPanicManager, destroyPanicManager } from "/src/managers/panic";
10+
import { createPersistenceManager, destroyPersistenceManager } from "/src/managers/persistence";
11+
import { createAppWindowStore, destroyAppWindowStore } from "/src/stores/app-window";
12+
import { createDialogStore, destroyDialogStore } from "/src/stores/dialog";
13+
import { createDocumentStore, destroyDocumentStore } from "/src/stores/document";
14+
import { createFullscreenStore, destroyFullscreenStore } from "/src/stores/fullscreen";
15+
import { createNodeGraphStore, destroyNodeGraphStore } from "/src/stores/node-graph";
16+
import { createPortfolioStore, destroyPortfolioStore } from "/src/stores/portfolio";
17+
import { createTooltipStore, destroyTooltipStore } from "/src/stores/tooltip";
1918
import type { SubscriptionsRouter } from "/src/subscriptions-router";
20-
21-
import MainWindow from "@graphite/components/window/MainWindow.svelte";
19+
import type { EditorHandle } from "/wasm/pkg/graphite_wasm";
2220
2321
// Graphite Wasm editor and subscriptions router
2422
export let subscriptions: SubscriptionsRouter;
@@ -346,38 +344,38 @@
346344
font-weight: 400;
347345
font-style: normal;
348346
font-stretch: normal;
349-
src: url("@graphite/../node_modules/source-sans-pro/WOFF2/TTF/SourceSansPro-Regular.ttf.woff2") format("woff2");
347+
src: url("/node_modules/source-sans-pro/WOFF2/TTF/SourceSansPro-Regular.ttf.woff2") format("woff2");
350348
}
351349
352350
@font-face {
353351
font-family: "Source Sans Pro";
354352
font-weight: 400;
355353
font-style: italic;
356354
font-stretch: normal;
357-
src: url("@graphite/../node_modules/source-sans-pro/WOFF2/TTF/SourceSansPro-It.ttf.woff2") format("woff2");
355+
src: url("/node_modules/source-sans-pro/WOFF2/TTF/SourceSansPro-It.ttf.woff2") format("woff2");
358356
}
359357
360358
@font-face {
361359
font-family: "Source Sans Pro";
362360
font-weight: 700;
363361
font-style: normal;
364362
font-stretch: normal;
365-
src: url("@graphite/../node_modules/source-sans-pro/WOFF2/TTF/SourceSansPro-Bold.ttf.woff2") format("woff2");
363+
src: url("/node_modules/source-sans-pro/WOFF2/TTF/SourceSansPro-Bold.ttf.woff2") format("woff2");
366364
}
367365
368366
@font-face {
369367
font-family: "Source Sans Pro";
370368
font-weight: 700;
371369
font-style: italic;
372370
font-stretch: normal;
373-
src: url("@graphite/../node_modules/source-sans-pro/WOFF2/TTF/SourceSansPro-BoldIt.ttf.woff2") format("woff2");
371+
src: url("/node_modules/source-sans-pro/WOFF2/TTF/SourceSansPro-BoldIt.ttf.woff2") format("woff2");
374372
}
375373
376374
@font-face {
377375
font-family: "Source Code Pro";
378376
font-weight: 400;
379377
font-style: normal;
380378
font-stretch: normal;
381-
src: url("@graphite/../node_modules/source-code-pro/WOFF2/TTF/SourceCodePro-Regular.ttf.woff2") format("woff2");
379+
src: url("/node_modules/source-code-pro/WOFF2/TTF/SourceCodePro-Regular.ttf.woff2") format("woff2");
382380
}
383381
</style>

frontend/src/components/floating-menus/ColorPicker.svelte

Lines changed: 14 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,16 @@
11
<script lang="ts">
22
import { getContext, onDestroy, createEventDispatcher, tick } from "svelte";
3-
4-
import { isPlatformNative } from "@graphite/../wasm/pkg/graphite_wasm";
5-
import type { FillChoice, MenuDirection, Color } from "@graphite/../wasm/pkg/graphite_wasm";
6-
import type { TooltipStore } from "@graphite/stores/tooltip";
3+
import FloatingMenu, { preventEscapeClosingParentFloatingMenu } from "/src/components/layout/FloatingMenu.svelte";
4+
import LayoutCol from "/src/components/layout/LayoutCol.svelte";
5+
import LayoutRow from "/src/components/layout/LayoutRow.svelte";
6+
import IconButton from "/src/components/widgets/buttons/IconButton.svelte";
7+
import NumberInput from "/src/components/widgets/inputs/NumberInput.svelte";
8+
import SpectrumInput, { MAX_MIDPOINT, MIN_MIDPOINT } from "/src/components/widgets/inputs/SpectrumInput.svelte";
9+
import TextInput from "/src/components/widgets/inputs/TextInput.svelte";
10+
import Separator from "/src/components/widgets/labels/Separator.svelte";
11+
import TextLabel from "/src/components/widgets/labels/TextLabel.svelte";
12+
import type { TooltipStore } from "/src/stores/tooltip";
13+
import type { HSV, RGB } from "/src/utility-functions/colors";
714
import {
815
contrastingOutlineFactor,
916
fillChoiceColor,
@@ -20,18 +27,9 @@
2027
colorOpaque,
2128
colorEquals,
2229
gradientFirstColor,
23-
} from "@graphite/utility-functions/colors";
24-
import type { HSV, RGB } from "@graphite/utility-functions/colors";
25-
26-
import FloatingMenu, { preventEscapeClosingParentFloatingMenu } from "@graphite/components/layout/FloatingMenu.svelte";
27-
import LayoutCol from "@graphite/components/layout/LayoutCol.svelte";
28-
import LayoutRow from "@graphite/components/layout/LayoutRow.svelte";
29-
import IconButton from "@graphite/components/widgets/buttons/IconButton.svelte";
30-
import NumberInput from "@graphite/components/widgets/inputs/NumberInput.svelte";
31-
import SpectrumInput, { MAX_MIDPOINT, MIN_MIDPOINT } from "@graphite/components/widgets/inputs/SpectrumInput.svelte";
32-
import TextInput from "@graphite/components/widgets/inputs/TextInput.svelte";
33-
import Separator from "@graphite/components/widgets/labels/Separator.svelte";
34-
import TextLabel from "@graphite/components/widgets/labels/TextLabel.svelte";
30+
} from "/src/utility-functions/colors";
31+
import { isPlatformNative } from "/wasm/pkg/graphite_wasm";
32+
import type { FillChoice, MenuDirection, Color } from "/wasm/pkg/graphite_wasm";
3533
3634
type PresetColors = "None" | "Black" | "White" | "Red" | "Yellow" | "Green" | "Cyan" | "Blue" | "Magenta";
3735

frontend/src/components/floating-menus/Dialog.svelte

Lines changed: 10 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,15 @@
11
<script lang="ts">
22
import { getContext, onMount } from "svelte";
3-
4-
import type { DialogStore } from "@graphite/stores/dialog";
5-
import { crashReportUrl } from "@graphite/utility-functions/crash-report";
6-
import { wipeDocuments } from "@graphite/utility-functions/persistence";
7-
8-
import FloatingMenu from "@graphite/components/layout/FloatingMenu.svelte";
9-
import LayoutCol from "@graphite/components/layout/LayoutCol.svelte";
10-
import LayoutRow from "@graphite/components/layout/LayoutRow.svelte";
11-
import TextButton from "@graphite/components/widgets/buttons/TextButton.svelte";
12-
import IconLabel from "@graphite/components/widgets/labels/IconLabel.svelte";
13-
import TextLabel from "@graphite/components/widgets/labels/TextLabel.svelte";
14-
import WidgetLayout from "@graphite/components/widgets/WidgetLayout.svelte";
3+
import FloatingMenu from "/src/components/layout/FloatingMenu.svelte";
4+
import LayoutCol from "/src/components/layout/LayoutCol.svelte";
5+
import LayoutRow from "/src/components/layout/LayoutRow.svelte";
6+
import TextButton from "/src/components/widgets/buttons/TextButton.svelte";
7+
import IconLabel from "/src/components/widgets/labels/IconLabel.svelte";
8+
import TextLabel from "/src/components/widgets/labels/TextLabel.svelte";
9+
import WidgetLayout from "/src/components/widgets/WidgetLayout.svelte";
10+
import type { DialogStore } from "/src/stores/dialog";
11+
import { crashReportUrl } from "/src/utility-functions/crash-report";
12+
import { wipeDocuments } from "/src/utility-functions/persistence";
1513
1614
const dialog = getContext<DialogStore>("dialog");
1715

frontend/src/components/floating-menus/EyedropperPreview.svelte

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,8 +9,7 @@
99

1010
<script lang="ts">
1111
import { onMount } from "svelte";
12-
13-
import FloatingMenu from "@graphite/components/layout/FloatingMenu.svelte";
12+
import FloatingMenu from "/src/components/layout/FloatingMenu.svelte";
1413
1514
let temporaryCanvas: HTMLCanvasElement | undefined;
1615
let zoomPreviewCanvas: HTMLCanvasElement | undefined;

frontend/src/components/floating-menus/MenuList.svelte

Lines changed: 10 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -2,18 +2,16 @@
22

33
<script lang="ts">
44
import { createEventDispatcher, tick, onDestroy, onMount } from "svelte";
5-
6-
import type { MenuListEntry, MenuDirection } from "@graphite/../wasm/pkg/graphite_wasm";
7-
8-
import MenuList from "@graphite/components/floating-menus/MenuList.svelte";
9-
import FloatingMenu from "@graphite/components/layout/FloatingMenu.svelte";
10-
import LayoutCol from "@graphite/components/layout/LayoutCol.svelte";
11-
import LayoutRow from "@graphite/components/layout/LayoutRow.svelte";
12-
import TextInput from "@graphite/components/widgets/inputs/TextInput.svelte";
13-
import IconLabel from "@graphite/components/widgets/labels/IconLabel.svelte";
14-
import Separator from "@graphite/components/widgets/labels/Separator.svelte";
15-
import ShortcutLabel from "@graphite/components/widgets/labels/ShortcutLabel.svelte";
16-
import TextLabel from "@graphite/components/widgets/labels/TextLabel.svelte";
5+
import MenuList from "/src/components/floating-menus/MenuList.svelte";
6+
import FloatingMenu from "/src/components/layout/FloatingMenu.svelte";
7+
import LayoutCol from "/src/components/layout/LayoutCol.svelte";
8+
import LayoutRow from "/src/components/layout/LayoutRow.svelte";
9+
import TextInput from "/src/components/widgets/inputs/TextInput.svelte";
10+
import IconLabel from "/src/components/widgets/labels/IconLabel.svelte";
11+
import Separator from "/src/components/widgets/labels/Separator.svelte";
12+
import ShortcutLabel from "/src/components/widgets/labels/ShortcutLabel.svelte";
13+
import TextLabel from "/src/components/widgets/labels/TextLabel.svelte";
14+
import type { MenuListEntry, MenuDirection } from "/wasm/pkg/graphite_wasm";
1715
1816
let self: FloatingMenu | undefined;
1917
let scroller: LayoutCol | undefined;

frontend/src/components/floating-menus/NodeCatalog.svelte

Lines changed: 6 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,12 @@
11
<script lang="ts">
22
import { createEventDispatcher, getContext, onMount } from "svelte";
33
import { SvelteMap } from "svelte/reactivity";
4-
5-
import type { FrontendNodeType } from "@graphite/../wasm/pkg/graphite_wasm";
6-
import type { NodeGraphStore } from "@graphite/stores/node-graph";
7-
8-
import LayoutCol from "@graphite/components/layout/LayoutCol.svelte";
9-
import TextButton from "@graphite/components/widgets/buttons/TextButton.svelte";
10-
import TextInput from "@graphite/components/widgets/inputs/TextInput.svelte";
11-
import TextLabel from "@graphite/components/widgets/labels/TextLabel.svelte";
4+
import LayoutCol from "/src/components/layout/LayoutCol.svelte";
5+
import TextButton from "/src/components/widgets/buttons/TextButton.svelte";
6+
import TextInput from "/src/components/widgets/inputs/TextInput.svelte";
7+
import TextLabel from "/src/components/widgets/labels/TextLabel.svelte";
8+
import type { NodeGraphStore } from "/src/stores/node-graph";
9+
import type { FrontendNodeType } from "/wasm/pkg/graphite_wasm";
1210
1311
const dispatch = createEventDispatcher<{ selectNodeType: string }>();
1412
const nodeGraph = getContext<NodeGraphStore>("nodeGraph");

frontend/src/components/floating-menus/Tooltip.svelte

Lines changed: 6 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,11 @@
11
<script lang="ts">
22
import { getContext } from "svelte";
3-
4-
import type { EditorHandle, LabeledShortcut } from "@graphite/../wasm/pkg/graphite_wasm";
5-
import type { TooltipStore } from "@graphite/stores/tooltip";
6-
7-
import FloatingMenu from "@graphite/components/layout/FloatingMenu.svelte";
8-
import LayoutRow from "@graphite/components/layout/LayoutRow.svelte";
9-
import ShortcutLabel from "@graphite/components/widgets/labels/ShortcutLabel.svelte";
10-
import TextLabel from "@graphite/components/widgets/labels/TextLabel.svelte";
3+
import FloatingMenu from "/src/components/layout/FloatingMenu.svelte";
4+
import LayoutRow from "/src/components/layout/LayoutRow.svelte";
5+
import ShortcutLabel from "/src/components/widgets/labels/ShortcutLabel.svelte";
6+
import TextLabel from "/src/components/widgets/labels/TextLabel.svelte";
7+
import type { TooltipStore } from "/src/stores/tooltip";
8+
import type { EditorHandle, LabeledShortcut } from "/wasm/pkg/graphite_wasm";
119
1210
const tooltip = getContext<TooltipStore>("tooltip");
1311
const editor = getContext<EditorHandle>("editor");

0 commit comments

Comments
 (0)