diff --git a/e2e/playwright/file-tree.spec.ts b/e2e/playwright/file-tree.spec.ts index 384358708..ece92ac67 100644 --- a/e2e/playwright/file-tree.spec.ts +++ b/e2e/playwright/file-tree.spec.ts @@ -26,10 +26,6 @@ test.describe('integrations tests', () => { 'Creating a new file or switching file while in sketchMode should exit sketchMode', { tag: '@electron' }, async ({ tronApp, homePage, scene, editor, toolbar }) => { - test.skip( - process.platform === 'win32', - 'windows times out will waiting for the execution indicator?' - ) await tronApp.initialise({ fixtures: { homePage, scene, editor, toolbar }, folderSetupFn: async (dir) => { @@ -55,7 +51,6 @@ test.describe('integrations tests', () => { sortBy: 'last-modified-desc', }) await homePage.openProject('test-sample') - // windows times out here, hence the skip above await scene.waitForExecutionDone() }) await test.step('enter sketch mode', async () => { @@ -71,10 +66,13 @@ test.describe('integrations tests', () => { await toolbar.editSketch() await expect(toolbar.exitSketchBtn).toBeVisible() }) + + const fileName = 'Untitled.kcl' await test.step('check sketch mode is exited when creating new file', async () => { await toolbar.fileTreeBtn.click() await toolbar.expectFileTreeState(['main.kcl']) - await toolbar.createFile({ wait: true }) + + await toolbar.createFile({ fileName, waitForToastToDisappear: true }) // check we're out of sketch mode await expect(toolbar.exitSketchBtn).not.toBeVisible() @@ -93,10 +91,10 @@ test.describe('integrations tests', () => { }) await toolbar.editSketch() await expect(toolbar.exitSketchBtn).toBeVisible() - await toolbar.expectFileTreeState(['main.kcl', 'Untitled.kcl']) + await toolbar.expectFileTreeState(['main.kcl', fileName]) }) await test.step('check sketch mode is exited when opening a different file', async () => { - await toolbar.openFile('untitled.kcl', { wait: false }) + await toolbar.openFile(fileName, { wait: false }) // check we're out of sketch mode await expect(toolbar.exitSketchBtn).not.toBeVisible() diff --git a/e2e/playwright/fixtures/sceneFixture.ts b/e2e/playwright/fixtures/sceneFixture.ts index 3baee5dc8..798868ec5 100644 --- a/e2e/playwright/fixtures/sceneFixture.ts +++ b/e2e/playwright/fixtures/sceneFixture.ts @@ -195,7 +195,7 @@ export class SceneFixture { } waitForExecutionDone = async () => { - await expect(this.exeIndicator).toBeVisible() + await expect(this.exeIndicator).toBeVisible({ timeout: 30000 }) } expectPixelColor = async ( diff --git a/e2e/playwright/fixtures/toolbarFixture.ts b/e2e/playwright/fixtures/toolbarFixture.ts index fb8a908ad..3d303be8a 100644 --- a/e2e/playwright/fixtures/toolbarFixture.ts +++ b/e2e/playwright/fixtures/toolbarFixture.ts @@ -16,6 +16,7 @@ export class ToolbarFixture { fileCreateToast!: Locator filePane!: Locator exeIndicator!: Locator + treeInputField!: Locator constructor(page: Page) { this.page = page @@ -31,6 +32,7 @@ export class ToolbarFixture { this.editSketchBtn = page.getByText('Edit Sketch') this.fileTreeBtn = page.locator('[id="files-button-holder"]') this.createFileBtn = page.getByTestId('create-file-button') + this.treeInputField = page.getByTestId('tree-input-field') this.filePane = page.locator('#files-pane') this.fileCreateToast = page.getByText('Successfully created') @@ -59,10 +61,15 @@ export class ToolbarFixture { expectFileTreeState = async (expected: string[]) => { await expect.poll(this._serialiseFileTree).toEqual(expected) } - createFile = async ({ wait }: { wait: boolean } = { wait: false }) => { + createFile = async (args: { + fileName: string + waitForToastToDisappear: boolean + }) => { await this.createFileBtn.click() + await this.treeInputField.fill(args.fileName) + await this.treeInputField.press('Enter') await expect(this.fileCreateToast).toBeVisible() - if (wait) { + if (args.waitForToastToDisappear) { await this.fileCreateToast.waitFor({ state: 'detached' }) } } diff --git a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Client-side-scene-scale-should-match-engine-scale-Inch-scale-1-Google-Chrome-linux.png b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Client-side-scene-scale-should-match-engine-scale-Inch-scale-1-Google-Chrome-linux.png index 78e1c5072..d5e244dd0 100644 Binary files a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Client-side-scene-scale-should-match-engine-scale-Inch-scale-1-Google-Chrome-linux.png and b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Client-side-scene-scale-should-match-engine-scale-Inch-scale-1-Google-Chrome-linux.png differ diff --git a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Client-side-scene-scale-should-match-engine-scale-Inch-scale-1-Google-Chrome-win32.png b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Client-side-scene-scale-should-match-engine-scale-Inch-scale-1-Google-Chrome-win32.png index 5ff8e179d..f6fb63304 100644 Binary files a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Client-side-scene-scale-should-match-engine-scale-Inch-scale-1-Google-Chrome-win32.png and b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Client-side-scene-scale-should-match-engine-scale-Inch-scale-1-Google-Chrome-win32.png differ diff --git a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Client-side-scene-scale-should-match-engine-scale-Inch-scale-2-Google-Chrome-linux.png b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Client-side-scene-scale-should-match-engine-scale-Inch-scale-2-Google-Chrome-linux.png index fe1a02df5..ee85d2fdd 100644 Binary files a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Client-side-scene-scale-should-match-engine-scale-Inch-scale-2-Google-Chrome-linux.png and b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Client-side-scene-scale-should-match-engine-scale-Inch-scale-2-Google-Chrome-linux.png differ diff --git a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Client-side-scene-scale-should-match-engine-scale-Inch-scale-2-Google-Chrome-win32.png b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Client-side-scene-scale-should-match-engine-scale-Inch-scale-2-Google-Chrome-win32.png index 7e774fc58..7f43f1aa4 100644 Binary files a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Client-side-scene-scale-should-match-engine-scale-Inch-scale-2-Google-Chrome-win32.png and b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Client-side-scene-scale-should-match-engine-scale-Inch-scale-2-Google-Chrome-win32.png differ diff --git a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Client-side-scene-scale-should-match-engine-scale-Millimeter-scale-1-Google-Chrome-linux.png b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Client-side-scene-scale-should-match-engine-scale-Millimeter-scale-1-Google-Chrome-linux.png index 2e8e827a6..b2dc6ee66 100644 Binary files a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Client-side-scene-scale-should-match-engine-scale-Millimeter-scale-1-Google-Chrome-linux.png and b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Client-side-scene-scale-should-match-engine-scale-Millimeter-scale-1-Google-Chrome-linux.png differ diff --git a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Client-side-scene-scale-should-match-engine-scale-Millimeter-scale-1-Google-Chrome-win32.png b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Client-side-scene-scale-should-match-engine-scale-Millimeter-scale-1-Google-Chrome-win32.png index 0c5da89c1..a8624a7c0 100644 Binary files a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Client-side-scene-scale-should-match-engine-scale-Millimeter-scale-1-Google-Chrome-win32.png and b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Client-side-scene-scale-should-match-engine-scale-Millimeter-scale-1-Google-Chrome-win32.png differ diff --git a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Client-side-scene-scale-should-match-engine-scale-Millimeter-scale-2-Google-Chrome-linux.png b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Client-side-scene-scale-should-match-engine-scale-Millimeter-scale-2-Google-Chrome-linux.png index 3a24ee84c..15de7faa7 100644 Binary files a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Client-side-scene-scale-should-match-engine-scale-Millimeter-scale-2-Google-Chrome-linux.png and b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Client-side-scene-scale-should-match-engine-scale-Millimeter-scale-2-Google-Chrome-linux.png differ diff --git a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Client-side-scene-scale-should-match-engine-scale-Millimeter-scale-2-Google-Chrome-win32.png b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Client-side-scene-scale-should-match-engine-scale-Millimeter-scale-2-Google-Chrome-win32.png index ab82fb0aa..965a62b64 100644 Binary files a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Client-side-scene-scale-should-match-engine-scale-Millimeter-scale-2-Google-Chrome-win32.png and b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Client-side-scene-scale-should-match-engine-scale-Millimeter-scale-2-Google-Chrome-win32.png differ diff --git a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Draft-circle-should-look-right-1-Google-Chrome-linux.png b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Draft-circle-should-look-right-1-Google-Chrome-linux.png index 22ad3f3e2..039d4b37c 100644 Binary files a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Draft-circle-should-look-right-1-Google-Chrome-linux.png and b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Draft-circle-should-look-right-1-Google-Chrome-linux.png differ diff --git a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Draft-circle-should-look-right-1-Google-Chrome-win32.png b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Draft-circle-should-look-right-1-Google-Chrome-win32.png index 1a21406c0..141a2a5c9 100644 Binary files a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Draft-circle-should-look-right-1-Google-Chrome-win32.png and b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Draft-circle-should-look-right-1-Google-Chrome-win32.png differ diff --git a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Draft-rectangles-should-look-right-1-Google-Chrome-linux.png b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Draft-rectangles-should-look-right-1-Google-Chrome-linux.png index e3a43017c..1f156f74e 100644 Binary files a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Draft-rectangles-should-look-right-1-Google-Chrome-linux.png and b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Draft-rectangles-should-look-right-1-Google-Chrome-linux.png differ diff --git a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Draft-rectangles-should-look-right-1-Google-Chrome-win32.png b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Draft-rectangles-should-look-right-1-Google-Chrome-win32.png index 25a04b3f2..aa7d7718d 100644 Binary files a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Draft-rectangles-should-look-right-1-Google-Chrome-win32.png and b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Draft-rectangles-should-look-right-1-Google-Chrome-win32.png differ diff --git a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Draft-segments-should-look-right-1-Google-Chrome-linux.png b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Draft-segments-should-look-right-1-Google-Chrome-linux.png index ddc31ae4e..f088bb6bd 100644 Binary files a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Draft-segments-should-look-right-1-Google-Chrome-linux.png and b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Draft-segments-should-look-right-1-Google-Chrome-linux.png differ diff --git a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Draft-segments-should-look-right-1-Google-Chrome-win32.png b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Draft-segments-should-look-right-1-Google-Chrome-win32.png index c6a6c0b53..95df01018 100644 Binary files a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Draft-segments-should-look-right-1-Google-Chrome-win32.png and b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Draft-segments-should-look-right-1-Google-Chrome-win32.png differ diff --git a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Draft-segments-should-look-right-2-Google-Chrome-linux.png b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Draft-segments-should-look-right-2-Google-Chrome-linux.png index 2a7320235..385274758 100644 Binary files a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Draft-segments-should-look-right-2-Google-Chrome-linux.png and b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Draft-segments-should-look-right-2-Google-Chrome-linux.png differ diff --git a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Draft-segments-should-look-right-2-Google-Chrome-win32.png b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Draft-segments-should-look-right-2-Google-Chrome-win32.png index 6e2b1727a..4ed1f33ca 100644 Binary files a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Draft-segments-should-look-right-2-Google-Chrome-win32.png and b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Draft-segments-should-look-right-2-Google-Chrome-win32.png differ diff --git a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Grid-visibility-Grid-turned-off-1-Google-Chrome-linux.png b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Grid-visibility-Grid-turned-off-1-Google-Chrome-linux.png index d06e5b7b9..0b65be0ff 100644 Binary files a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Grid-visibility-Grid-turned-off-1-Google-Chrome-linux.png and b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Grid-visibility-Grid-turned-off-1-Google-Chrome-linux.png differ diff --git a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Grid-visibility-Grid-turned-off-1-Google-Chrome-win32.png b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Grid-visibility-Grid-turned-off-1-Google-Chrome-win32.png index 3656ad869..a6b9bab59 100644 Binary files a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Grid-visibility-Grid-turned-off-1-Google-Chrome-win32.png and b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Grid-visibility-Grid-turned-off-1-Google-Chrome-win32.png differ diff --git a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Grid-visibility-Grid-turned-on-1-Google-Chrome-linux.png b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Grid-visibility-Grid-turned-on-1-Google-Chrome-linux.png index 66fcb1ddc..6eccdf765 100644 Binary files a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Grid-visibility-Grid-turned-on-1-Google-Chrome-linux.png and b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Grid-visibility-Grid-turned-on-1-Google-Chrome-linux.png differ diff --git a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Grid-visibility-Grid-turned-on-1-Google-Chrome-win32.png b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Grid-visibility-Grid-turned-on-1-Google-Chrome-win32.png index d61edb334..64ba34e24 100644 Binary files a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Grid-visibility-Grid-turned-on-1-Google-Chrome-win32.png and b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Grid-visibility-Grid-turned-on-1-Google-Chrome-win32.png differ diff --git a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Sketch-on-face-with-none-z-up-1-Google-Chrome-linux.png b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Sketch-on-face-with-none-z-up-1-Google-Chrome-linux.png index e01b575a0..329a36b9c 100644 Binary files a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Sketch-on-face-with-none-z-up-1-Google-Chrome-linux.png and b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Sketch-on-face-with-none-z-up-1-Google-Chrome-linux.png differ diff --git a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Sketch-on-face-with-none-z-up-1-Google-Chrome-win32.png b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Sketch-on-face-with-none-z-up-1-Google-Chrome-win32.png index ba30cd7e1..ed36aa851 100644 Binary files a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Sketch-on-face-with-none-z-up-1-Google-Chrome-win32.png and b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Sketch-on-face-with-none-z-up-1-Google-Chrome-win32.png differ diff --git a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Zoom-to-fit-on-load---solid-2d-1-Google-Chrome-linux.png b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Zoom-to-fit-on-load---solid-2d-1-Google-Chrome-linux.png index e609971d9..f8e303ab4 100644 Binary files a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Zoom-to-fit-on-load---solid-2d-1-Google-Chrome-linux.png and b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Zoom-to-fit-on-load---solid-2d-1-Google-Chrome-linux.png differ diff --git a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Zoom-to-fit-on-load---solid-2d-1-Google-Chrome-win32.png b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Zoom-to-fit-on-load---solid-2d-1-Google-Chrome-win32.png index 2a783e73d..f42ce2347 100644 Binary files a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Zoom-to-fit-on-load---solid-2d-1-Google-Chrome-win32.png and b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Zoom-to-fit-on-load---solid-2d-1-Google-Chrome-win32.png differ diff --git a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Zoom-to-fit-on-load---solid-3d-1-Google-Chrome-linux.png b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Zoom-to-fit-on-load---solid-3d-1-Google-Chrome-linux.png index 8fa0f8e24..2bb7b2005 100644 Binary files a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Zoom-to-fit-on-load---solid-3d-1-Google-Chrome-linux.png and b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Zoom-to-fit-on-load---solid-3d-1-Google-Chrome-linux.png differ diff --git a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Zoom-to-fit-on-load---solid-3d-1-Google-Chrome-win32.png b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Zoom-to-fit-on-load---solid-3d-1-Google-Chrome-win32.png index 458fc92bb..04958027d 100644 Binary files a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Zoom-to-fit-on-load---solid-3d-1-Google-Chrome-win32.png and b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Zoom-to-fit-on-load---solid-3d-1-Google-Chrome-win32.png differ diff --git a/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable--XY-1-Google-Chrome-linux.png b/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable--XY-1-Google-Chrome-linux.png index c3d32ea4b..58f0281c7 100644 Binary files a/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable--XY-1-Google-Chrome-linux.png and b/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable--XY-1-Google-Chrome-linux.png differ diff --git a/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable--XY-1-Google-Chrome-win32.png b/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable--XY-1-Google-Chrome-win32.png index 0aa6416c1..c807e9ca1 100644 Binary files a/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable--XY-1-Google-Chrome-win32.png and b/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable--XY-1-Google-Chrome-win32.png differ diff --git a/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable--XZ-1-Google-Chrome-linux.png b/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable--XZ-1-Google-Chrome-linux.png index 127b0f318..56b53d595 100644 Binary files a/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable--XZ-1-Google-Chrome-linux.png and b/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable--XZ-1-Google-Chrome-linux.png differ diff --git a/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable--XZ-1-Google-Chrome-win32.png b/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable--XZ-1-Google-Chrome-win32.png index dc3a484e2..8448bb283 100644 Binary files a/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable--XZ-1-Google-Chrome-win32.png and b/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable--XZ-1-Google-Chrome-win32.png differ diff --git a/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable--YZ-1-Google-Chrome-linux.png b/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable--YZ-1-Google-Chrome-linux.png index 4967bf225..31a79978a 100644 Binary files a/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable--YZ-1-Google-Chrome-linux.png and b/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable--YZ-1-Google-Chrome-linux.png differ diff --git a/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable--YZ-1-Google-Chrome-win32.png b/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable--YZ-1-Google-Chrome-win32.png index 722869578..893ff191b 100644 Binary files a/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable--YZ-1-Google-Chrome-win32.png and b/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable--YZ-1-Google-Chrome-win32.png differ diff --git a/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable-XY-1-Google-Chrome-linux.png b/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable-XY-1-Google-Chrome-linux.png index d05727ebe..4609c1efb 100644 Binary files a/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable-XY-1-Google-Chrome-linux.png and b/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable-XY-1-Google-Chrome-linux.png differ diff --git a/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable-XY-1-Google-Chrome-win32.png b/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable-XY-1-Google-Chrome-win32.png index 25fe227d7..776fb0627 100644 Binary files a/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable-XY-1-Google-Chrome-win32.png and b/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable-XY-1-Google-Chrome-win32.png differ diff --git a/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable-XZ-1-Google-Chrome-linux.png b/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable-XZ-1-Google-Chrome-linux.png index 948c1a5a3..0fb86d04c 100644 Binary files a/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable-XZ-1-Google-Chrome-linux.png and b/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable-XZ-1-Google-Chrome-linux.png differ diff --git a/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable-XZ-1-Google-Chrome-win32.png b/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable-XZ-1-Google-Chrome-win32.png index 6f8ac92cb..d1322ba9a 100644 Binary files a/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable-XZ-1-Google-Chrome-win32.png and b/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable-XZ-1-Google-Chrome-win32.png differ diff --git a/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable-YZ-1-Google-Chrome-linux.png b/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable-YZ-1-Google-Chrome-linux.png index 49f228f7c..801a70566 100644 Binary files a/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable-YZ-1-Google-Chrome-linux.png and b/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable-YZ-1-Google-Chrome-linux.png differ diff --git a/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable-YZ-1-Google-Chrome-win32.png b/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable-YZ-1-Google-Chrome-win32.png index c307e6d33..a41fc88e8 100644 Binary files a/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable-YZ-1-Google-Chrome-win32.png and b/e2e/playwright/snapshot-tests.spec.ts-snapshots/extrude-on-default-planes-should-be-stable-YZ-1-Google-Chrome-win32.png differ diff --git a/src/components/FileTree.tsx b/src/components/FileTree.tsx index 70610549e..d010d3edc 100644 --- a/src/components/FileTree.tsx +++ b/src/components/FileTree.tsx @@ -6,10 +6,10 @@ import { Dispatch, useCallback, useRef, useState } from 'react' import { useNavigate, useRouteLoaderData } from 'react-router-dom' import { Disclosure } from '@headlessui/react' import { FontAwesomeIcon } from '@fortawesome/react-fontawesome' -import { faChevronRight } from '@fortawesome/free-solid-svg-icons' +import { faChevronRight, faPencil } from '@fortawesome/free-solid-svg-icons' import { useFileContext } from 'hooks/useFileContext' import styles from './FileTree.module.css' -import { sortProject } from 'lib/desktopFS' +import { sortFilesAndDirectories } from 'lib/desktopFS' import { FILE_EXT } from 'lib/constants' import { CustomIcon } from './CustomIcon' import { codeManager, kclManager } from 'lib/singletons' @@ -27,6 +27,36 @@ function getIndentationCSS(level: number) { return `calc(1rem * ${level + 1})` } +function TreeEntryInput(props: { + level: number + onSubmit: (value: string) => void +}) { + const [value, setValue] = useState('') + const onKeyPress = (e: React.KeyboardEvent) => { + if (e.key !== 'Enter') return + props.onSubmit(value) + } + + return ( + + ) +} + function RenameForm({ fileOrDir, onSubmit, @@ -113,16 +143,32 @@ function DeleteFileTreeItemDialog({ } const FileTreeItem = ({ + parentDir, project, currentFile, + lastDirectoryClicked, fileOrDir, onNavigateToFile, + onClickDirectory, + onCreateFile, + onCreateFolder, + newTreeEntry, level = 0, }: { + parentDir: FileEntry | undefined project?: IndexLoaderData['project'] currentFile?: IndexLoaderData['file'] + lastDirectoryClicked?: FileEntry fileOrDir: FileEntry onNavigateToFile?: () => void + onClickDirectory: ( + open: boolean, + path: FileEntry, + parentDir: FileEntry | undefined + ) => void + onCreateFile: (name: string) => void + onCreateFolder: (name: string) => void + newTreeEntry: TreeEntry level?: number }) => { const { send: fileSend, context: fileContext } = useFileContext() @@ -156,6 +202,10 @@ const FileTreeItem = ({ [fileOrDir.path] ) + const showNewTreeEntry = + newTreeEntry !== undefined && + fileOrDir.path === fileContext.selectedDirectory.path + const isRenaming = fileContext.itemsBeingRenamed.includes(fileOrDir.path) const removeCurrentItemFromRenaming = useCallback( () => @@ -179,13 +229,6 @@ const FileTreeItem = ({ }) }, [fileContext.itemsBeingRenamed, fileOrDir.path, fileSend]) - const clickDirectory = () => { - fileSend({ - type: 'Set selected directory', - directory: fileOrDir, - }) - } - function handleKeyUp(e: React.KeyboardEvent) { if (e.metaKey && e.key === 'Backspace') { // Open confirmation dialog @@ -223,6 +266,8 @@ const FileTreeItem = ({ onNavigateToFile?.() } + // The below handles both the "root" of all directories and all subs. It's + // why some code is duplicated. return (
{fileOrDir.children === null ? ( @@ -266,14 +311,15 @@ const FileTreeItem = ({ e.currentTarget.focus()} - onClickCapture={clickDirectory} - onFocusCapture={clickDirectory} + onClick={(e) => { + e.stopPropagation() + onClickDirectory(open, fileOrDir, parentDir) + }} onKeyDown={(e) => e.key === 'Enter' && e.preventDefault()} onKeyUp={handleKeyUp} > @@ -315,35 +361,67 @@ const FileTreeItem = ({ >
    { - fileSend({ - type: 'Set selected directory', - directory: fileOrDir, - }) + onClick={(e) => { + e.stopPropagation() + onClickDirectory(open, fileOrDir, parentDir) }} - onFocusCapture={(e) => - fileSend({ - type: 'Set selected directory', - directory: fileOrDir, - }) - } > - {fileOrDir.children?.map((child) => ( - - ))} + {showNewTreeEntry && ( +
    + + + newTreeEntry === 'file' + ? onCreateFile(value) + : onCreateFolder(value) + } + /> +
    + )} + {sortFilesAndDirectories(fileOrDir.children || []).map( + (child) => ( + + ) + )} + {!showNewTreeEntry && fileOrDir.children?.length === 0 && ( +
    +
    No files
    +
    + )}
)} )} + {isConfirmingDelete && ( void } -export const FileTreeMenu = () => { - const { send } = useFileContext() - const { send: modelingSend } = useModelingContext() - - function createFile() { - send({ - type: 'Create file', - data: { name: '', makeDir: false, shouldSetToRename: true }, - }) - modelingSend({ type: 'Cancel' }) - } - - function createFolder() { - send({ - type: 'Create file', - data: { name: '', makeDir: true, shouldSetToRename: true }, - }) - } - - useHotkeyWrapper(['mod + n'], createFile) - useHotkeyWrapper(['mod + shift + n'], createFolder) +export const FileTreeMenu = ({ + onCreateFile, + onCreateFolder, +}: { + onCreateFile: () => void + onCreateFolder: () => void +}) => { + useHotkeyWrapper(['mod + n'], onCreateFile) + useHotkeyWrapper(['mod + shift + n'], onCreateFolder) return ( <> @@ -440,7 +506,7 @@ export const FileTreeMenu = () => { bgClassName: 'bg-transparent', }} className="!p-0 !bg-transparent hover:text-primary border-transparent hover:border-primary !outline-none" - onClick={createFile} + onClick={onCreateFile} > Create file @@ -456,7 +522,7 @@ export const FileTreeMenu = () => { bgClassName: 'bg-transparent', }} className="!p-0 !bg-transparent hover:text-primary border-transparent hover:border-primary !outline-none" - onClick={createFolder} + onClick={onCreateFolder} > Create folder @@ -466,30 +532,106 @@ export const FileTreeMenu = () => { ) } +type TreeEntry = 'file' | 'folder' | undefined + +export const useFileTreeOperations = () => { + const { send } = useFileContext() + const { send: modelingSend } = useModelingContext() + + // As long as this is undefined, a new "file tree entry prompt" is not shown. + const [newTreeEntry, setNewTreeEntry] = useState(undefined) + + function createFile(args: { dryRun: boolean; name?: string }) { + if (args.dryRun) { + setNewTreeEntry('file') + return + } + + // Clear so that the entry prompt goes away. + setNewTreeEntry(undefined) + + if (!args.name) return + + send({ + type: 'Create file', + data: { name: args.name, makeDir: false, shouldSetToRename: false }, + }) + modelingSend({ type: 'Cancel' }) + } + + function createFolder(args: { dryRun: boolean; name?: string }) { + if (args.dryRun) { + setNewTreeEntry('folder') + return + } + + setNewTreeEntry(undefined) + + if (!args.name) return + + send({ + type: 'Create file', + data: { name: args.name, makeDir: true, shouldSetToRename: false }, + }) + } + + return { + createFile, + createFolder, + newTreeEntry, + } +} + export const FileTree = ({ className = '', onNavigateToFile: closePanel, }: FileTreeProps) => { + const { createFile, createFolder, newTreeEntry } = useFileTreeOperations() + return (

Files

- + createFile({ dryRun: true })} + onCreateFolder={() => createFolder({ dryRun: true })} + />
- + createFile({ dryRun: false, name })} + onCreateFolder={(name: string) => createFolder({ dryRun: false, name })} + />
) } export const FileTreeInner = ({ onNavigateToFile, + onCreateFile, + onCreateFolder, + newTreeEntry, }: { + onCreateFile: (name: string) => void + onCreateFolder: (name: string) => void + newTreeEntry: TreeEntry onNavigateToFile?: () => void }) => { const loaderData = useRouteLoaderData(PATHS.FILE) as IndexLoaderData const { send: fileSend, context: fileContext } = useFileContext() const { send: modelingSend } = useModelingContext() + const [lastDirectoryClicked, setLastDirectoryClicked] = useState< + FileEntry | undefined + >(undefined) + + const onNavigateToFile_ = () => { + // Reset modeling state when navigating to a new file + onNavigateToFile?.() + modelingSend({ type: 'Cancel' }) + } + // Refresh the file tree when there are changes. useFileSystemWatcher( async (eventType, path) => { @@ -513,33 +655,78 @@ export const FileTreeInner = ({ ) ) - const clickDirectory = () => { + const onTreeEntryInputSubmit = (value: string) => { + if (newTreeEntry === 'file') { + onCreateFile(value) + onNavigateToFile_() + } else { + onCreateFolder(value) + } + } + + const onClickDirectory = ( + open_: boolean, + fileOrDir: FileEntry, + parentDir: FileEntry | undefined + ) => { + // open true is closed... it's broken. Save me. I've inverted it here for + // sanity. + const open = !open_ + + const target = open ? fileOrDir : parentDir + + // We're at the root, can't select anything further + if (!target) return + + setLastDirectoryClicked(target) fileSend({ type: 'Set selected directory', - directory: fileContext.project, + directory: target, }) } + const showNewTreeEntry = + newTreeEntry !== undefined && + fileContext.selectedDirectory.path === loaderData.project?.path + return ( -
-
    - {sortProject(fileContext.project?.children || []).map((fileOrDir) => ( - { - // Reset modeling state when navigating to a new file - modelingSend({ type: 'Cancel' }) - onNavigateToFile?.() - }} - key={fileOrDir.path} - /> - ))} -
+
+
+
    + {showNewTreeEntry && ( +
    + + +
    + )} + {sortFilesAndDirectories(fileContext.project?.children || []).map( + (fileOrDir) => ( + + ) + )} +
+
) } diff --git a/src/components/ModelingMachineProvider.tsx b/src/components/ModelingMachineProvider.tsx index 7b6a41898..90d68e134 100644 --- a/src/components/ModelingMachineProvider.tsx +++ b/src/components/ModelingMachineProvider.tsx @@ -158,36 +158,39 @@ export const ModelingMachineProvider = ({ 'enable copilot': () => { editorManager.setCopilotEnabled(true) }, - 'sketch exit execute': ({ context: { store } }) => { - ;(async () => { - // When cancelling the sketch mode we should disable sketch mode within the engine. - await engineCommandManager.sendSceneCommand({ - type: 'modeling_cmd_req', - cmd_id: uuidv4(), - cmd: { type: 'sketch_mode_disable' }, - }) + // tsc reports this typing as perfectly fine, but eslint is complaining. + // It's actually nonsensical, so I'm quieting. + // eslint-disable-next-line @typescript-eslint/no-misused-promises + 'sketch exit execute': async ({ + context: { store }, + }): Promise => { + // When cancelling the sketch mode we should disable sketch mode within the engine. + await engineCommandManager.sendSceneCommand({ + type: 'modeling_cmd_req', + cmd_id: uuidv4(), + cmd: { type: 'sketch_mode_disable' }, + }) - sceneInfra.camControls.syncDirection = 'clientToEngine' + sceneInfra.camControls.syncDirection = 'clientToEngine' - if (cameraProjection.current === 'perspective') { - await sceneInfra.camControls.snapToPerspectiveBeforeHandingBackControlToEngine() - } + if (cameraProjection.current === 'perspective') { + await sceneInfra.camControls.snapToPerspectiveBeforeHandingBackControlToEngine() + } - sceneInfra.camControls.syncDirection = 'engineToClient' + sceneInfra.camControls.syncDirection = 'engineToClient' - store.videoElement?.pause() + store.videoElement?.pause() - kclManager - .executeCode() - .then(() => { - if (engineCommandManager.engineConnection?.idleMode) return + return kclManager + .executeCode() + .then(() => { + if (engineCommandManager.engineConnection?.idleMode) return - store.videoElement?.play().catch((e) => { - console.warn('Video playing was prevented', e) - }) + store.videoElement?.play().catch((e) => { + console.warn('Video playing was prevented', e) }) - .catch(reportRejection) - })().catch(reportRejection) + }) + .catch(reportRejection) }, 'Set mouse state': assign(({ context, event }) => { if (event.type !== 'Set mouse state') return {} diff --git a/src/components/ModelingSidebar/ModelingPane.tsx b/src/components/ModelingSidebar/ModelingPane.tsx index a5ffc079f..2f959b419 100644 --- a/src/components/ModelingSidebar/ModelingPane.tsx +++ b/src/components/ModelingSidebar/ModelingPane.tsx @@ -48,7 +48,7 @@ export const ModelingPaneHeader = ({ bgClassName: 'bg-transparent dark:bg-transparent', }} className="!p-0 !bg-transparent hover:text-primary border-transparent dark:!border-transparent hover:!border-primary dark:hover:!border-chalkboard-70 !outline-none" - onClick={onClose} + onClick={() => onClose()} > Close @@ -59,14 +59,12 @@ export const ModelingPaneHeader = ({ } export const ModelingPane = ({ - title, - icon, id, children, className, - Menu, detailsTestId, onClose, + title, ...props }: ModelingPaneProps) => { const { settings } = useSettingsAuthContext() @@ -78,6 +76,7 @@ export const ModelingPane = ({ return (
- -
{children}
+ {children}
) } diff --git a/src/components/ModelingSidebar/ModelingPanes/DebugPane.tsx b/src/components/ModelingSidebar/ModelingPanes/DebugPane.tsx index f96cb9ef6..c98810ded 100644 --- a/src/components/ModelingSidebar/ModelingPanes/DebugPane.tsx +++ b/src/components/ModelingSidebar/ModelingPanes/DebugPane.tsx @@ -5,16 +5,18 @@ import { CamDebugSettings } from 'clientSideScene/ClientSideSceneComp' export const DebugPane = () => { return ( -
-
- - - - -
-
+
+
+
+ + + + +
+
+
) } diff --git a/src/components/ModelingSidebar/ModelingPanes/KclEditorPane.tsx b/src/components/ModelingSidebar/ModelingPanes/KclEditorPane.tsx index f27f41226..53ec42540 100644 --- a/src/components/ModelingSidebar/ModelingPanes/KclEditorPane.tsx +++ b/src/components/ModelingSidebar/ModelingPanes/KclEditorPane.tsx @@ -174,27 +174,31 @@ export const KclEditorPane = () => { const initialCode = useRef(codeManager.code) return ( -
- { - if (_editorView === null) return +
+
+ { + if (_editorView === null) return - editorManager.setEditorView(_editorView) + editorManager.setEditorView(_editorView) - // On first load of this component, ensure we show the current errors - // in the editor. - // Make sure we don't add them twice. - if (diagnosticCount(_editorView.state) === 0) { - kclManager.setDiagnosticsForCurrentErrors() - } - }} - /> + // On first load of this component, ensure we show the current errors + // in the editor. + // Make sure we don't add them twice. + if (diagnosticCount(_editorView.state) === 0) { + kclManager.setDiagnosticsForCurrentErrors() + } + }} + /> +
) } diff --git a/src/components/ModelingSidebar/ModelingPanes/index.tsx b/src/components/ModelingSidebar/ModelingPanes/index.tsx index f48c16b0c..328427534 100644 --- a/src/components/ModelingSidebar/ModelingPanes/index.tsx +++ b/src/components/ModelingSidebar/ModelingPanes/index.tsx @@ -2,11 +2,17 @@ import { IconDefinition, faBugSlash } from '@fortawesome/free-solid-svg-icons' import { KclEditorMenu } from 'components/ModelingSidebar/ModelingPanes/KclEditorMenu' import { CustomIconName } from 'components/CustomIcon' import { KclEditorPane } from 'components/ModelingSidebar/ModelingPanes/KclEditorPane' +import { ModelingPaneHeader } from 'components/ModelingSidebar/ModelingPane' import { MouseEventHandler, ReactNode } from 'react' import { MemoryPane, MemoryPaneMenu } from './MemoryPane' import { LogsPane } from './LoggingPanes' import { DebugPane } from './DebugPane' -import { FileTreeInner, FileTreeMenu, FileTreeRoot } from 'components/FileTree' +import { + FileTreeInner, + FileTreeMenu, + FileTreeRoot, + useFileTreeOperations, +} from 'components/FileTree' import { useKclContext } from 'lang/KclProvider' import { editorManager } from 'lib/singletons' import { ContextFrom } from 'xstate' @@ -38,20 +44,19 @@ interface PaneCallbackProps { export type SidebarPane = { id: SidebarType - title: ReactNode - sidebarName?: string + sidebarName: string icon: CustomIconName | IconDefinition keybinding: string - Content: ReactNode | React.FC - Menu?: ReactNode | React.FC + Content: React.FC<{ id: SidebarType; onClose: () => void }> hide?: boolean | ((props: PaneCallbackProps) => boolean) showBadge?: BadgeInfo } export type SidebarAction = { id: string - title: ReactNode + sidebarName: string icon: CustomIconName + title: ReactNode iconClassName?: string // Just until we get rid of FontAwesome icons keybinding: string action: () => void @@ -59,14 +64,30 @@ export type SidebarAction = { disable?: () => string | undefined } +// For now a lot of icons are the same but the reality is they could totally +// be different, like an icon based on some data for the pane, or the icon +// changes to be a spinning loader on loading. + export const sidebarPanes: SidebarPane[] = [ { id: 'code', - title: 'KCL Code', icon: 'code', - Content: KclEditorPane, + sidebarName: 'KCL Code', + Content: (props: { id: SidebarType; onClose: () => void }) => { + return ( + <> + } + onClose={props.onClose} + /> + + + ) + }, keybinding: 'Shift + C', - Menu: KclEditorMenu, showBadge: { value: ({ kclContext }) => { return kclContext.errors.length @@ -79,34 +100,96 @@ export const sidebarPanes: SidebarPane[] = [ }, { id: 'files', - title: , - sidebarName: 'Project Files', icon: 'folder', - Content: FileTreeInner, + sidebarName: 'Project Files', + Content: (props: { id: SidebarType; onClose: () => void }) => { + const { createFile, createFolder, newTreeEntry } = useFileTreeOperations() + + return ( + <> + } + Menu={ + createFile({ dryRun: true })} + onCreateFolder={() => createFolder({ dryRun: true })} + /> + } + onClose={props.onClose} + /> + createFile({ dryRun: false, name })} + onCreateFolder={(name: string) => + createFolder({ dryRun: false, name }) + } + newTreeEntry={newTreeEntry} + /> + + ) + }, keybinding: 'Shift + F', - Menu: FileTreeMenu, hide: ({ platform }) => platform === 'web', }, { id: 'variables', - title: 'Variables', icon: 'make-variable', - Content: MemoryPane, - Menu: MemoryPaneMenu, + sidebarName: 'Variables', + Content: (props: { id: SidebarType; onClose: () => void }) => { + return ( + <> + } + onClose={props.onClose} + /> + + + ) + }, keybinding: 'Shift + V', }, { id: 'logs', - title: 'Logs', icon: 'logs', - Content: LogsPane, + sidebarName: 'Logs', + Content: (props: { id: SidebarType; onClose: () => void }) => { + return ( + <> + + + + ) + }, keybinding: 'Shift + L', }, { id: 'debug', - title: 'Debug', icon: faBugSlash, - Content: DebugPane, + sidebarName: 'Debug', + Content: (props: { id: SidebarType; onClose: () => void }) => { + return ( + <> + + + + ) + }, keybinding: 'Shift + D', hide: ({ settings }) => !settings.modeling.showDebugPanel.current, }, diff --git a/src/components/ModelingSidebar/ModelingSidebar.module.css b/src/components/ModelingSidebar/ModelingSidebar.module.css index c2bda853d..e69de29bb 100644 --- a/src/components/ModelingSidebar/ModelingSidebar.module.css +++ b/src/components/ModelingSidebar/ModelingSidebar.module.css @@ -1,11 +0,0 @@ -.grid { - display: grid; - grid-template-columns: auto 1fr; - grid-template-rows: 1fr 1fr; - row-gap: 0.25rem; - align-items: stretch; - position: relative; - padding-block: 1px; - max-width: 100%; - flex: 1 1 0; -} diff --git a/src/components/ModelingSidebar/ModelingSidebar.tsx b/src/components/ModelingSidebar/ModelingSidebar.tsx index 81a3ee202..77eeca84b 100644 --- a/src/components/ModelingSidebar/ModelingSidebar.tsx +++ b/src/components/ModelingSidebar/ModelingSidebar.tsx @@ -5,14 +5,12 @@ import { useCallback, useEffect, useMemo, - ReactNode, useContext, } from 'react' import { useHotkeys } from 'react-hotkeys-hook' import { SidebarAction, SidebarType, sidebarPanes } from './ModelingPanes' import Tooltip from 'components/Tooltip' import { ActionIcon } from 'components/ActionIcon' -import styles from './ModelingSidebar.module.css' import { ModelingPane } from './ModelingPane' import { isDesktop } from 'lib/isDesktop' import { useModelingContext } from 'hooks/useModelingContext' @@ -62,6 +60,7 @@ export function ModelingSidebar({ paneOpacity }: ModelingSidebarProps) { { id: 'export', title: 'Export part', + sidebarName: 'Export part', icon: 'floppyDiskArrow', keybinding: 'Ctrl + Shift + E', action: () => @@ -73,6 +72,7 @@ export function ModelingSidebar({ paneOpacity }: ModelingSidebarProps) { { id: 'make', title: 'Make part', + sidebarName: 'Make part', icon: 'printer3d', keybinding: 'Ctrl + Shift + M', // eslint-disable-next-line @typescript-eslint/no-misused-promises @@ -182,7 +182,7 @@ export function ModelingSidebar({ paneOpacity }: ModelingSidebarProps) { bottomRight: 'hidden', }} > -
+
    = 1 - ? `row-start-1 row-end-3` - : `hidden`) + 'ml-[-1px] col-start-2 col-span-1 flex flex-col items-stretch gap-2 ' + + (context.store?.openPanes.length >= 1 ? `w-full` : `hidden`) } > {filteredPanes @@ -249,13 +247,15 @@ export function ModelingSidebar({ paneOpacity }: ModelingSidebarProps) { {}} id={`${pane.id}-pane`} - title={pane.title} - Menu={pane.Menu} - onClose={() => togglePane(pane.id)} > {pane.Content instanceof Function ? ( - + togglePane(pane.id)} + /> ) : ( pane.Content )} @@ -271,8 +271,7 @@ interface ModelingPaneButtonProps extends React.HTMLAttributes { paneConfig: { id: string - title: ReactNode - sidebarName?: string + sidebarName: string icon: CustomIconName | IconDefinition keybinding: string iconClassName?: string @@ -301,10 +300,7 @@ function ModelingPaneButton({