tmp media stream fix

.github/ISSUE_TEMPLATE/cryptic_error.yml

@@ -1,37 +0,0 @@
-name: Cryptic KCL Error
-description: File a bug report for source code that produces a confusing error
-title: "[CRYPTIC]: "
-labels: ["cryptic-error"]
-assignees: []
-body:
-  - type: markdown
-    attributes:
-      value: "Thank you for taking the time to report a confusing error. Please provide as much information as possible to help us resolve it."
-
-  - type: textarea
-    id: kcl
-    attributes:
-      label: Paste minimal KCL source that produces a cryptic error
-      description: Minimal KCL reproducer that produces a cryptic error
-      placeholder: "const ..."
-      render: javascript
-    validations:
-      required: true
-
-  - type: textarea
-    id: expected-behavior
-    attributes:
-      label: Expected Behavior
-      description: Description of what you expected to happen (if you know).
-      placeholder: "I expected that..."
-    validations:
-      required: false
-
-  - type: textarea
-    id: additional-context
-    attributes:
-      label: Additional Context
-      description: Add any other context about the problem here.
-      placeholder: "Anything else you want to add..."
-    validations:
-      required: false

README.md

@@ -124,40 +124,20 @@ Before you submit a contribution PR to this repo, please ensure that:
 
 ## Release a new version
 
-#### 1. Bump the versions by running `./make-release.sh` and create a Cut Release PR
+1. Bump the versions by running `./make-realease.sh` while on a fresh pull of main
 
-That will create the branch with the updated json files for you:
-- run `./make-release.sh` or `./make-release.sh patch` for a patch update;
-- run `./make-release.sh minor` for minor; or
-- run `./make-release.sh major` for major.
+That will create the branch with the updated json files for you.
+run `./make-release.sh` for a patch update
+run `./make-release.sh "minor"` for minor
+run `./make-release.sh "major"` for major
 
-After it runs you should just need the push the branch and open a PR.
+After it runs you should just need to push the push the branch and open a PR (it will suggest a changelog for you too, delete any that are not user facing)
 
-**Important:** It needs to be prefixed with `Cut release v` to build in release mode and a few other things to test in the best context possible, the intent would be for instance to have `Cut release v1.2.3` for the `v1.2.3` release candidate.
+The PR may serve as a place to discuss the human-readable changelog and extra QA. 
 
-The PR may then serve as a place to discuss the human-readable changelog and extra QA. The `make-release.sh` tool suggests a changelog for you too to be used as PR description, just make sure to delete lines that are not user facing.
-
-#### 2. Smoke test artifacts from the Cut Release PR
-
-The release builds can be find under the `artifact` zip, at the very bottom of the `ci` action page for each commit on this branch.
-
-We don't have a strict process, but click around and check for anything obvious, posting results as comments in the Cut Release PR.
-
-The other `ci` output in Cut Release PRs is `updater-test`, because we don't have a way to test this fully automated, we have a semi-automated process. Download updater-test zip file, install the app, run it, expect an updater prompt to a dummy v0.99.99, install it and check that the app comes back at that version (on both macOS and Windows).
-
-#### 3. Merge the Cut Release PR
-
-This will kick the `create-release` action, that creates a _Draft_ release out of this Cut Release PR merge after less than a minute, with the new version as title and Cut Release PR as description.
-
-
-#### 4. Publish the release
-
-Head over to https://github.com/KittyCAD/modeling-app/releases, the draft release corresponding to the merged Cut Release PR should show up at the top as _Draft_. Click on it, verify the content, and hit _Publish_.
-
-#### 5. Profit
-
-A new Action kicks in at https://github.com/KittyCAD/modeling-app/actions, which can be found under `release` event filter.
+2. Merge the PR
 
+3. Profit (A new Action kicks in at https://github.com/KittyCAD/modeling-app/actions if the PR was correctly named)
 
 ## Fuzzing the parser
 

e2e/playwright/flow-tests.spec.ts

@@ -3099,49 +3099,6 @@ const sketch002 = startSketchOn(extrude001, $seg01)
     ).not.toBeDisabled()
   })
 
