Fix defined but never used warnings (#3045)

updater smoke test instructions

README.md

@@ -135,9 +135,18 @@ After it runs you should just need to push the push the branch and open a PR (it
 
 The PR may serve as a place to discuss the human-readable changelog and extra QA. 
 
-2. Merge the PR
+2. Smoke test the artifact from the above PR
+We don't have a strict process, but click around and check for anything obvious
+One of the artifacts is called 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 v0.99.99, install it and check that the app comes back at that version (on both macOS and Windows).
+
+3. Merge the PR
+
+
+4. Profit (A new Action kicks in at https://github.com/KittyCAD/modeling-app/actions if the PR was correctly named)
+
 
-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,6 +3099,49 @@ 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) {
@@ -3500,11 +3543,62 @@ test.describe('Command bar tests', () => {
       `const extrude001 = extrude(${KCL_DEFAULT_LENGTH}, sketch001)`
     )
   })
-  test('Command bar works and can change a setting', async ({ page }) => {
+
+  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,
+  }) => {
     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()
@@ -3515,23 +3609,17 @@ test.describe('Command bar tests', () => {
       .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 page.keyboard.type('theme')
-    const themeOption = page.getByRole('option', {
-      name: 'Settings · app · theme',
-    })
+    await cmdSearchBar.fill('theme')
     await expect(themeOption).toBeVisible()
     await themeOption.click()
     const themeInput = page.getByPlaceholder('Select an option')
@@ -3553,6 +3641,24 @@ test.describe('Command bar tests', () => {
     ).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 ({
@@ -3577,7 +3683,7 @@ test.describe('Command bar tests', () => {
     await expect(cmdSearchBar).toBeFocused()
 
     // Try typing in the command bar
-    await page.keyboard.type('theme')
+    await cmdSearchBar.fill('theme')
     const themeOption = page.getByRole('option', {
       name: 'Settings · app · theme',
     })
@@ -3648,7 +3754,9 @@ test.describe('Command bar tests', () => {
     await page.mouse.click(700, 200)
 
     // Assert that we're on the distance step
-    await expect(page.getByRole('button', { name: 'distance' })).toBeDisabled()
+    await expect(
+      page.getByRole('button', { name: 'distance', exact: false })
+    ).toBeDisabled()
 
     // Assert that the an alternative variable name is chosen,
     // since the default variable name is already in use (distance)
@@ -3663,11 +3771,12 @@ test.describe('Command bar tests', () => {
 
     // Review step and argument hotkeys
     await expect(submitButton).toBeEnabled()
-    await page.keyboard.press('Backspace')
+    await expect(submitButton).toBeFocused()
+    await submitButton.press('Backspace')
 
     // Assert we're back on the distance step
     await expect(
-      page.getByRole('button', { name: 'Distance 5', exact: false })
+      page.getByRole('button', { name: 'distance', exact: false })
     ).toBeDisabled()
 
     await continueButton.click()
@@ -3691,6 +3800,47 @@ 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', () => {
@@ -4642,10 +4792,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' })
+      page.getByRole('button', { name: 'selection : 1 face', exact: false })
     ).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.0",
+  "version": "0.24.2",
   "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 { deferExecution, posToOffset, formatMarkdownContents } from './util'
+import { posToOffset, formatMarkdownContents } from './util'
 import lspAutocompleteExt from './autocomplete'
 import lspHoverExt from './hover'
 import lspFormatExt from './format'
@@ -93,23 +93,10 @@ export class LanguageServerPlugin implements PluginValue {
   private doSemanticTokens: boolean = false
   private doFoldingRanges: boolean = false
 
-  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)
+  // 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
 
   constructor(options: LanguageServerOptions, private view: EditorView) {
     this.client = options.client
@@ -152,14 +139,9 @@ export class LanguageServerPlugin implements PluginValue {
   }
 
   update(viewUpdate: ViewUpdate) {
-    // If the doc didn't change we can return early.
-    if (!viewUpdate.docChanged) {
-      return
+    if (viewUpdate.docChanged) {
+      this.scheduleSendDoc()
     }
-
-    this.sendChange({
-      documentText: viewUpdate.state.doc.toString(),
-    })
   }
 
   destroy() {
@@ -184,16 +166,6 @@ 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 }
@@ -204,7 +176,7 @@ export class LanguageServerPlugin implements PluginValue {
     )
       return null
 
-    this.sendChange({ documentText: this.getDocText() })
+    this.ensureDocSent()
     const result = await this.client.textDocumentHover({
       textDocument: { uri: this.getDocUri() },
       position: { line, character },
@@ -227,6 +199,42 @@ 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 ||
@@ -284,13 +292,7 @@ export class LanguageServerPlugin implements PluginValue {
     )
       return null
 
-    this.client.textDocumentDidChange({
-      textDocument: {
-        uri: this.getDocUri(),
-        version: this.documentVersion++,
-      },
-      contentChanges: [{ text: this.getDocText() }],
-    })
+    this.ensureDocSent()
 
     const result = await this.client.textDocumentFormatting({
       textDocument: { uri: this.getDocUri() },
@@ -330,9 +332,7 @@ export class LanguageServerPlugin implements PluginValue {
     )
       return null
 
-    this.sendChange({
-      documentText: context.state.doc.toString(),
-    })
+    this.ensureDocSent()
 
     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.0"
+  "version": "0.24.2"
 }

src/App.tsx

@@ -26,7 +26,6 @@ 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')
@@ -46,8 +45,6 @@ export function App() {
 
   useHotKeyListener()
   const { context } = useModelingContext()
-  const { streamDimensions, didDragInStream, buttonDownInStream } =
-    useAppState()
 
   const { auth, settings } = useSettingsAuthContext()
   const token = auth?.context?.token
@@ -77,7 +74,7 @@ export function App() {
     (p) => p === onboardingStatus.current
   )
     ? 'opacity-20'
-    : didDragInStream
+    : context.store?.didDragInStream
     ? 'opacity-40'
     : ''
 
@@ -95,11 +92,11 @@ export function App() {
       clientX: e.clientX,
       clientY: e.clientY,
       el: e.currentTarget,
-      ...streamDimensions,
+      ...context.store?.streamDimensions,
     })
 
     const newCmdId = uuidv4()
-    if (buttonDownInStream === undefined) {
+    if (context.store?.buttonDownInStream === undefined) {
       debounceSocketSend({
         type: 'modeling_cmd_req',
         cmd: {
@@ -121,7 +118,7 @@ export function App() {
         className={
           'transition-opacity transition-duration-75 ' +
           paneOpacity +
-          (buttonDownInStream ? ' pointer-events-none' : '')
+          (context.store?.buttonDownInStream ? ' pointer-events-none' : '')
         }
         project={{ project, file }}
         enableMenu={true}

src/AppState.tsx

@@ -1,10 +1,4 @@
-import {
-  createContext,
-  useContext,
-  useState,
-  ReactNode,
-  useEffect,
-} from 'react'
+import { createContext, useContext, useState, ReactNode } from 'react'
 
 /*
 
@@ -17,23 +11,11 @@ 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)
@@ -42,38 +24,47 @@ 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'],
   })
-  useEffect(() => {
-    // console.log('appState change', appState)
-  }, [appState])
-  const setAppState = (newAppState: Partial<AppState>) => {
-    // console.log('appstate', newAppState)
-    _setAppState({
-      ...appState,
-      ...newAppState,
-      mediaStream: newAppState.mediaStream || appState.mediaStream,
-    })
-  }
+  const setAppState = (newAppState: Partial<AppState>) =>
+    _setAppState({ ...appState, ...newAppState })
 
   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: (
-      <AppStateProvider>
-        <CommandBarProvider>
-          <SettingsAuthProvider>
-            <LspProvider>
-              <KclContextProvider>
+      <CommandBarProvider>
+        <SettingsAuthProvider>
+          <LspProvider>
+            <KclContextProvider>
+              <AppStateProvider>
                 <Outlet />
-              </KclContextProvider>
-            </LspProvider>
-          </SettingsAuthProvider>
-        </CommandBarProvider>
-      </AppStateProvider>
+              </AppStateProvider>
+            </KclContextProvider>
+          </LspProvider>
+        </SettingsAuthProvider>
+      </CommandBarProvider>
     ),
     errorElement: <ErrorPage />,
     children: [

src/Toolbar.tsx

@@ -16,6 +16,7 @@ import {
   canRectangleTool,
   isEditingExistingSketch,
 } from 'machines/modelingMachine'
+import { DEV } from 'env'
 
 export function Toolbar({
   className = '',
@@ -60,7 +61,7 @@ export function Toolbar({
         ? send('CancelSketch')
         : send({
             type: 'change tool',
-            data: 'line',
+            data: { tool: 'line' },
           }),
     { enabled: !disableLineButton, scopes: ['sketch'] }
   )
@@ -75,7 +76,7 @@ export function Toolbar({
         ? send('CancelSketch')
         : send({
             type: 'change tool',
-            data: 'tangentialArc',
+            data: { tool: 'tangentialArc' },
           }),
     { enabled: !disableTangentialArc, scopes: ['sketch'] }
   )
@@ -89,7 +90,7 @@ export function Toolbar({
         ? send('CancelSketch')
         : send({
             type: 'change tool',
-            data: 'rectangle',
+            data: { tool: 'rectangle' },
           }),
     { enabled: !disableRectangle, scopes: ['sketch'] }
   )
@@ -118,6 +119,16 @@ 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
@@ -263,7 +274,7 @@ export function Toolbar({
                     ? send('CancelSketch')
                     : send({
                         type: 'change tool',
-                        data: 'line',
+                        data: { tool: 'line' },
                       })
                 }
                 aria-pressed={state?.matches('Sketch.Line tool')}
@@ -293,7 +304,7 @@ export function Toolbar({
                     ? send('CancelSketch')
                     : send({
                         type: 'change tool',
-                        data: 'tangentialArc',
+                        data: { tool: 'tangentialArc' },
                       })
                 }
                 aria-pressed={state.matches('Sketch.Tangential arc to')}
@@ -323,7 +334,7 @@ export function Toolbar({
                     ? send('CancelSketch')
                     : send({
                         type: 'change tool',
-                        data: 'rectangle',
+                        data: { tool: 'rectangle' },
                       })
                 }
                 aria-pressed={state.matches('Sketch.Rectangle tool')}
@@ -404,6 +415,36 @@ 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,6 +41,7 @@ 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])
@@ -82,8 +83,10 @@ function CommandArgOptionInput({
     // We deal with the whole option object internally
     setSelectedOption(option)
 
-    // But we only submit the value
-    onSubmit(option.value)
+    // But we only submit the value itself
+    if (shouldSubmitOnChange) {
+      onSubmit(option.value)
+    }
   }
 
   function handleSubmit(e: React.FormEvent<HTMLFormElement>) {
@@ -94,7 +97,18 @@ function CommandArgOptionInput({
   }
 
   return (
-    <form id="arg-form" onSubmit={handleSubmit} ref={formRef}>
+    <form
+      id="arg-form"
+      onSubmit={handleSubmit}
+      ref={formRef}
+      onKeyDownCapture={(e) => {
+        if (e.key === 'Enter') {
+          setShouldSubmitOnChange(true)
+        } else {
+          setShouldSubmitOnChange(false)
+        }
+      }}
+    >
       <Combobox
         value={selectedOption}
         onChange={handleSelectOption}
@@ -118,6 +132,12 @@ function CommandArgOptionInput({
               if (event.key === 'Backspace' && !event.currentTarget.value) {
                 stepBack()
               }
+
+              if (event.key === 'Enter') {
+                setShouldSubmitOnChange(true)
+              } else {
+                setShouldSubmitOnChange(false)
+              }
             }}
             value={query}
             placeholder={
@@ -136,6 +156,9 @@ 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,6 +114,7 @@ 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,6 +28,11 @@ 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,6 +3,7 @@ import { useCommandsContext } from 'hooks/useCommandsContext'
 import { useKclContext } from 'lang/KclProvider'
 import { CommandArgument } from 'lib/commandTypes'
 import {
+  Selection,
   canSubmitSelectionArg,
   getSelectionType,
   getSelectionTypeDisplayText,
@@ -11,6 +12,25 @@ 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
 
@@ -85,7 +105,9 @@ function CommandBarSelectionInput({
       >
         {canSubmitSelection
           ? getSelectionTypeDisplayText(selection) + ' selected'
-          : `Please select ${arg.multiple ? 'one or more faces' : 'one face'}`}
+          : `Please select ${
+              arg.multiple ? 'one or more ' : 'one '
+            }${getSemanticSelectionType(arg.selectionTypes).join(' or ')}`}
         <input
           id="selection"
           name="selection"

src/components/CommandComboBox.tsx

@@ -70,19 +70,23 @@ function CommandComboBox({
       >
         {filteredOptions?.map((option) => (
           <Combobox.Option
-            key={option.name}
+            key={option.groupId + option.name + (option.displayName || '')}
             value={option}
-            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"
+            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"
           >
             {'icon' in option && option.icon && (
               <CustomIcon name={option.icon} className="w-5 h-5" />
             )}
-            <p className="flex-grow">{option.displayName || option.name} </p>
-            {option.description && (
-              <p className="text-xs text-chalkboard-60 dark:text-chalkboard-40">
-                {option.description}
+            <div className="flex-grow flex flex-col">
+              <p className="my-0 leading-tight">
+                {option.displayName || option.name}{' '}
               </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,6 +131,16 @@ 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
@@ -177,6 +187,22 @@ 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

src/components/ModelingMachineProvider.tsx

@@ -42,7 +42,7 @@ import {
 import { applyConstraintIntersect } from './Toolbar/Intersect'
 import { applyConstraintAbsDistance } from './Toolbar/SetAbsDistance'
 import useStateMachineCommands from 'hooks/useStateMachineCommands'
-import { modelingMachineConfig } from 'lib/commandBarConfigs/modelingCommandConfig'
+import { modelingMachineCommandConfig } from 'lib/commandBarConfigs/modelingCommandConfig'
 import {
   STRAIGHT_SEGMENT,
   TANGENTIAL_ARC_TO_SEGMENT,
@@ -72,6 +72,7 @@ import { uuidv4 } from 'lib/utils'
 import { err, trap } from 'lib/trap'
 import { useCommandsContext } from 'hooks/useCommandsContext'
 import { modelingMachineEvent } from 'editor/manager'
+import { hasValidFilletSelection } from 'lang/modifyAst/addFillet'
 
 type MachineContext<T extends AnyStateMachine> = {
   state: StateFrom<T>
@@ -164,7 +165,7 @@ export const ModelingMachineProvider = ({
 
             store.videoElement?.pause()
             kclManager.executeCode(true).then(() => {
-              if (engineCommandManager.engineConnection?.freezeFrame) return
+              if (engineCommandManager.engineConnection?.idleMode) return
 
               store.videoElement?.play()
             })
@@ -444,6 +445,12 @@ export const ModelingMachineProvider = ({
           if (selectionRanges.codeBasedSelections.length <= 0) return false
           return true
         },
+        'has valid fillet selection': ({ selectionRanges }) =>
+          hasValidFilletSelection({
+            selectionRanges,
+            ast: kclManager.ast,
+            code: codeManager.code,
+          }),
         'Selection is on face': ({ selectionRanges }, { data }) => {
           if (data?.forceNewSketch) return false
           if (!isSingleCursorInPipe(selectionRanges, kclManager.ast))
@@ -494,7 +501,6 @@ export const ModelingMachineProvider = ({
               kclManager.ast,
               data.sketchPathToNode,
               data.extrudePathToNode,
-              kclManager.programMemory,
               data.cap
             )
             if (trap(sketched)) return Promise.reject(sketched)
@@ -920,7 +926,7 @@ export const ModelingMachineProvider = ({
     state: modelingState,
     send: modelingSend,
     actor: modelingActor,
-    commandBarConfig: modelingMachineConfig,
+    commandBarConfig: modelingMachineCommandConfig,
     allCommandsRequireNetwork: true,
     // TODO for when sketch tools are in the toolbar: This was added when we used one "Cancel" event,
     // but we need to support "SketchCancel" and basically

src/components/ModelingSidebar/ModelingPane.tsx

@@ -1,7 +1,6 @@
 import styles from './ModelingPane.module.css'
 import { useSettingsAuthContext } from 'hooks/useSettingsAuthContext'
 import { useModelingContext } from 'hooks/useModelingContext'
-import { useAppState } from 'AppState'
 
 export interface ModelingPaneProps
   extends React.PropsWithChildren,
@@ -34,10 +33,9 @@ export const ModelingPane = ({
 }: ModelingPaneProps) => {
   const { settings } = useSettingsAuthContext()
   const onboardingStatus = settings.context.app.onboardingStatus
-  // const { context } = useModelingContext()
-  const { buttonDownInStream } = useAppState()
+  const { context } = useModelingContext()
   const pointerEventsCssClass =
-    buttonDownInStream || onboardingStatus.current === 'camera'
+    context.store?.buttonDownInStream || onboardingStatus.current === 'camera'
       ? 'pointer-events-none '
       : 'pointer-events-auto '
   return (

src/components/ModelingSidebar/ModelingSidebar.tsx

@@ -15,7 +15,6 @@ import styles from './ModelingSidebar.module.css'
 import { ModelingPane } from './ModelingPane'
 import { isTauri } from 'lib/isTauri'
 import { useModelingContext } from 'hooks/useModelingContext'
-import { useAppState } from 'AppState'
 
 interface ModelingSidebarProps {
   paneOpacity: '' | 'opacity-20' | 'opacity-40'
@@ -25,9 +24,8 @@ export function ModelingSidebar({ paneOpacity }: ModelingSidebarProps) {
   const { settings } = useSettingsAuthContext()
   const onboardingStatus = settings.context.app.onboardingStatus
   const { context } = useModelingContext()
-  const { buttonDownInStream } = useAppState()
   const pointerEventsCssClass =
-    buttonDownInStream ||
+    context.store?.buttonDownInStream ||
     onboardingStatus.current === 'camera' ||
     context.store?.openPanes.length === 0
       ? 'pointer-events-none '

src/components/Stream.tsx

@@ -9,7 +9,11 @@ import { ClientSideScene } from 'clientSideScene/ClientSideSceneComp'
 import { btnName } from 'lib/cameraControls'
 import { sendSelectEventToEngine } from 'lib/selections'
 import { kclManager, engineCommandManager, sceneInfra } from 'lib/singletons'
-import { useAppState } from 'AppState'
+import { useAppStream } from 'AppState'
+import {
+  EngineConnectionStateType,
+  DisconnectingType,
+} from 'lang/std/engineConnection'
 
 export const Stream = () => {
   const [isLoading, setIsLoading] = useState(true)
@@ -17,17 +21,30 @@ export const Stream = () => {
   const [clickCoords, setClickCoords] = useState<{ x: number; y: number }>()
   const videoRef = useRef<HTMLVideoElement>(null)
   const { settings } = useSettingsAuthContext()
-  const { state, send } = useModelingContext()
-  const { mediaStream, streamDimensions, didDragInStream, setAppState } =
-    useAppState()
-
-  const { overallState } = useNetworkContext()
+  const { state, send, context } = useModelingContext()
+  const { mediaStream } = useAppStream()
+  const { overallState, immediateState } = useNetworkContext()
   const [isFreezeFrame, setIsFreezeFrame] = useState(false)
+  const [isPaused, setIsPaused] = useState(false)
+
+  const IDLE = settings.context.app.streamIdleMode.current
 
   const isNetworkOkay =
     overallState === NetworkHealthState.Ok ||
     overallState === NetworkHealthState.Weak
 
+  useEffect(() => {
+    if (
+      immediateState.type === EngineConnectionStateType.Disconnecting &&
+      immediateState.value.type === DisconnectingType.Pause
+    ) {
+      setIsPaused(true)
+    }
+    if (immediateState.type === EngineConnectionStateType.Connecting) {
+      setIsPaused(false)
+    }
+  }, [immediateState])
+
   // Linux has a default behavior to paste text on middle mouse up
   // This adds a listener to block that pasting if the click target
   // is not a text input, so users can move in the 3D scene with
@@ -55,7 +72,7 @@ export const Stream = () => {
       capture: true,
     })
 
-    const IDLE_TIME_MS = 1000 * 20
+    const IDLE_TIME_MS = 1000 * 60 * 2
     let timeoutIdIdleA: ReturnType<typeof setTimeout> | undefined = undefined
 
     const teardown = () => {
@@ -64,57 +81,78 @@ export const Stream = () => {
       sceneInfra.modelingSend({ type: 'Cancel' })
       // Give video time to pause
       window.requestAnimationFrame(() => {
-        engineCommandManager.engineConnection?.tearDown({ freeze: true })
+        engineCommandManager.tearDown({ idleMode: true })
       })
     }
 
-    // Teardown everything if we go hidden or reconnect
-    if (globalThis?.window?.document) {
-      globalThis.window.document.onvisibilitychange = () => {
-        if (globalThis.window.document.visibilityState === 'hidden') {
-          clearTimeout(timeoutIdIdleA)
-          timeoutIdIdleA = setTimeout(teardown, IDLE_TIME_MS)
-        } else if (!engineCommandManager.engineConnection?.isReady()) {
-          clearTimeout(timeoutIdIdleA)
-          engineCommandManager.engineConnection?.connect(true)
-        }
+    const onVisibilityChange = () => {
+      if (globalThis.window.document.visibilityState === 'hidden') {
+        clearTimeout(timeoutIdIdleA)
+        timeoutIdIdleA = setTimeout(teardown, IDLE_TIME_MS)
+      } else if (!engineCommandManager.engineConnection?.isReady()) {
+        clearTimeout(timeoutIdIdleA)
+        engineCommandManager.engineConnection?.connect(true)
       }
     }
 
+    // Teardown everything if we go hidden or reconnect
+    if (IDLE) {
+      globalThis?.window?.document?.addEventListener(
+        'visibilitychange',
+        onVisibilityChange
+      )
+    }
+
     let timeoutIdIdleB: ReturnType<typeof setTimeout> | undefined = undefined
 
     const onAnyInput = () => {
-      if (!engineCommandManager.engineConnection?.isReady()) {
-        engineCommandManager.engineConnection?.connect(true)
-      }
       // Clear both timers
       clearTimeout(timeoutIdIdleA)
       clearTimeout(timeoutIdIdleB)
       timeoutIdIdleB = setTimeout(teardown, IDLE_TIME_MS)
     }
 
-    globalThis?.window?.document?.addEventListener('keydown', onAnyInput)
-    globalThis?.window?.document?.addEventListener('mousemove', onAnyInput)
-    globalThis?.window?.document?.addEventListener('mousedown', onAnyInput)
-    globalThis?.window?.document?.addEventListener('scroll', onAnyInput)
-    globalThis?.window?.document?.addEventListener('touchstart', onAnyInput)
+    if (IDLE) {
+      globalThis?.window?.document?.addEventListener('keydown', onAnyInput)
+      globalThis?.window?.document?.addEventListener('mousemove', onAnyInput)
+      globalThis?.window?.document?.addEventListener('mousedown', onAnyInput)
+      globalThis?.window?.document?.addEventListener('scroll', onAnyInput)
+      globalThis?.window?.document?.addEventListener('touchstart', onAnyInput)
+    }
 
-    timeoutIdIdleB = setTimeout(teardown, IDLE_TIME_MS)
+    if (IDLE) {
+      timeoutIdIdleB = setTimeout(teardown, IDLE_TIME_MS)
+    }
 
     return () => {
       globalThis?.window?.document?.removeEventListener('paste', handlePaste, {
         capture: true,
       })
-      globalThis?.window?.document?.removeEventListener('keydown', onAnyInput)
-      globalThis?.window?.document?.removeEventListener('mousemove', onAnyInput)
-      globalThis?.window?.document?.removeEventListener('mousedown', onAnyInput)
-      globalThis?.window?.document?.removeEventListener('scroll', onAnyInput)
-      globalThis?.window?.document?.removeEventListener(
-        'touchstart',
-        onAnyInput
-      )
+      if (IDLE) {
+        clearTimeout(timeoutIdIdleA)
+        clearTimeout(timeoutIdIdleB)
+
+        globalThis?.window?.document?.removeEventListener(
+          'visibilitychange',
+          onVisibilityChange
+        )
+        globalThis?.window?.document?.removeEventListener('keydown', onAnyInput)
+        globalThis?.window?.document?.removeEventListener(
+          'mousemove',
+          onAnyInput
+        )
+        globalThis?.window?.document?.removeEventListener(
+          'mousedown',
+          onAnyInput
+        )
+        globalThis?.window?.document?.removeEventListener('scroll', onAnyInput)
+        globalThis?.window?.document?.removeEventListener(
+          'touchstart',
+          onAnyInput
+        )
+      }
     }
-  }, [])
+  }, [IDLE])
 
   useEffect(() => {
     setIsFirstRender(kclManager.isFirstRender)
@@ -128,19 +166,12 @@ export const Stream = () => {
     )
       return
     if (!videoRef.current) return
-    // console.log('setting mideastrema to vi2', mediaStream, (window as any).mediaStream)
-    const _mediaStream = mediaStream || (window as any).mediaStream
-    if (!_mediaStream) return
+    if (!mediaStream) return
 
-    // console.log('setting mideastrema to vi')
     // Do not immediately play the stream!
-    videoRef.current.srcObject = _mediaStream
+    videoRef.current.srcObject = mediaStream
     videoRef.current.pause()
 
-    // setAppState({
-    //   mediaStream,
-    // })
-
     send({
       type: 'Set context',
       data: {
@@ -159,49 +190,44 @@ export const Stream = () => {
       clientX: e.clientX,
       clientY: e.clientY,
       el: videoRef.current,
-      ...streamDimensions,
+      ...context.store?.streamDimensions,
     })
 
-    setAppState({
-      buttonDownInStream: e.button,
+    send({
+      type: 'Set context',
+      data: {
+        buttonDownInStream: e.button,
+      },
     })
-    // send({
-    //   type: 'Set context',
-    //   data: {
-    //     buttonDownInStream: e.button,
-    //   },
-    // })
     setClickCoords({ x, y })
   }
 
   const handleMouseUp: MouseEventHandler<HTMLDivElement> = (e) => {
     if (!isNetworkOkay) return
     if (!videoRef.current) return
-    setAppState({
-      buttonDownInStream: undefined,
+    send({
+      type: 'Set context',
+      data: {
+        buttonDownInStream: undefined,
+      },
     })
-    // send({
-    //   type: 'Set context',
-    //   data: {
-    //     buttonDownInStream: undefined,
-    //   },
-    // })
     if (state.matches('Sketch')) return
     if (state.matches('Sketch no face')) return
 
-    if (!didDragInStream && btnName(e).left) {
-      sendSelectEventToEngine(e, videoRef.current, streamDimensions)
+    if (!context.store?.didDragInStream && btnName(e).left) {
+      sendSelectEventToEngine(
+        e,
+        videoRef.current,
+        context.store?.streamDimensions
+      )
     }
 
-    setAppState({
-      didDragInStream: false,
+    send({
+      type: 'Set context',
+      data: {
+        didDragInStream: false,
+      },
     })
-    // send({
-    //   type: 'Set context',
-    //   data: {
-    //     didDragInStream: false,
-    //   },
-    // })
     setClickCoords(undefined)
   }
 
@@ -215,16 +241,13 @@ export const Stream = () => {
       ((clickCoords.x - e.clientX) ** 2 + (clickCoords.y - e.clientY) ** 2) **
       0.5
 
-    if (delta > 5 && !didDragInStream) {
-      setAppState({
-        didDragInStream: true,
+    if (delta > 5 && !context.store?.didDragInStream) {
+      send({
+        type: 'Set context',
+        data: {
+          didDragInStream: true,
+        },
       })
-      // send({
-      //   type: 'Set context',
-      //   data: {
-      //     didDragInStream: true,
-      //   },
-      // })
     }
   }
 
@@ -252,6 +275,32 @@ export const Stream = () => {
       <ClientSideScene
         cameraControls={settings.context.modeling.mouseControls.current}
       />
+      {isPaused && (
+        <div className="text-center absolute inset-0">
+          <div
+            className="flex flex-col items-center justify-center h-screen"
+            data-testid="paused"
+          >
+            <div className="border-primary border p-2 rounded-sm">
+              <svg
+                width="8"
+                height="12"
+                viewBox="0 0 8 12"
+                fill="none"
+                xmlns="http://www.w3.org/2000/svg"
+              >
+                <path
+                  fillRule="evenodd"
+                  clipRule="evenodd"
+                  d="M2 12V0H0V12H2ZM8 12V0H6V12H8Z"
+                  fill="var(--primary)"
+                />
+              </svg>
+            </div>
+            <p className="text-base mt-2 text-primary bold">Paused</p>
+          </div>
+        </div>
+      )}
       {(!isNetworkOkay || isLoading || isFirstRender) && !isFreezeFrame && (
         <div className="text-center absolute inset-0">
           <Loading>

src/editor/plugins/lsp/copilot/index.ts

@@ -195,14 +195,15 @@ export class CompletionRequester implements PluginValue {
 
   private queuedUids: string[] = []
 
-  private _deffererCodeUpdate = deferExecution(() => {
-    this.requestCompletions()
-  }, changesDelay)
-
   private _deffererUserSelect = deferExecution(() => {
     this.rejectSuggestionCommand()
   }, changesDelay)
 
+  // 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 sendScheduledInput: number | null = null
+
   constructor(readonly view: EditorView, client: LanguageServerClient) {
     this.client = client
   }
@@ -245,7 +246,34 @@ export class CompletionRequester implements PluginValue {
     }
 
     this.lastPos = this.view.state.selection.main.head
-    if (viewUpdate.docChanged) this._deffererCodeUpdate(true)
+    if (viewUpdate.docChanged) this.scheduleUpdateDoc()
+  }
+
+  scheduleUpdateDoc() {
+    if (this.sendScheduledInput != null)
+      window.clearTimeout(this.sendScheduledInput)
+    this.sendScheduledInput = window.setTimeout(
+      () => this.updateDoc(),
+      changesDelay
+    )
+  }
+
+  updateDoc() {
+    if (this.sendScheduledInput != null) {
+      window.clearTimeout(this.sendScheduledInput)
+      this.sendScheduledInput = null
+    }
+
+    if (!this.client.ready) return
+    try {
+      this.requestCompletions()
+    } catch (e) {
+      console.error(e)
+    }
+  }
+
+  ensureDocUpdated() {
+    if (this.sendScheduledInput != null) this.updateDoc()
   }
 
   ghostText(): GhostText | null {

src/editor/plugins/lsp/kcl/index.ts

@@ -27,13 +27,10 @@ export class KclPlugin implements PluginValue {
     this.client = client
   }
 
-  private _deffererCodeUpdate = deferExecution(() => {
-    if (this.viewUpdate === null) {
-      return
-    }
-
-    kclManager.executeCode()
-  }, changesDelay)
+  // 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 sendScheduledInput: number | null = null
 
   private _deffererUserSelect = deferExecution(() => {
     if (this.viewUpdate === null) {
@@ -101,7 +98,34 @@ export class KclPlugin implements PluginValue {
     codeManager.code = newCode
     codeManager.writeToFile()
 
-    this._deffererCodeUpdate(true)
+    this.scheduleUpdateDoc()
+  }
+
+  scheduleUpdateDoc() {
+    if (this.sendScheduledInput != null)
+      window.clearTimeout(this.sendScheduledInput)
+    this.sendScheduledInput = window.setTimeout(
+      () => this.updateDoc(),
+      changesDelay
+    )
+  }
+
+  updateDoc() {
+    if (this.sendScheduledInput != null) {
+      window.clearTimeout(this.sendScheduledInput)
+      this.sendScheduledInput = null
+    }
+
+    if (!this.client.ready) return
+    try {
+      kclManager.executeCode()
+    } catch (e) {
+      console.error(e)
+    }
+  }
+
+  ensureDocUpdated() {
+    if (this.sendScheduledInput != null) this.updateDoc()
   }
 
   async updateUnits(

src/hooks/useNetworkContext.tsx

@@ -1,11 +1,16 @@
 import { createContext, useContext } from 'react'
 import {
   ConnectingTypeGroup,
+  EngineConnectionStateType,
+  EngineConnectionState,
   initialConnectingTypeGroupState,
 } from '../lang/std/engineConnection'
 import { NetworkStatus, NetworkHealthState } from './useNetworkStatus'
 
 export const NetworkContext = createContext<NetworkStatus>({
+  immediateState: {
+    type: EngineConnectionStateType.Disconnected,
+  } as EngineConnectionState,
   hasIssues: undefined,
   overallState: NetworkHealthState.Disconnected,
   internetConnected: true,

src/hooks/useNetworkStatus.tsx

@@ -6,6 +6,7 @@ import {
   EngineCommandManagerEvents,
   EngineConnectionEvents,
   EngineConnectionStateType,
+  EngineConnectionState,
   ErrorType,
   initialConnectingTypeGroupState,
 } from '../lang/std/engineConnection'
@@ -19,6 +20,7 @@ export enum NetworkHealthState {
 }
 
 export interface NetworkStatus {
+  immediateState: EngineConnectionState
   hasIssues: boolean | undefined
   overallState: NetworkHealthState
   internetConnected: boolean
@@ -33,6 +35,9 @@ export interface NetworkStatus {
 // Must be called from one place in the application.
 // We've chosen the <Router /> component for this.
 export function useNetworkStatus() {
+  const [immediateState, setImmediateState] = useState<EngineConnectionState>({
+    type: EngineConnectionStateType.Disconnected,
+  })
   const [steps, setSteps] = useState(
     structuredClone(initialConnectingTypeGroupState)
   )
@@ -126,6 +131,7 @@ export function useNetworkStatus() {
     const onConnectionStateChange = ({
       detail: engineConnectionState,
     }: CustomEvent) => {
+      setImmediateState(engineConnectionState)
       setSteps((steps) => {
         let nextSteps = structuredClone(steps)
 
@@ -215,6 +221,7 @@ export function useNetworkStatus() {
   }, [])
 
   return {
+    immediateState,
     hasIssues,
     overallState,
     internetConnected,

src/hooks/useSetupEngineManager.ts

@@ -1,10 +1,10 @@
 import { useLayoutEffect, useEffect, useRef } from 'react'
-import { engineCommandManager, kclManager, sceneInfra } from 'lib/singletons'
+import { engineCommandManager, kclManager } from 'lib/singletons'
 import { deferExecution } from 'lib/utils'
 import { Themes } from 'lib/theme'
 import { makeDefaultPlanes, modifyGrid } from 'lang/wasm'
 import { useModelingContext } from './useModelingContext'
-import { useAppState } from 'AppState'
+import { useAppState, useAppStream } from 'AppState'
 
 export function useSetupEngineManager(
   streamRef: React.RefObject<HTMLDivElement>,
@@ -27,10 +27,8 @@ export function useSetupEngineManager(
     showScaleGrid: boolean
   }
 ) {
-  const { setAppState, streamDimensions } = useAppState()
-
-  const streamWidth = streamRef?.current?.offsetWidth
-  const streamHeight = streamRef?.current?.offsetHeight
+  const { setAppState } = useAppState()
+  const { setMediaStream } = useAppStream()
 
   const hasSetNonZeroDimensions = useRef<boolean>(false)
 
@@ -40,109 +38,123 @@ export function useSetupEngineManager(
     engineCommandManager.pool = settings.pool
   }
 
-  const startEngineInstance = () => {
+  const startEngineInstance = (restart: boolean = false) => {
     // Load the engine command manager once with the initial width and height,
     // then we do not want to reload it.
     const { width: quadWidth, height: quadHeight } = getDimensions(
-      streamWidth,
-      streamHeight
+      streamRef?.current?.offsetWidth ?? 0,
+      streamRef?.current?.offsetHeight ?? 0
     )
-    if (!hasSetNonZeroDimensions.current && quadHeight && quadWidth) {
-      engineCommandManager.start({
-        // setMediaStream: (mediaStream) =>
-        //   settings.modelingSend({
-        //     type: 'Set context',
-        //     data: { mediaStream },
-        //   }),
-        setMediaStream: (mediaStream) => {
-          ;(window as any).mediaStream = mediaStream
-          setAppState({ mediaStream })
-        },
-        setIsStreamReady: (isStreamReady) => setAppState({ isStreamReady }),
-        width: quadWidth,
-        height: quadHeight,
-        executeCode: () => {
-          // We only want to execute the code here that we already have set.
-          // Nothing else.
-          kclManager.isFirstRender = true
-          return kclManager.executeCode(true, true).then(() => {
-            kclManager.isFirstRender = false
-          })
-        },
-        token,
-        settings,
-        makeDefaultPlanes: () => {
-          return makeDefaultPlanes(kclManager.engineCommandManager)
-        },
-        modifyGrid: (hidden: boolean) => {
-          return modifyGrid(kclManager.engineCommandManager, hidden)
-        },
-      })
-      setAppState({
-        streamDimensions: { streamWidth: quadWidth, streamHeight: quadHeight },
-      })
-      sceneInfra._streamDimensions = {
-        streamWidth: quadWidth,
-        streamHeight: quadHeight,
-      }
-      // settings.modelingSend({
-      //   type: 'Set context',
-      //   data: {
-      //     streamDimensions: {
-      //       streamWidth: quadWidth,
-      //       streamHeight: quadHeight,
-      //     },
-      //   },
-      // })
-      hasSetNonZeroDimensions.current = true
+    if (restart) {
+      kclManager.isFirstRender = false
     }
+    engineCommandManager.start({
+      restart,
+      setMediaStream: (mediaStream) => setMediaStream(mediaStream),
+      setIsStreamReady: (isStreamReady) => setAppState({ isStreamReady }),
+      width: quadWidth,
+      height: quadHeight,
+      executeCode: () => {
+        // We only want to execute the code here that we already have set.
+        // Nothing else.
+        kclManager.isFirstRender = true
+        return kclManager.executeCode(true, true).then(() => {
+          kclManager.isFirstRender = false
+        })
+      },
+      token,
+      settings,
+      makeDefaultPlanes: () => {
+        return makeDefaultPlanes(kclManager.engineCommandManager)
+      },
+      modifyGrid: (hidden: boolean) => {
+        return modifyGrid(kclManager.engineCommandManager, hidden)
+      },
+    })
+    settings.modelingSend({
+      type: 'Set context',
+      data: {
+        streamDimensions: {
+          streamWidth: quadWidth,
+          streamHeight: quadHeight,
+        },
+      },
+    })
+    hasSetNonZeroDimensions.current = true
   }
 
-  useLayoutEffect(startEngineInstance, [
+  useLayoutEffect(() => {
+    const { width: quadWidth, height: quadHeight } = getDimensions(
+      streamRef?.current?.offsetWidth ?? 0,
+      streamRef?.current?.offsetHeight ?? 0
+    )
+    if (!hasSetNonZeroDimensions.current && quadHeight && quadWidth) {
+      startEngineInstance()
+    }
+  }, [
     streamRef?.current?.offsetWidth,
     streamRef?.current?.offsetHeight,
     settings.modelingSend,
-    setAppState,
   ])
 
   useEffect(() => {
     const handleResize = deferExecution(() => {
       const { width, height } = getDimensions(
-        streamRef?.current?.offsetWidth,
-        streamRef?.current?.offsetHeight
+        streamRef?.current?.offsetWidth ?? 0,
+        streamRef?.current?.offsetHeight ?? 0
       )
       if (
-        streamDimensions.streamWidth !== width ||
-        streamDimensions.streamHeight !== height
+        settings.modelingContext.store.streamDimensions.streamWidth !== width ||
+        settings.modelingContext.store.streamDimensions.streamHeight !== height
       ) {
         engineCommandManager.handleResize({
           streamWidth: width,
           streamHeight: height,
         })
-        setAppState({
-          streamDimensions: { streamWidth: width, streamHeight: height },
+        settings.modelingSend({
+          type: 'Set context',
+          data: {
+            streamDimensions: {
+              streamWidth: width,
+              streamHeight: height,
+            },
+          },
         })
-        sceneInfra._streamDimensions = {
-          streamWidth: width,
-          streamHeight: height,
-        }
-        // settings.modelingSend({
-        //   type: 'Set context',
-        //   data: {
-        //     streamDimensions: {
-        //       streamWidth: width,
-        //       streamHeight: height,
-        //     },
-        //   },
-        // })
       }
     }, 500)
 
     const onOnline = () => {
-      startEngineInstance()
+      startEngineInstance(true)
     }
 
+    const onVisibilityChange = () => {
+      if (window.document.visibilityState === 'visible') {
+        if (
+          !engineCommandManager.engineConnection?.isReady() &&
+          !engineCommandManager.engineConnection?.isConnecting()
+        ) {
+          startEngineInstance()
+        }
+      }
+    }
+    window.document.addEventListener('visibilitychange', onVisibilityChange)
+
+    const onAnyInput = () => {
+      if (
+        !engineCommandManager.engineConnection?.isReady() &&
+        !engineCommandManager.engineConnection?.isConnecting()
+      ) {
+        startEngineInstance()
+      }
+    }
+    window.document.addEventListener('keydown', onAnyInput)
+    window.document.addEventListener('mousemove', onAnyInput)
+    window.document.addEventListener('mousedown', onAnyInput)
+    window.document.addEventListener('scroll', onAnyInput)
+    window.document.addEventListener('touchstart', onAnyInput)
+
     const onOffline = () => {
+      kclManager.isFirstRender = true
       engineCommandManager.tearDown()
     }
 
@@ -150,11 +162,30 @@ export function useSetupEngineManager(
     window.addEventListener('offline', onOffline)
     window.addEventListener('resize', handleResize)
     return () => {
+      window.document.removeEventListener(
+        'visibilitychange',
+        onVisibilityChange
+      )
+      window.document.removeEventListener('keydown', onAnyInput)
+      window.document.removeEventListener('mousemove', onAnyInput)
+      window.document.removeEventListener('mousedown', onAnyInput)
+      window.document.removeEventListener('scroll', onAnyInput)
+      window.document.removeEventListener('touchstart', onAnyInput)
       window.removeEventListener('online', onOnline)
       window.removeEventListener('offline', onOffline)
       window.removeEventListener('resize', handleResize)
     }
-  }, [])
+
+    // Engine relies on many settings so we should rebind events when it changes
+    // We have to list out the ones we care about because the settings object holds
+    // non-settings too...
+  }, [
+    settings.enableSSAO,
+    settings.highlightEdges,
+    settings.showScaleGrid,
+    settings.theme,
+    settings.pool,
+  ])
 }
 
 function getDimensions(streamWidth?: number, streamHeight?: number) {

src/hooks/useStateMachineCommands.ts

@@ -6,7 +6,11 @@ import { modelingMachine } from 'machines/modelingMachine'
 import { authMachine } from 'machines/authMachine'
 import { settingsMachine } from 'machines/settingsMachine'
 import { homeMachine } from 'machines/homeMachine'
-import { Command, CommandSetConfig, CommandSetSchema } from 'lib/commandTypes'
+import {
+  Command,
+  StateMachineCommandSetConfig,
+  StateMachineCommandSetSchema,
+} from 'lib/commandTypes'
 import { useKclContext } from 'lang/KclProvider'
 import { useNetworkContext } from 'hooks/useNetworkContext'
 import { NetworkHealthState } from 'hooks/useNetworkStatus'
@@ -21,20 +25,20 @@ export type AllMachines =
 
 interface UseStateMachineCommandsArgs<
   T extends AllMachines,
-  S extends CommandSetSchema<T>
+  S extends StateMachineCommandSetSchema<T>
 > {
   machineId: T['id']
   state: StateFrom<T>
   send: Function
   actor: InterpreterFrom<T>
-  commandBarConfig?: CommandSetConfig<T, S>
+  commandBarConfig?: StateMachineCommandSetConfig<T, S>
   allCommandsRequireNetwork?: boolean
   onCancel?: () => void
 }
 
 export default function useStateMachineCommands<
   T extends AnyStateMachine,
-  S extends CommandSetSchema<T>
+  S extends StateMachineCommandSetSchema<T>
 >({
   machineId,
   state,
@@ -58,7 +62,7 @@ export default function useStateMachineCommands<
     const newCommands = state.nextEvents
       .filter((_) => !allCommandsRequireNetwork || !disableAllButtons)
       .filter((e) => !['done.', 'error.'].some((n) => e.includes(n)))
-      .map((type) =>
+      .flatMap((type) =>
         createMachineCommand<T, S>({
           // The group is the owner machine's ID.
           groupId: machineId,

src/index.tsx

@@ -13,6 +13,7 @@ import {
   UpdaterRestartModal,
   createUpdaterRestartModal,
 } from 'components/UpdaterRestartModal'
+import { AppStreamProvider } from 'AppState'
 
 // uncomment for xstate inspector
 // import { DEV } from 'env'
@@ -26,28 +27,30 @@ const root = ReactDOM.createRoot(document.getElementById('root') as HTMLElement)
 
 root.render(
   <HotkeysProvider>
-    <Router />
-    <Toaster
-      position="bottom-center"
-      toastOptions={{
-        style: {
-          borderRadius: '3px',
-        },
-        className:
-          'bg-chalkboard-10 dark:bg-chalkboard-90 text-chalkboard-110 dark:text-chalkboard-10 rounded-sm border-chalkboard-20/50 dark:border-chalkboard-80/50',
-        success: {
-          iconTheme: {
-            primary: 'oklch(89% 0.16 143.4deg)',
-            secondary: 'oklch(48.62% 0.1654 142.5deg)',
+    <AppStreamProvider>
+      <Router />
+      <Toaster
+        position="bottom-center"
+        toastOptions={{
+          style: {
+            borderRadius: '3px',
           },
-          duration:
-            window?.localStorage.getItem('playwright') === 'true'
-              ? 10 // speed up e2e tests
-              : 1500,
-        },
-      }}
-    />
-    <ModalContainer />
+          className:
+            'bg-chalkboard-10 dark:bg-chalkboard-90 text-chalkboard-110 dark:text-chalkboard-10 rounded-sm border-chalkboard-20/50 dark:border-chalkboard-80/50',
+          success: {
+            iconTheme: {
+              primary: 'oklch(89% 0.16 143.4deg)',
+              secondary: 'oklch(48.62% 0.1654 142.5deg)',
+            },
+            duration:
+              window?.localStorage.getItem('playwright') === 'true'
+                ? 10 // speed up e2e tests
+                : 1500,
+          },
+        }}
+      />
+      <ModalContainer />
+    </AppStreamProvider>
   </HotkeysProvider>
 )
 

src/lang/KclProvider.tsx

@@ -3,6 +3,8 @@ import { createContext, useContext, useEffect, useState } from 'react'
 import { type IndexLoaderData } from 'lib/types'
 import { useLoaderData } from 'react-router-dom'
 import { codeManager, kclManager } from 'lib/singletons'
+import { useCommandsContext } from 'hooks/useCommandsContext'
+import { Command } from 'lib/commandTypes'
 
 const KclContext = createContext({
   code: codeManager?.code || '',
@@ -35,6 +37,7 @@ export function KclContextProvider({
   const [errors, setErrors] = useState<KCLError[]>([])
   const [logs, setLogs] = useState<string[]>([])
   const [wasmInitFailed, setWasmInitFailed] = useState(false)
+  const { commandBarSend } = useCommandsContext()
 
   useEffect(() => {
     codeManager.registerCallBacks({
@@ -50,6 +53,28 @@ export function KclContextProvider({
     })
   }, [])
 
+  // Add format code to command palette.
+  useEffect(() => {
+    const commands: Command[] = [
+      {
+        name: 'format-code',
+        displayName: 'Format Code',
+        description: 'Nicely formats the KCL code in the editor.',
+        needsReview: false,
+        groupId: 'code',
+        icon: 'code',
+        onSubmit: (data) => {
+          kclManager.format()
+        },
+      },
+    ]
+    commandBarSend({ type: 'Add commands', data: { commands } })
+
+    return () => {
+      commandBarSend({ type: 'Remove commands', data: { commands } })
+    }
+  }, [kclManager, commandBarSend])
+
   return (
     <KclContext.Provider
       value={{

src/lang/modifyAst.test.ts

@@ -304,7 +304,6 @@ describe('testing sketchOnExtrudedFace', () => {
     const ast = parse(code)
     if (err(ast)) throw ast
 
-    const programMemory = await enginelessExecutor(ast)
     const segmentSnippet = `line([9.7, 9.19], %)`
     const segmentRange: [number, number] = [
       code.indexOf(segmentSnippet),
@@ -321,8 +320,7 @@ describe('testing sketchOnExtrudedFace', () => {
     const extruded = sketchOnExtrudedFace(
       ast,
       segmentPathToNode,
-      extrudePathToNode,
-      programMemory
+      extrudePathToNode
     )
     if (err(extruded)) throw extruded
     const { modifiedAst } = extruded
@@ -345,7 +343,6 @@ const sketch001 = startSketchOn(part001, seg01)`)
   |> extrude(5 + 7, %)`
     const ast = parse(code)
     if (err(ast)) throw ast
-    const programMemory = await enginelessExecutor(ast)
     const segmentSnippet = `close(%)`
     const segmentRange: [number, number] = [
       code.indexOf(segmentSnippet),
@@ -362,8 +359,7 @@ const sketch001 = startSketchOn(part001, seg01)`)
     const extruded = sketchOnExtrudedFace(
       ast,
       segmentPathToNode,
-      extrudePathToNode,
-      programMemory
+      extrudePathToNode
     )
     if (err(extruded)) throw extruded
     const { modifiedAst } = extruded
@@ -386,7 +382,6 @@ const sketch001 = startSketchOn(part001, seg01)`)
   |> extrude(5 + 7, %)`
     const ast = parse(code)
     if (err(ast)) throw ast
-    const programMemory = await enginelessExecutor(ast)
     const sketchSnippet = `startProfileAt([3.58, 2.06], %)`
     const sketchRange: [number, number] = [
       code.indexOf(sketchSnippet),
@@ -404,7 +399,6 @@ const sketch001 = startSketchOn(part001, seg01)`)
       ast,
       sketchPathToNode,
       extrudePathToNode,
-      programMemory,
       'end'
     )
     if (err(extruded)) throw extruded
@@ -436,7 +430,6 @@ const sketch001 = startSketchOn(part001, 'END')`)
     const part001 = extrude(5 + 7, sketch001)`
     const ast = parse(code)
     if (err(ast)) throw ast
-    const programMemory = await enginelessExecutor(ast)
     const segmentSnippet = `line([4.99, -0.46], %)`
     const segmentRange: [number, number] = [
       code.indexOf(segmentSnippet),
@@ -453,8 +446,7 @@ const sketch001 = startSketchOn(part001, 'END')`)
     const updatedAst = sketchOnExtrudedFace(
       ast,
       segmentPathToNode,
-      extrudePathToNode,
-      programMemory
+      extrudePathToNode
     )
     if (err(updatedAst)) throw updatedAst
     const newCode = recast(updatedAst.modifiedAst)

src/lang/modifyAst.ts

@@ -349,7 +349,6 @@ export function sketchOnExtrudedFace(
   node: Program,
   sketchPathToNode: PathToNode,
   extrudePathToNode: PathToNode,
-  programMemory: ProgramMemory,
   cap: 'none' | 'start' | 'end' = 'none'
 ): { modifiedAst: Program; pathToNode: PathToNode } | Error {
   let _node = { ...node }
@@ -388,7 +387,6 @@ export function sketchOnExtrudedFace(
   if (cap === 'none') {
     const __tag = addTagForSketchOnFace(
       {
-        previousProgramMemory: programMemory,
         pathToNode: sketchPathToNode,
         node: _node,
       },

src/lang/modifyAst/addFillet.test.ts

@@ -0,0 +1,315 @@
+import {
+  parse,
+  recast,
+  initPromise,
+  PathToNode,
+  Value,
+  Program,
+  CallExpression,
+} from '../wasm'
+import { addFillet, isTagUsedInFillet } from './addFillet'
+import { getNodeFromPath, getNodePathFromSourceRange } from '../queryAst'
+import { createLiteral } from 'lang/modifyAst'
+import { err } from 'lib/trap'
+
+beforeAll(async () => {
+  await initPromise // Initialize the WASM environment before running tests
+})
+
+const runFilletTest = async (
+  code: string,
+  segmentSnippet: string,
+  extrudeSnippet: string,
+  radius = createLiteral(5) as Value,
+  expectedCode: string
+) => {
+  const astOrError = parse(code)
+  if (astOrError instanceof Error) {
+    return new Error('AST not found')
+  }
+
+  const ast = astOrError as Program
+
+  const segmentRange: [number, number] = [
+    code.indexOf(segmentSnippet),
+    code.indexOf(segmentSnippet) + segmentSnippet.length,
+  ]
+  const pathToSegmentNode: PathToNode = getNodePathFromSourceRange(
+    ast,
+    segmentRange
+  )
+
+  const extrudeRange: [number, number] = [
+    code.indexOf(extrudeSnippet),
+    code.indexOf(extrudeSnippet) + extrudeSnippet.length,
+  ]
+
+  const pathToExtrudeNode: PathToNode = getNodePathFromSourceRange(
+    ast,
+    extrudeRange
+  )
+  if (pathToExtrudeNode instanceof Error) {
+    return new Error('Path to extrude node not found')
+  }
+
+  // const radius = createLiteral(5) as Value
+
+  const result = addFillet(ast, pathToSegmentNode, pathToExtrudeNode, radius)
+  if (result instanceof Error) {
+    return result
+  }
+  const { modifiedAst } = result
+  const newCode = recast(modifiedAst)
+
+  expect(newCode).toContain(expectedCode)
+}
+
+describe('Testing addFillet', () => {
+  /**
+   * 1. Ideal Case
+   */
+
+  it('should add a fillet to a specific segment after extrusion, clean', async () => {
+    const code = `
+      const sketch001 = startSketchOn('XZ')
+        |> startProfileAt([2.16, 49.67], %)
+        |> line([101.49, 139.93], %)
+        |> line([60.04, -55.72], %)
+        |> line([1.29, -115.74], %)
+        |> line([-87.24, -47.08], %)
+        |> tangentialArcTo([56.15, -94.58], %)
+        |> tangentialArcTo([14.68, -104.52], %)
+        |> lineTo([profileStartX(%), profileStartY(%)], %)
+        |> close(%)
+      const extrude001 = extrude(50, sketch001)
+    `
+    const segmentSnippet = `line([60.04, -55.72], %)`
+    const extrudeSnippet = `const extrude001 = extrude(50, sketch001)`
+    const radius = createLiteral(5) as Value
+    const expectedCode = `const sketch001 = startSketchOn('XZ')
+  |> startProfileAt([2.16, 49.67], %)
+  |> line([101.49, 139.93], %)
+  |> line([60.04, -55.72], %, $seg01)
+  |> line([1.29, -115.74], %)
+  |> line([-87.24, -47.08], %)
+  |> tangentialArcTo([56.15, -94.58], %)
+  |> tangentialArcTo([14.68, -104.52], %)
+  |> lineTo([profileStartX(%), profileStartY(%)], %)
+  |> close(%)
+const extrude001 = extrude(50, sketch001)
+  |> fillet({ radius: 5, tags: [seg01] }, %)`
+
+    await runFilletTest(
+      code,
+      segmentSnippet,
+      extrudeSnippet,
+      radius,
+      expectedCode
+    )
+  })
+
+  /**
+   * 2. Case of existing tag in the other line
+   */
+
+  it('should add a fillet to a specific segment after extrusion with existing tag in any other line', async () => {
+    const code = `
+        const sketch001 = startSketchOn('XZ')
+          |> startProfileAt([2.16, 49.67], %)
+          |> line([101.49, 139.93], %)
+          |> line([60.04, -55.72], %)
+          |> line([1.29, -115.74], %)
+          |> line([-87.24, -47.08], %, $seg01)
+          |> tangentialArcTo([56.15, -94.58], %)
+          |> tangentialArcTo([14.68, -104.52], %)
+          |> lineTo([profileStartX(%), profileStartY(%)], %)
+          |> close(%)
+        const extrude001 = extrude(50, sketch001)
+      `
+    const segmentSnippet = `line([60.04, -55.72], %)`
+    const extrudeSnippet = `const extrude001 = extrude(50, sketch001)`
+    const radius = createLiteral(5) as Value
+    const expectedCode = `const sketch001 = startSketchOn('XZ')
+  |> startProfileAt([2.16, 49.67], %)
+  |> line([101.49, 139.93], %)
+  |> line([60.04, -55.72], %, $seg02)
+  |> line([1.29, -115.74], %)
+  |> line([-87.24, -47.08], %, $seg01)
+  |> tangentialArcTo([56.15, -94.58], %)
+  |> tangentialArcTo([14.68, -104.52], %)
+  |> lineTo([profileStartX(%), profileStartY(%)], %)
+  |> close(%)
+const extrude001 = extrude(50, sketch001)
+  |> fillet({ radius: 5, tags: [seg02] }, %)`
+
+    await runFilletTest(
+      code,
+      segmentSnippet,
+      extrudeSnippet,
+      radius,
+      expectedCode
+    )
+  })
+
+  /**
+   * 3. Case of existing tag in the fillet line
+   */
+
+  it('should add a fillet to a specific segment after extrusion with existing tag in that exact line', async () => {
+    const code = `
+        const sketch001 = startSketchOn('XZ')
+          |> startProfileAt([2.16, 49.67], %)
+          |> line([101.49, 139.93], %)
+          |> line([60.04, -55.72], %)
+          |> line([1.29, -115.74], %)
+          |> line([-87.24, -47.08], %, $seg03)
+          |> tangentialArcTo([56.15, -94.58], %)
+          |> tangentialArcTo([14.68, -104.52], %)
+          |> lineTo([profileStartX(%), profileStartY(%)], %)
+          |> close(%)
+        const extrude001 = extrude(50, sketch001)
+      `
+    const segmentSnippet = `line([-87.24, -47.08], %, $seg03)`
+    const extrudeSnippet = `const extrude001 = extrude(50, sketch001)`
+    const radius = createLiteral(5) as Value
+    const expectedCode = `const sketch001 = startSketchOn('XZ')
+  |> startProfileAt([2.16, 49.67], %)
+  |> line([101.49, 139.93], %)
+  |> line([60.04, -55.72], %)
+  |> line([1.29, -115.74], %)
+  |> line([-87.24, -47.08], %, $seg03)
+  |> tangentialArcTo([56.15, -94.58], %)
+  |> tangentialArcTo([14.68, -104.52], %)
+  |> lineTo([profileStartX(%), profileStartY(%)], %)
+  |> close(%)
+const extrude001 = extrude(50, sketch001)
+  |> fillet({ radius: 5, tags: [seg03] }, %)`
+
+    await runFilletTest(
+      code,
+      segmentSnippet,
+      extrudeSnippet,
+      radius,
+      expectedCode
+    )
+  })
+
+  /**
+   * 4. Case of existing fillet on some other segment
+   */
+
+  it('should add another fillet after the existing fillet', async () => {
+    const code = `const sketch001 = startSketchOn('XZ')
+            |> startProfileAt([2.16, 49.67], %)
+            |> line([101.49, 139.93], %)
+            |> line([60.04, -55.72], %)
+            |> line([1.29, -115.74], %)
+            |> line([-87.24, -47.08], %, $seg03)
+            |> tangentialArcTo([56.15, -94.58], %)
+            |> tangentialArcTo([14.68, -104.52], %)
+            |> lineTo([profileStartX(%), profileStartY(%)], %)
+            |> close(%)
+          const extrude001 = extrude(50, sketch001)
+            |> fillet({ radius: 10, tags: [seg03] }, %)`
+    const segmentSnippet = `line([60.04, -55.72], %)`
+    const extrudeSnippet = `const extrude001 = extrude(50, sketch001)`
+    const radius = createLiteral(5) as Value
+    const expectedCode = `const sketch001 = startSketchOn('XZ')
+  |> startProfileAt([2.16, 49.67], %)
+  |> line([101.49, 139.93], %)
+  |> line([60.04, -55.72], %, $seg01)
+  |> line([1.29, -115.74], %)
+  |> line([-87.24, -47.08], %, $seg03)
+  |> tangentialArcTo([56.15, -94.58], %)
+  |> tangentialArcTo([14.68, -104.52], %)
+  |> lineTo([profileStartX(%), profileStartY(%)], %)
+  |> close(%)
+const extrude001 = extrude(50, sketch001)
+  |> fillet({ radius: 10, tags: [seg03] }, %)
+  |> fillet({ radius: 5, tags: [seg01] }, %)`
+
+    await runFilletTest(
+      code,
+      segmentSnippet,
+      extrudeSnippet,
+      radius,
+      expectedCode
+    )
+  })
+})
+
+describe('Testing isTagUsedInFillet', () => {
+  const code = `const sketch001 = startSketchOn('XZ')
+  |> startProfileAt([7.72, 4.13], %)
+  |> line([7.11, 3.48], %, $seg01)
+  |> line([-3.29, -13.85], %)
+  |> line([-6.37, 3.88], %, $seg02)
+  |> close(%)
+const extrude001 = extrude(-5, sketch001)
+  |> fillet({
+       radius: 1.11,
+       tags: [
+         getOppositeEdge(seg01, %),
+         seg01,
+         getPreviousAdjacentEdge(seg02, %)
+       ]
+     }, %)
+`
+  it('should correctly identify getOppositeEdge and baseEdge edges', () => {
+    const ast = parse(code)
+    if (err(ast)) return
+    const lineOfInterest = `line([7.11, 3.48], %, $seg01)`
+    const range: [number, number] = [
+      code.indexOf(lineOfInterest),
+      code.indexOf(lineOfInterest) + lineOfInterest.length,
+    ]
+    const pathToNode = getNodePathFromSourceRange(ast, range)
+    if (err(pathToNode)) return
+    const callExp = getNodeFromPath<CallExpression>(
+      ast,
+      pathToNode,
+      'CallExpression'
+    )
+    if (err(callExp)) return
+    const edges = isTagUsedInFillet({ ast, callExp: callExp.node })
+    expect(edges).toEqual(['getOppositeEdge', 'baseEdge'])
+  })
+  it('should correctly identify getPreviousAdjacentEdge edges', () => {
+    const ast = parse(code)
+    if (err(ast)) return
+    const lineOfInterest = `line([-6.37, 3.88], %, $seg02)`
+    const range: [number, number] = [
+      code.indexOf(lineOfInterest),
+      code.indexOf(lineOfInterest) + lineOfInterest.length,
+    ]
+    const pathToNode = getNodePathFromSourceRange(ast, range)
+    if (err(pathToNode)) return
+    const callExp = getNodeFromPath<CallExpression>(
+      ast,
+      pathToNode,
+      'CallExpression'
+    )
+    if (err(callExp)) return
+    const edges = isTagUsedInFillet({ ast, callExp: callExp.node })
+    expect(edges).toEqual(['getPreviousAdjacentEdge'])
+  })
+  it('should correctly identify no edges', () => {
+    const ast = parse(code)
+    if (err(ast)) return
+    const lineOfInterest = `line([-3.29, -13.85], %)`
+    const range: [number, number] = [
+      code.indexOf(lineOfInterest),
+      code.indexOf(lineOfInterest) + lineOfInterest.length,
+    ]
+    const pathToNode = getNodePathFromSourceRange(ast, range)
+    if (err(pathToNode)) return
+    const callExp = getNodeFromPath<CallExpression>(
+      ast,
+      pathToNode,
+      'CallExpression'
+    )
+    if (err(callExp)) return
+    const edges = isTagUsedInFillet({ ast, callExp: callExp.node })
+    expect(edges).toEqual([])
+  })
+})

src/lang/modifyAst/addFillet.ts

@@ -0,0 +1,404 @@
+import {
+  ArrayExpression,
+  CallExpression,
+  ObjectExpression,
+  PathToNode,
+  Program,
+  Value,
+  VariableDeclaration,
+  VariableDeclarator,
+} from '../wasm'
+import {
+  createCallExpressionStdLib,
+  createLiteral,
+  createPipeSubstitution,
+  createObjectExpression,
+  createArrayExpression,
+  createIdentifier,
+  createPipeExpression,
+} from '../modifyAst'
+import {
+  getNodeFromPath,
+  getNodePathFromSourceRange,
+  hasSketchPipeBeenExtruded,
+  traverse,
+} from '../queryAst'
+import {
+  addTagForSketchOnFace,
+  getTagFromCallExpression,
+  sketchLineHelperMap,
+} from '../std/sketch'
+import { err } from 'lib/trap'
+import { Selections, canFilletSelection } from 'lib/selections'
+
+export function addFillet(
+  node: Program,
+  pathToSegmentNode: PathToNode,
+  pathToExtrudeNode: PathToNode,
+  radius = createLiteral(5) as Value
+  // shouldPipe = false, // TODO: Implement this feature
+): { modifiedAst: Program; pathToFilletNode: PathToNode } | Error {
+  // close ast to make mutations safe
+  let _node: Program = JSON.parse(JSON.stringify(node))
+
+  /**
+   * Add Tag to the Segment Expression
+   */
+
+  // Find the specific sketch segment to tag with the new tag
+  const sketchSegmentChunk = getNodeFromPath(
+    _node,
+    pathToSegmentNode,
+    'CallExpression'
+  )
+  if (err(sketchSegmentChunk)) return sketchSegmentChunk
+  const { node: sketchSegmentNode } = sketchSegmentChunk as {
+    node: CallExpression
+  }
+
+  // Check whether selection is a valid segment from sketchLineHelpersMap
+  if (!(sketchSegmentNode.callee.name in sketchLineHelperMap)) {
+    return new Error('Selection is not a sketch segment')
+  }
+
+  // Add tag to the sketch segment or use existing tag
+  const taggedSegment = addTagForSketchOnFace(
+    {
+      // previousProgramMemory: programMemory,
+      pathToNode: pathToSegmentNode,
+      node: _node,
+    },
+    sketchSegmentNode.callee.name
+  )
+  if (err(taggedSegment)) return taggedSegment
+  const { tag } = taggedSegment
+
+  /**
+   * Find Extrude Expression automatically
+   */
+
+  // 1. Get the sketch name
+
+  /**
+   * Add Fillet to the Extrude expression
+   */
+
+  // Create the fillet call expression in one line
+  const filletCall = createCallExpressionStdLib('fillet', [
+    createObjectExpression({
+      radius: radius,
+      tags: createArrayExpression([createIdentifier(tag)]),
+    }),
+    createPipeSubstitution(),
+  ])
+
+  // Locate the extrude call
+  const extrudeChunk = getNodeFromPath<VariableDeclaration>(
+    _node,
+    pathToExtrudeNode,
+    'VariableDeclaration'
+  )
+  if (err(extrudeChunk)) return extrudeChunk
+  const { node: extrudeVarDecl } = extrudeChunk
+
+  const extrudeDeclarator = extrudeVarDecl.declarations[0]
+  const extrudeInit = extrudeDeclarator.init
+
+  if (
+    !extrudeDeclarator ||
+    (extrudeInit.type !== 'CallExpression' &&
+      extrudeInit.type !== 'PipeExpression')
+  ) {
+    return new Error('Extrude PipeExpression / CallExpression not found.')
+  }
+
+  // determine if extrude is in a PipeExpression or CallExpression
+
+  // CallExpression - no fillet
+  // PipeExpression - fillet exists
+
+  const getPathToNodeOfFilletLiteral = (
+    pathToExtrudeNode: PathToNode,
+    extrudeDeclarator: VariableDeclarator,
+    tag: string
+  ): PathToNode => {
+    let pathToFilletObj: any
+    let inFillet = false
+    traverse(extrudeDeclarator.init, {
+      enter(node, path) {
+        if (node.type === 'CallExpression' && node.callee.name === 'fillet') {
+          inFillet = true
+        }
+        if (inFillet && node.type === 'ObjectExpression') {
+          const hasTag = node.properties.some((prop) => {
+            const isTagProp = prop.key.name === 'tags'
+            if (isTagProp && prop.value.type === 'ArrayExpression') {
+              return prop.value.elements.some(
+                (element) =>
+                  element.type === 'Identifier' && element.name === tag
+              )
+            }
+            return false
+          })
+          if (!hasTag) return false
+          pathToFilletObj = path
+          node.properties.forEach((prop, index) => {
+            if (prop.key.name === 'radius') {
+              pathToFilletObj.push(
+                ['properties', 'ObjectExpression'],
+                [index, 'index'],
+                ['value', 'Property']
+              )
+            }
+          })
+        }
+      },
+      leave(node) {
+        if (node.type === 'CallExpression' && node.callee.name === 'fillet') {
+          inFillet = false
+        }
+      },
+    })
+    let indexOfPipeExpression = pathToExtrudeNode.findIndex(
+      (path) => path[1] === 'PipeExpression'
+    )
+    indexOfPipeExpression =
+      indexOfPipeExpression === -1
+        ? pathToExtrudeNode.length
+        : indexOfPipeExpression
+
+    return [
+      ...pathToExtrudeNode.slice(0, indexOfPipeExpression),
+      ...pathToFilletObj,
+    ]
+  }
+
+  if (extrudeInit.type === 'CallExpression') {
+    // 1. no fillet case
+    extrudeDeclarator.init = createPipeExpression([extrudeInit, filletCall])
+    return {
+      modifiedAst: _node,
+      pathToFilletNode: getPathToNodeOfFilletLiteral(
+        pathToExtrudeNode,
+        extrudeDeclarator,
+        tag
+      ),
+    }
+  } else if (extrudeInit.type === 'PipeExpression') {
+    // 2. fillet case
+
+    // there are 2 options here:
+
+    const existingFilletCall = extrudeInit.body.find((node) => {
+      return node.type === 'CallExpression' && node.callee.name === 'fillet'
+    })
+
+    if (!existingFilletCall || existingFilletCall.type !== 'CallExpression') {
+      return new Error('Fillet CallExpression not found.')
+    }
+
+    // check if the existing fillet has the same tag as the new fillet
+    let filletTag = null
+    if (existingFilletCall.arguments[0].type === 'ObjectExpression') {
+      const properties = (existingFilletCall.arguments[0] as ObjectExpression)
+        .properties
+      const tagsProperty = properties.find((prop) => prop.key.name === 'tags')
+      if (tagsProperty && tagsProperty.value.type === 'ArrayExpression') {
+        const elements = (tagsProperty.value as ArrayExpression).elements
+        if (elements.length > 0 && elements[0].type === 'Identifier') {
+          filletTag = elements[0].name
+        }
+      }
+    } else {
+      return new Error('Expected an ObjectExpression node')
+    }
+
+    if (filletTag !== tag) {
+      extrudeInit.body.push(filletCall)
+      return {
+        modifiedAst: _node,
+        pathToFilletNode: getPathToNodeOfFilletLiteral(
+          pathToExtrudeNode,
+          extrudeDeclarator,
+          tag
+        ),
+      }
+    }
+  } else {
+    return new Error('Unsupported extrude type.')
+  }
+
+  return new Error('Unsupported extrude type.')
+}
+
+export const hasValidFilletSelection = ({
+  selectionRanges,
+  ast,
+  code,
+}: {
+  selectionRanges: Selections
+  ast: Program
+  code: string
+}) => {
+  // case 0: check if there is anything filletable in the scene
+  let extrudeExists = false
+  traverse(ast, {
+    enter(node) {
+      if (node.type === 'CallExpression' && node.callee.name === 'extrude') {
+        extrudeExists = true
+      }
+    },
+  })
+  if (!extrudeExists) return false
+
+  // case 1: nothing selected, test whether the extrusion exists
+  if (selectionRanges) {
+    if (selectionRanges.codeBasedSelections.length === 0) {
+      return true
+    }
+    const range0 = selectionRanges.codeBasedSelections[0].range[0]
+    const codeLength = code.length
+    if (range0 === codeLength) {
+      return true
+    }
+  }
+
+  // case 2: sketch segment selected, test whether it is extruded
+  // TODO: add loft / sweep check
+  if (selectionRanges.codeBasedSelections.length > 0) {
+    const isExtruded = hasSketchPipeBeenExtruded(
+      selectionRanges.codeBasedSelections[0],
+      ast
+    )
+    if (isExtruded) {
+      const pathToSelectedNode = getNodePathFromSourceRange(
+        ast,
+        selectionRanges.codeBasedSelections[0].range
+      )
+      const segmentNode = getNodeFromPath<CallExpression>(
+        ast,
+        pathToSelectedNode,
+        'CallExpression'
+      )
+      if (err(segmentNode)) return false
+      if (segmentNode.node.type === 'CallExpression') {
+        const segmentName = segmentNode.node.callee.name
+        if (segmentName in sketchLineHelperMap) {
+          const edges = isTagUsedInFillet({
+            ast,
+            callExp: segmentNode.node,
+          })
+          // edge has already been filleted
+          if (
+            ['edge', 'default'].includes(
+              selectionRanges.codeBasedSelections[0].type
+            ) &&
+            edges.includes('baseEdge')
+          )
+            return false
+          return true
+        } else {
+          return false
+        }
+      }
+    } else {
+      return false
+    }
+  }
+
+  return canFilletSelection(selectionRanges)
+}
+
+type EdgeTypes =
+  | 'baseEdge'
+  | 'getNextAdjacentEdge'
+  | 'getPreviousAdjacentEdge'
+  | 'getOppositeEdge'
+
+export const isTagUsedInFillet = ({
+  ast,
+  callExp,
+}: {
+  ast: Program
+  callExp: CallExpression
+}): Array<EdgeTypes> => {
+  const tag = getTagFromCallExpression(callExp)
+  if (err(tag)) return []
+
+  let inFillet = false
+  let inObj = false
+  let inTagHelper: EdgeTypes | '' = ''
+  const edges: Array<EdgeTypes> = []
+  traverse(ast, {
+    enter: (node) => {
+      if (node.type === 'CallExpression' && node.callee.name === 'fillet') {
+        inFillet = true
+      }
+      if (inFillet && node.type === 'ObjectExpression') {
+        node.properties.forEach((prop) => {
+          if (
+            prop.key.name === 'tags' &&
+            prop.value.type === 'ArrayExpression'
+          ) {
+            inObj = true
+          }
+        })
+      }
+      if (
+        inObj &&
+        inFillet &&
+        node.type === 'CallExpression' &&
+        (node.callee.name === 'getOppositeEdge' ||
+          node.callee.name === 'getNextAdjacentEdge' ||
+          node.callee.name === 'getPreviousAdjacentEdge')
+      ) {
+        inTagHelper = node.callee.name
+      }
+      if (
+        inObj &&
+        inFillet &&
+        !inTagHelper &&
+        node.type === 'Identifier' &&
+        node.name === tag
+      ) {
+        edges.push('baseEdge')
+      }
+      if (
+        inObj &&
+        inFillet &&
+        inTagHelper &&
+        node.type === 'Identifier' &&
+        node.name === tag
+      ) {
+        edges.push(inTagHelper)
+      }
+    },
+    leave: (node) => {
+      if (node.type === 'CallExpression' && node.callee.name === 'fillet') {
+        inFillet = false
+      }
+      if (inFillet && node.type === 'ObjectExpression') {
+        node.properties.forEach((prop) => {
+          if (
+            prop.key.name === 'tags' &&
+            prop.value.type === 'ArrayExpression'
+          ) {
+            inObj = true
+          }
+        })
+      }
+      if (
+        inObj &&
+        inFillet &&
+        node.type === 'CallExpression' &&
+        (node.callee.name === 'getOppositeEdge' ||
+          node.callee.name === 'getNextAdjacentEdge' ||
+          node.callee.name === 'getPreviousAdjacentEdge')
+      ) {
+        inTagHelper = ''
+      }
+    },
+  })
+
+  return edges
+}

src/lang/std/engineConnection.ts

@@ -143,6 +143,7 @@ export enum DisconnectingType {
   Error = 'error',
   Timeout = 'timeout',
   Quit = 'quit',
+  Pause = 'pause',
 }
 
 // Sorted by severity
@@ -200,6 +201,7 @@ export type DisconnectingValue =
   | State<DisconnectingType.Error, ErrorType>
   | State<DisconnectingType.Timeout, void>
   | State<DisconnectingType.Quit, void>
+  | State<DisconnectingType.Pause, void>
 
 // These are ordered by the expected sequence.
 export enum ConnectingType {
@@ -300,7 +302,31 @@ class EngineConnection extends EventTarget {
   pc?: RTCPeerConnection
   unreliableDataChannel?: RTCDataChannel
   mediaStream?: MediaStream
-  freezeFrame: boolean = false
+  idleMode: boolean = false
+
+  onIceCandidate = function (
+    this: RTCPeerConnection,
+    event: RTCPeerConnectionIceEvent
+  ) {}
+  onIceCandidateError = function (
+    this: RTCPeerConnection,
+    event: RTCPeerConnectionIceErrorEvent
+  ) {}
+  onConnectionStateChange = function (this: RTCPeerConnection, event: Event) {}
+  onDataChannelOpen = function (this: RTCDataChannel, event: Event) {}
+  onDataChannelClose = function (this: RTCDataChannel, event: Event) {}
+  onDataChannelError = function (this: RTCDataChannel, event: Event) {}
+  onDataChannelMessage = function (this: RTCDataChannel, event: MessageEvent) {}
+  onDataChannel = function (
+    this: RTCPeerConnection,
+    event: RTCDataChannelEvent
+  ) {}
+  onTrack = function (this: RTCPeerConnection, event: RTCTrackEvent) {}
+  onWebSocketOpen = function (event: Event) {}
+  onWebSocketClose = function (event: Event) {}
+  onWebSocketError = function (event: Event) {}
+  onWebSocketMessage = function (event: MessageEvent) {}
+  onNetworkStatusReady = () => {}
 
   private _state: EngineConnectionState = {
     type: EngineConnectionStateType.Fresh,
@@ -346,6 +372,7 @@ class EngineConnection extends EventTarget {
   private engineCommandManager: EngineCommandManager
 
   private pingPongSpan: { ping?: Date; pong?: Date }
+  private pingIntervalId: ReturnType<typeof setInterval>
 
   constructor({
     engineCommandManager,
@@ -366,10 +393,10 @@ class EngineConnection extends EventTarget {
     this.pingPongSpan = { ping: undefined, pong: undefined }
 
     // Without an interval ping, our connection will timeout.
-    // If this.freezeFrame is true we skip this logic so only reconnect
+    // If this.idleMode is true we skip this logic so only reconnect
     // happens on mouse move
-    setInterval(() => {
-      if (this.freezeFrame) return
+    this.pingIntervalId = setInterval(() => {
+      if (this.idleMode) return
 
       switch (this.state.type as EngineConnectionStateType) {
         case EngineConnectionStateType.ConnectionEstablished:
@@ -431,13 +458,60 @@ class EngineConnection extends EventTarget {
     return this.state.type === EngineConnectionStateType.ConnectionEstablished
   }
 
-  tearDown(opts?: { freeze: boolean }) {
-    this.freezeFrame = opts?.freeze ?? false
+  tearDown(opts?: { idleMode: boolean }) {
+    this.idleMode = opts?.idleMode ?? false
     this.disconnectAll()
-    this.state = {
-      type: EngineConnectionStateType.Disconnecting,
-      value: { type: DisconnectingType.Quit },
-    }
+    clearInterval(this.pingIntervalId)
+
+    this.pc?.removeEventListener('icecandidate', this.onIceCandidate)
+    this.pc?.removeEventListener('icecandidateerror', this.onIceCandidateError)
+    this.pc?.removeEventListener(
+      'connectionstatechange',
+      this.onConnectionStateChange
+    )
+    this.pc?.removeEventListener('track', this.onTrack)
+
+    this.unreliableDataChannel?.removeEventListener(
+      'open',
+      this.onDataChannelOpen
+    )
+    this.unreliableDataChannel?.removeEventListener(
+      'close',
+      this.onDataChannelClose
+    )
+    this.unreliableDataChannel?.removeEventListener(
+      'error',
+      this.onDataChannelError
+    )
+    this.unreliableDataChannel?.removeEventListener(
+      'message',
+      this.onDataChannelMessage
+    )
+    this.pc?.removeEventListener('datachannel', this.onDataChannel)
+
+    this.websocket?.removeEventListener('open', this.onWebSocketOpen)
+    this.websocket?.removeEventListener('close', this.onWebSocketClose)
+    this.websocket?.removeEventListener('error', this.onWebSocketError)
+    this.websocket?.removeEventListener('message', this.onWebSocketMessage)
+
+    window.removeEventListener(
+      'use-network-status-ready',
+      this.onNetworkStatusReady
+    )
+
+    this.state = opts?.idleMode
+      ? {
+          type: EngineConnectionStateType.Disconnecting,
+          value: {
+            type: DisconnectingType.Pause,
+          },
+        }
+      : {
+          type: EngineConnectionStateType.Disconnecting,
+          value: {
+            type: DisconnectingType.Quit,
+          },
+        }
   }
 
   /**
@@ -477,7 +551,7 @@ class EngineConnection extends EventTarget {
         },
       }
 
-      this.pc.addEventListener('icecandidate', (event) => {
+      this.onIceCandidate = (event: RTCPeerConnectionIceEvent) => {
         if (event.candidate === null) {
           return
         }
@@ -499,18 +573,20 @@ class EngineConnection extends EventTarget {
             usernameFragment: event.candidate.usernameFragment || undefined,
           },
         })
-      })
+      }
+      this.pc.addEventListener('icecandidate', this.onIceCandidate)
 
-      this.pc.addEventListener('icecandidateerror', (_event: Event) => {
+      this.onIceCandidateError = (_event: Event) => {
         const event = _event as RTCPeerConnectionIceErrorEvent
         console.warn(
           `ICE candidate returned an error: ${event.errorCode}: ${event.errorText} for ${event.url}`
         )
-      })
+      }
+      this.pc.addEventListener('icecandidateerror', this.onIceCandidateError)
 
       // https://developer.mozilla.org/en-US/docs/Web/API/RTCPeerConnection/connectionstatechange_event
       // Event type: generic Event type...
-      this.pc.addEventListener('connectionstatechange', (event: any) => {
+      this.onConnectionStateChange = (event: any) => {
         console.log('connectionstatechange: ' + event.target?.connectionState)
         switch (event.target?.connectionState) {
           // From what I understand, only after have we done the ICE song and
@@ -539,9 +615,13 @@ class EngineConnection extends EventTarget {
           default:
             break
         }
-      })
+      }
+      this.pc.addEventListener(
+        'connectionstatechange',
+        this.onConnectionStateChange
+      )
 
-      this.pc.addEventListener('track', (event) => {
+      this.onTrack = (event) => {
         const mediaStream = event.streams[0]
 
         this.state = {
@@ -625,9 +705,10 @@ class EngineConnection extends EventTarget {
         // to pass it to the rest of the application.
 
         this.mediaStream = mediaStream
-      })
+      }
+      this.pc.addEventListener('track', this.onTrack)
 
-      this.pc.addEventListener('datachannel', (event) => {
+      this.onDataChannel = (event) => {
         this.unreliableDataChannel = event.channel
 
         this.state = {
@@ -638,7 +719,7 @@ class EngineConnection extends EventTarget {
           },
         }
 
-        this.unreliableDataChannel.addEventListener('open', (event) => {
+        this.onDataChannelOpen = (event) => {
           this.state = {
             type: EngineConnectionStateType.Connecting,
             value: {
@@ -654,14 +735,22 @@ class EngineConnection extends EventTarget {
           this.dispatchEvent(
             new CustomEvent(EngineConnectionEvents.Opened, { detail: this })
           )
-        })
+        }
+        this.unreliableDataChannel?.addEventListener(
+          'open',
+          this.onDataChannelOpen
+        )
 
-        this.unreliableDataChannel.addEventListener('close', (event) => {
+        this.onDataChannelClose = (event) => {
           this.disconnectAll()
           this.finalizeIfAllConnectionsClosed()
-        })
+        }
+        this.unreliableDataChannel?.addEventListener(
+          'close',
+          this.onDataChannelClose
+        )
 
-        this.unreliableDataChannel.addEventListener('error', (event) => {
+        this.onDataChannelError = (event) => {
           this.disconnectAll()
 
           this.state = {
@@ -674,8 +763,13 @@ class EngineConnection extends EventTarget {
               },
             },
           }
-        })
-        this.unreliableDataChannel.addEventListener('message', (event) => {
+        }
+        this.unreliableDataChannel?.addEventListener(
+          'error',
+          this.onDataChannelError
+        )
+
+        this.onDataChannelMessage = (event) => {
           const result: UnreliableResponses = JSON.parse(event.data)
           Object.values(
             this.engineCommandManager.unreliableSubscriptions[result.type] || {}
@@ -697,8 +791,13 @@ class EngineConnection extends EventTarget {
               }
             }
           )
-        })
-      })
+        }
+        this.unreliableDataChannel.addEventListener(
+          'message',
+          this.onDataChannelMessage
+        )
+      }
+      this.pc.addEventListener('datachannel', this.onDataChannel)
     }
 
     const createWebSocketConnection = () => {
@@ -712,7 +811,7 @@ class EngineConnection extends EventTarget {
       this.websocket = new WebSocket(this.url, [])
       this.websocket.binaryType = 'arraybuffer'
 
-      this.websocket.addEventListener('open', (event) => {
+      this.onWebSocketOpen = (event) => {
         this.state = {
           type: EngineConnectionStateType.Connecting,
           value: {
@@ -733,14 +832,16 @@ class EngineConnection extends EventTarget {
         // Send an initial ping
         this.send({ type: 'ping' })
         this.pingPongSpan.ping = new Date()
-      })
+      }
+      this.websocket.addEventListener('open', this.onWebSocketOpen)
 
-      this.websocket.addEventListener('close', (event) => {
+      this.onWebSocketClose = (event) => {
         this.disconnectAll()
         this.finalizeIfAllConnectionsClosed()
-      })
+      }
+      this.websocket.addEventListener('close', this.onWebSocketClose)
 
-      this.websocket.addEventListener('error', (event) => {
+      this.onWebSocketError = (event) => {
         this.disconnectAll()
 
         this.state = {
@@ -753,9 +854,10 @@ class EngineConnection extends EventTarget {
             },
           },
         }
-      })
+      }
+      this.websocket.addEventListener('error', this.onWebSocketError)
 
-      this.websocket.addEventListener('message', (event) => {
+      this.onWebSocketMessage = (event) => {
         // In the EngineConnection, we're looking for messages to/from
         // the server that relate to the ICE handshake, or WebRTC
         // negotiation. There may be other messages (including ArrayBuffer
@@ -960,15 +1062,20 @@ class EngineConnection extends EventTarget {
             })
             break
         }
-      })
+      }
+      this.websocket.addEventListener('message', this.onWebSocketMessage)
     }
 
     if (reconnecting) {
       createWebSocketConnection()
     } else {
-      window.addEventListener('use-network-status-ready', () => {
+      this.onNetworkStatusReady = () => {
         createWebSocketConnection()
-      })
+      }
+      window.addEventListener(
+        'use-network-status-ready',
+        this.onNetworkStatusReady
+      )
     }
   }
   // Do not change this back to an object or any, we should only be sending the
@@ -1003,8 +1110,6 @@ class EngineConnection extends EventTarget {
       this.unreliableDataChannel?.readyState === 'closed'
     if (allClosed) {
       // Do not notify the rest of the program that we have cut off anything.
-      if (this.freezeFrame) return
-
       this.state = { type: EngineConnectionStateType.Disconnected }
     }
   }
@@ -1154,7 +1259,15 @@ export class EngineCommandManager extends EventTarget {
   private makeDefaultPlanes: () => Promise<DefaultPlanes> | null = () => null
   private modifyGrid: (hidden: boolean) => Promise<void> | null = () => null
 
+  private onEngineConnectionOpened = () => {}
+  private onEngineConnectionClosed = () => {}
+  private onEngineConnectionStarted = ({ detail: engineConnection }: any) => {}
+  private onEngineConnectionNewTrack = ({
+    detail,
+  }: CustomEvent<NewTrackArgs>) => {}
+
   start({
+    restart,
     setMediaStream,
     setIsStreamReady,
     width,
@@ -1170,6 +1283,7 @@ export class EngineCommandManager extends EventTarget {
       showScaleGrid: false,
     },
   }: {
+    restart?: boolean
     setMediaStream: (stream: MediaStream) => void
     setIsStreamReady: (isStreamReady: boolean) => void
     width: number
@@ -1215,162 +1329,168 @@ export class EngineCommandManager extends EventTarget {
       })
     )
 
+    this.onEngineConnectionOpened = () => {
+      // Set the stream background color
+      // This takes RGBA values from 0-1
+      // So we convert from the conventional 0-255 found in Figma
+
+      void this.sendSceneCommand({
+        type: 'modeling_cmd_req',
+        cmd_id: uuidv4(),
+        cmd: {
+          type: 'set_background_color',
+          color: getThemeColorForEngine(settings.theme),
+        },
+      })
+
+      // Sets the default line colors
+      const opposingTheme = getOppositeTheme(settings.theme)
+      this.sendSceneCommand({
+        cmd_id: uuidv4(),
+        type: 'modeling_cmd_req',
+        cmd: {
+          type: 'set_default_system_properties',
+          color: getThemeColorForEngine(opposingTheme),
+        },
+      })
+
+      // Set the edge lines visibility
+      this.sendSceneCommand({
+        type: 'modeling_cmd_req',
+        cmd_id: uuidv4(),
+        cmd: {
+          type: 'edge_lines_visible' as any, // TODO: update kittycad.ts to use the correct type
+          hidden: !settings.highlightEdges,
+        },
+      })
+
+      this._camControlsCameraChange()
+      this.sendSceneCommand({
+        // CameraControls subscribes to default_camera_get_settings response events
+        // firing this at connection ensure the camera's are synced initially
+        type: 'modeling_cmd_req',
+        cmd_id: uuidv4(),
+        cmd: {
+          type: 'default_camera_get_settings',
+        },
+      })
+      // We want modify the grid first because we don't want it to flash.
+      // Ideally these would already be default hidden in engine (TODO do
+      // that) https://github.com/KittyCAD/engine/issues/2282
+      this.modifyGrid(!settings.showScaleGrid)?.then(async () => {
+        await this.initPlanes()
+        this.resolveReady()
+        setIsStreamReady(true)
+        await executeCode()
+      })
+    }
     this.engineConnection.addEventListener(
       EngineConnectionEvents.Opened,
-      () => {
-        // Set the stream background color
-        // This takes RGBA values from 0-1
-        // So we convert from the conventional 0-255 found in Figma
-
-        void this.sendSceneCommand({
-          type: 'modeling_cmd_req',
-          cmd_id: uuidv4(),
-          cmd: {
-            type: 'set_background_color',
-            color: getThemeColorForEngine(settings.theme),
-          },
-        })
-
-        // Sets the default line colors
-        const opposingTheme = getOppositeTheme(settings.theme)
-        this.sendSceneCommand({
-          cmd_id: uuidv4(),
-          type: 'modeling_cmd_req',
-          cmd: {
-            type: 'set_default_system_properties',
-            color: getThemeColorForEngine(opposingTheme),
-          },
-        })
-
-        // Set the edge lines visibility
-        this.sendSceneCommand({
-          type: 'modeling_cmd_req',
-          cmd_id: uuidv4(),
-          cmd: {
-            type: 'edge_lines_visible' as any, // TODO: update kittycad.ts to use the correct type
-            hidden: !settings.highlightEdges,
-          },
-        })
-
-        this._camControlsCameraChange()
-        this.sendSceneCommand({
-          // CameraControls subscribes to default_camera_get_settings response events
-          // firing this at connection ensure the camera's are synced initially
-          type: 'modeling_cmd_req',
-          cmd_id: uuidv4(),
-          cmd: {
-            type: 'default_camera_get_settings',
-          },
-        })
-        // We want modify the grid first because we don't want it to flash.
-        // Ideally these would already be default hidden in engine (TODO do
-        // that) https://github.com/KittyCAD/engine/issues/2282
-        this.modifyGrid(!settings.showScaleGrid)?.then(async () => {
-          await this.initPlanes()
-          this.resolveReady()
-          setIsStreamReady(true)
-          await executeCode()
-        })
-      }
+      this.onEngineConnectionOpened
     )
 
+    this.onEngineConnectionClosed = () => {
+      setIsStreamReady(false)
+    }
     this.engineConnection.addEventListener(
       EngineConnectionEvents.Closed,
-      () => {
-        setIsStreamReady(false)
-      }
+      this.onEngineConnectionClosed
     )
 
-    this.engineConnection.addEventListener(
-      EngineConnectionEvents.ConnectionStarted,
-      ({ detail: engineConnection }: any) => {
-        engineConnection?.pc?.addEventListener(
-          'datachannel',
-          (event: RTCDataChannelEvent) => {
-            let unreliableDataChannel = event.channel
+    this.onEngineConnectionStarted = ({ detail: engineConnection }: any) => {
+      engineConnection?.pc?.addEventListener(
+        'datachannel',
+        (event: RTCDataChannelEvent) => {
+          let unreliableDataChannel = event.channel
 
-            unreliableDataChannel.addEventListener(
-              'message',
-              (event: MessageEvent) => {
-                const result: UnreliableResponses = JSON.parse(event.data)
-                Object.values(
-                  this.unreliableSubscriptions[result.type] || {}
-                ).forEach(
-                  // TODO: There is only one response that uses the unreliable channel atm,
-                  // highlight_set_entity, if there are more it's likely they will all have the same
-                  // sequence logic, but I'm not sure if we use a single global sequence or a sequence
-                  // per unreliable subscription.
-                  (callback) => {
-                    let data = result?.data
-                    if (isHighlightSetEntity_type(data)) {
-                      if (
-                        data.sequence !== undefined &&
-                        data.sequence > this.inSequence
-                      ) {
-                        this.inSequence = data.sequence
-                        callback(result)
-                      }
+          unreliableDataChannel.addEventListener(
+            'message',
+            (event: MessageEvent) => {
+              const result: UnreliableResponses = JSON.parse(event.data)
+              Object.values(
+                this.unreliableSubscriptions[result.type] || {}
+              ).forEach(
+                // TODO: There is only one response that uses the unreliable channel atm,
+                // highlight_set_entity, if there are more it's likely they will all have the same
+                // sequence logic, but I'm not sure if we use a single global sequence or a sequence
+                // per unreliable subscription.
+                (callback) => {
+                  let data = result?.data
+                  if (isHighlightSetEntity_type(data)) {
+                    if (
+                      data.sequence !== undefined &&
+                      data.sequence > this.inSequence
+                    ) {
+                      this.inSequence = data.sequence
+                      callback(result)
                     }
                   }
-                )
-              }
-            )
-          }
-        )
-
-        // When the EngineConnection starts a connection, we want to register
-        // callbacks into the WebSocket/PeerConnection.
-        engineConnection.websocket?.addEventListener('message', ((
-          event: MessageEvent
-        ) => {
-          if (event.data instanceof ArrayBuffer) {
-            // If the data is an ArrayBuffer, it's  the result of an export command,
-            // because in all other cases we send JSON strings. But in the case of
-            // export we send a binary blob.
-            // Pass this to our export function.
-            exportSave(event.data).then(() => {
-              this.pendingExport?.resolve()
-            }, this.pendingExport?.reject)
-          } else {
-            const message: Models['WebSocketResponse_type'] = JSON.parse(
-              event.data
-            )
-            if (
-              message.success &&
-              (message.resp.type === 'modeling' ||
-                message.resp.type === 'modeling_batch') &&
-              message.request_id
-            ) {
-              this.handleModelingCommand(
-                message.resp,
-                message.request_id,
-                message
+                }
               )
-            } else if (
-              !message.success &&
-              message.request_id &&
-              this.artifactMap[message.request_id]
-            ) {
-              this.handleFailedModelingCommand(message.request_id, message)
             }
+          )
+        }
+      )
+
+      // When the EngineConnection starts a connection, we want to register
+      // callbacks into the WebSocket/PeerConnection.
+      engineConnection.websocket?.addEventListener('message', ((
+        event: MessageEvent
+      ) => {
+        if (event.data instanceof ArrayBuffer) {
+          // If the data is an ArrayBuffer, it's  the result of an export command,
+          // because in all other cases we send JSON strings. But in the case of
+          // export we send a binary blob.
+          // Pass this to our export function.
+          exportSave(event.data).then(() => {
+            this.pendingExport?.resolve()
+          }, this.pendingExport?.reject)
+        } else {
+          const message: Models['WebSocketResponse_type'] = JSON.parse(
+            event.data
+          )
+          if (
+            message.success &&
+            (message.resp.type === 'modeling' ||
+              message.resp.type === 'modeling_batch') &&
+            message.request_id
+          ) {
+            this.handleModelingCommand(
+              message.resp,
+              message.request_id,
+              message
+            )
+          } else if (
+            !message.success &&
+            message.request_id &&
+            this.artifactMap[message.request_id]
+          ) {
+            this.handleFailedModelingCommand(message.request_id, message)
           }
-        }) as EventListener)
+        }
+      }) as EventListener)
 
-        this.engineConnection?.addEventListener(
-          EngineConnectionEvents.NewTrack,
-          (({ detail: { mediaStream } }: CustomEvent<NewTrackArgs>) => {
-            mediaStream.getVideoTracks()[0].addEventListener('mute', () => {
-              console.error(
-                'video track mute: check webrtc internals -> inbound rtp'
-              )
-            })
+      this.onEngineConnectionNewTrack = ({
+        detail: { mediaStream },
+      }: CustomEvent<NewTrackArgs>) => {
+        mediaStream.getVideoTracks()[0].addEventListener('mute', () => {
+          console.error(
+            'video track mute: check webrtc internals -> inbound rtp'
+          )
+        })
 
-            setMediaStream(mediaStream)
-          }) as EventListener
-        )
-
-        this.engineConnection?.connect()
+        setMediaStream(mediaStream)
       }
+      this.engineConnection?.addEventListener(
+        EngineConnectionEvents.NewTrack,
+        this.onEngineConnectionNewTrack as EventListener
+      )
+
+      this.engineConnection?.connect()
+    }
+    this.engineConnection.addEventListener(
+      EngineConnectionEvents.ConnectionStarted,
+      this.onEngineConnectionStarted
     )
   }
 
@@ -1627,15 +1747,34 @@ export class EngineCommandManager extends EventTarget {
       }
     }
   }
-  tearDown() {
+  tearDown(opts?: { idleMode: boolean }) {
     if (this.engineConnection) {
-      this.engineConnection?.tearDown()
+      this.engineConnection.removeEventListener(
+        EngineConnectionEvents.Opened,
+        this.onEngineConnectionOpened
+      )
+      this.engineConnection.removeEventListener(
+        EngineConnectionEvents.Closed,
+        this.onEngineConnectionClosed
+      )
+      this.engineConnection.removeEventListener(
+        EngineConnectionEvents.ConnectionStarted,
+        this.onEngineConnectionStarted
+      )
+      this.engineConnection.removeEventListener(
+        EngineConnectionEvents.NewTrack,
+        this.onEngineConnectionNewTrack as EventListener
+      )
+
+      this.engineConnection?.tearDown(opts)
+      this.engineConnection = undefined
+
       // Our window.tearDown assignment causes this case to happen which is
       // only really for tests.
       // @ts-ignore
     } else if (this.engineCommandManager?.engineConnection) {
       // @ts-ignore
-      this.engineCommandManager?.engineConnection?.tearDown()
+      this.engineCommandManager?.engineConnection?.tearDown(opts)
     }
   }
   async startNewSession() {

src/lang/std/sketch.test.ts

@@ -221,7 +221,7 @@ describe('testing addTagForSketchOnFace', () => {
     const pathToNode = getNodePathFromSourceRange(ast, sourceRange)
     const sketchOnFaceRetVal = addTagForSketchOnFace(
       {
-        previousProgramMemory: programMemory,
+        // previousProgramMemory: programMemory, // redundant?
         pathToNode,
         node: ast,
       },

src/lang/std/sketch.ts

@@ -28,7 +28,6 @@ import { createPipeExpression, splitPathAtPipeExpression } from '../modifyAst'
 
 import {
   SketchLineHelper,
-  ModifyAstBase,
   TransformCallback,
   ConstrainInfo,
   RawValues,
@@ -37,6 +36,7 @@ import {
   SingleValueInput,
   VarValueKeys,
   ArrayOrObjItemInput,
+  AddTagInfo,
 } from 'lang/std/stdTypes'
 
 import {
@@ -308,6 +308,18 @@ function singleRawValueHelper(
   ]
 }
 
+function getTag(index = 2): SketchLineHelper['getTag'] {
+  return (callExp: CallExpression) => {
+    if (callExp.type !== 'CallExpression')
+      return new Error('Not a CallExpression')
+    const arg = callExp.arguments?.[index]
+    if (!arg) return new Error('No argument')
+    if (arg.type !== 'TagDeclarator')
+      return new Error('Tag not a TagDeclarator')
+    return arg.value
+  }
+}
+
 export const lineTo: SketchLineHelper = {
   add: ({
     node,
@@ -377,6 +389,7 @@ export const lineTo: SketchLineHelper = {
       pathToNode,
     }
   },
+  getTag: getTag(),
   addTag: addTag(),
   getConstraintInfo: (callExp, ...args) =>
     commonConstraintInfoHelper(
@@ -503,6 +516,7 @@ export const line: SketchLineHelper = {
       pathToNode,
     }
   },
+  getTag: getTag(),
   addTag: addTag(),
   getConstraintInfo: (callExp, ...args) =>
     commonConstraintInfoHelper(
@@ -563,6 +577,7 @@ export const xLineTo: SketchLineHelper = {
       pathToNode,
     }
   },
+  getTag: getTag(),
   addTag: addTag(),
   getConstraintInfo: (callExp, ...args) =>
     horzVertConstraintInfoHelper(
@@ -623,6 +638,7 @@ export const yLineTo: SketchLineHelper = {
       pathToNode,
     }
   },
+  getTag: getTag(),
   addTag: addTag(),
   getConstraintInfo: (callExp, ...args) =>
     horzVertConstraintInfoHelper(
@@ -682,6 +698,7 @@ export const xLine: SketchLineHelper = {
       pathToNode,
     }
   },
+  getTag: getTag(),
   addTag: addTag(),
   getConstraintInfo: (callExp, ...args) =>
     horzVertConstraintInfoHelper(
@@ -738,6 +755,7 @@ export const yLine: SketchLineHelper = {
       pathToNode,
     }
   },
+  getTag: getTag(),
   addTag: addTag(),
   getConstraintInfo: (callExp, ...args) =>
     horzVertConstraintInfoHelper(
@@ -830,6 +848,7 @@ export const tangentialArcTo: SketchLineHelper = {
       pathToNode,
     }
   },
+  getTag: getTag(),
   addTag: addTag(),
   getConstraintInfo: (callExp: CallExpression, code, pathToNode) => {
     if (callExp.type !== 'CallExpression') return []
@@ -948,6 +967,7 @@ export const angledLine: SketchLineHelper = {
       pathToNode,
     }
   },
+  getTag: getTag(),
   addTag: addTag(),
   getConstraintInfo: (callExp, ...args) =>
     commonConstraintInfoHelper(
@@ -1044,6 +1064,7 @@ export const angledLineOfXLength: SketchLineHelper = {
       pathToNode,
     }
   },
+  getTag: getTag(),
   addTag: addTag(),
   getConstraintInfo: (callExp, ...args) =>
     commonConstraintInfoHelper(
@@ -1140,6 +1161,7 @@ export const angledLineOfYLength: SketchLineHelper = {
       pathToNode,
     }
   },
+  getTag: getTag(),
   addTag: addTag(),
   getConstraintInfo: (callExp, ...args) =>
     commonConstraintInfoHelper(
@@ -1227,6 +1249,7 @@ export const angledLineToX: SketchLineHelper = {
       pathToNode,
     }
   },
+  getTag: getTag(),
   addTag: addTag(),
   getConstraintInfo: (callExp, ...args) =>
     commonConstraintInfoHelper(
@@ -1316,6 +1339,7 @@ export const angledLineToY: SketchLineHelper = {
       pathToNode,
     }
   },
+  getTag: getTag(),
   addTag: addTag(),
   getConstraintInfo: (callExp, ...args) =>
     commonConstraintInfoHelper(
@@ -1440,6 +1464,7 @@ export const angledLineThatIntersects: SketchLineHelper = {
       pathToNode,
     }
   },
+  getTag: getTag(),
   addTag: addTag(),
   getConstraintInfo: (callExp: CallExpression, code, pathToNode) => {
     if (callExp.type !== 'CallExpression') return []
@@ -1792,10 +1817,7 @@ export function replaceSketchLine({
   return { modifiedAst, valueUsedInTransform, pathToNode }
 }
 
-export function addTagForSketchOnFace(
-  a: ModifyAstBase,
-  expressionName: string
-) {
+export function addTagForSketchOnFace(a: AddTagInfo, expressionName: string) {
   if (expressionName === 'close') {
     return addTag(1)(a)
   }
@@ -1806,6 +1828,17 @@ export function addTagForSketchOnFace(
   return new Error(`"${expressionName}" is not a sketch line helper`)
 }
 
+export function getTagFromCallExpression(
+  callExp: CallExpression
+): string | Error {
+  if (callExp.callee.name === 'close') return getTag(1)(callExp)
+  if (callExp.callee.name in sketchLineHelperMap) {
+    const { getTag } = sketchLineHelperMap[callExp.callee.name]
+    return getTag(callExp)
+  }
+  return new Error(`"${callExp.callee.name}" is not a sketch line helper`)
+}
+
 function isAngleLiteral(lineArugement: Value): boolean {
   return lineArugement?.type === 'ArrayExpression'
     ? isLiteralArrayOrStatic(lineArugement.elements[0])
@@ -1816,9 +1849,7 @@ function isAngleLiteral(lineArugement: Value): boolean {
     : false
 }
 
-type addTagFn = (
-  a: ModifyAstBase
-) => { modifiedAst: Program; tag: string } | Error
+type addTagFn = (a: AddTagInfo) => { modifiedAst: Program; tag: string } | Error
 
 function addTag(tagIndex = 2): addTagFn {
   return ({ node, pathToNode }) => {

src/lang/std/stdTypes.ts

@@ -32,6 +32,11 @@ export interface ModifyAstBase {
   pathToNode: PathToNode
 }
 
+export interface AddTagInfo {
+  node: Program
+  pathToNode: PathToNode
+}
+
 interface addCall extends ModifyAstBase {
   to: [number, number]
   from: [number, number]
@@ -127,7 +132,8 @@ export interface SketchLineHelper {
         pathToNode: PathToNode
       }
     | Error
-  addTag: (a: ModifyAstBase) =>
+  getTag: (a: CallExpression) => string | Error
+  addTag: (a: AddTagInfo) =>
     | {
         modifiedAst: Program
         tag: string

src/lib/commandBarConfigs/authCommandConfig.ts

@@ -1,9 +1,9 @@
-import { CommandSetConfig } from 'lib/commandTypes'
+import { StateMachineCommandSetConfig } from 'lib/commandTypes'
 import { authMachine } from 'machines/authMachine'
 
 type AuthCommandSchema = {}
 
-export const authCommandBarConfig: CommandSetConfig<
+export const authCommandBarConfig: StateMachineCommandSetConfig<
   typeof authMachine,
   AuthCommandSchema
 > = {

src/lib/commandBarConfigs/homeCommandConfig.ts

@@ -1,4 +1,4 @@
-import { CommandSetConfig } from 'lib/commandTypes'
+import { StateMachineCommandSetConfig } from 'lib/commandTypes'
 import { homeMachine } from 'machines/homeMachine'
 
 export type HomeCommandSchema = {
@@ -17,7 +17,7 @@ export type HomeCommandSchema = {
   }
 }
 
-export const homeCommandBarConfig: CommandSetConfig<
+export const homeCommandBarConfig: StateMachineCommandSetConfig<
   typeof homeMachine,
   HomeCommandSchema
 > = {

src/lib/commandBarConfigs/modelingCommandConfig.ts

@@ -1,8 +1,8 @@
 import { Models } from '@kittycad/lib'
-import { CommandSetConfig, KclCommandValue } from 'lib/commandTypes'
+import { StateMachineCommandSetConfig, KclCommandValue } from 'lib/commandTypes'
 import { KCL_DEFAULT_LENGTH } from 'lib/constants'
 import { Selections } from 'lib/selections'
-import { modelingMachine } from 'machines/modelingMachine'
+import { modelingMachine, SketchTool } from 'machines/modelingMachine'
 
 type OutputFormat = Models['OutputFormat_type']
 type OutputTypeKey = OutputFormat['type']
@@ -27,9 +27,17 @@ export type ModelingCommandSchema = {
     // result: (typeof EXTRUSION_RESULTS)[number]
     distance: KclCommandValue
   }
+  Fillet: {
+    // todo
+    selection: Selections
+    radius: KclCommandValue
+  }
+  'change tool': {
+    tool: SketchTool
+  }
 }
 
-export const modelingMachineConfig: CommandSetConfig<
+export const modelingMachineCommandConfig: StateMachineCommandSetConfig<
   typeof modelingMachine,
   ModelingCommandSchema
 > = {
@@ -37,22 +45,47 @@ export const modelingMachineConfig: CommandSetConfig<
     description: 'Enter sketch mode.',
     icon: 'sketch',
   },
-  // TODO the event is no 'change tool' with data: 'line', 'rectangle' etc
-  // 'Equip Line tool': {
-  //   description: 'Start drawing straight lines.',
-  //   icon: 'line',
-  //   displayName: 'Line',
-  // },
-  // 'Equip tangential arc to': {
-  //   description: 'Start drawing an arc tangent to the current segment.',
-  //   icon: 'arc',
-  //   displayName: 'Tangential Arc',
-  // },
-  // 'Equip rectangle tool': {
-  //   description: 'Start drawing a rectangle.',
-  //   icon: 'rectangle',
-  //   displayName: 'Rectangle',
-  // },
+  'change tool': [
+    {
+      description: 'Start drawing straight lines.',
+      icon: 'line',
+      displayName: 'Line',
+      args: {
+        tool: {
+          defaultValue: 'line',
+          required: true,
+          skip: true,
+          inputType: 'string',
+        },
+      },
+    },
+    {
+      description: 'Start drawing an arc tangent to the current segment.',
+      icon: 'arc',
+      displayName: 'Tangential Arc',
+      args: {
+        tool: {
+          defaultValue: 'tangentialArc',
+          required: true,
+          skip: true,
+          inputType: 'string',
+        },
+      },
+    },
+    {
+      description: 'Start drawing a rectangle.',
+      icon: 'rectangle',
+      displayName: 'Rectangle',
+      args: {
+        tool: {
+          defaultValue: 'rectangle',
+          required: true,
+          skip: true,
+          inputType: 'string',
+        },
+      },
+    },
+  ],
   Export: {
     description: 'Export the current model.',
     icon: 'exportFile',
@@ -157,4 +190,36 @@ export const modelingMachineConfig: CommandSetConfig<
       },
     },
   },
+  Fillet: {
+    // todo
+    description: 'Fillet edge',
+    icon: 'fillet',
+    needsReview: true,
+    args: {
+      selection: {
+        inputType: 'selection',
+        selectionTypes: [
+          'default',
+          'line-end',
+          'line-mid',
+          'extrude-wall', // to fix: accespts only this selection type
+          'start-cap',
+          'end-cap',
+          'point',
+          'edge',
+          'line',
+          'arc',
+          'all',
+        ],
+        multiple: true, // TODO: multiple selection like in extrude command
+        required: true,
+        skip: true,
+      },
+      radius: {
+        inputType: 'kcl',
+        defaultValue: KCL_DEFAULT_LENGTH,
+        required: true,
+      },
+    },
+  },
 }

src/lib/commandBarConfigs/settingsCommandConfig.ts

@@ -124,6 +124,7 @@ export function createSettingsCommand({
     displayName: `Settings · ${decamelize(type.replaceAll('.', ' · '), {
       separator: ' ',
     })}`,
+    description: settingConfig.description,
     groupId: 'settings',
     icon: 'settings',
     needsReview: false,

src/lib/commandTypes.ts

@@ -33,13 +33,13 @@ export interface KclExpressionWithVariable extends KclExpression {
 export type KclCommandValue = KclExpression | KclExpressionWithVariable
 export type CommandInputType = (typeof INPUT_TYPES)[number]
 
-export type CommandSetSchema<T extends AnyStateMachine> = Partial<{
+export type StateMachineCommandSetSchema<T extends AnyStateMachine> = Partial<{
   [EventType in EventFrom<T>['type']]: Record<string, any>
 }>
 
-export type CommandSet<
+export type StateMachineCommandSet<
   T extends AllMachines,
-  Schema extends CommandSetSchema<T>
+  Schema extends StateMachineCommandSetSchema<T>
 > = Partial<{
   [EventType in EventFrom<T>['type']]: Command<
     T,
@@ -48,21 +48,25 @@ export type CommandSet<
   >
 }>
 
-export type CommandSetConfig<
+/**
+ * A configuration object for a set of commands tied to a state machine.
+ * Each event type can have one or more commands associated with it.
+ * @param T The state machine type.
+ * @param Schema The schema for the command set, defined by the developer.
+ */
+export type StateMachineCommandSetConfig<
   T extends AllMachines,
-  Schema extends CommandSetSchema<T>
+  Schema extends StateMachineCommandSetSchema<T>
 > = Partial<{
-  [EventType in EventFrom<T>['type']]: CommandConfig<
-    T,
-    EventFrom<T>['type'],
-    Schema[EventType]
-  >
+  [EventType in EventFrom<T>['type']]:
+    | CommandConfig<T, EventFrom<T>['type'], Schema[EventType]>
+    | CommandConfig<T, EventFrom<T>['type'], Schema[EventType]>[]
 }>
 
 export type Command<
   T extends AnyStateMachine = AnyStateMachine,
   CommandName extends EventFrom<T>['type'] = EventFrom<T>['type'],
-  CommandSchema extends CommandSetSchema<T>[CommandName] = CommandSetSchema<T>[CommandName]
+  CommandSchema extends StateMachineCommandSetSchema<T>[CommandName] = StateMachineCommandSetSchema<T>[CommandName]
 > = {
   name: CommandName
   groupId: T['id']
@@ -81,7 +85,7 @@ export type Command<
 export type CommandConfig<
   T extends AnyStateMachine = AnyStateMachine,
   CommandName extends EventFrom<T>['type'] = EventFrom<T>['type'],
-  CommandSchema extends CommandSetSchema<T>[CommandName] = CommandSetSchema<T>[CommandName]
+  CommandSchema extends StateMachineCommandSetSchema<T>[CommandName] = StateMachineCommandSetSchema<T>[CommandName]
 > = Omit<
   Command<T, CommandName, CommandSchema>,
   'name' | 'groupId' | 'onSubmit' | 'onCancel' | 'args' | 'needsReview'

src/lib/constants.ts

@@ -51,6 +51,7 @@ export const ONBOARDING_PROJECT_NAME = 'Tutorial Project $nn'
 export const KCL_DEFAULT_CONSTANT_PREFIXES = {
   SKETCH: 'sketch',
   EXTRUDE: 'extrude',
+  SEGMENT: 'seg',
 } as const
 /** The default KCL length expression */
 export const KCL_DEFAULT_LENGTH = `5`

src/lib/createMachineCommand.ts

@@ -11,20 +11,20 @@ import {
   CommandArgument,
   CommandArgumentConfig,
   CommandConfig,
-  CommandSetConfig,
-  CommandSetSchema,
+  StateMachineCommandSetConfig,
+  StateMachineCommandSetSchema,
 } from './commandTypes'
 
 interface CreateMachineCommandProps<
   T extends AnyStateMachine,
-  S extends CommandSetSchema<T>
+  S extends StateMachineCommandSetSchema<T>
 > {
   type: EventFrom<T>['type']
   groupId: T['id']
   state: StateFrom<T>
   send: Function
   actor: InterpreterFrom<T>
-  commandBarConfig?: CommandSetConfig<T, S>
+  commandBarConfig?: StateMachineCommandSetConfig<T, S>
   onCancel?: () => void
 }
 
@@ -32,7 +32,7 @@ interface CreateMachineCommandProps<
 // from a more terse Command Bar Meta definition.
 export function createMachineCommand<
   T extends AnyStateMachine,
-  S extends CommandSetSchema<T>
+  S extends StateMachineCommandSetSchema<T>
 >({
   groupId,
   type,
@@ -41,13 +41,30 @@ export function createMachineCommand<
   actor,
   commandBarConfig,
   onCancel,
-}: CreateMachineCommandProps<T, S>): Command<
-  T,
-  typeof type,
-  S[typeof type]
-> | null {
+}: CreateMachineCommandProps<T, S>):
+  | Command<T, typeof type, S[typeof type]>
+  | Command<T, typeof type, S[typeof type]>[]
+  | null {
   const commandConfig = commandBarConfig && commandBarConfig[type]
-  if (!commandConfig) return null
+  // There may be no command config for this event type,
+  // or there may be multiple commands to create.
+  if (!commandConfig) {
+    return null
+  } else if (commandConfig instanceof Array) {
+    return commandConfig
+      .map((config) =>
+        createMachineCommand({
+          groupId,
+          type,
+          state,
+          send,
+          actor,
+          commandBarConfig: { [type]: config },
+          onCancel,
+        })
+      )
+      .filter((c) => c !== null) as Command<T, typeof type, S[typeof type]>[]
+  }
 
   // Hide commands based on platform by returning `null`
   // so the consumer can filter them out
@@ -64,6 +81,7 @@ export function createMachineCommand<
     name: type,
     groupId,
     icon,
+    description: commandConfig.description,
     needsReview: commandConfig.needsReview || false,
     onSubmit: (data?: S[typeof type]) => {
       if (data !== undefined && data !== null) {
@@ -84,6 +102,10 @@ export function createMachineCommand<
     command.onCancel = onCancel
   }
 
+  if ('displayName' in commandConfig) {
+    command.displayName = commandConfig.displayName
+  }
+
   return command
 }
 
@@ -92,7 +114,7 @@ export function createMachineCommand<
 // bundled together into the args for a Command.
 function buildCommandArguments<
   T extends AnyStateMachine,
-  S extends CommandSetSchema<T>,
+  S extends StateMachineCommandSetSchema<T>,
   CommandName extends EventFrom<T>['type'] = EventFrom<T>['type']
 >(
   state: StateFrom<T>,
@@ -112,7 +134,7 @@ function buildCommandArguments<
 
 export function buildCommandArgument<
   T extends AnyStateMachine,
-  O extends CommandSetSchema<T> = CommandSetSchema<T>
+  O extends StateMachineCommandSetSchema<T> = StateMachineCommandSetSchema<T>
 >(
   arg: CommandArgumentConfig<O, T>,
   context: ContextFrom<T>,

src/lib/selections.ts

@@ -406,6 +406,17 @@ export function canExtrudeSelection(selection: Selections) {
   )
 }
 
+export function canFilletSelection(selection: Selections) {
+  const commonNodes = selection.codeBasedSelections.map((_, i) =>
+    buildCommonNodeFromSelection(selection, i)
+  ) // TODO FILLET DUMMY PLACEHOLDER
+  return (
+    !!isSketchPipe(selection) &&
+    commonNodes.every((n) => nodeHasClose(n)) &&
+    commonNodes.every((n) => !nodeHasExtrude(n))
+  )
+}
+
 function canExtrudeSelectionItem(selection: Selections, i: number) {
   const commonNode = buildCommonNodeFromSelection(selection, i)
 

src/lib/settings/initialSettings.tsx

@@ -163,6 +163,17 @@ export function createSettings() {
         validate: (v) => typeof v === 'boolean',
         hideOnPlatform: 'both', //for now
       }),
+      /**
+       * Stream resource saving behavior toggle
+       */
+      streamIdleMode: new Setting<boolean>({
+        defaultValue: false,
+        description: 'Toggle stream idling, saving bandwidth and battery',
+        validate: (v) => typeof v === 'boolean',
+        commandConfig: {
+          inputType: 'boolean',
+        },
+      }),
       onboardingStatus: new Setting<string>({
         defaultValue: '',
         validate: (v) => typeof v === 'string',

src/lib/settings/settingsUtils.ts

@@ -38,6 +38,7 @@ function configurationToSettingsPayload(
         : undefined,
       onboardingStatus: configuration?.settings?.app?.onboarding_status,
       dismissWebBanner: configuration?.settings?.app?.dismiss_web_banner,
+      streamIdleMode: configuration?.settings?.app?.stream_idle_mode,
       projectDirectory: configuration?.settings?.project?.directory,
       enableSSAO: configuration?.settings?.modeling?.enable_ssao,
     },
@@ -75,6 +76,7 @@ function projectConfigurationToSettingsPayload(
         : undefined,
       onboardingStatus: configuration?.settings?.app?.onboarding_status,
       dismissWebBanner: configuration?.settings?.app?.dismiss_web_banner,
+      streamIdleMode: configuration?.settings?.app?.stream_idle_mode,
       enableSSAO: configuration?.settings?.modeling?.enable_ssao,
     },
     modeling: {

src/lib/singletons.ts

@@ -37,4 +37,7 @@ if (typeof window !== 'undefined') {
     document.addEventListener('mousemove', (e) =>
       console.log(`await page.mouse.click(${e.clientX}, ${e.clientY})`)
     )
+  ;(window as any).enableFillet = () => {
+    ;(window as any)._enableFillet = true
+  }
 }

src/lib/useCalculateKclExpression.ts

@@ -6,7 +6,7 @@ import { PrevVariable, findAllPreviousVariables } from 'lang/queryAst'
 import { Value, parse } from 'lang/wasm'
 import { useEffect, useRef, useState } from 'react'
 import { executeAst } from 'lang/langHelpers'
-import { trap } from 'lib/trap'
+import { err, trap } from 'lib/trap'
 
 const isValidVariableName = (name: string) =>
   /^[a-zA-Z_][a-zA-Z0-9_]*$/.test(name)
@@ -86,6 +86,7 @@ export function useCalculateKclExpression({
     const execAstAndSetResult = async () => {
       const _code = `const __result__ = ${value}`
       const ast = parse(_code)
+      if (err(ast)) return
       if (trap(ast, { suppress: true })) return
 
       const _programMem: any = { root: {}, return: null }

src/machines/commandBarMachine.ts

@@ -66,7 +66,7 @@ export type CommandBarMachineEvent =
 
 export const commandBarMachine = createMachine(
   {
-    /** @xstate-layout N4IgpgJg5mDOIC5QGED2BbdBDAdhABAEJYBOAxMgDaqxgDaADALqKgAONAlgC6eo6sQAD0QBaAJwA6AGwAmAKwBmBoukAWafIAcDcSoA0IAJ6JZDaZIDs8hgzV6AjA61a1DWQF8PhtJlwFiciowUkYWJBAOWB4+AQiRBFF5CwdpcVkHS1lpVyU5QxNEh1lFGTUsrUUtOQd5SwZLLx8MbDwiUkkqGkgyAHk2MBwwwSiY-kEEswZJbPltM0U3eXLZAsRFeQcrerUHRbTFvfkmkF9WgI6u2ggyADFONv98WkowAGNufDeW-2GI0d443iiHESkktUUilkskqdiUWjWCAcDC0kjUqnElkc6lkoK0JzOT0CnWo1zIAEEIARvn48LA-uwuIC4qAEqIHJjJPJcYtxFoYdJFFjVsZEG5pqCquJxJoGvJxOUCT82sSrj0AEpgdCoABuYC+yog9OYIyZsQmYmhWzMmTqLnU0kyikRGVRbj5lg2SmUam5StpFxIkgAymBXh8HlADQGyKHw58aecGZEzUDWYgchY7CisWoSlpQQ5EVDLJJxKkdIpyypUop-ed2kHCW0Xu9uD1kwDzcCEJCtlUNgWhZZ1OlnaKEBpZJItHVzDZ5xlpPWiZdDc8w22Ow5wozosyLUiVNMSg5ytVKmfrIipzO564z2otPVpI1vKd18SAOJYbgACzAEhI3wUgoAAV3QQZuFgCg-1wGAvjAkgSCgkCSHAyCcG4TtUxZYRED2TQZGSOw80qaQ7ARCc9mmZYSksextGkNJBRXFUOh-f9AOA0CIKgmCABE4E3D5oyTE1-lww8clKBjZF2Bh5SFZwXUUyRVDzJwNE2LQzzYwNJE4gCgJwKNeMw6DJHJAB3LAYlM-AHjYMDuFjMCACN0B4NCMKgnD927dMkWSUs8yY8RISfWQshvcsrDlapshULJPHfZsDKM7iHPM-jJAANSwShOAgX9IzICB+DASQHh1VAAGsqp1Qrit-MByXQvisP8sY8ISZwbCsDllBLSwz1qRFBQsRZ5WRIVkui-TG0M39jJ4jqLNgfLmpK3hTLIQCSFQIM2EoX8ADMjvQSQmqKna2vWvyJL3HrD1SEoyzSdJUkUm9dnUtQn10aK6hkxbiU1HVODAay3M87zE1+J6UwCtN8IQUauR0OZ0ksFwUUqRFPWmUdouPXR3TBjoIahmHKQIHKuqRrtUYSaVShhLF+TkeTzBFQosVKDRM2RVInEdSmg2p6GyE1bU9R8zrsKZqSexFqQHWlHNXHzCbFhnX1+UydFkVxiXJClmGAFEIG8hmld3ZGXp7TR5C5RSCxdjlQV1tR9bqaVdhsSFxDN5AALeOrgPa3ysJgiqcCqmr6sa7bWujxXjQd5nesQZYthsblIQYJx6hUic9AsdEFT2HQzByVLmgDJaw-eSOHPTjbysq6qcFqhrrtT9sO-4ugd1NFGc4QXEPo5eVLGsFxlnKREXGnZI9HcT1mOikO0s-S5w7bqNh9j-bkKOyQTvOy6B9utOHtj7qD1V8pSyrHJZ3STY4QmjQ0R2Ww0oSjuF3u+HAqAIBwEEOlRs48nZBVENkKQNprC42qBoJ0LothaXMJ9aElRXDLj3k3VUpJIBwOfgg4oMx8y41SPUOY8p5DFk2GiKoxsoRVmhGoM2cY2zAQRngChgU0a7HZtFH0ilRp1D5usVh6JXCKD2CUdI8lQ7rlbB8chkkJ6HkxFsBeulbQZAUCwrYCiqzIhyE+fqZtMomTMg-aCwiWYEV2NOBUCghQ6EFGzYsvpwQUT5MxawFECx2JWllRxMdLI2TsrtKMTkXIuMnmeCiZYwrePMFWCKv1XZKVGroWwmxNARK4g4hWG0tp3wSSk16lQpC41ULjV8uxUjSBvFCNEDTdCOkWCY44xCGzgzAJDaGdTnaZHBADYcqg5DpCovzeRno5izA0BeUOh8o5OPgDo+BaNvqV0xNFaE7gdYTnnvkmUChdKEMyF4LwQA */
+    /** @xstate-layout N4IgpgJg5mDOIC5QGED2BbdBDAdhABAEJYBOAxMgDaqxgDaADALqKgAONAlgC6eo6sQAD0QBaAJwA6AGwAmAKwBmBoukAWafIAcDcSoA0IAJ6JZDaZIDs8hgzV6AjA61a1DWQF8PhtJlwFiciowUkYWJBAOWB4+AQiRBFF5CwdpcVkHS1lpVyU5QxNEh1lFGTUsrUUtOQd5SwZLLx8MbDwiUkkqGkgyAHk2MBwwwSiY-kEEswZJbPltM0U3eXLZAsRFeQcrerUHRbTFvfkmkF9WgI6u2ggyADFONv98WkowAGNufDeW-2GI0d443iiHESkktUUilkskqdiUWjWCAcDC0kjUqnElkc6lkoK0JzOT0CnWo1zIAEEIARvn48LA-uwuIC4qAEqIHJjJPJcYtxFoYdJFFjVsZEG5pqCquJxJoGvJxOUCT82sSrj0AEpgdCoABuYC+yog9OYIyZsQmYmhWzMmTqLnU0kyikRGVRbj5lg2SmUam5StpFxIkgAymBXh8HlADQGyKHw58aecGZEzUDWYgchY7CisWoSlpQQ5EVDLJJxKkdIpyypUop-ed2kHCW0Xu9uD1kwDzcCEJCtlUNgWhZZ1OlnaKEBpZJItHVzDZ5xlpPWiZdDc8w22O7JwozosyLUj3KiZZY85YtMUNgx5Ii81JuS5xBtPVCCyuVR0AOJYbgACzAEhI3wUgoAAV3QQZuFgCg-1wGAvjAkgSCgkCSHAyCcG4TtUxZYRED2TQZGSOw80qaQ7ARCc9mmZYSjPPFpDSQUP0DSQf3-QDgNAiCoJggAROBNw+aMkxNf5cMPHJSjPWRdhvZ9LGcF0b0kVQ8ycDRNkvNRWMbdjfwAoCcCjHjMOgyRyQAdywGITPwB42DA7hYzAgAjdAeDQjCoJw-du3TJE6mnWwoT0NIUTUAs71sMtdGsRYCyUtI9OJDijO49DeKw2BJAANSwShOAgX9IzICB+DASQHh1VAAGsqp1Qrit-MBySy8y-LGPCElSeoy2lZJcwcNRfXHQpBWmWQsRsPYdDPZJUu-QyuPssy+Py5qSt4EyyEAkhUCDNhKF-AAzQ70EkJqiu2tqOt88S926w9UhhLlykWXFHXcTJixsd60hHGxNj2Jag01HVODAKzXI8rzE1+R6U38tN8IQJSuR0OZ0gvHQXHGxBPWmUdppUWwFV0MHJAhqGYcpAh1qwrqDx7ZFajUmVpulEbqlqREsfBTQ0jcPM5P5KmaehshNW1PVvOy7Cka7VHeoYDkyjSPQtAvPMqkRQU1BnX1+UydFkQvCWwEhqWAFEIC8xnFd3ZHntZuTDZG4ob1nGxPTUfXrBnS8nDmEpT2ObxTnXVUALeOrgPanycvKyrqpwWqGqurbWsThXjWd5WesQZYtmBkplCceplIncK0SrXYqnccxxcj5s2OQWP4-s3PzJgiqcCqmr6sa7P2x7vi6AcAvJJ7XEy0dUFMWsFxlnKfn+S5CL3E9Jiuapjv3i7qNx+T-bDskY6zourObpz+6cuZgK0Y5Ua0TqEvXDkJR-YnR0s1xjkIMnDln3uuVsHwOxT1NCjIuR5nCSBUExJi1huRqyooUTYpYnzeyUFkKsy4Tg4FQBAOAgg26Nmga7QKohshSBtNYXGDonQumtPYaQfsSjLBHDefepJICUJZtQ4oMx8wXj6jebGt4JwbC2OiVwig9hh2hLpVu0cOhxjbMBBGeABFPwSA3ERRMlhKWCn9WRVQzZQirMo0BAYNzxn4RJGBh5MRbGXsHawGQFBmLrpUasOQorOAjs0OxaUVrGVMvfaCuiVYEV2KWTYg1yxyA0i6ZYaIPSL3lOkS8wSo6hOWpxCJ8te6WRsnZKMjlnIxNgSNIiiTF6vVSdI9JM1taXlxLzTwqiClBnSqtSJScLIFVvjtKANSXquENqoJwtgyZzRFIUQ4MhqgNACdNTQCpLbWyshMnsjpSwjXRJYHecgcmImsLIz0odNAaGqPiHpDYY6HwTlE+ATiqHPwohYewWQshmGhHrCcJz5Bck5toZwGhMheC8EAA */
     predictableActionArguments: true,
     tsTypes: {} as import('./commandBarMachine.typegen').Typegen0,
     context: {
@@ -147,6 +147,10 @@ export const commandBarMachine = createMachine(
             cond: 'Command has no arguments',
             actions: ['Execute command'],
           },
+          {
+            target: 'Checking Arguments',
+            cond: 'All arguments are skippable',
+          },
           {
             target: 'Gathering arguments',
             actions: ['Set current argument to first non-skippable'],
@@ -199,7 +203,7 @@ export const commandBarMachine = createMachine(
           'Change current argument': {
             target: 'Gathering arguments',
             internal: true,
-            actions: ['Remove current argument and set a new one'],
+            actions: ['Set current argument'],
           },
 
           'Deselect command': {
@@ -355,29 +359,13 @@ export const commandBarMachine = createMachine(
           switch (event.type) {
             case 'Edit argument':
               return event.data.arg
+            case 'Change current argument':
+              return Object.values(event.data)[0]
             default:
               return context.currentArgument
           }
         },
       }),
-      'Remove current argument and set a new one': assign({
-        argumentsToSubmit: (context, event) => {
-          if (
-            event.type !== 'Change current argument' ||
-            !context.currentArgument
-          )
-            return context.argumentsToSubmit
-          const { name } = context.currentArgument
-
-          const { [name]: _, ...rest } = context.argumentsToSubmit
-          return rest
-        },
-        currentArgument: (context, event) => {
-          if (event.type !== 'Change current argument')
-            return context.currentArgument
-          return Object.values(event.data)[0]
-        },
-      }),
       'Clear argument data': assign({
         selectedCommand: undefined,
         currentArgument: undefined,
@@ -510,7 +498,9 @@ export const commandBarMachine = createMachine(
 )
 
 function sortCommands(a: Command, b: Command) {
-  if (b.groupId === 'auth') return -1
-  if (a.groupId === 'auth') return 1
+  if (b.groupId === 'auth' && !(a.groupId === 'auth')) return -2
+  if (a.groupId === 'auth' && !(b.groupId === 'auth')) return 2
+  if (b.groupId === 'settings' && !(a.groupId === 'settings')) return -1
+  if (a.groupId === 'settings' && !(b.groupId === 'settings')) return 1
   return a.name.localeCompare(b.name)
 }

src/machines/settingsMachine.ts

@@ -63,6 +63,12 @@ export const settingsMachine = createMachine(
             ],
           },
 
+          'set.app.streamIdleMode': {
+            target: 'persisting settings',
+
+            actions: ['setSettingAtLevel', 'toastSuccess'],
+          },
+
           'set.modeling.highlightEdges': {
             target: 'persisting settings',
 

src/routes/Onboarding/Camera.tsx

@@ -8,11 +8,9 @@ import {
 } from 'lib/cameraControls'
 import { SettingsSection } from 'components/Settings/SettingsSection'
 import { useModelingContext } from 'hooks/useModelingContext'
-import { useAppState } from 'AppState'
 
 export default function Units() {
   const { context } = useModelingContext()
-  const { buttonDownInStream } = useAppState()
   const dismiss = useDismiss()
   const next = useNextClick(onboardingPaths.STREAMING)
   const {
@@ -31,7 +29,7 @@ export default function Units() {
       <div
         className={
           'max-w-2xl border border-chalkboard-50 dark:border-chalkboard-80 shadow-lg flex flex-col justify-center bg-chalkboard-10 dark:bg-chalkboard-90 p-8 rounded' +
-          (buttonDownInStream ? '' : ' pointer-events-auto')
+          (context.store?.buttonDownInStream ? '' : ' pointer-events-auto')
         }
       >
         <SettingsSection

src/routes/Onboarding/CmdK.tsx

@@ -2,11 +2,9 @@ import usePlatform from 'hooks/usePlatform'
 import { OnboardingButtons, kbdClasses, useDismiss, useNextClick } from '.'
 import { onboardingPaths } from 'routes/Onboarding/paths'
 import { useModelingContext } from 'hooks/useModelingContext'
-import { useAppState } from 'AppState'
 
 export default function CmdK() {
-  // const { context } = useModelingContext()
-  const { buttonDownInStream } = useAppState()
+  const { context } = useModelingContext()
   const dismiss = useDismiss()
   const next = useNextClick(onboardingPaths.USER_MENU)
   const platformName = usePlatform()
@@ -16,7 +14,7 @@ export default function CmdK() {
       <div
         className={
           'max-w-full xl:max-w-4xl border border-chalkboard-50 dark:border-chalkboard-80 shadow-lg flex flex-col justify-center bg-chalkboard-10 dark:bg-chalkboard-90 p-8 rounded' +
-          (buttonDownInStream ? '' : ' pointer-events-auto')
+          (context.store?.buttonDownInStream ? '' : ' pointer-events-auto')
         }
       >
         <h2 className="text-2xl font-bold">Command Bar</h2>

src/routes/Onboarding/CodeEditor.tsx

@@ -1,12 +1,10 @@
 import { useModelingContext } from 'hooks/useModelingContext'
 import { OnboardingButtons, useDemoCode, useDismiss, useNextClick } from '.'
 import { onboardingPaths } from 'routes/Onboarding/paths'
-import { useAppState } from 'AppState'
 
 export default function OnboardingCodeEditor() {
   useDemoCode()
   const { context } = useModelingContext()
-  const { buttonDownInStream } = useAppState()
   const dismiss = useDismiss()
   const next = useNextClick(onboardingPaths.PARAMETRIC_MODELING)
 
@@ -15,7 +13,7 @@ export default function OnboardingCodeEditor() {
       <div
         className={
           'z-10 max-w-xl border border-chalkboard-50 dark:border-chalkboard-80 shadow-lg h-[75vh] flex flex-col justify-center bg-chalkboard-10 dark:bg-chalkboard-90 p-8 rounded' +
-          (buttonDownInStream ? '' : ' pointer-events-auto')
+          (context.store?.buttonDownInStream ? '' : ' pointer-events-auto')
         }
       >
         <section className="flex-1 overflow-y-auto">

src/routes/Onboarding/Export.tsx

@@ -2,11 +2,9 @@ import { APP_NAME } from 'lib/constants'
 import { OnboardingButtons, useDismiss, useNextClick } from '.'
 import { onboardingPaths } from 'routes/Onboarding/paths'
 import { useModelingContext } from 'hooks/useModelingContext'
-import { useAppState } from 'AppState'
 
 export default function Export() {
   const { context } = useModelingContext()
-  const { buttonDownInStream } = useAppState()
   const dismiss = useDismiss()
   const next = useNextClick(onboardingPaths.SKETCHING)
 
@@ -15,7 +13,7 @@ export default function Export() {
       <div
         className={
           'max-w-full xl:max-w-2xl border border-chalkboard-50 dark:border-chalkboard-80 shadow-lg flex flex-col justify-center bg-chalkboard-10 dark:bg-chalkboard-90 p-8 rounded' +
-          (buttonDownInStream ? '' : ' pointer-events-auto')
+          (context.store?.buttonDownInStream ? '' : ' pointer-events-auto')
         }
       >
         <section className="flex-1">

src/routes/Onboarding/InteractiveNumbers.tsx

@@ -8,12 +8,10 @@ import {
 import { onboardingPaths } from 'routes/Onboarding/paths'
 import { bracketWidthConstantLine } from 'lib/exampleKcl'
 import { useModelingContext } from 'hooks/useModelingContext'
-import { useAppState } from 'AppState'
 
 export default function OnboardingInteractiveNumbers() {
   useDemoCode()
   const { context } = useModelingContext()
-  const { buttonDownInStream } = useAppState()
   const dismiss = useDismiss()
   const next = useNextClick(onboardingPaths.COMMAND_K)
 
@@ -22,7 +20,7 @@ export default function OnboardingInteractiveNumbers() {
       <div
         className={
           'z-10 max-w-xl border border-chalkboard-50 dark:border-chalkboard-80 shadow-lg h-[75vh] flex flex-col justify-center bg-chalkboard-10 dark:bg-chalkboard-90 p-8 rounded' +
-          (buttonDownInStream ? '' : ' pointer-events-auto')
+          (context.store?.buttonDownInStream ? '' : ' pointer-events-auto')
         }
       >
         <section className="flex-1 overflow-y-auto mb-6">

src/routes/Onboarding/ParametricModeling.tsx

@@ -4,12 +4,10 @@ import { Themes, getSystemTheme } from 'lib/theme'
 import { useSettingsAuthContext } from 'hooks/useSettingsAuthContext'
 import { bracketThicknessCalculationLine } from 'lib/exampleKcl'
 import { useModelingContext } from 'hooks/useModelingContext'
-import { useAppState } from 'AppState'
 
 export default function OnboardingParametricModeling() {
   useDemoCode()
   const { context } = useModelingContext()
-  const { buttonDownInStream } = useAppState()
   const {
     settings: {
       context: {
@@ -32,7 +30,7 @@ export default function OnboardingParametricModeling() {
       <div
         className={
           'z-10 max-w-xl border border-chalkboard-50 dark:border-chalkboard-80 shadow-lg h-[75vh] flex flex-col justify-center bg-chalkboard-10 dark:bg-chalkboard-90 p-8 rounded' +
-          (buttonDownInStream ? '' : ' pointer-events-auto')
+          (context.store?.buttonDownInStream ? '' : ' pointer-events-auto')
         }
       >
         <section className="flex-1 overflow-y-auto mb-6">

src/routes/Onboarding/ProjectMenu.tsx

@@ -2,11 +2,9 @@ import { OnboardingButtons, useDismiss, useNextClick } from '.'
 import { onboardingPaths } from 'routes/Onboarding/paths'
 import { isTauri } from 'lib/isTauri'
 import { useModelingContext } from 'hooks/useModelingContext'
-import { useAppState } from 'AppState'
 
 export default function ProjectMenu() {
   const { context } = useModelingContext()
-  const { buttonDownInStream } = useAppState()
   const dismiss = useDismiss()
   const next = useNextClick(onboardingPaths.EXPORT)
   const tauri = isTauri()
@@ -16,7 +14,7 @@ export default function ProjectMenu() {
       <div
         className={
           'max-w-xl flex flex-col border border-chalkboard-50 dark:border-chalkboard-80 shadow-lg justify-center bg-chalkboard-10 dark:bg-chalkboard-90 p-8 rounded' +
-          (buttonDownInStream ? '' : ' pointer-events-auto')
+          (context.store?.buttonDownInStream ? '' : ' pointer-events-auto')
         }
       >
         <section className="flex-1">

src/routes/Onboarding/Sketching.tsx

@@ -3,11 +3,9 @@ import { onboardingPaths } from 'routes/Onboarding/paths'
 import { useEffect } from 'react'
 import { codeManager, kclManager } from 'lib/singletons'
 import { useModelingContext } from 'hooks/useModelingContext'
-import { useAppState } from 'AppState'
 
 export default function Sketching() {
   const { context } = useModelingContext()
-  const { buttonDownInStream } = useAppState()
   const dismiss = useDismiss()
   const next = useNextClick(onboardingPaths.FUTURE_WORK)
 
@@ -25,7 +23,7 @@ export default function Sketching() {
       <div
         className={
           'max-w-full xl:max-w-2xl border border-chalkboard-50 dark:border-chalkboard-80 shadow-lg flex flex-col justify-center bg-chalkboard-10 dark:bg-chalkboard-90 p-8 rounded' +
-          (buttonDownInStream ? '' : ' pointer-events-auto')
+          (context.store?.buttonDownInStream ? '' : ' pointer-events-auto')
         }
       >
         <h1 className="text-2xl font-bold">Sketching</h1>

src/routes/Onboarding/Streaming.tsx

@@ -1,11 +1,9 @@
 import { useModelingContext } from 'hooks/useModelingContext'
 import { OnboardingButtons, useDismiss, useNextClick } from '.'
 import { onboardingPaths } from 'routes/Onboarding/paths'
-import { useAppState } from 'AppState'
 
 export default function Streaming() {
   const { context } = useModelingContext()
-  const { buttonDownInStream } = useAppState()
   const dismiss = useDismiss()
   const next = useNextClick(onboardingPaths.EDITOR)
 
@@ -14,7 +12,7 @@ export default function Streaming() {
       <div
         className={
           'max-w-xl border border-chalkboard-50 dark:border-chalkboard-80 shadow-lg h-[75vh] flex flex-col justify-center bg-chalkboard-10 dark:bg-chalkboard-90 p-8 rounded' +
-          (buttonDownInStream ? '' : ' pointer-events-auto')
+          (context.store?.buttonDownInStream ? '' : ' pointer-events-auto')
         }
       >
         <section className="flex-1 overflow-y-auto">

src/routes/Onboarding/UserMenu.tsx

@@ -3,11 +3,9 @@ import { onboardingPaths } from 'routes/Onboarding/paths'
 import { useEffect, useState } from 'react'
 import { useModelingContext } from 'hooks/useModelingContext'
 import { useSettingsAuthContext } from 'hooks/useSettingsAuthContext'
-import { useAppState } from 'AppState'
 
 export default function UserMenu() {
   const { context } = useModelingContext()
-  const { buttonDownInStream } = useAppState()
   const { auth } = useSettingsAuthContext()
   const dismiss = useDismiss()
   const next = useNextClick(onboardingPaths.PROJECT_MENU)
@@ -38,7 +36,7 @@ export default function UserMenu() {
       <div
         className={
           'max-w-xl flex flex-col border border-chalkboard-50 dark:border-chalkboard-80 shadow-lg justify-center bg-chalkboard-10 dark:bg-chalkboard-90 p-8 rounded' +
-          (buttonDownInStream ? '' : ' pointer-events-auto')
+          (context.store?.buttonDownInStream ? '' : ' pointer-events-auto')
         }
       >
         <section className="flex-1">

src/wasm-lib/Cargo.lock

@@ -169,7 +169,7 @@ checksum = "3b43422f69d8ff38f95f1b2bb76517c91589a924d1559a0e935d7c8ce0274c11"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.70",
+ "syn 2.0.71",
 ]
 
 [[package]]
@@ -180,7 +180,7 @@ checksum = "6e0c28dcc82d7c8ead5cb13beb15405b57b8546e93215673ff8ca0349a028107"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.70",
+ "syn 2.0.71",
 ]
 
 [[package]]
@@ -191,7 +191,7 @@ checksum = "3c87f3f15e7794432337fc718554eaa4dc8f04c9677a950ffe366f20a162ae42"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.70",
+ "syn 2.0.71",
 ]
 
 [[package]]
@@ -431,7 +431,7 @@ dependencies = [
  "heck 0.5.0",
  "proc-macro2",
  "quote",
- "syn 2.0.70",
+ "syn 2.0.71",
 ]
 
 [[package]]
@@ -631,7 +631,7 @@ dependencies = [
  "proc-macro2",
  "quote",
  "strsim 0.10.0",
- "syn 2.0.70",
+ "syn 2.0.71",
 ]
 
 [[package]]
@@ -642,7 +642,7 @@ checksum = "a668eda54683121533a393014d8692171709ff57a7d61f187b6e782719f8933f"
 dependencies = [
  "darling_core",
  "quote",
- "syn 2.0.70",
+ "syn 2.0.71",
 ]
 
 [[package]]
@@ -697,7 +697,7 @@ checksum = "4078275de501a61ceb9e759d37bdd3d7210e654dbc167ac1a3678ef4435ed57b"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.70",
+ "syn 2.0.71",
  "synstructure",
 ]
 
@@ -726,7 +726,7 @@ dependencies = [
  "rustfmt-wrapper",
  "serde",
  "serde_tokenstream",
- "syn 2.0.70",
+ "syn 2.0.71",
 ]
 
 [[package]]
@@ -737,7 +737,7 @@ checksum = "67e77553c4162a157adbf834ebae5b415acbecbeafc7a74b0e886657506a7611"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.70",
+ "syn 2.0.71",
 ]
 
 [[package]]
@@ -764,7 +764,7 @@ checksum = "487585f4d0c6655fe74905e2504d8ad6908e4db67f744eb140876906c2f3175d"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.70",
+ "syn 2.0.71",
 ]
 
 [[package]]
@@ -936,7 +936,7 @@ checksum = "87750cf4b7a4c0625b1529e4c543c2182106e4dedc60a2a6455e00d212c489ac"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.70",
+ "syn 2.0.71",
 ]
 
 [[package]]
@@ -1026,7 +1026,7 @@ dependencies = [
  "inflections",
  "proc-macro2",
  "quote",
- "syn 2.0.70",
+ "syn 2.0.71",
 ]
 
 [[package]]
@@ -1448,7 +1448,7 @@ dependencies = [
  "pretty_assertions",
  "proc-macro2",
  "quote",
- "syn 2.0.70",
+ "syn 2.0.71",
 ]
 
 [[package]]
@@ -1824,7 +1824,7 @@ dependencies = [
  "regex",
  "regex-syntax 0.8.3",
  "structmeta",
- "syn 2.0.70",
+ "syn 2.0.71",
 ]
 
 [[package]]
@@ -1842,7 +1842,7 @@ dependencies = [
  "bincode",
  "either",
  "fnv",
- "itertools 0.10.5",
+ "itertools 0.12.1",
  "lazy_static",
  "nom",
  "quick-xml",
@@ -1877,7 +1877,7 @@ checksum = "2f38a4412a78282e09a2cf38d195ea5420d15ba0602cb375210efbc877243965"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.70",
+ "syn 2.0.71",
 ]
 
 [[package]]
@@ -2041,7 +2041,7 @@ dependencies = [
  "proc-macro2",
  "pyo3-macros-backend",
  "quote",
- "syn 2.0.70",
+ "syn 2.0.71",
 ]
 
 [[package]]
@@ -2054,7 +2054,7 @@ dependencies = [
  "proc-macro2",
  "pyo3-build-config",
  "quote",
- "syn 2.0.70",
+ "syn 2.0.71",
 ]
 
 [[package]]
@@ -2516,7 +2516,7 @@ dependencies = [
  "proc-macro2",
  "quote",
  "serde_derive_internals",
- "syn 2.0.70",
+ "syn 2.0.71",
 ]
 
 [[package]]
@@ -2590,7 +2590,7 @@ checksum = "e0cd7e117be63d3c3678776753929474f3b04a43a080c744d6b0ae2a8c28e222"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.70",
+ "syn 2.0.71",
 ]
 
 [[package]]
@@ -2601,7 +2601,7 @@ checksum = "330f01ce65a3a5fe59a60c82f3c9a024b573b8a6e875bd233fe5f934e71d54e3"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.70",
+ "syn 2.0.71",
 ]
 
 [[package]]
@@ -2624,7 +2624,7 @@ checksum = "0b2e6b945e9d3df726b65d6ee24060aff8e3533d431f677a9695db04eff9dfdb"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.70",
+ "syn 2.0.71",
 ]
 
 [[package]]
@@ -2645,7 +2645,7 @@ dependencies = [
  "proc-macro2",
  "quote",
  "serde",
- "syn 2.0.70",
+ "syn 2.0.71",
 ]
 
 [[package]]
@@ -2782,7 +2782,7 @@ dependencies = [
  "proc-macro2",
  "quote",
  "structmeta-derive",
- "syn 2.0.70",
+ "syn 2.0.71",
 ]
 
 [[package]]
@@ -2793,7 +2793,7 @@ checksum = "152a0b65a590ff6c3da95cabe2353ee04e6167c896b28e3b14478c2636c922fc"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.70",
+ "syn 2.0.71",
 ]
 
 [[package]]
@@ -2837,9 +2837,9 @@ dependencies = [
 
 [[package]]
 name = "syn"
-version = "2.0.70"
+version = "2.0.71"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "2f0209b68b3613b093e0ec905354eccaedcfe83b8cb37cbdeae64026c3064c16"
+checksum = "b146dcf730474b4bcd16c311627b31ede9ab149045db4d6088b3becaea046462"
 dependencies = [
  "proc-macro2",
  "quote",
@@ -2860,7 +2860,7 @@ checksum = "c8af7666ab7b6390ab78131fb5b0fce11d6b7a6951602017c35fa82800708971"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.70",
+ "syn 2.0.71",
 ]
 
 [[package]]
@@ -2928,22 +2928,22 @@ dependencies = [
 
 [[package]]
 name = "thiserror"
-version = "1.0.61"
+version = "1.0.62"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "c546c80d6be4bc6a00c0f01730c08df82eaa7a7a61f11d656526506112cc1709"
+checksum = "f2675633b1499176c2dff06b0856a27976a8f9d436737b4cf4f312d4d91d8bbb"
 dependencies = [
  "thiserror-impl",
 ]
 
 [[package]]
 name = "thiserror-impl"
-version = "1.0.61"
+version = "1.0.62"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "46c3384250002a6d5af4d114f2845d37b57521033f30d5c3f46c4d70e1197533"
+checksum = "d20468752b09f49e909e55a5d338caa8bedf615594e9d80bc4c565d30faf798c"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.70",
+ "syn 2.0.71",
 ]
 
 [[package]]
@@ -3039,7 +3039,7 @@ checksum = "5f5ae998a069d4b5aba8ee9dad856af7d520c3699e6159b185c2acd48155d39a"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.70",
+ "syn 2.0.71",
 ]
 
 [[package]]
@@ -3192,7 +3192,7 @@ checksum = "84fd902d4e0b9a4b27f2f440108dc034e1758628a9b702f8ec61ad66355422fa"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.70",
+ "syn 2.0.71",
 ]
 
 [[package]]
@@ -3220,7 +3220,7 @@ checksum = "34704c8d6ebcbc939824180af020566b01a7c01f80641264eba0999f6c2b6be7"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.70",
+ "syn 2.0.71",
 ]
 
 [[package]]
@@ -3297,7 +3297,7 @@ checksum = "c88cc88fd23b5a04528f3a8436024f20010a16ec18eb23c164b1242f65860130"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.70",
+ "syn 2.0.71",
  "termcolor",
 ]
 
@@ -3455,7 +3455,7 @@ dependencies = [
  "proc-macro-error",
  "proc-macro2",
  "quote",
- "syn 2.0.70",
+ "syn 2.0.71",
 ]
 
 [[package]]
@@ -3516,7 +3516,7 @@ dependencies = [
  "once_cell",
  "proc-macro2",
  "quote",
- "syn 2.0.70",
+ "syn 2.0.71",
  "wasm-bindgen-shared",
 ]
 
@@ -3551,7 +3551,7 @@ checksum = "e94f17b526d0a461a191c78ea52bbce64071ed5c04c9ffe424dcb38f74171bb7"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.70",
+ "syn 2.0.71",
  "wasm-bindgen-backend",
  "wasm-bindgen-shared",
 ]
@@ -3876,7 +3876,7 @@ checksum = "9ce1b18ccd8e73a9321186f97e46f9f04b778851177567b1975109d26a08d2a6"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.70",
+ "syn 2.0.71",
 ]
 
 [[package]]

src/wasm-lib/derive-docs/Cargo.toml

@@ -20,7 +20,7 @@ quote = "1"
 regex = "1.10"
 serde = { version = "1.0.204", features = ["derive"] }
 serde_tokenstream = "0.2"
-syn = { version = "2.0.70", features = ["full"] }
+syn = { version = "2.0.71", features = ["full"] }
 
 [dev-dependencies]
 anyhow = "1.0.86"

src/wasm-lib/derive-docs/src/lib.rs

@@ -837,7 +837,7 @@ fn generate_code_block_test(fn_name: &str, code_block: &str, index: usize) -> pr
 
             // Read the output file.
             let actual = image::io::Reader::open(output_file).unwrap().decode().unwrap();
-            twenty_twenty::assert_image(&format!("tests/outputs/{}.png", #test_name_str), &actual, 1.0);
+            twenty_twenty::assert_image(&format!("tests/outputs/{}.png", #test_name_str), &actual, 0.99);
 
         }
     }

src/wasm-lib/derive-docs/tests/args_with_lifetime.gen

@@ -86,7 +86,7 @@ mod test_examples_someFn {
         twenty_twenty::assert_image(
             &format!("tests/outputs/{}.png", "serial_test_example_someFn0"),
             &actual,
-            1.0,
+            0.99,
         );
     }
 }

src/wasm-lib/derive-docs/tests/args_with_refs.gen

@@ -86,7 +86,7 @@ mod test_examples_someFn {
         twenty_twenty::assert_image(
             &format!("tests/outputs/{}.png", "serial_test_example_someFn0"),
             &actual,
-            1.0,
+            0.99,
         );
     }
 }

src/wasm-lib/derive-docs/tests/array.gen

@@ -86,7 +86,7 @@ mod test_examples_show {
         twenty_twenty::assert_image(
             &format!("tests/outputs/{}.png", "serial_test_example_show0"),
             &actual,
-            1.0,
+            0.99,
         );
     }
 
@@ -176,7 +176,7 @@ mod test_examples_show {
         twenty_twenty::assert_image(
             &format!("tests/outputs/{}.png", "serial_test_example_show1"),
             &actual,
-            1.0,
+            0.99,
         );
     }
 }

src/wasm-lib/derive-docs/tests/box.gen

@@ -86,7 +86,7 @@ mod test_examples_show {
         twenty_twenty::assert_image(
             &format!("tests/outputs/{}.png", "serial_test_example_show0"),
             &actual,
-            1.0,
+            0.99,
         );
     }
 }

src/wasm-lib/derive-docs/tests/doc_comment_with_code.gen

@@ -88,7 +88,7 @@ mod test_examples_my_func {
         twenty_twenty::assert_image(
             &format!("tests/outputs/{}.png", "serial_test_example_my_func0"),
             &actual,
-            1.0,
+            0.99,
         );
     }
 
@@ -178,7 +178,7 @@ mod test_examples_my_func {
         twenty_twenty::assert_image(
             &format!("tests/outputs/{}.png", "serial_test_example_my_func1"),
             &actual,
-            1.0,
+            0.99,
         );
     }
 }

src/wasm-lib/derive-docs/tests/lineTo.gen

@@ -88,7 +88,7 @@ mod test_examples_line_to {
         twenty_twenty::assert_image(
             &format!("tests/outputs/{}.png", "serial_test_example_line_to0"),
             &actual,
-            1.0,
+            0.99,
         );
     }
 
@@ -178,7 +178,7 @@ mod test_examples_line_to {
         twenty_twenty::assert_image(
             &format!("tests/outputs/{}.png", "serial_test_example_line_to1"),
             &actual,
-            1.0,
+            0.99,
         );
     }
 }

src/wasm-lib/derive-docs/tests/min.gen

@@ -86,7 +86,7 @@ mod test_examples_min {
         twenty_twenty::assert_image(
             &format!("tests/outputs/{}.png", "serial_test_example_min0"),
             &actual,
-            1.0,
+            0.99,
         );
     }
 
@@ -176,7 +176,7 @@ mod test_examples_min {
         twenty_twenty::assert_image(
             &format!("tests/outputs/{}.png", "serial_test_example_min1"),
             &actual,
-            1.0,
+            0.99,
         );
     }
 }

src/wasm-lib/derive-docs/tests/option.gen

@@ -86,7 +86,7 @@ mod test_examples_show {
         twenty_twenty::assert_image(
             &format!("tests/outputs/{}.png", "serial_test_example_show0"),
             &actual,
-            1.0,
+            0.99,
         );
     }
 }

src/wasm-lib/derive-docs/tests/option_input_format.gen

@@ -86,7 +86,7 @@ mod test_examples_import {
         twenty_twenty::assert_image(
             &format!("tests/outputs/{}.png", "serial_test_example_import0"),
             &actual,
-            1.0,
+            0.99,
         );
     }
 }

src/wasm-lib/derive-docs/tests/return_vec_box_sketch_group.gen

@@ -86,7 +86,7 @@ mod test_examples_import {
         twenty_twenty::assert_image(
             &format!("tests/outputs/{}.png", "serial_test_example_import0"),
             &actual,
-            1.0,
+            0.99,
         );
     }
 }

src/wasm-lib/derive-docs/tests/return_vec_sketch_group.gen

@@ -86,7 +86,7 @@ mod test_examples_import {
         twenty_twenty::assert_image(
             &format!("tests/outputs/{}.png", "serial_test_example_import0"),
             &actual,
-            1.0,
+            0.99,
         );
     }
 }

src/wasm-lib/derive-docs/tests/show.gen

@@ -86,7 +86,7 @@ mod test_examples_show {
         twenty_twenty::assert_image(
             &format!("tests/outputs/{}.png", "serial_test_example_show0"),
             &actual,
-            1.0,
+            0.99,
         );
     }
 }

src/wasm-lib/kcl-macros/Cargo.toml

@@ -15,7 +15,7 @@ databake = "0.1.8"
 kcl-lib = { path = "../kcl" }
 proc-macro2 = "1"
 quote = "1"
-syn = { version = "2.0.70", features = ["full"] }
+syn = { version = "2.0.71", features = ["full"] }
 
 [dev-dependencies]
 pretty_assertions = "1.4.0"

src/wasm-lib/kcl/Cargo.toml

@@ -35,7 +35,7 @@ schemars = { version = "0.8.17", features = ["impl_json_schema", "url", "uuid1"]
 serde = { version = "1.0.204", features = ["derive"] }
 serde_json = "1.0.120"
 sha2 = "0.10.8"
-thiserror = "1.0.61"
+thiserror = "1.0.62"
 toml = "0.8.14"
 ts-rs = { version = "9.0.1", features = ["uuid-impl", "url-impl", "chrono-impl", "no-serde-warnings", "serde-json-impl"] }
 url = { version = "2.5.2", features = ["serde"] }
@@ -98,6 +98,10 @@ harness = false
 name = "compiler_benchmark_iai"
 harness = false
 
+[[bench]]
+name = "digest_benchmark"
+harness = false
+
 [[bench]]
 name = "lsp_semantic_tokens_benchmark_criterion"
 harness = false

src/wasm-lib/kcl/benches/digest_benchmark.rs

@@ -0,0 +1,31 @@
+use criterion::{criterion_group, criterion_main, Criterion};
+
+pub fn bench_digest(c: &mut Criterion) {
+    for (name, file) in [
+        ("pipes_on_pipes", PIPES_PROGRAM),
+        ("big_kitt", KITT_PROGRAM),
+        ("cube", CUBE_PROGRAM),
+        ("math", MATH_PROGRAM),
+        ("mike_stress_test", MIKE_STRESS_TEST_PROGRAM),
+    ] {
+        let tokens = kcl_lib::token::lexer(file).unwrap();
+        let prog = kcl_lib::parser::Parser::new(tokens).ast().unwrap();
+        c.bench_function(&format!("digest_{name}"), move |b| {
+            let prog = prog.clone();
+
+            b.iter(move || {
+                let mut prog = prog.clone();
+                prog.compute_digest();
+            });
+        });
+    }
+}
+
+criterion_group!(benches, bench_digest);
+criterion_main!(benches);
+
+const KITT_PROGRAM: &str = include_str!("../../tests/executor/inputs/kittycad_svg.kcl");
+const PIPES_PROGRAM: &str = include_str!("../../tests/executor/inputs/pipes_on_pipes.kcl");
+const CUBE_PROGRAM: &str = include_str!("../../tests/executor/inputs/cube.kcl");
+const MATH_PROGRAM: &str = include_str!("../../tests/executor/inputs/math.kcl");
+const MIKE_STRESS_TEST_PROGRAM: &str = include_str!("../../tests/executor/inputs/mike_stress_test.kcl");