From 8d9dbf36c3f58ad6eb6872f7f8c47e9906328d32 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Wed, 22 Jan 2025 20:58:53 -0500 Subject: [PATCH 01/43] Bump vite from 5.4.6 to 5.4.12 (#5129) Bumps [vite](https://github.com/vitejs/vite/tree/HEAD/packages/vite) from 5.4.6 to 5.4.12. - [Release notes](https://github.com/vitejs/vite/releases) - [Changelog](https://github.com/vitejs/vite/blob/v5.4.12/packages/vite/CHANGELOG.md) - [Commits](https://github.com/vitejs/vite/commits/v5.4.12/packages/vite) --- updated-dependencies: - dependency-name: vite dependency-type: direct:development ... Signed-off-by: dependabot[bot] Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> --- package.json | 2 +- yarn.lock | 8 ++++---- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/package.json b/package.json index 495ec14362..8425a6f18e 100644 --- a/package.json +++ b/package.json @@ -201,7 +201,7 @@ "ts-node": "^10.0.0", "typescript": "^5.7.3", "typescript-eslint": "^8.19.1", - "vite": "^5.4.6", + "vite": "^5.4.12", "vite-plugin-package-version": "^1.1.0", "vite-tsconfig-paths": "^4.3.2", "vitest": "^1.6.0", diff --git a/yarn.lock b/yarn.lock index 2a0ec7b35f..0147843d73 100644 --- a/yarn.lock +++ b/yarn.lock @@ -9461,10 +9461,10 @@ vite-tsconfig-paths@^4.3.2: globrex "^0.1.2" tsconfck "^3.0.3" -vite@^5.0.0, vite@^5.4.6: - version "5.4.6" - resolved "https://registry.yarnpkg.com/vite/-/vite-5.4.6.tgz#85a93a1228a7fb5a723ca1743e337a2588ed008f" - integrity sha512-IeL5f8OO5nylsgzd9tq4qD2QqI0k2CQLGrWD0rCN0EQJZpBK5vJAx0I+GDkMOXxQX/OfFHMuLIx6ddAxGX/k+Q== +vite@^5.0.0, vite@^5.4.12: + version "5.4.12" + resolved "https://registry.yarnpkg.com/vite/-/vite-5.4.12.tgz#627d12ff06de3942557dfe8632fd712a12a072c7" + integrity sha512-KwUaKB27TvWwDJr1GjjWthLMATbGEbeWYZIbGZ5qFIsgPP3vWzLu4cVooqhm5/Z2SPDUMjyPVjTztm5tYKwQxA== dependencies: esbuild "^0.21.3" postcss "^8.4.43" From 20016b101ea04b3c32b09bca26a26f022c7a3dc4 Mon Sep 17 00:00:00 2001 From: Kevin Nadro Date: Thu, 23 Jan 2025 09:45:45 -0500 Subject: [PATCH 02/43] Fix: Properly setting selection range when KCL editor is not mounted. (#4960) * fix: fixed selection range issue when doing a constraint when the KCL editor is closed * fix: linter and tsc errors * fix: trying to reuse logic instead? * fix: removed console log --- src/components/ModelingMachineProvider.tsx | 11 ++++++++- src/editor/manager.ts | 28 ++++++++++++---------- 2 files changed, 26 insertions(+), 13 deletions(-) diff --git a/src/components/ModelingMachineProvider.tsx b/src/components/ModelingMachineProvider.tsx index 09f8480ee3..fe1b20a5a6 100644 --- a/src/components/ModelingMachineProvider.tsx +++ b/src/components/ModelingMachineProvider.tsx @@ -388,7 +388,16 @@ export const ModelingMachineProvider = ({ } if (setSelections.selectionType === 'completeSelection') { - editorManager.selectRange(setSelections.selection) + const codeMirrorSelection = editorManager.createEditorSelection( + setSelections.selection + ) + kclEditorActor.send({ + type: 'setLastSelectionEvent', + data: { + codeMirrorSelection, + scrollIntoView: false, + }, + }) if (!sketchDetails) return { selectionRanges: setSelections.selection, diff --git a/src/editor/manager.ts b/src/editor/manager.ts index 2e8de86371..87d86259f6 100644 --- a/src/editor/manager.ts +++ b/src/editor/manager.ts @@ -315,6 +315,21 @@ export default class EditorManager { if (selections?.graphSelections?.length === 0) { return } + + if (!this._editorView) { + return + } + const codeBaseSelections = this.createEditorSelection(selections) + this._editorView.dispatch({ + selection: codeBaseSelections, + annotations: [ + updateOutsideEditorEvent, + Transaction.addToHistory.of(false), + ], + }) + } + + createEditorSelection(selections: Selections) { let codeBasedSelections = [] for (const selection of selections.graphSelections) { const safeEnd = Math.min( @@ -331,18 +346,7 @@ export default class EditorManager { .range[1] const safeEnd = Math.min(end, this._editorView?.state.doc.length || end) codeBasedSelections.push(EditorSelection.cursor(safeEnd)) - - if (!this._editorView) { - return - } - - this._editorView.dispatch({ - selection: EditorSelection.create(codeBasedSelections, 1), - annotations: [ - updateOutsideEditorEvent, - Transaction.addToHistory.of(false), - ], - }) + return EditorSelection.create(codeBasedSelections, 1) } // We will ONLY get here if the user called a select event. From 3adb42b5f2a6c3efeeb92b48203ee800965bed50 Mon Sep 17 00:00:00 2001 From: Pierre Jacquier Date: Thu, 23 Jan 2025 16:13:49 +0100 Subject: [PATCH 03/43] Supress stdio logs on e2e tests in CI (#5132) * WIP: pw log error only * Force tests to run on branch * Remove all page.on('console', console.log) * Remove context.console too * Add --quiet flag * Revert useless changes * Supress stdio logs on e2e tests in CI --- package.json | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/package.json b/package.json index 8425a6f18e..3054523a37 100644 --- a/package.json +++ b/package.json @@ -113,9 +113,9 @@ "test:unit": "vitest run --mode development --exclude **/kclSamples.test.ts", "test:unit:kcl-samples": "vitest run --mode development ./src/lang/kclSamples.test.ts", "test:playwright:electron": "playwright test --config=playwright.electron.config.ts --grep-invert='@snapshot'", - "test:playwright:electron:windows": "playwright test --config=playwright.electron.config.ts --grep-invert=\"@skipWin|@snapshot\"", - "test:playwright:electron:macos": "playwright test --config=playwright.electron.config.ts --grep-invert='@skipMacos|@snapshot'", - "test:playwright:electron:ubuntu": "playwright test --config=playwright.electron.config.ts --grep-invert='@skipLinux|@snapshot'", + "test:playwright:electron:windows": "playwright test --config=playwright.electron.config.ts --grep-invert=\"@skipWin|@snapshot\" --quiet", + "test:playwright:electron:macos": "playwright test --config=playwright.electron.config.ts --grep-invert='@skipMacos|@snapshot' --quiet", + "test:playwright:electron:ubuntu": "playwright test --config=playwright.electron.config.ts --grep-invert='@skipLinux|@snapshot' --quiet", "test:playwright:electron:local": "yarn tron:package && NODE_ENV=development playwright test --config=playwright.electron.config.ts --grep-invert='@snapshot'", "test:playwright:electron:windows:local": "yarn tron:package && NODE_ENV=development playwright test --config=playwright.electron.config.ts --grep-invert=\"@skipWin|@snapshot\"", "test:playwright:electron:macos:local": "yarn tron:package && NODE_ENV=development playwright test --config=playwright.electron.config.ts --grep-invert='@skipMacos|@snapshot'", From 8ef31a0be1f46734eb0c7fdda2aa418b28afa3ef Mon Sep 17 00:00:00 2001 From: Frank Noirot Date: Thu, 23 Jan 2025 10:25:21 -0500 Subject: [PATCH 04/43] Refactor: decouple command palette actor from React (#5108) * Convert commandBarMachine to standalone actor * Switch all uses of CommandBarProvider pattern to use actor and selector snapshots directly --- src/Router.tsx | 33 ++++++------- src/Toolbar.tsx | 6 +-- src/clientSideScene/ClientSideSceneComp.tsx | 8 ++-- src/clientSideScene/segments.ts | 3 +- .../CommandBar/CommandArgOptionInput.tsx | 6 +-- src/components/CommandBar/CommandBar.tsx | 24 +++++----- .../CommandBar/CommandBarArgument.tsx | 6 +-- .../CommandBar/CommandBarBasicInput.tsx | 6 +-- .../CommandBar/CommandBarHeader.tsx | 8 ++-- .../CommandBar/CommandBarKclInput.tsx | 6 +-- .../CommandBar/CommandBarProvider.tsx | 43 ----------------- .../CommandBar/CommandBarReview.tsx | 8 ++-- .../CommandBar/CommandBarSelectionInput.tsx | 6 +-- .../CommandBar/CommandBarTextareaInput.tsx | 6 +-- src/components/CommandBarOpenButton.tsx | 5 +- src/components/CommandComboBox.tsx | 7 ++- src/components/FileMachineProvider.tsx | 14 +++--- src/components/MachineManagerProvider.tsx | 4 +- src/components/ModelingMachineProvider.tsx | 18 ++++--- .../ModelingPanes/KclEditorMenu.tsx | 5 +- .../ModelingSidebar/ModelingSidebar.tsx | 7 ++- .../NetworkHealthIndicator.test.tsx | 5 +- src/components/ProjectSidebarMenu.test.tsx | 9 ++-- src/components/ProjectSidebarMenu.tsx | 19 ++++---- src/components/ProjectsContextProvider.tsx | 5 +- src/components/SettingsAuthProvider.tsx | 15 +++--- src/components/Stream.tsx | 5 +- src/components/ToastTextToCad.tsx | 9 +--- src/components/UserSidebarMenu.test.tsx | 5 +- src/editor/manager.ts | 12 ----- src/hooks/useCommandsContext.ts | 10 ---- src/hooks/useStateMachineCommands.ts | 10 ++-- src/lib/textToCad.ts | 6 --- src/lib/toolbar.ts | 47 +++++++++---------- src/machines/commandBarMachine.ts | 25 ++++++++-- src/routes/Home.tsx | 5 +- 36 files changed, 174 insertions(+), 242 deletions(-) delete mode 100644 src/components/CommandBar/CommandBarProvider.tsx delete mode 100644 src/hooks/useCommandsContext.ts diff --git a/src/Router.tsx b/src/Router.tsx index 82d42762e2..cd8ba8c4c4 100644 --- a/src/Router.tsx +++ b/src/Router.tsx @@ -31,7 +31,6 @@ import { settingsLoader, telemetryLoader, } from 'lib/routeLoaders' -import { CommandBarProvider } from 'components/CommandBar/CommandBarProvider' import SettingsAuthProvider from 'components/SettingsAuthProvider' import LspProvider from 'components/LspProvider' import { KclContextProvider } from 'lang/KclProvider' @@ -58,23 +57,21 @@ const router = createRouter([ /* Make sure auth is the outermost provider or else we will have * inefficient re-renders, use the react profiler to see. */ element: ( - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + ), errorElement: , children: [ diff --git a/src/Toolbar.tsx b/src/Toolbar.tsx index ea8a775d80..4e0e8385b4 100644 --- a/src/Toolbar.tsx +++ b/src/Toolbar.tsx @@ -2,7 +2,6 @@ import { useRef, useMemo, memo, useCallback, useState } from 'react' import { isCursorInSketchCommandRange } from 'lang/util' import { engineCommandManager, kclManager } from 'lib/singletons' import { useModelingContext } from 'hooks/useModelingContext' -import { useCommandsContext } from 'hooks/useCommandsContext' import { useNetworkContext } from 'hooks/useNetworkContext' import { NetworkHealthState } from 'hooks/useNetworkStatus' import { ActionButton } from 'components/ActionButton' @@ -22,13 +21,13 @@ import { } from 'lib/toolbar' import { isDesktop } from 'lib/isDesktop' import { openExternalBrowserIfDesktop } from 'lib/openWindow' +import { commandBarActor } from 'machines/commandBarMachine' export function Toolbar({ className = '', ...props }: React.HTMLAttributes) { const { state, send, context } = useModelingContext() - const { commandBarSend } = useCommandsContext() const iconClassName = 'group-disabled:text-chalkboard-50 !text-inherit dark:group-enabled:group-hover:!text-inherit' const bgClassName = '!bg-transparent' @@ -71,10 +70,9 @@ export function Toolbar({ () => ({ modelingState: state, modelingSend: send, - commandBarSend, sketchPathId, }), - [state, send, commandBarSend, sketchPathId] + [state, send, commandBarActor.send, sketchPathId] ) const tooltipContentClassName = !showRichContent diff --git a/src/clientSideScene/ClientSideSceneComp.tsx b/src/clientSideScene/ClientSideSceneComp.tsx index 5a1f20cd25..5132b431f5 100644 --- a/src/clientSideScene/ClientSideSceneComp.tsx +++ b/src/clientSideScene/ClientSideSceneComp.tsx @@ -46,8 +46,8 @@ import { } from 'lang/modifyAst' import { ActionButton } from 'components/ActionButton' import { err, reportRejection, trap } from 'lib/trap' -import { useCommandsContext } from 'hooks/useCommandsContext' import { Node } from 'wasm-lib/kcl/bindings/Node' +import { commandBarActor } from 'machines/commandBarMachine' function useShouldHideScene(): { hideClient: boolean; hideServer: boolean } { const [isCamMoving, setIsCamMoving] = useState(false) @@ -510,7 +510,6 @@ const ConstraintSymbol = ({ constrainInfo: ConstrainInfo verticalPosition: 'top' | 'bottom' }) => { - const { commandBarSend } = useCommandsContext() const { context } = useModelingContext() const varNameMap: { [key in ConstrainInfo['type']]: { @@ -630,7 +629,7 @@ const ConstraintSymbol = ({ // disabled={implicitDesc} TODO why does this change styles that are hard to override? onClick={toSync(async () => { if (!isConstrained) { - commandBarSend({ + commandBarActor.send({ type: 'Find and select command', data: { name: 'Constrain with named value', @@ -756,7 +755,6 @@ export const CamDebugSettings = () => { sceneInfra.camControls.reactCameraProperties ) const [fov, setFov] = useState(12) - const { commandBarSend } = useCommandsContext() useEffect(() => { sceneInfra.camControls.setReactCameraPropertiesCallback(setCamSettings) @@ -775,7 +773,7 @@ export const CamDebugSettings = () => { type="checkbox" checked={camSettings.type === 'perspective'} onChange={() => - commandBarSend({ + commandBarActor.send({ type: 'Find and select command', data: { groupId: 'settings', diff --git a/src/clientSideScene/segments.ts b/src/clientSideScene/segments.ts index 0a152a62b6..dfb3b6802b 100644 --- a/src/clientSideScene/segments.ts +++ b/src/clientSideScene/segments.ts @@ -61,6 +61,7 @@ import { SegmentInputs } from 'lang/std/stdTypes' import { err } from 'lib/trap' import { editorManager, sceneInfra } from 'lib/singletons' import { Selections } from 'lib/selections' +import { commandBarActor } from 'machines/commandBarMachine' interface CreateSegmentArgs { input: SegmentInputs @@ -847,7 +848,7 @@ function createLengthIndicator({ }) // Command Bar - editorManager.commandBarSend({ + commandBarActor.send({ type: 'Find and select command', data: { name: 'Constrain length', diff --git a/src/components/CommandBar/CommandArgOptionInput.tsx b/src/components/CommandBar/CommandArgOptionInput.tsx index 57ae4ac3e5..990a31162e 100644 --- a/src/components/CommandBar/CommandArgOptionInput.tsx +++ b/src/components/CommandBar/CommandArgOptionInput.tsx @@ -1,8 +1,8 @@ import { Combobox } from '@headlessui/react' import { useSelector } from '@xstate/react' import Fuse from 'fuse.js' -import { useCommandsContext } from 'hooks/useCommandsContext' import { CommandArgument, CommandArgumentOption } from 'lib/commandTypes' +import { commandBarActor, useCommandBarState } from 'machines/commandBarMachine' import { useEffect, useMemo, useRef, useState } from 'react' import { AnyStateMachine, StateFrom } from 'xstate' @@ -23,7 +23,7 @@ function CommandArgOptionInput({ placeholder?: string }) { const actorContext = useSelector(arg.machineActor, contextSelector) - const { commandBarSend, commandBarState } = useCommandsContext() + const commandBarState = useCommandBarState() const resolvedOptions = useMemo( () => typeof arg.options === 'function' @@ -142,7 +142,7 @@ function CommandArgOptionInput({ className="flex-grow px-2 py-1 border-b border-b-chalkboard-100 dark:border-b-chalkboard-80 !bg-transparent focus:outline-none" onKeyDown={(event) => { if (event.metaKey && event.key === 'k') - commandBarSend({ type: 'Close' }) + commandBarActor.send({ type: 'Close' }) if (event.key === 'Backspace' && !event.currentTarget.value) { stepBack() } diff --git a/src/components/CommandBar/CommandBar.tsx b/src/components/CommandBar/CommandBar.tsx index b2a30a8b9d..c9c819737b 100644 --- a/src/components/CommandBar/CommandBar.tsx +++ b/src/components/CommandBar/CommandBar.tsx @@ -1,6 +1,5 @@ import { Dialog, Popover, Transition } from '@headlessui/react' import { Fragment, useEffect } from 'react' -import { useCommandsContext } from 'hooks/useCommandsContext' import CommandBarArgument from './CommandBarArgument' import CommandComboBox from '../CommandComboBox' import CommandBarReview from './CommandBarReview' @@ -8,12 +7,13 @@ import { useLocation } from 'react-router-dom' import useHotkeyWrapper from 'lib/hotkeyWrapper' import { CustomIcon } from 'components/CustomIcon' import Tooltip from 'components/Tooltip' +import { commandBarActor, useCommandBarState } from 'machines/commandBarMachine' export const COMMAND_PALETTE_HOTKEY = 'mod+k' export const CommandBar = () => { const { pathname } = useLocation() - const { commandBarState, commandBarSend } = useCommandsContext() + const commandBarState = useCommandBarState() const { context: { selectedCommand, currentArgument, commands }, } = commandBarState @@ -23,16 +23,16 @@ export const CommandBar = () => { // Close the command bar when navigating useEffect(() => { if (commandBarState.matches('Closed')) return - commandBarSend({ type: 'Close' }) + commandBarActor.send({ type: 'Close' }) }, [pathname]) // Hook up keyboard shortcuts useHotkeyWrapper([COMMAND_PALETTE_HOTKEY], () => { if (commandBarState.context.commands.length === 0) return if (commandBarState.matches('Closed')) { - commandBarSend({ type: 'Open' }) + commandBarActor.send({ type: 'Open' }) } else { - commandBarSend({ type: 'Close' }) + commandBarActor.send({ type: 'Close' }) } }) @@ -52,14 +52,14 @@ export const CommandBar = () => { ...entries[entries.length - 1][1], } - commandBarSend({ + commandBarActor.send({ type: 'Edit argument', data: { arg: currentArg, }, }) } else { - commandBarSend({ type: 'Deselect command' }) + commandBarActor.send({ type: 'Deselect command' }) } } else { const entries = Object.entries(selectedCommand?.args || {}) @@ -68,9 +68,9 @@ export const CommandBar = () => { ) if (index === 0) { - commandBarSend({ type: 'Deselect command' }) + commandBarActor.send({ type: 'Deselect command' }) } else { - commandBarSend({ + commandBarActor.send({ type: 'Change current argument', data: { arg: { name: entries[index - 1][0], ...entries[index - 1][1] }, @@ -85,14 +85,14 @@ export const CommandBar = () => { show={!commandBarState.matches('Closed') || false} afterLeave={() => { if (selectedCommand?.onCancel) selectedCommand.onCancel() - commandBarSend({ type: 'Clear' }) + commandBarActor.send({ type: 'Clear' }) }} as={Fragment} > { - commandBarSend({ type: 'Close' }) + commandBarActor.send({ type: 'Close' }) }} className={ 'fixed inset-0 z-50 overflow-y-auto pb-4 pt-1 ' + @@ -122,7 +122,7 @@ export const CommandBar = () => { ) )}