-  test('Fillet button states test', async ({ page }) => {
-    const u = await getUtils(page)
-    await page.addInitScript(async () => {
-      localStorage.setItem(
-        'persistCode',
-        `const sketch001 = startSketchOn('XZ')
-  |> startProfileAt([-5, -5], %)
-  |> line([0, 10], %)
-  |> line([10, 0], %)
-  |> line([0, -10], %)
-  |> lineTo([profileStartX(%), profileStartY(%)], %)
-  |> close(%)`
-      )
-    })
-
-    await page.setViewportSize({ width: 1000, height: 500 })
-    await u.waitForAuthSkipAppStart()
-    await u.openDebugPanel()
-    await u.expectCmdLog('[data-message-type="execution-done"]')
-    await u.closeDebugPanel()
-
-    const selectSegment = () => page.getByText(`line([10, 0], %)`).click()
-    const selectClose = () => page.getByText(`close(%)`).click()
-    const clickEmpty = () => page.mouse.click(950, 100)
-
-    // expect fillet button without any bodies in the scene
-    await selectSegment()
-    await expect(page.getByRole('button', { name: 'Fillet' })).toBeDisabled()
-    await clickEmpty()
-    await expect(page.getByRole('button', { name: 'Fillet' })).toBeDisabled()
-
-    // test fillet button with the body in the scene
-    const codeToAdd = `${await u.codeLocator.allInnerTexts()}
-const extrude001 = extrude(10, sketch001)`
-    await u.codeLocator.fill(codeToAdd)
-    await selectSegment()
-    await expect(page.getByRole('button', { name: 'Fillet' })).toBeEnabled()
-    await selectClose()
-    await expect(page.getByRole('button', { name: 'Fillet' })).toBeDisabled()
-    await clickEmpty()
-    await expect(page.getByRole('button', { name: 'Fillet' })).toBeEnabled()
-  })
-
   const removeAfterFirstParenthesis = (inputString: string) => {
     const index = inputString.indexOf('(')
     if (index !== -1) {
@@ -3543,62 +3500,11 @@ test.describe('Command bar tests', () => {
       `const extrude001 = extrude(${KCL_DEFAULT_LENGTH}, sketch001)`
     )
   })
-
-  test('Fillet from command bar', async ({ page }) => {
-    await page.addInitScript(async () => {
-      localStorage.setItem(
-        'persistCode',
-        `const sketch001 = startSketchOn('XY')
-  |> startProfileAt([-5, -5], %)
-  |> line([0, 10], %)
-  |> line([10, 0], %)
-  |> line([0, -10], %)
-  |> lineTo([profileStartX(%), profileStartY(%)], %)
-  |> close(%)
-const extrude001 = extrude(-10, sketch001)`
-      )
-    })
-
-    const u = await getUtils(page)
-    await page.setViewportSize({ width: 1000, height: 500 })
-    await u.waitForAuthSkipAppStart()
-    await u.openDebugPanel()
-    await u.expectCmdLog('[data-message-type="execution-done"]')
-    await u.closeDebugPanel()
-
-    const selectSegment = () => page.getByText(`line([0, -10], %)`).click()
-
-    await selectSegment()
-    await page.waitForTimeout(100)
-    await page.getByRole('button', { name: 'Fillet' }).click()
-    await page.waitForTimeout(100)
-    await page.keyboard.press('Enter')
-    await page.waitForTimeout(100)
-    await page.keyboard.press('Enter')
-    await page.waitForTimeout(100)
-    await expect(page.locator('.cm-activeLine')).toContainText(
-      `fillet({ radius: ${KCL_DEFAULT_LENGTH}, tags: [seg01] }, %)`
-    )
-  })
-
-  test('Command bar can change a setting, and switch back and forth between arguments', async ({
-    page,
-  }) => {
+  test('Command bar works and can change a setting', async ({ page }) => {
     const u = await getUtils(page)
     await page.setViewportSize({ width: 1200, height: 500 })
     await u.waitForAuthSkipAppStart()
 
-    const commandBarButton = page.getByRole('button', { name: 'Commands' })
-    const cmdSearchBar = page.getByPlaceholder('Search commands')
-    const themeOption = page.getByRole('option', {
-      name: 'theme',
-      exact: false,
-    })
-    const commandLevelArgButton = page.getByRole('button', { name: 'level' })
-    const commandThemeArgButton = page.getByRole('button', { name: 'value' })
-    // This selector changes after we set the setting
-    let commandOptionInput = page.getByPlaceholder('Select an option')
-
     await expect(
       page.getByRole('button', { name: 'Start Sketch' })
     ).not.toBeDisabled()
@@ -3609,17 +3515,23 @@ const extrude001 = extrude(-10, sketch001)`
       .or(page.getByRole('button', { name: '⌘K' }))
       .click()
 
+    let cmdSearchBar = page.getByPlaceholder('Search commands')
     await expect(cmdSearchBar).toBeVisible()
     await page.keyboard.press('Escape')
+    cmdSearchBar = page.getByPlaceholder('Search commands')
     await expect(cmdSearchBar).not.toBeVisible()
 
     // Now try the same, but with the keyboard shortcut, check focus
     await page.keyboard.press('Meta+K')
+    cmdSearchBar = page.getByPlaceholder('Search commands')
     await expect(cmdSearchBar).toBeVisible()
     await expect(cmdSearchBar).toBeFocused()
 
     // Try typing in the command bar
-    await cmdSearchBar.fill('theme')
+    await page.keyboard.type('theme')
+    const themeOption = page.getByRole('option', {
+      name: 'Settings · app · theme',
+    })
     await expect(themeOption).toBeVisible()
     await themeOption.click()
     const themeInput = page.getByPlaceholder('Select an option')
@@ -3641,24 +3553,6 @@ const extrude001 = extrude(-10, sketch001)`
     ).toBeVisible()
     // Check that the theme changed
     await expect(page.locator('body')).not.toHaveClass(`body-bg dark`)
-
-    commandOptionInput = page.getByPlaceholder('system')
-
-    // Test case for https://github.com/KittyCAD/modeling-app/issues/2882
-    await commandBarButton.click()
-    await cmdSearchBar.focus()
-    await cmdSearchBar.fill('theme')
-    await themeOption.click()
-    await expect(commandThemeArgButton).toBeDisabled()
-    await commandOptionInput.focus()
-    await commandOptionInput.fill('lig')
-    await commandLevelArgButton.click()
-    await expect(commandLevelArgButton).toBeDisabled()
-
-    // Test case for https://github.com/KittyCAD/modeling-app/issues/2881
-    await commandThemeArgButton.click()
-    await expect(commandThemeArgButton).toBeDisabled()
-    await expect(commandLevelArgButton).toHaveText('level: project')
   })
 
   test('Command bar keybinding works from code editor and can change a setting', async ({
@@ -3683,7 +3577,7 @@ const extrude001 = extrude(-10, sketch001)`
     await expect(cmdSearchBar).toBeFocused()
 
     // Try typing in the command bar
-    await cmdSearchBar.fill('theme')
+    await page.keyboard.type('theme')
     const themeOption = page.getByRole('option', {
       name: 'Settings · app · theme',
     })
@@ -3754,9 +3648,7 @@ const extrude001 = extrude(-10, sketch001)`
     await page.mouse.click(700, 200)
 
     // Assert that we're on the distance step
-    await expect(
-      page.getByRole('button', { name: 'distance', exact: false })
-    ).toBeDisabled()
+    await expect(page.getByRole('button', { name: 'distance' })).toBeDisabled()
 
     // Assert that the an alternative variable name is chosen,
     // since the default variable name is already in use (distance)
@@ -3771,12 +3663,11 @@ const extrude001 = extrude(-10, sketch001)`
 
     // Review step and argument hotkeys
     await expect(submitButton).toBeEnabled()
-    await expect(submitButton).toBeFocused()
-    await submitButton.press('Backspace')
+    await page.keyboard.press('Backspace')
 
     // Assert we're back on the distance step
     await expect(
-      page.getByRole('button', { name: 'distance', exact: false })
+      page.getByRole('button', { name: 'Distance 5', exact: false })
     ).toBeDisabled()
 
     await continueButton.click()
@@ -3800,47 +3691,6 @@ const extrude001 = extrude(distance001, sketch001)`.replace(
       ) // remove newlines
     )
   })
-
-  test('Can switch between sketch tools via command bar', async ({ page }) => {
-    const u = await getUtils(page)
-    await page.setViewportSize({ width: 1200, height: 500 })
-    await u.waitForAuthSkipAppStart()
-
-    const sketchButton = page.getByRole('button', { name: 'Start Sketch' })
-    const cmdBarButton = page.getByRole('button', { name: 'Commands' })
-    const rectangleToolCommand = page.getByRole('option', {
-      name: 'Rectangle',
-    })
-    const rectangleToolButton = page.getByRole('button', { name: 'Rectangle' })
-    const lineToolCommand = page.getByRole('option', { name: 'Line' })
-    const lineToolButton = page.getByRole('button', { name: 'Line' })
-    const arcToolCommand = page.getByRole('option', { name: 'Tangential Arc' })
-    const arcToolButton = page.getByRole('button', { name: 'Tangential Arc' })
-
-    // Start a sketch
-    await sketchButton.click()
-    await page.mouse.click(700, 200)
-
-    // Switch between sketch tools via the command bar
-    await expect(lineToolButton).toHaveAttribute('aria-pressed', 'true')
-    await cmdBarButton.click()
-    await rectangleToolCommand.click()
-    await expect(rectangleToolButton).toHaveAttribute('aria-pressed', 'true')
-    await cmdBarButton.click()
-    await lineToolCommand.click()
-    await expect(lineToolButton).toHaveAttribute('aria-pressed', 'true')
-
-    // Click in the scene a couple times to draw a line
-    // so tangential arc is valid
-    await page.mouse.click(700, 200)
-    await page.mouse.move(700, 300, { steps: 5 })
-    await page.mouse.click(700, 300)
-
-    // switch to tangential arc via command bar
-    await cmdBarButton.click()
-    await arcToolCommand.click()
-    await expect(arcToolButton).toHaveAttribute('aria-pressed', 'true')
-  })
 })
 
 test.describe('Regression tests', () => {
@@ -4792,10 +4642,10 @@ test.describe('Sketch tests', () => {
     // click extrude
     await page.getByRole('button', { name: 'Extrude' }).click()
 
-    // sketch selection should already have been made. "Selection: 1 face" only show up when the selection has been made already
+    // sketch selection should already have been made. "Selection 1 face" only show up when the selection has been made already
     // otherwise the cmdbar would be waiting for a selection.
     await expect(
-      page.getByRole('button', { name: 'selection : 1 face', exact: false })
+      page.getByRole('button', { name: 'Selection 1 face' })
     ).toBeVisible()
   })
   test("Existing sketch with bad code delete user's code", async ({ page }) => {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "untitled-app",
-  "version": "0.24.3",
+  "version": "0.24.0",
   "private": true,
   "dependencies": {
     "@codemirror/autocomplete": "^6.17.0",

packages/codemirror-lsp-client/src/plugin/lsp.ts

@@ -30,7 +30,7 @@ import { URI } from 'vscode-uri'
 import { LanguageServerClient } from '../client'
 import { CompletionItemKindMap } from './autocomplete'
 import { addToken, SemanticToken } from './semantic-tokens'
-import { posToOffset, formatMarkdownContents } from './util'
+import { deferExecution, posToOffset, formatMarkdownContents } from './util'
 import lspAutocompleteExt from './autocomplete'
 import lspHoverExt from './hover'
 import lspFormatExt from './format'
@@ -93,10 +93,23 @@ export class LanguageServerPlugin implements PluginValue {
   private doSemanticTokens: boolean = false
   private doFoldingRanges: boolean = false
 
-  // When a doc update needs to be sent to the server, this holds the
-  // timeout handle for it. When null, the server has the up-to-date
-  // document.
-  private sendScheduled: number | null = null
+  private _defferer = deferExecution((code: string) => {
+    try {
+      // Update the state (not the editor) with the new code.
+      this.client.textDocumentDidChange({
+        textDocument: {
+          uri: this.getDocUri(),
+          version: this.documentVersion++,
+        },
+        contentChanges: [{ text: code }],
+      })
+
+      this.requestSemanticTokens()
+      this.updateFoldingRanges()
+    } catch (e) {
+      console.error(e)
+    }
+  }, this.changesDelay)
 
   constructor(options: LanguageServerOptions, private view: EditorView) {
     this.client = options.client
@@ -139,9 +152,14 @@ export class LanguageServerPlugin implements PluginValue {
   }
 
   update(viewUpdate: ViewUpdate) {
-    if (viewUpdate.docChanged) {
-      this.scheduleSendDoc()
+    // If the doc didn't change we can return early.
+    if (!viewUpdate.docChanged) {
+      return
     }
+
+    this.sendChange({
+      documentText: viewUpdate.state.doc.toString(),
+    })
   }
 
   destroy() {
@@ -166,6 +184,16 @@ export class LanguageServerPlugin implements PluginValue {
     this.updateFoldingRanges()
   }
 
+  async sendChange({ documentText }: { documentText: string }) {
+    if (!this.client.ready) return
+
+    this._defferer(documentText)
+  }
+
+  requestDiagnostics() {
+    this.sendChange({ documentText: this.getDocText() })
+  }
+
   async requestHoverTooltip(
     view: EditorView,
     { line, character }: { line: number; character: number }
@@ -176,7 +204,7 @@ export class LanguageServerPlugin implements PluginValue {
     )
       return null
 
-    this.ensureDocSent()
+    this.sendChange({ documentText: this.getDocText() })
     const result = await this.client.textDocumentHover({
       textDocument: { uri: this.getDocUri() },
       position: { line, character },
@@ -199,42 +227,6 @@ export class LanguageServerPlugin implements PluginValue {
     return { pos, end, create: (view) => ({ dom }), above: true }
   }
 
-  scheduleSendDoc() {
-    if (this.sendScheduled != null) window.clearTimeout(this.sendScheduled)
-    this.sendScheduled = window.setTimeout(
-      () => this.sendDoc(),
-      this.changesDelay
-    )
-  }
-
-  sendDoc() {
-    if (this.sendScheduled != null) {
-      window.clearTimeout(this.sendScheduled)
-      this.sendScheduled = null
-    }
-
-    if (!this.client.ready) return
-    try {
-      // Update the state (not the editor) with the new code.
-      this.client.textDocumentDidChange({
-        textDocument: {
-          uri: this.getDocUri(),
-          version: this.documentVersion++,
-        },
-        contentChanges: [{ text: this.view.state.doc.toString() }],
-      })
-
-      this.requestSemanticTokens()
-      this.updateFoldingRanges()
-    } catch (e) {
-      console.error(e)
-    }
-  }
-
-  ensureDocSent() {
-    if (this.sendScheduled != null) this.sendDoc()
-  }
-
   async getFoldingRanges(): Promise<LSP.FoldingRange[] | null> {
     if (
       !this.doFoldingRanges ||
@@ -292,7 +284,13 @@ export class LanguageServerPlugin implements PluginValue {
     )
       return null
 
-    this.ensureDocSent()
+    this.client.textDocumentDidChange({
+      textDocument: {
+        uri: this.getDocUri(),
+        version: this.documentVersion++,
+      },
+      contentChanges: [{ text: this.getDocText() }],
+    })
 
     const result = await this.client.textDocumentFormatting({
       textDocument: { uri: this.getDocUri() },
@@ -332,7 +330,9 @@ export class LanguageServerPlugin implements PluginValue {
     )
       return null
 
-    this.ensureDocSent()
+    this.sendChange({
+      documentText: context.state.doc.toString(),
+    })
 
     const result = await this.client.textDocumentCompletion({
       textDocument: { uri: this.getDocUri() },

src-tauri/tauri.conf.json

@@ -80,5 +80,5 @@
     }
   },
   "productName": "Zoo Modeling App",
-  "version": "0.24.3"
+  "version": "0.24.0"
 }

src/App.tsx

@@ -26,6 +26,7 @@ import useHotkeyWrapper from 'lib/hotkeyWrapper'
 import Gizmo from 'components/Gizmo'
 import { CoreDumpManager } from 'lib/coredump'
 import { UnitsMenu } from 'components/UnitsMenu'
+import { useAppState } from 'AppState'
 
 export function App() {
   useRefreshSettings(paths.FILE + 'SETTINGS')
@@ -44,7 +45,9 @@ export function App() {
   }, [projectName, projectPath])
 
   useHotKeyListener()
-  const { context, state } = useModelingContext()
+  const { context } = useModelingContext()
+  const { streamDimensions, didDragInStream, buttonDownInStream } =
+    useAppState()
 
   const { auth, settings } = useSettingsAuthContext()
   const token = auth?.context?.token
@@ -57,6 +60,7 @@ export function App() {
   const {
     app: { onboardingStatus },
   } = settings.context
+  const { state } = useModelingContext()
 
   useHotkeys('backspace', (e) => {
     e.preventDefault()
@@ -73,7 +77,7 @@ export function App() {
     (p) => p === onboardingStatus.current
   )
     ? 'opacity-20'
-    : context.store?.didDragInStream
+    : didDragInStream
     ? 'opacity-40'
     : ''
 
@@ -91,11 +95,11 @@ export function App() {
       clientX: e.clientX,
       clientY: e.clientY,
       el: e.currentTarget,
-      ...context.store?.streamDimensions,
+      ...streamDimensions,
     })
 
     const newCmdId = uuidv4()
-    if (context.store?.buttonDownInStream === undefined) {
+    if (buttonDownInStream === undefined) {
       debounceSocketSend({
         type: 'modeling_cmd_req',
         cmd: {
@@ -117,7 +121,7 @@ export function App() {
         className={
           'transition-opacity transition-duration-75 ' +
           paneOpacity +
-          (context.store?.buttonDownInStream ? ' pointer-events-none' : '')
+          (buttonDownInStream ? ' pointer-events-none' : '')
         }
         project={{ project, file }}
         enableMenu={true}

src/AppState.tsx

@@ -1,4 +1,10 @@
-import { createContext, useContext, useState, ReactNode } from 'react'
+import {
+  createContext,
+  useContext,
+  useState,
+  ReactNode,
+  useEffect,
+} from 'react'
 
 /*
 
@@ -11,11 +17,23 @@ Please do not fill this up with junk.
 interface AppState {
   isStreamReady: boolean
   setAppState: (newAppState: Partial<AppState>) => void
+
+  mediaStream?: MediaStream
+  buttonDownInStream: number | undefined
+  didDragInStream: boolean
+  streamDimensions: { streamWidth: number; streamHeight: number }
+  // openPanes: SidebarType[]
 }
 
 const AppStateContext = createContext<AppState>({
   isStreamReady: false,
   setAppState: () => {},
+
+  buttonDownInStream: undefined,
+  didDragInStream: false,
+  streamDimensions: { streamWidth: 1280, streamHeight: 720 },
+  mediaStream: undefined,
+  // openPanes: persistedContext.openPanes || ['code'],
 })
 
 export const useAppState = () => useContext(AppStateContext)
@@ -24,47 +42,38 @@ export const AppStateProvider = ({ children }: { children: ReactNode }) => {
   const [appState, _setAppState] = useState<AppState>({
     isStreamReady: false,
     setAppState: () => {},
+
+    buttonDownInStream: undefined,
+    didDragInStream: false,
+    streamDimensions: { streamWidth: 1280, streamHeight: 720 },
+    mediaStream: undefined,
+    // openPanes: persistedContext.openPanes || ['code'],
   })
-  const setAppState = (newAppState: Partial<AppState>) =>
-    _setAppState({ ...appState, ...newAppState })
+  useEffect(() => {
+    // console.log('appState change', appState)
+  }, [appState])
+  const setAppState = (newAppState: Partial<AppState>) => {
+    // console.log('appstate', newAppState)
+    _setAppState({
+      ...appState,
+      ...newAppState,
+      mediaStream: newAppState.mediaStream || appState.mediaStream,
+    })
+  }
 
   return (
     <AppStateContext.Provider
       value={{
         isStreamReady: appState.isStreamReady,
         setAppState,
+
+        mediaStream: appState.mediaStream,
+        buttonDownInStream: appState.buttonDownInStream,
+        didDragInStream: appState.didDragInStream,
+        streamDimensions: appState.streamDimensions,
       }}
     >
       {children}
     </AppStateContext.Provider>
   )
 }
-
-interface AppStream {
-  mediaStream: MediaStream
-  setMediaStream: (mediaStream: MediaStream) => void
-}
-
-const AppStreamContext = createContext<AppStream>({
-  mediaStream: undefined as unknown as MediaStream,
-  setMediaStream: () => {},
-})
-
-export const useAppStream = () => useContext(AppStreamContext)
-
-export const AppStreamProvider = ({ children }: { children: ReactNode }) => {
-  const [mediaStream, setMediaStream] = useState<MediaStream>(
-    undefined as unknown as MediaStream
-  )
-
-  return (
-    <AppStreamContext.Provider
-      value={{
-        mediaStream,
-        setMediaStream,
-      }}
-    >
-      {children}
-    </AppStreamContext.Provider>
-  )
-}

src/Router.tsx

@@ -49,17 +49,17 @@ const router = createBrowserRouter([
     /* Make sure auth is the outermost provider or else we will have
      * inefficient re-renders, use the react profiler to see. */
     element: (
-      <CommandBarProvider>
-        <SettingsAuthProvider>
-          <LspProvider>
-            <KclContextProvider>
-              <AppStateProvider>
+      <AppStateProvider>
+        <CommandBarProvider>
+          <SettingsAuthProvider>
+            <LspProvider>
+              <KclContextProvider>
                 <Outlet />
-              </AppStateProvider>
-            </KclContextProvider>
-          </LspProvider>
-        </SettingsAuthProvider>
-      </CommandBarProvider>
+              </KclContextProvider>
+            </LspProvider>
+          </SettingsAuthProvider>
+        </CommandBarProvider>
+      </AppStateProvider>
     ),
     errorElement: <ErrorPage />,
     children: [

src/Toolbar.tsx

@@ -16,7 +16,6 @@ import {
   canRectangleTool,
   isEditingExistingSketch,
 } from 'machines/modelingMachine'
-import { DEV } from 'env'
 
 export function Toolbar({
   className = '',
@@ -61,7 +60,7 @@ export function Toolbar({
         ? send('CancelSketch')
         : send({
             type: 'change tool',
-            data: { tool: 'line' },
+            data: 'line',
           }),
     { enabled: !disableLineButton, scopes: ['sketch'] }
   )
@@ -76,7 +75,7 @@ export function Toolbar({
         ? send('CancelSketch')
         : send({
             type: 'change tool',
-            data: { tool: 'tangentialArc' },
+            data: 'tangentialArc',
           }),
     { enabled: !disableTangentialArc, scopes: ['sketch'] }
   )
@@ -90,7 +89,7 @@ export function Toolbar({
         ? send('CancelSketch')
         : send({
             type: 'change tool',
-            data: { tool: 'rectangle' },
+            data: 'rectangle',
           }),
     { enabled: !disableRectangle, scopes: ['sketch'] }
   )
@@ -119,16 +118,6 @@ export function Toolbar({
       }),
     { enabled: !disableAllButtons, scopes: ['modeling'] }
   )
-  const disableFillet = !state.can('Fillet') || disableAllButtons
-  useHotkeys(
-    'f',
-    () =>
-      commandBarSend({
-        type: 'Find and select command',
-        data: { name: 'Fillet', groupId: 'modeling' },
-      }),
-    { enabled: !disableFillet, scopes: ['modeling'] }
-  )
 
   function handleToolbarButtonsWheelEvent(ev: WheelEvent<HTMLSpanElement>) {
     const span = toolbarButtonsRef.current
@@ -274,7 +263,7 @@ export function Toolbar({
                     ? send('CancelSketch')
                     : send({
                         type: 'change tool',
-                        data: { tool: 'line' },
+                        data: 'line',
                       })
                 }
                 aria-pressed={state?.matches('Sketch.Line tool')}
@@ -304,7 +293,7 @@ export function Toolbar({
                     ? send('CancelSketch')
                     : send({
                         type: 'change tool',
-                        data: { tool: 'tangentialArc' },
+                        data: 'tangentialArc',
                       })
                 }
                 aria-pressed={state.matches('Sketch.Tangential arc to')}
@@ -334,7 +323,7 @@ export function Toolbar({
                     ? send('CancelSketch')
                     : send({
                         type: 'change tool',
-                        data: { tool: 'rectangle' },
+                        data: 'rectangle',
                       })
                 }
                 aria-pressed={state.matches('Sketch.Rectangle tool')}
@@ -415,36 +404,6 @@ export function Toolbar({
             </ActionButton>
           </li>
         )}
-        {state.matches('idle') && (DEV || (window as any)._enableFillet) && (
-          <li className="contents">
-            <ActionButton
-              className={buttonClassName}
-              Element="button"
-              onClick={() =>
-                commandBarSend({
-                  type: 'Find and select command',
-                  data: { name: 'Fillet', groupId: 'modeling' },
-                })
-              }
-              disabled={disableFillet}
-              title={disableFillet ? 'fillet' : "edge can't be filleted"}
-              iconStart={{
-                icon: 'fillet', // todo: add fillet icon
-                iconClassName,
-                bgClassName,
-              }}
-            >
-              Fillet
-              <Tooltip
-                delay={1250}
-                position="bottom"
-                className="!px-2 !text-xs"
-              >
-                Shortcut: F
-              </Tooltip>
-            </ActionButton>
-          </li>
-        )}
       </ul>
     </menu>
   )

src/components/CommandBar/CommandArgOptionInput.tsx

@@ -41,7 +41,6 @@ function CommandArgOptionInput({
   )
   const inputRef = useRef<HTMLInputElement>(null)
   const formRef = useRef<HTMLFormElement>(null)
-  const [shouldSubmitOnChange, setShouldSubmitOnChange] = useState(false)
   const [selectedOption, setSelectedOption] = useState<
     CommandArgumentOption<unknown>
   >(currentOption || resolvedOptions[0])
@@ -83,10 +82,8 @@ function CommandArgOptionInput({
     // We deal with the whole option object internally
     setSelectedOption(option)
 
-    // But we only submit the value itself
-    if (shouldSubmitOnChange) {
-      onSubmit(option.value)
-    }
+    // But we only submit the value
+    onSubmit(option.value)
   }
 
   function handleSubmit(e: React.FormEvent<HTMLFormElement>) {
@@ -97,18 +94,7 @@ function CommandArgOptionInput({
   }
 
   return (
-    <form
-      id="arg-form"
-      onSubmit={handleSubmit}
-      ref={formRef}
-      onKeyDownCapture={(e) => {
-        if (e.key === 'Enter') {
-          setShouldSubmitOnChange(true)
-        } else {
-          setShouldSubmitOnChange(false)
-        }
-      }}
-    >
+    <form id="arg-form" onSubmit={handleSubmit} ref={formRef}>
       <Combobox
         value={selectedOption}
         onChange={handleSelectOption}
@@ -132,12 +118,6 @@ function CommandArgOptionInput({
               if (event.key === 'Backspace' && !event.currentTarget.value) {
                 stepBack()
               }
-
-              if (event.key === 'Enter') {
-                setShouldSubmitOnChange(true)
-              } else {
-                setShouldSubmitOnChange(false)
-              }
             }}
             value={query}
             placeholder={
@@ -156,9 +136,6 @@ function CommandArgOptionInput({
         <Combobox.Options
           static
           className="overflow-y-auto max-h-96 cursor-pointer"
-          onMouseDown={() => {
-            setShouldSubmitOnChange(true)
-          }}
         >
           {filteredOptions?.map((option) => (
             <Combobox.Option

src/components/CommandBar/CommandBarHeader.tsx

@@ -114,7 +114,6 @@ function CommandBarHeader({ children }: React.PropsWithChildren<{}>) {
                     >
                       {argName}
                     </span>
-                    <span className="sr-only">:&nbsp;</span>
                     {argValue ? (
                       arg.inputType === 'selection' ? (
                         getSelectionTypeDisplayText(argValue as Selections)

src/components/CommandBar/CommandBarProvider.tsx

@@ -28,11 +28,6 @@ export const CommandBarProvider = ({
           Object.keys(context.selectedCommand?.args).length === 0
         )
       },
-      'All arguments are skippable': (context, _event) => {
-        return Object.values(context.selectedCommand!.args!).every(
-          (argConfig) => argConfig.skip
-        )
-      },
     },
   })
 

src/components/CommandBar/CommandBarSelectionInput.tsx

@@ -3,7 +3,6 @@ import { useCommandsContext } from 'hooks/useCommandsContext'
 import { useKclContext } from 'lang/KclProvider'
 import { CommandArgument } from 'lib/commandTypes'
 import {
-  Selection,
   canSubmitSelectionArg,
   getSelectionType,
   getSelectionTypeDisplayText,
@@ -12,25 +11,6 @@ import { modelingMachine } from 'machines/modelingMachine'
 import { useCallback, useEffect, useRef, useState } from 'react'
 import { StateFrom } from 'xstate'
 
-const semanticEntityNames: { [key: string]: Array<Selection['type']> } = {
-  face: ['extrude-wall', 'start-cap', 'end-cap'],
-  edge: ['edge', 'line', 'arc'],
-  point: ['point', 'line-end', 'line-mid'],
-}
-
-function getSemanticSelectionType(selectionType: Array<Selection['type']>) {
-  const semanticSelectionType = new Set()
-  selectionType.forEach((type) => {
-    Object.entries(semanticEntityNames).forEach(([entity, entityTypes]) => {
-      if (entityTypes.includes(type)) {
-        semanticSelectionType.add(entity)
-      }
-    })
-  })
-
-  return Array.from(semanticSelectionType)
-}
-
 const selectionSelector = (snapshot: StateFrom<typeof modelingMachine>) =>
   snapshot.context.selectionRanges
 
@@ -105,9 +85,7 @@ function CommandBarSelectionInput({
       >
         {canSubmitSelection
           ? getSelectionTypeDisplayText(selection) + ' selected'
-          : `Please select ${
-              arg.multiple ? 'one or more ' : 'one '
-            }${getSemanticSelectionType(arg.selectionTypes).join(' or ')}`}
+          : `Please select ${arg.multiple ? 'one or more faces' : 'one face'}`}
         <input
           id="selection"
           name="selection"

src/components/CommandComboBox.tsx

@@ -70,23 +70,19 @@ function CommandComboBox({
       >
         {filteredOptions?.map((option) => (
           <Combobox.Option
-            key={option.groupId + option.name + (option.displayName || '')}
+            key={option.name}
             value={option}
-            className="flex items-center gap-4 px-4 py-1.5 first:mt-2 last:mb-2 ui-active:bg-primary/10 dark:ui-active:bg-chalkboard-90"
+            className="flex items-center gap-2 px-4 py-1 first:mt-2 last:mb-2 ui-active:bg-primary/10 dark:ui-active:bg-chalkboard-90"
           >
             {'icon' in option && option.icon && (
               <CustomIcon name={option.icon} className="w-5 h-5" />
             )}
-            <div className="flex-grow flex flex-col">
-              <p className="my-0 leading-tight">
-                {option.displayName || option.name}{' '}
+            <p className="flex-grow">{option.displayName || option.name} </p>
+            {option.description && (
+              <p className="text-xs text-chalkboard-60 dark:text-chalkboard-40">
+                {option.description}
               </p>
-              {option.description && (
-                <p className="my-0 text-xs text-chalkboard-60 dark:text-chalkboard-50">
-                  {option.description}
-                </p>
-              )}
-            </div>
+            )}
           </Combobox.Option>
         ))}
       </Combobox.Options>

src/components/CustomIcon.tsx

@@ -131,16 +131,6 @@ const CustomIconMap = {
       />
     </svg>
   ),
-  code: (
-    <svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M10.7071 5L7.77734 14.7794L8.73527 15.0663L11.665 5.28698L10.7071 5ZM2.35356 9.64644L5.85362 6.14644L6.56072 6.85355L3.41423 10L6.56072 13.1464L5.85362 13.8536L2.35356 10.3536L2 10L2.35356 9.64644ZM17.0607 9.64644L13.5607 6.14644L12.8536 6.85355L16 10L12.8536 13.1464L13.5607 13.8535L17.0607 10.3536L17.4142 10L17.0607 9.64644Z"
-        fill="currentColor"
-      />
-    </svg>
-  ),
   dimension: (
     <svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
       <path
@@ -187,22 +177,6 @@ const CustomIconMap = {
       />
     </svg>
   ),
-  fillet: (
-    <svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M8 5H5V15H15V12C15 8.13401 11.866 5 8 5ZM5 4H4V5V15V16H5H15H16V15V12C16 7.58172 12.4183 4 8 4H5Z"
-        fill="currentColor"
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M4.5 3.5H5.5H8.5C12.9183 3.5 16.5 7.08172 16.5 11.5V14.5V15.5H16V12C16 7.58172 12.4182 4 7.99996 4H4.5V3.5Z"
-        fill="currentColor"
-      />
-    </svg>
-  ),
   file: (
     <svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
       <path