Update bracket example code and some test colors that broke

.env.development

@@ -2,9 +2,7 @@ NODE_ENV=development
 DEV=true
 VITE_KC_API_WS_MODELING_URL=wss://api.dev.zoo.dev/ws/modeling/commands
 VITE_KC_API_BASE_URL=https://api.dev.zoo.dev
-BASE_URL=https://api.dev.zoo.dev
 VITE_KC_SITE_BASE_URL=https://dev.zoo.dev
 VITE_KC_SKIP_AUTH=false
 VITE_KC_CONNECTION_TIMEOUT_MS=5000
-# ONLY add your token in .env.development.local if you want to skip auth, otherwise this token takes precedence!
-#VITE_KC_DEV_TOKEN="your token from dev.zoo.dev should go in .env.development.local"
+VITE_KC_DEV_TOKEN="your token from dev.zoo.dev should go in .env.development.local"

.eslintrc

@@ -13,8 +13,6 @@
       "plugin:css-modules/recommended"
     ],
     "rules": {
-      "@typescript-eslint/no-floating-promises": "error",
-      "@typescript-eslint/no-misused-promises": "error",
       "semi": [
         "error",
         "never"
@@ -26,6 +24,7 @@
       {
         "files": ["e2e/**/*.ts"], // Update the pattern based on your file structure
         "rules": {
+          "@typescript-eslint/no-floating-promises": "warn",
           "suggest-no-throw/suggest-no-throw": "off",
           "testing-library/prefer-screen-queries": "off",
           "jest/valid-expect": "off"

.github/workflows/build-test-publish-apps.yml

@@ -44,7 +44,7 @@ jobs:
 
       # TODO: see if we can fetch from main instead if no diff at src/wasm-lib
       - name: Run build:wasm
-        run: "yarn build:wasm"
+        run: "yarn build:wasm${{ env.BUILD_RELEASE == 'true' && '-dev' || ''}}"
 
       - name: Set nightly version
         if: github.event_name == 'schedule'
@@ -81,6 +81,8 @@ jobs:
       CSC_KEY_PASSWORD: ${{ secrets.APPLE_CERTIFICATE_PASSWORD }}
       CSC_KEYCHAIN: ${{ secrets.APPLE_SIGNING_IDENTITY }}
       CSC_FOR_PULL_REQUEST: true
+      TAURI_PRIVATE_KEY: ${{ secrets.TAURI_SIGNING_PRIVATE_KEY }}
+      TAURI_PRIVATE_KEY_PASSWORD: ${{ secrets.TAURI_SIGNING_PRIVATE_KEY_PASSWORD }}
       VERSION: ${{ github.event_name == 'schedule' && needs.prepare-files.outputs.version || format('v{0}', needs.prepare-files.outputs.version) }}
       VERSION_NO_V: ${{ needs.prepare-files.outputs.version }}
       WINDOWS_CERTIFICATE_THUMBPRINT: F4C9A52FF7BC26EE5E054946F6B11DEEA94C748D
@@ -140,12 +142,37 @@ jobs:
       - name: List artifacts in out/
         run: ls -R out
 
+      - name: Prepare the tauri update bundles (macOS)
+        if: ${{ env.BUILD_RELEASE && matrix.os == 'macos-14' }}
+        run: |
+          for ARCH in arm64 x64; do
+            TAURI_DIR=out/tauri/$VERSION/macos
+            TEMP_DIR=temp/$ARCH
+            mkdir -p $TAURI_DIR
+            mkdir -p $TEMP_DIR
+            unzip out/*-$ARCH-mac.zip -d $TEMP_DIR
+            tar -czvf "$TAURI_DIR/Zoo Modeling App-$ARCH.app.tar.gz" -C $TEMP_DIR "Zoo Modeling App.app" 
+            yarn tauri signer sign "$TAURI_DIR/Zoo Modeling App-$ARCH.app.tar.gz"
+          done
+          ls -R out
+
+      - name: Prepare the tauri update bundles (Windows)
+        if: ${{ env.BUILD_RELEASE && matrix.os == 'windows-2022' }}
+        run: |
+          $env:TAURI_DIR="out/tauri/${env:VERSION}/nsis"
+          mkdir -p ${env:TAURI_DIR}
+          $env:OUT_FILE="${env:TAURI_DIR}/Zoo Modeling App_${env:VERSION_NO_V}_x64-setup.nsis.zip"
+          7z a -mm=Copy "${env:OUT_FILE}" ./out/*-x64-win.exe
+          yarn tauri signer sign "${env:OUT_FILE}"
+          ls -R out
+
       - uses: actions/upload-artifact@v3
         with:
           name: out-${{ matrix.os }}
           path: |
             out/Zoo*.*
             out/latest*.yml
+            out/tauri
 
       # TODO: add the 'Build for Mac TestFlight (nightly)' stage back
 
@@ -165,6 +192,8 @@ jobs:
       NOTES: ${{ github.event_name == 'release' && github.event.release.body || format('Non-release build, commit {0}', github.sha) }}
       BUCKET_DIR: ${{ github.event_name == 'schedule' && 'dl.kittycad.io/releases/modeling-app/nightly' || 'dl.kittycad.io/releases/modeling-app' }}
       WEBSITE_DIR: ${{ github.event_name == 'schedule' && 'dl.zoo.dev/releases/modeling-app/nightly' || 'dl.zoo.dev/releases/modeling-app' }}
+      BUCKET_DIR_TAURI: 'dl.kittycad.io/releases/modeling-app/tauri-compat'
+      WEBSITE_DIR_TAURI: 'dl.zoo.dev/releases/modeling-app/tauri-compat'
       URL_CODED_NAME: ${{ github.event_name == 'schedule' && 'Zoo%20Modeling%20App%20%28Nightly%29' || 'Zoo%20Modeling%20App' }}
     steps:
       - uses: actions/checkout@v4
@@ -183,7 +212,7 @@ jobs:
         with:
           name: out-ubuntu-22.04
           path: out
-
+      
       - name: Generate the download static endpoint
         run: |
           RELEASE_DIR=https://${WEBSITE_DIR}
@@ -193,10 +222,8 @@ jobs:
             --arg notes "${NOTES}" \
             --arg mac_arm64_url "$RELEASE_DIR/${{ env.URL_CODED_NAME }}-${VERSION_NO_V}-arm64-mac.dmg" \
             --arg mac_x64_url "$RELEASE_DIR/${{ env.URL_CODED_NAME }}-${VERSION_NO_V}-x64-mac.dmg" \
-            --arg windows_arm64_url "$RELEASE_DIR/${{ env.URL_CODED_NAME }}-${VERSION_NO_V}-arm64-win.exe" \
-            --arg windows_x64_url "$RELEASE_DIR/${{ env.URL_CODED_NAME }}-${VERSION_NO_V}-x64-win.exe" \
-            --arg linux_arm64_url "$RELEASE_DIR/${{ env.URL_CODED_NAME }}-${VERSION_NO_V}-arm64-linux.AppImage" \
-            --arg linux_x64_url "$RELEASE_DIR/${{ env.URL_CODED_NAME }}-${VERSION_NO_V}-x86_64-linux.AppImage" \
+            --arg windows_arm64_url "$RELEASE_DIR/${{ env.URL_CODED_NAME }}-${VERSION_NO_V}-arm64-win.msi" \
+            --arg windows_x64_url "$RELEASE_DIR/${{ env.URL_CODED_NAME }}-${VERSION_NO_V}-x64-win.msi" \
             '{
               "version": $version,
               "pub_date": $pub_date,
@@ -208,22 +235,54 @@ jobs:
                 "dmg-x64": {
                   "url": $mac_x64_url
                 },
-                "exe-arm64": {
+                "msi-arm64": {
                   "url": $windows_arm64_url
                 },
-                "exe-x64": {
+                "msi-x64": {
                   "url": $windows_x64_url
-                },
-                "appimage-arm64": {
-                  "url": $linux_arm64_url
-                },
-                "appimage-x64": {
-                  "url": $linux_x64_url
                 }
               }
             }' > last_download.json
             cat last_download.json
 
+      - name: Generate the update static endpoint for tauri
+        run: |
+          TAURI_DIR=out/tauri/$VERSION
+          MAC_ARM64_SIG=`cat $TAURI_DIR/macos/*-arm64.app.tar.gz.sig`
+          MAC_X64_SIG=`cat $TAURI_DIR/macos/*-x64.app.tar.gz.sig`
+          WINDOWS_SIG=`cat $TAURI_DIR/nsis/*.nsis.zip.sig`
+          RELEASE_DIR=https://${WEBSITE_DIR_TAURI}/${VERSION}
+          jq --null-input \
+            --arg version "${VERSION}" \
+            --arg pub_date "${PUB_DATE}" \
+            --arg notes "${NOTES}" \
+            --arg mac_arm64_sig "$MAC_ARM64_SIG" \
+            --arg mac_arm64_url "$RELEASE_DIR/macos/${{ env.URL_CODED_NAME }}-arm64.app.tar.gz" \
+            --arg mac_x64_sig "$MAC_X64_SIG" \
+            --arg mac_x64_url "$RELEASE_DIR/macos/${{ env.URL_CODED_NAME }}-x64.app.tar.gz" \
+            --arg windows_sig "$WINDOWS_SIG" \
+            --arg windows_url "$RELEASE_DIR/nsis/${{ env.URL_CODED_NAME }}_${VERSION_NO_V}_x64-setup.nsis.zip" \
+            '{
+              "version": $version,
+              "pub_date": $pub_date,
+              "notes": $notes,
+              "platforms": {
+                "darwin-x86_64": {
+                  "signature": $mac_x64_sig,
+                  "url": $mac_x64_url
+                },
+                "darwin-aarch64": {
+                  "signature": $mac_arm64_sig,
+                  "url": $mac_arm64_url
+                },
+                "windows-x86_64": {
+                  "signature": $windows_sig,
+                  "url": $windows_url
+                }
+              }
+            }' > last_update.json
+            cat last_update.json
+
       - name: List artifacts
         run: "ls -R out"
 
@@ -238,45 +297,41 @@ jobs:
           project_id: ${{ env.GOOGLE_CLOUD_PROJECT_ID }}
 
       - name: Upload release files to public bucket
-        uses: google-github-actions/upload-cloud-storage@v2.2.0
+        uses: google-github-actions/upload-cloud-storage@v2.1.3
         with:
           path: out
           glob: 'Zoo*'
           parent: false
           destination: ${{ env.BUCKET_DIR }}
 
-      # TODO: remove workaround introduced in https://github.com/KittyCAD/modeling-app/issues/3817
-      - name: Upload release files to public bucket (test/electron-builder workaround)
-        uses: google-github-actions/upload-cloud-storage@v2.2.0
-        with:
-          path: out
-          glob: 'Zoo*'
-          parent: false
-          destination: '${{ env.BUCKET_DIR }}/test/electron-builder'
-
       - name: Upload update endpoint to public bucket
-        uses: google-github-actions/upload-cloud-storage@v2.2.0
+        uses: google-github-actions/upload-cloud-storage@v2.1.3
         with:
           path: out
           glob: 'latest*'
           parent: false
-          destination: ${{ env.BUCKET_DIR }}
-
-      # TODO: remove workaround introduced in https://github.com/KittyCAD/modeling-app/issues/3817
-      - name: Upload update endpoint to public bucket (test/electron-builder workaround)
-        uses: google-github-actions/upload-cloud-storage@v2.2.0
-        with:
-          path: out
-          glob: 'latest*'
-          parent: false
-          destination: '${{ env.BUCKET_DIR }}/test/electron-builder'
+          destination: ${{ env.BUCKET_DIR }} 
 
       - name: Upload download endpoint to public bucket
-        uses: google-github-actions/upload-cloud-storage@v2.2.0
+        uses: google-github-actions/upload-cloud-storage@v2.1.3
         with:
           path: last_download.json
           destination: ${{ env.BUCKET_DIR }}
 
+      - name: Upload release files to public bucket for tauri
+        uses: google-github-actions/upload-cloud-storage@v2.1.1
+        with:
+          path: "out/tauri/${{ env.VERSION }}" 
+          glob: '*/Zoo*'
+          parent: false
+          destination: ${{ env.BUCKET_DIR_TAURI }}/${{ env.VERSION }}
+
+      - name: Upload update endpoint to public bucket for tauri
+        uses: google-github-actions/upload-cloud-storage@v2.1.1
+        with:
+          path: last_update.json
+          destination: ${{ env.BUCKET_DIR }}
+
       - name: Upload release files to Github
         if: ${{ github.event_name == 'release' }}
         uses: softprops/action-gh-release@v2

.github/workflows/build-test-web.yml

@@ -45,7 +45,7 @@ jobs:
       - run: yarn xstate:typegen
       - run: yarn tsc
       - name: Lint
-        run: yarn eslint --max-warnings 0 src e2e packages/codemirror-lsp-client
+        run: yarn eslint --max-warnings 0 src e2e
 
 
   check-typos:

.github/workflows/cargo-clippy.yml

@@ -28,7 +28,6 @@ jobs:
         dir: ['src/wasm-lib']
     steps:
       - uses: actions/checkout@v4
-      - uses: taiki-e/install-action@just
       - name: Install latest rust
         uses: actions-rs/toolchain@v1
         with:
@@ -42,7 +41,7 @@ jobs:
       - name: Run clippy
         run: |
           cd "${{ matrix.dir }}"
-          just lint
+          cargo clippy --all --tests --benches -- -D warnings
       # If this fails, run "cargo check" to update Cargo.lock,
       # then add Cargo.lock to the PR.
       - name: Check Cargo.lock doesn't need updating

.github/workflows/playwright.yml

@@ -262,7 +262,7 @@ jobs:
       fail-fast: false
       matrix:
         os: [ubuntu-latest, windows-latest, macos-14]
-    timeout-minutes: 40
+    timeout-minutes: 30
     runs-on: ${{ matrix.os }}
     needs: check-rust-changes
     steps:
@@ -381,7 +381,7 @@ jobs:
                     echo "retried=true" >>$GITHUB_OUTPUT
                     echo "run playwright with last failed tests and retry $retry"
                     if [[ "$IS_UBUNTU" == "true" ]]; then
-                      xvfb-run --auto-servernum --server-args="-screen 0 1280x960x24" -- yarn playwright test --config=playwright.electron.config.ts --last-failed --grep=@electron || true
+                      xvfb-run --auto-servernum --server-args="-screen 0 1280x960x24" -- yarn playwright test --config=playwright.electron.config.ts --grep=@electron || true
                     else
                       yarn playwright test --config=playwright.electron.config.ts --grep=@electron || true
                     fi

Makefile

@@ -7,14 +7,6 @@ XSTATE_TYPEGENS := $(wildcard src/machines/*.typegen.ts)
 dev: node_modules public/wasm_lib_bg.wasm $(XSTATE_TYPEGENS)
 	yarn start
 
-# I'm sorry this is so specific to my setup you may as well ignore this.
-# This is so you don't have to deal with electron windows popping up constantly.
-# It should work for you other Linux users.
-lee-electron-test:
-	Xephyr -br -ac -noreset -screen 1200x500 :2 &
-	DISPLAY=:2 NODE_ENV=development PW_TEST_CONNECT_WS_ENDPOINT=ws://127.0.0.1:4444/ yarn tron:test -g "when using the file tree"
-	killall Xephyr
-
 $(XSTATE_TYPEGENS): $(TS_SRC)
 	yarn xstate typegen 'src/**/*.ts?(x)'
 

README.md

@@ -351,6 +351,25 @@ PS: for the debug panel, the following JSON is useful for snapping the camera
 
 </details>
 
+### Tauri e2e tests
+
+#### Windows (local only until the CI edge version mismatch is fixed)
+
+```
+yarn install
+yarn build:wasm-dev
+cp src/wasm-lib/pkg/wasm_lib_bg.wasm public
+yarn vite build --mode development
+yarn tauri build --debug -b
+$env:KITTYCAD_API_TOKEN="<YOUR_KITTYCAD_API_TOKEN>"
+$env:VITE_KC_API_BASE_URL="https://api.dev.zoo.dev"
+$env:E2E_TAURI_ENABLED="true"
+$env:TS_NODE_COMPILER_OPTIONS='{"module": "commonjs"}'
+$env:E2E_APPLICATION=".\src-tauri\target\debug\Zoo Modeling App.exe"
+Stop-Process -Name msedgedriver
+yarn wdio run wdio.conf.ts
+```
+
 ## KCL
 
 For how to contribute to KCL, [see our KCL README](https://github.com/KittyCAD/modeling-app/tree/main/src/wasm-lib/kcl).

docs/kcl/KNOWN-ISSUES.md

@@ -24,3 +24,6 @@ once fixed in engine will just start working here with no language changes.
     chamfer cases work currently.
 
     Sketching on the chamfered face does not currently work.
+
+- **Shell**: Shell sometimes does not work when arcs or fillets are involved.
+    We are tracking the engine side bug on this.

docs/kcl/index.md

@@ -56,7 +56,6 @@ layout: manual
 * [`line`](kcl/line)
 * [`lineTo`](kcl/lineTo)
 * [`ln`](kcl/ln)
-* [`loft`](kcl/loft)
 * [`log`](kcl/log)
 * [`log10`](kcl/log10)
 * [`log2`](kcl/log2)
@@ -64,7 +63,6 @@ layout: manual
 * [`max`](kcl/max)
 * [`min`](kcl/min)
 * [`mm`](kcl/mm)
-* [`offsetPlane`](kcl/offsetPlane)
 * [`patternCircular2d`](kcl/patternCircular2d)
 * [`patternCircular3d`](kcl/patternCircular3d)
 * [`patternLinear2d`](kcl/patternLinear2d)

e2e/playwright/code-pane-and-errors.spec.ts

@@ -27,19 +27,9 @@ test.describe('Code pane and errors', () => {
     const u = await getUtils(page)
 
     // Load the app with the working starter code
-    await page.addInitScript(() => {
-      localStorage.setItem(
-        'persistCode',
-        `// Extruded Triangle
-const sketch001 = startSketchOn('XZ')
-  |> startProfileAt([0, 0], %)
-  |> line([10, 0], %)
-  |> line([-5, 10], %)
-  |> lineTo([profileStartX(%), profileStartY(%)], %)
-  |> close(%)
-const extrude001 = extrude(5, sketch001)`
-      )
-    })
+    await page.addInitScript((code) => {
+      localStorage.setItem('persistCode', code)
+    }, bracket)
 
     await page.setViewportSize({ width: 1200, height: 500 })
     await u.waitForAuthSkipAppStart()
@@ -271,7 +261,10 @@ test(
 
       await page.getByText('bracket').click()
 
-      await u.waitForPageLoad()
+      await expect(page.getByTestId('loading')).toBeAttached()
+      await expect(page.getByTestId('loading')).not.toBeAttached({
+        timeout: 20_000,
+      })
     })
 
     // If they're open by default, we're not actually testing anything.
@@ -299,7 +292,16 @@ test(
 
       await page.getByText('router-template-slate').click()
 
-      await u.waitForPageLoad()
+      await expect(page.getByTestId('loading')).toBeAttached()
+      await expect(page.getByTestId('loading')).not.toBeAttached({
+        timeout: 20_000,
+      })
+
+      await expect(
+        page.getByRole('button', { name: 'Start Sketch' })
+      ).toBeEnabled({
+        timeout: 20_000,
+      })
     })
 
     await test.step('All panes opened before should be visible', async () => {

e2e/playwright/desktop-export.spec.ts

@@ -43,6 +43,12 @@ test(
       // open the project
       await page.getByText(`bracket`).click()
 
+      // wait for the project to load
+      await expect(page.getByTestId('loading')).toBeAttached()
+      await expect(page.getByTestId('loading')).not.toBeAttached({
+        timeout: 20_000,
+      })
+
       // expect zero errors in guter
       await expect(page.locator('.cm-lint-marker-error')).not.toBeVisible()
 
@@ -50,12 +56,6 @@ test(
       const exportButton = page.getByTestId('export-pane-button')
       await expect(exportButton).toBeVisible()
 
-      // Wait for the model to finish loading
-      const modelStateIndicator = page.getByTestId(
-        'model-state-indicator-execution-done'
-      )
-      await expect(modelStateIndicator).toBeVisible({ timeout: 60000 })
-
       const gltfOption = page.getByText('glTF')
       const submitButton = page.getByText('Confirm Export')
       const exportingToastMessage = page.getByText(`Exporting...`)
@@ -104,7 +104,7 @@ test(
             },
             { timeout: 15_000 }
           )
-          .toBe(477481)
+          .toBe(477327)
 
         // clean up output.gltf
         await fsp.rm('output.gltf')

e2e/playwright/file-tree.spec.ts

@@ -112,8 +112,7 @@ test.describe('when using the file tree to', () => {
       })
 
       const {
-        openKclCodePanel,
-        openFilePanel,
+        panesOpen,
         createAndSelectProject,
         pasteCodeInEditor,
         createNewFileAndSelect,
@@ -125,9 +124,9 @@ test.describe('when using the file tree to', () => {
       await page.setViewportSize({ width: 1200, height: 500 })
       page.on('console', console.log)
 
+      await panesOpen(['files', 'code'])
+
       await createAndSelectProject('project-000')
-      await openKclCodePanel()
-      await openFilePanel()
       // File the main.kcl with contents
       const kclCube = await fsp.readFile(
         'src/wasm-lib/tests/executor/inputs/cube.kcl',
@@ -202,78 +201,4 @@ test.describe('when using the file tree to', () => {
       await electronApp.close()
     }
   )
-
-  test(
-    'loading small file, then large, then back to small',
-    {
-      tag: '@electron',
-    },
-    async ({ browser: _ }, testInfo) => {
-      const { page } = await setupElectron({
-        testInfo,
-      })
-
-      const {
-        panesOpen,
-        createAndSelectProject,
-        pasteCodeInEditor,
-        createNewFile,
-        openDebugPanel,
-        closeDebugPanel,
-        expectCmdLog,
-      } = await getUtils(page, test)
-
-      await page.setViewportSize({ width: 1200, height: 500 })
-      page.on('console', console.log)
-
-      await panesOpen(['files', 'code'])
-      await createAndSelectProject('project-000')
-
-      // Create a small file
-      const kclCube = await fsp.readFile(
-        'src/wasm-lib/tests/executor/inputs/cube.kcl',
-        'utf-8'
-      )
-      // pasted into main.kcl
-      await pasteCodeInEditor(kclCube)
-
-      // Create a large lego file
-      await createNewFile('lego')
-      const legoFile = page.getByRole('listitem').filter({
-        has: page.getByRole('button', { name: 'lego.kcl' }),
-      })
-      await expect(legoFile).toBeVisible({ timeout: 60_000 })
-      await legoFile.click()
-      const kclLego = await fsp.readFile(
-        'src/wasm-lib/tests/executor/inputs/lego.kcl',
-        'utf-8'
-      )
-      await pasteCodeInEditor(kclLego)
-      const mainFile = page.getByRole('listitem').filter({
-        has: page.getByRole('button', { name: 'main.kcl' }),
-      })
-
-      // Open settings and enable the debug panel
-      await page
-        .getByRole('link', {
-          name: 'settings Settings',
-        })
-        .click()
-      await page.locator('#showDebugPanel').getByText('OffOn').click()
-      await page.getByTestId('settings-close-button').click()
-
-      await test.step('swap between small and large files', async () => {
-        await openDebugPanel()
-        // Previously created a file so we need to start back at main.kcl
-        await mainFile.click()
-        await expectCmdLog('[data-message-type="execution-done"]', 60_000)
-        // Click the large file
-        await legoFile.click()
-        // Once it is building, click back to the smaller file
-        await mainFile.click()
-        await expectCmdLog('[data-message-type="execution-done"]', 60_000)
-        await closeDebugPanel()
-      })
-    }
-  )
 })

e2e/playwright/projects.spec.ts

@@ -147,6 +147,9 @@ test.describe('Can export from electron app', () => {
         const u = await getUtils(page)
 
         page.on('console', console.log)
+        await electronApp.context().addInitScript(async () => {
+          ;(window as any).playwrightSkipFilePicker = true
+        })
 
         const pointOnModel = { x: 630, y: 280 }
 
@@ -170,10 +173,10 @@ test.describe('Can export from electron app', () => {
           // gray at this pixel means the stream has loaded in the most
           // user way we can verify it (pixel color)
           await expect
-            .poll(() => u.getGreatestPixDiff(pointOnModel, [85, 85, 85]), {
+            .poll(() => u.getGreatestPixDiff(pointOnModel, [75, 75, 75]), {
               timeout: 10_000,
             })
-            .toBeLessThan(15)
+            .toBeLessThan(10)
         })
 
         const exportLocations: Array<Paths> = []
@@ -204,7 +207,7 @@ test.describe('Can export from electron app', () => {
               },
               { timeout: 15_000 }
             )
-            .toBe(477481)
+            .toBe(477327)
 
           // clean up output.gltf
           await fsp.rm('output.gltf')
@@ -492,6 +495,10 @@ test(
 
     await file.click()
 
+    await expect(page.getByTestId('loading')).toBeAttached()
+    await expect(page.getByTestId('loading')).not.toBeAttached({
+      timeout: 20_000,
+    })
     await expect(u.codeLocator).toContainText(
       'A mounting bracket for the Focusrite Scarlett Solo audio interface'
     )
@@ -849,10 +856,10 @@ const extrude001 = extrude(200, sketch001)`)
     // gray at this pixel means the stream has loaded in the most
     // user way we can verify it (pixel color)
     await expect
-      .poll(() => u.getGreatestPixDiff(pointOnModel, [143, 143, 143]), {
+      .poll(() => u.getGreatestPixDiff(pointOnModel, [132, 132, 132]), {
         timeout: 10_000,
       })
-      .toBeLessThan(15)
+      .toBeLessThan(10)
 
     await expect(async () => {
       await page.mouse.move(0, 0, { steps: 5 })
@@ -860,8 +867,8 @@ const extrude001 = extrude(200, sketch001)`)
       await page.mouse.click(pointOnModel.x, pointOnModel.y)
       // check user can interact with model by checking it turns yellow
       await expect
-        .poll(() => u.getGreatestPixDiff(pointOnModel, [180, 180, 137]))
-        .toBeLessThan(15)
+        .poll(() => u.getGreatestPixDiff(pointOnModel, [176, 180, 132]))
+        .toBeLessThan(10)
     }).toPass({ timeout: 40_000, intervals: [1_000] })
 
     await page.getByTestId('app-logo').click()
@@ -935,15 +942,24 @@ test(
 
       await page.getByText('bracket').click()
 
-      await u.waitForPageLoad()
+      await expect(page.getByTestId('loading')).toBeAttached()
+      await expect(page.getByTestId('loading')).not.toBeAttached({
+        timeout: 20_000,
+      })
+
+      await expect(
+        page.getByRole('button', { name: 'Start Sketch' })
+      ).toBeEnabled({
+        timeout: 20_000,
+      })
 
       // gray at this pixel means the stream has loaded in the most
       // user way we can verify it (pixel color)
       await expect
-        .poll(() => u.getGreatestPixDiff(pointOnModel, [85, 85, 85]), {
+        .poll(() => u.getGreatestPixDiff(pointOnModel, [75, 75, 75]), {
           timeout: 10_000,
         })
-        .toBeLessThan(15)
+        .toBeLessThan(10)
     })
 
     await test.step('Clicking the logo takes us back to the projects page / home', async () => {
@@ -960,15 +976,24 @@ test(
 
       await page.getByText('router-template-slate').click()
 
-      await u.waitForPageLoad()
+      await expect(page.getByTestId('loading')).toBeAttached()
+      await expect(page.getByTestId('loading')).not.toBeAttached({
+        timeout: 20_000,
+      })
+
+      await expect(
+        page.getByRole('button', { name: 'Start Sketch' })
+      ).toBeEnabled({
+        timeout: 20_000,
+      })
 
       // gray at this pixel means the stream has loaded in the most
       // user way we can verify it (pixel color)
       await expect
-        .poll(() => u.getGreatestPixDiff(pointOnModel, [143, 143, 143]), {
+        .poll(() => u.getGreatestPixDiff(pointOnModel, [132, 132, 132]), {
           timeout: 10_000,
         })
-        .toBeLessThan(15)
+        .toBeLessThan(10)
     })
 
     await test.step('Opening the router-template project should load the stream', async () => {
@@ -1719,7 +1744,7 @@ test.describe('Renaming in the file tree', () => {
       })
 
       await test.step('Rename the folder', async () => {
-        await page.waitForTimeout(2000)
+        await page.waitForTimeout(60000)
         await folderToRename.click({ button: 'right' })
         await expect(renameMenuItem).toBeVisible()
         await renameMenuItem.click()

e2e/playwright/regression-tests.spec.ts

@@ -54,67 +54,6 @@ const sketch001 = startSketchAt([-0, -0])
     const crypticErrorText = `ApiError`
     await expect(page.getByText(crypticErrorText).first()).toBeVisible()
   })
-  test('user should not have to press down twice in cmdbar', async ({
-    page,
-  }) => {
-    // because the model has `line([0,0]..` it is valid code, but the model is invalid
-    // regression test for https://github.com/KittyCAD/modeling-app/issues/3251
-    // Since the bad model also found as issue with the artifact graph, which in tern blocked the editor diognostics
-    const u = await getUtils(page)
-    await page.addInitScript(async () => {
-      localStorage.setItem(
-        'persistCode',
-        `const sketch2 = startSketchOn("XY")
-const sketch001 = startSketchAt([-0, -0])
-  |> line([0, 0], %)
-  |> line([-4.84, -5.29], %)
-  |> lineTo([profileStartX(%), profileStartY(%)], %)
-  |> close(%)`
-      )
-    })
-
-    await page.setViewportSize({ width: 1000, height: 500 })
-
-    await page.goto('/')
-    await u.waitForPageLoad()
-
-    await test.step('Check arrow down works', async () => {
-      await page.getByTestId('command-bar-open-button').click()
-
-      await page
-        .getByRole('option', { name: 'floppy disk arrow Export' })
-        .click()
-
-      // press arrow down key twice
-      await page.keyboard.press('ArrowDown')
-      await page.waitForTimeout(100)
-      await page.keyboard.press('ArrowDown')
-
-      // STL is the third option, which makes sense for two arrow downs
-      await expect(page.locator('[data-headlessui-state="active"]')).toHaveText(
-        'STL'
-      )
-
-      await page.keyboard.press('Escape')
-      await page.waitForTimeout(200)
-      await page.keyboard.press('Escape')
-      await page.waitForTimeout(200)
-    })
-
-    await test.step('Check arrow up works', async () => {
-      // theme in test is dark, which is the second option, which means we can test arrow up
-      await page.getByTestId('command-bar-open-button').click()
-
-      await page.getByText('The overall appearance of the').click()
-
-      await page.keyboard.press('ArrowUp')
-      await page.waitForTimeout(100)
-
-      await expect(page.locator('[data-headlessui-state="active"]')).toHaveText(
-        'light'
-      )
-    })
-  })
   test('executes on load', async ({ page }) => {
     const u = await getUtils(page)
     await page.addInitScript(async () => {
@@ -419,7 +358,6 @@ const sketch001 = startSketchAt([-0, -0])
       await page.addInitScript(
         async ({ code }) => {
           localStorage.setItem('persistCode', code)
-          ;(window as any).playwrightSkipFilePicker = true
         },
         {
           code: bracket,
@@ -455,22 +393,20 @@ const sketch001 = startSketchAt([-0, -0])
       await test.step('The second export is blocked', async () => {
         // Find the toast.
         // Look out for the toast message
-        await Promise.all([
-          expect(exportingToastMessage.first()).toBeVisible(),
-          expect(alreadyExportingToastMessage).toBeVisible(),
-        ])
+        await expect(exportingToastMessage).toBeVisible()
+        await expect(alreadyExportingToastMessage).toBeVisible()
+
+        await page.waitForTimeout(1000)
       })
 
       await test.step('The first export still succeeds', async () => {
-        await Promise.all([
-          expect(exportingToastMessage).not.toBeVisible({ timeout: 15_000 }),
-          expect(errorToastMessage).not.toBeVisible(),
-          expect(engineErrorToastMessage).not.toBeVisible(),
-          expect(successToastMessage).toBeVisible({ timeout: 15_000 }),
-          expect(alreadyExportingToastMessage).not.toBeVisible({
-            timeout: 15_000,
-          }),
-        ])
+        await expect(exportingToastMessage).not.toBeVisible()
+        await expect(errorToastMessage).not.toBeVisible()
+        await expect(engineErrorToastMessage).not.toBeVisible()
+
+        await expect(successToastMessage).toBeVisible()
+
+        await expect(alreadyExportingToastMessage).not.toBeVisible()
       })
     })
 
@@ -483,12 +419,10 @@ const sketch001 = startSketchAt([-0, -0])
       await expect(exportingToastMessage).toBeVisible()
 
       // Expect it to succeed.
-      await Promise.all([
-        expect(exportingToastMessage).not.toBeVisible(),
-        expect(errorToastMessage).not.toBeVisible(),
-        expect(engineErrorToastMessage).not.toBeVisible(),
-        expect(alreadyExportingToastMessage).not.toBeVisible(),
-      ])
+      await expect(exportingToastMessage).not.toBeVisible()
+      await expect(errorToastMessage).not.toBeVisible()
+      await expect(engineErrorToastMessage).not.toBeVisible()
+      await expect(alreadyExportingToastMessage).not.toBeVisible()
 
       await expect(successToastMessage).toBeVisible()
     })

e2e/playwright/test-utils.ts

@@ -27,7 +27,6 @@ import * as TOML from '@iarna/toml'
 import { SaveSettingsPayload } from 'lib/settings/settingsTypes'
 import { SETTINGS_FILE_NAME } from 'lib/constants'
 import { isArray } from 'lib/utils'
-import { reportRejection } from 'lib/trap'
 
 type TestColor = [number, number, number]
 export const TEST_COLORS = {
@@ -440,50 +439,46 @@ export async function getUtils(page: Page, test_?: typeof test) {
       }
       return maxDiff
     },
-    doAndWaitForImageDiff: (fn: () => Promise<unknown>, diffCount = 200) =>
-      new Promise<boolean>((resolve) => {
-        ;(async () => {
+    doAndWaitForImageDiff: (fn: () => Promise<any>, diffCount = 200) =>
+      new Promise(async (resolve) => {
+        await page.screenshot({
+          path: './e2e/playwright/temp1.png',
+          fullPage: true,
+        })
+        await fn()
+        const isImageDiff = async () => {
           await page.screenshot({
-            path: './e2e/playwright/temp1.png',
+            path: './e2e/playwright/temp2.png',
             fullPage: true,
           })
-          await fn()
-          const isImageDiff = async () => {
-            await page.screenshot({
-              path: './e2e/playwright/temp2.png',
-              fullPage: true,
-            })
-            const screenshot1 = PNG.sync.read(
-              await fsp.readFile('./e2e/playwright/temp1.png')
-            )
-            const screenshot2 = PNG.sync.read(
-              await fsp.readFile('./e2e/playwright/temp2.png')
-            )
-            const actualDiffCount = pixelMatch(
-              screenshot1.data,
-              screenshot2.data,
-              null,
-              screenshot1.width,
-              screenshot2.height
-            )
-            return actualDiffCount > diffCount
-          }
+          const screenshot1 = PNG.sync.read(
+            await fsp.readFile('./e2e/playwright/temp1.png')
+          )
+          const screenshot2 = PNG.sync.read(
+            await fsp.readFile('./e2e/playwright/temp2.png')
+          )
+          const actualDiffCount = pixelMatch(
+            screenshot1.data,
+            screenshot2.data,
+            null,
+            screenshot1.width,
+            screenshot2.height
+          )
+          return actualDiffCount > diffCount
+        }
 
-          // run isImageDiff every 50ms until it returns true or 5 seconds have passed (100 times)
-          let count = 0
-          const interval = setInterval(() => {
-            ;(async () => {
-              count++
-              if (await isImageDiff()) {
-                clearInterval(interval)
-                resolve(true)
-              } else if (count > 100) {
-                clearInterval(interval)
-                resolve(false)
-              }
-            })().catch(reportRejection)
-          }, 50)
-        })().catch(reportRejection)
+        // run isImageDiff every 50ms until it returns true or 5 seconds have passed (100 times)
+        let count = 0
+        const interval = setInterval(async () => {
+          count++
+          if (await isImageDiff()) {
+            clearInterval(interval)
+            resolve(true)
+          } else if (count > 100) {
+            clearInterval(interval)
+            resolve(false)
+          }
+        }, 50)
       }),
     emulateNetworkConditions: async (
       networkOptions: Protocol.Network.emulateNetworkConditionsParameters
@@ -553,16 +548,13 @@ export async function getUtils(page: Page, test_?: typeof test) {
 
     createNewFileAndSelect: async (name: string) => {
       return test?.step(`Create a file named ${name}, select it`, async () => {
-        await openFilePanel(page)
         await page.getByTestId('create-file-button').click()
         await page.getByTestId('file-rename-field').fill(name)
         await page.keyboard.press('Enter')
-        const newFile = page
+        await page
           .locator('[data-testid="file-pane-scroll-container"] button')
           .filter({ hasText: name })
-
-        await expect(newFile).toBeVisible()
-        await newFile.click()
+          .click()
       })
     },
 
@@ -593,15 +585,6 @@ export async function getUtils(page: Page, test_?: typeof test) {
       })
     },
 
-    /**
-     * @deprecated Sorry I don't have time to fix this right now, but runs like
-     * the one linked below show me that setting the open panes in this manner is not reliable.
-     * You can either set `openPanes` as a part of the same initScript we run in setupElectron/setup,
-     * or you can imperatively open the panes with functions like {openKclCodePanel}
-     * (or we can make a general openPane function that takes a paneId).,
-     * but having a separate initScript does not seem to work reliably.
-     * @link https://github.com/KittyCAD/modeling-app/actions/runs/10731890169/job/29762700806?pr=3807#step:20:19553
-     */
     panesOpen: async (paneIds: PaneId[]) => {
       return test?.step(`Setting ${paneIds} panes to be open`, async () => {
         await page.addInitScript(
@@ -869,12 +852,10 @@ export async function setupElectron({
   testInfo,
   folderSetupFn,
   cleanProjectDir = true,
-  appSettings,
 }: {
   testInfo: TestInfo
   folderSetupFn?: (projectDirName: string) => Promise<void>
   cleanProjectDir?: boolean
-  appSettings?: Partial<SaveSettingsPayload>
 }) {
   // create or otherwise clear the folder
   const projectDirName = testInfo.outputPath('electron-test-projects-dir')
@@ -908,19 +889,15 @@ export async function setupElectron({
 
   if (cleanProjectDir) {
     const tempSettingsFilePath = join(projectDirName, SETTINGS_FILE_NAME)
-    const settingsOverrides = TOML.stringify(
-      appSettings
-        ? { settings: appSettings }
-        : {
-            ...TEST_SETTINGS,
-            settings: {
-              app: {
-                ...TEST_SETTINGS.app,
-                projectDirectory: projectDirName,
-              },
-            },
-          }
-    )
+    const settingsOverrides = TOML.stringify({
+      ...TEST_SETTINGS,
+      settings: {
+        app: {
+          ...TEST_SETTINGS.app,
+          projectDirectory: projectDirName,
+        },
+      },
+    })
     await fsp.writeFile(tempSettingsFilePath, settingsOverrides)
   }
 

e2e/playwright/testing-selections.spec.ts

@@ -787,7 +787,7 @@ const extrude001 = extrude(50, sketch001)
 
     await expect
       .poll(() => u.getGreatestPixDiff(extrudeWall, noHoverColor))
-      .toBeLessThan(15)
+      .toBeLessThan(5)
     await page.mouse.move(nothing.x, nothing.y)
     await page.waitForTimeout(100)
     await page.mouse.move(extrudeWall.x, extrudeWall.y)
@@ -798,18 +798,18 @@ const extrude001 = extrude(50, sketch001)
     await page.waitForTimeout(200)
     await expect(
       await u.getGreatestPixDiff(extrudeWall, hoverColor)
-    ).toBeLessThan(15)
+    ).toBeLessThan(6)
     await page.mouse.click(extrudeWall.x, extrudeWall.y)
     await expect(page.locator('.cm-activeLine')).toHaveText(`|> ${extrudeText}`)
     await page.waitForTimeout(200)
     await expect(
       await u.getGreatestPixDiff(extrudeWall, selectColor)
-    ).toBeLessThan(15)
+    ).toBeLessThan(6)
     await page.waitForTimeout(1000)
     // check color stays there, i.e. not overridden (this was a bug previously)
     await expect(
       await u.getGreatestPixDiff(extrudeWall, selectColor)
-    ).toBeLessThan(15)
+    ).toBeLessThan(6)
 
     await page.mouse.move(nothing.x, nothing.y)
     await page.waitForTimeout(300)
@@ -820,21 +820,21 @@ const extrude001 = extrude(50, sketch001)
     hoverColor = [145, 145, 145]
     selectColor = [168, 168, 120]
 
-    await expect(await u.getGreatestPixDiff(cap, noHoverColor)).toBeLessThan(15)
+    await expect(await u.getGreatestPixDiff(cap, noHoverColor)).toBeLessThan(6)
     await page.mouse.move(cap.x, cap.y)
     await expect(page.getByTestId('hover-highlight').first()).toBeVisible()
     await expect(page.getByTestId('hover-highlight').first()).toContainText(
       removeAfterFirstParenthesis(capText)
     )
     await page.waitForTimeout(200)
-    await expect(await u.getGreatestPixDiff(cap, hoverColor)).toBeLessThan(15)
+    await expect(await u.getGreatestPixDiff(cap, hoverColor)).toBeLessThan(6)
     await page.mouse.click(cap.x, cap.y)
     await expect(page.locator('.cm-activeLine')).toHaveText(`|> ${capText}`)
     await page.waitForTimeout(200)
-    await expect(await u.getGreatestPixDiff(cap, selectColor)).toBeLessThan(15)
+    await expect(await u.getGreatestPixDiff(cap, selectColor)).toBeLessThan(6)
     await page.waitForTimeout(1000)
     // check color stays there, i.e. not overridden (this was a bug previously)
-    await expect(await u.getGreatestPixDiff(cap, selectColor)).toBeLessThan(15)
+    await expect(await u.getGreatestPixDiff(cap, selectColor)).toBeLessThan(6)
   })
   test("Various pipe expressions should and shouldn't allow edit and or extrude", async ({
     page,

e2e/playwright/testing-settings.spec.ts

@@ -8,7 +8,7 @@ import {
   tearDown,
   executorInputPath,
 } from './test-utils'
-import { SaveSettingsPayload, SettingsLevel } from 'lib/settings/settingsTypes'
+import { SaveSettingsPayload } from 'lib/settings/settingsTypes'
 import { TEST_SETTINGS_KEY, TEST_SETTINGS_CORRUPTED } from './storageStates'
 import * as TOML from '@iarna/toml'
 
@@ -154,33 +154,29 @@ test.describe('Testing settings', () => {
 
   test('Project and user settings can be reset', async ({ page }) => {
     const u = await getUtils(page)
-    await test.step(`Setup`, async () => {
-      await page.setViewportSize({ width: 1200, height: 500 })
-      await u.waitForAuthSkipAppStart()
-    })
+    await page.setViewportSize({ width: 1200, height: 500 })
+    await u.waitForAuthSkipAppStart()
+    await page
+      .getByRole('button', { name: 'Start Sketch' })
+      .waitFor({ state: 'visible' })
 
-    // Selectors and constants
     const projectSettingsTab = page.getByRole('radio', { name: 'Project' })
     const userSettingsTab = page.getByRole('radio', { name: 'User' })
-    const resetButton = (level: SettingsLevel) =>
-      page.getByRole('button', {
-        name: `Reset ${level}-level settings`,
-      })
+    const resetButton = page.getByRole('button', {
+      name: 'Restore default settings',
+    })
     const themeColorSetting = page.locator('#themeColor').getByRole('slider')
     const settingValues = {
       default: '259',
       user: '120',
       project: '50',
     }
-    const resetToast = (level: SettingsLevel) =>
-      page.getByText(`${level}-level settings were reset`)
 
-    await test.step(`Open the settings modal`, async () => {
-      await page.getByRole('link', { name: 'Settings' }).last().click()
-      await expect(
-        page.getByRole('heading', { name: 'Settings', exact: true })
-      ).toBeVisible()
-    })
+    // Open the settings modal with lower-right button
+    await page.getByRole('link', { name: 'Settings' }).last().click()
+    await expect(
+      page.getByRole('heading', { name: 'Settings', exact: true })
+    ).toBeVisible()
 
     await test.step('Set up theme color', async () => {
       // Verify we're looking at the project-level settings,
@@ -199,40 +195,37 @@ test.describe('Testing settings', () => {
 
     await test.step('Reset project settings', async () => {
       // Click the reset settings button.
-      await resetButton('project').click()
+      await resetButton.click()
 
-      await expect(resetToast('project')).toBeVisible()
-      await expect(resetToast('project')).not.toBeVisible()
+      await expect(page.getByText('Settings restored to default')).toBeVisible()
+      await expect(
+        page.getByText('Settings restored to default')
+      ).not.toBeVisible()
 
       // Verify it is now set to the inherited user value
-      await expect(themeColorSetting).toHaveValue(settingValues.user)
+      await expect(themeColorSetting).toHaveValue(settingValues.default)
 
-      await test.step(`Check that the user settings did not change`, async () => {
-        await userSettingsTab.click()
-        await expect(themeColorSetting).toHaveValue(settingValues.user)
-      })
+      // Check that the user setting also rolled back
+      await userSettingsTab.click()
+      await expect(themeColorSetting).toHaveValue(settingValues.default)
+      await projectSettingsTab.click()
 
-      await test.step(`Set project-level again to test the user-level reset`, async () => {
-        await projectSettingsTab.click()
-        await themeColorSetting.fill(settingValues.project)
-        await userSettingsTab.click()
-      })
+      // Set project-level value to 50 again to test the user-level reset
+      await themeColorSetting.fill(settingValues.project)
+      await userSettingsTab.click()
     })
 
     await test.step('Reset user settings', async () => {
-      // Click the reset settings button.
-      await resetButton('user').click()
-
-      await expect(resetToast('user')).toBeVisible()
-      await expect(resetToast('user')).not.toBeVisible()
+      // Change the setting and click the reset settings button.
+      await themeColorSetting.fill(settingValues.user)
+      await resetButton.click()
 
       // Verify it is now set to the default value
       await expect(themeColorSetting).toHaveValue(settingValues.default)
 
-      await test.step(`Check that the project settings did not change`, async () => {
-        await projectSettingsTab.click()
-        await expect(themeColorSetting).toHaveValue(settingValues.project)
-      })
+      // Check that the project setting also changed
+      await projectSettingsTab.click()
+      await expect(themeColorSetting).toHaveValue(settingValues.default)
     })
   })
 
@@ -295,7 +288,7 @@ test.describe('Testing settings', () => {
       })
 
       await test.step('Refresh the application and see project setting applied', async () => {
-        await page.reload({ waitUntil: 'domcontentloaded' })
+        await page.reload()
 
         await expect(logoLink).toHaveCSS('--primary-hue', projectThemeColor)
         await settingsCloseButton.click()
@@ -310,109 +303,53 @@ test.describe('Testing settings', () => {
     }
   )
 
-  test(
-    `Load desktop app with no settings file`,
-    { tag: '@electron' },
-    async ({ browser: _ }, testInfo) => {
-      const { electronApp, page } = await setupElectron({
-        // This is what makes no settings file get created
-        cleanProjectDir: false,
-        testInfo,
-      })
-
-      await page.setViewportSize({ width: 1200, height: 500 })
-
-      // Selectors and constants
-      const errorHeading = page.getByRole('heading', {
-        name: 'An unextected error occurred',
-      })
-      const projectDirLink = page.getByText('Loaded from')
-
-      // If the app loads without exploding we're in the clear
-      await expect(errorHeading).not.toBeVisible()
-      await expect(projectDirLink).toBeVisible()
-
-      await electronApp.close()
-    }
-  )
-
-  test(
-    `Load desktop app with a settings file, but no project directory setting`,
-    { tag: '@electron' },
-    async ({ browser: _ }, testInfo) => {
-      const { electronApp, page } = await setupElectron({
-        testInfo,
-        appSettings: {
-          app: {
-            themeColor: '259',
-          },
-        },
-      })
-
-      await page.setViewportSize({ width: 1200, height: 500 })
-
-      // Selectors and constants
-      const errorHeading = page.getByRole('heading', {
-        name: 'An unextected error occurred',
-      })
-      const projectDirLink = page.getByText('Loaded from')
-
-      // If the app loads without exploding we're in the clear
-      await expect(errorHeading).not.toBeVisible()
-      await expect(projectDirLink).toBeVisible()
-
-      await electronApp.close()
-    }
-  )
-
   test(
     `Closing settings modal should go back to the original file being viewed`,
     { tag: '@electron' },
     async ({ browser: _ }, testInfo) => {
       const { electronApp, page } = await setupElectron({
         testInfo,
-        folderSetupFn: async (dir) => {
-          const bracketDir = join(dir, 'project-000')
-          await fsp.mkdir(bracketDir, { recursive: true })
-          await fsp.copyFile(
-            executorInputPath('cube.kcl'),
-            join(bracketDir, 'main.kcl')
-          )
-          await fsp.copyFile(
-            executorInputPath('cylinder.kcl'),
-            join(bracketDir, '2.kcl')
-          )
-        },
+        folderSetupFn: async () => {},
       })
-      const kclCube = await fsp.readFile(executorInputPath('cube.kcl'), 'utf-8')
-      const kclCylinder = await fsp.readFile(
-        executorInputPath('cylinder.kcl'),
-        'utf8'
-      )
 
       const {
-        openKclCodePanel,
-        openFilePanel,
-        waitForPageLoad,
-        selectFile,
+        panesOpen,
+        createAndSelectProject,
+        pasteCodeInEditor,
+        clickPane,
+        createNewFileAndSelect,
         editorTextMatches,
       } = await getUtils(page, test)
 
       await page.setViewportSize({ width: 1200, height: 500 })
       page.on('console', console.log)
 
-      await test.step('Precondition: Open to second project file', async () => {
-        await expect(page.getByTestId('home-section')).toBeVisible()
-        await page.getByText('project-000').click()
-        await waitForPageLoad()
-        await openKclCodePanel()
-        await openFilePanel()
-        await editorTextMatches(kclCube)
+      await panesOpen([])
 
-        await selectFile('2.kcl')
-        await editorTextMatches(kclCylinder)
+      await test.step('Precondition: No projects exist', async () => {
+        await expect(page.getByTestId('home-section')).toBeVisible()
+        const projectLinksPre = page.getByTestId('project-link')
+        await expect(projectLinksPre).toHaveCount(0)
       })
 
+      await createAndSelectProject('project-000')
+
+      await clickPane('code')
+      const kclCube = await fsp.readFile(
+        'src/wasm-lib/tests/executor/inputs/cube.kcl',
+        'utf-8'
+      )
+      await pasteCodeInEditor(kclCube)
+
+      await clickPane('files')
+      await createNewFileAndSelect('2.kcl')
+
+      const kclCylinder = await fsp.readFile(
+        'src/wasm-lib/tests/executor/inputs/cylinder.kcl',
+        'utf-8'
+      )
+      await pasteCodeInEditor(kclCylinder)
+
       const settingsOpenButton = page.getByRole('link', {
         name: 'settings Settings',
       })
@@ -420,9 +357,6 @@ test.describe('Testing settings', () => {
 
       await test.step('Open and close settings', async () => {
         await settingsOpenButton.click()
-        await expect(
-          page.getByRole('heading', { name: 'Settings', exact: true })
-        ).toBeVisible()
         await settingsCloseButton.click()
       })
 
@@ -436,37 +370,25 @@ test.describe('Testing settings', () => {
 
   test('Changing modeling default unit', async ({ page }) => {
     const u = await getUtils(page)
-    await test.step(`Test setup`, async () => {
-      await page.setViewportSize({ width: 1200, height: 500 })
-      await u.waitForAuthSkipAppStart()
-      await page
-        .getByRole('button', { name: 'Start Sketch' })
-        .waitFor({ state: 'visible' })
-    })
+    await page.setViewportSize({ width: 1200, height: 500 })
+    await u.waitForAuthSkipAppStart()
+    await page
+      .getByRole('button', { name: 'Start Sketch' })
+      .waitFor({ state: 'visible' })
 
-    // Selectors and constants
     const userSettingsTab = page.getByRole('radio', { name: 'User' })
-    const projectSettingsTab = page.getByRole('radio', { name: 'Project' })
-    const defaultUnitSection = page.getByText(
-      'default unitRoll back default unitRoll back to match'
-    )
-    const defaultUnitRollbackButton = page.getByRole('button', {
-      name: 'Roll back default unit',
-    })
 
-    await test.step(`Open the settings modal`, async () => {
-      await page.getByRole('link', { name: 'Settings' }).last().click()
-      await expect(
-        page.getByRole('heading', { name: 'Settings', exact: true })
-      ).toBeVisible()
-    })
+    // Open the settings modal with lower-right button
+    await page.getByRole('link', { name: 'Settings' }).last().click()
+    await expect(
+      page.getByRole('heading', { name: 'Settings', exact: true })
+    ).toBeVisible()
 
-    await test.step(`Reset unit setting`, async () => {
-      await userSettingsTab.click()
-      await defaultUnitSection.hover()
-      await defaultUnitRollbackButton.click()
-      await projectSettingsTab.click()
+    const resetButton = page.getByRole('button', {
+      name: 'Restore default settings',
     })
+    // Default unit should be mm
+    await resetButton.click()
 
     await test.step('Change modeling default unit within project tab', async () => {
       const changeUnitOfMeasureInProjectTab = async (unitOfMeasure: string) => {
@@ -571,70 +493,4 @@ test.describe('Testing settings', () => {
       await changeUnitOfMeasureInGizmo('m', 'Meters')
     })
   })
-
-  test('Changing theme in sketch mode', async ({ page }) => {
-    const u = await getUtils(page)
-    await page.addInitScript(() => {
-      localStorage.setItem(
-        'persistCode',
-        `const sketch001 = startSketchOn('XZ')
-  |> startProfileAt([0, 0], %)
-  |> line([5, 0], %)
-  |> line([0, 5], %)
-  |> line([-5, 0], %)
-  |> lineTo([profileStartX(%), profileStartY(%)], %)
-  |> close(%)
-const extrude001 = extrude(5, sketch001)
-`
-      )
-    })
-    await page.setViewportSize({ width: 1200, height: 500 })
-
-    // Selectors and constants
-    const editSketchButton = page.getByRole('button', { name: 'Edit Sketch' })
-    const lineToolButton = page.getByTestId('line')
-    const segmentOverlays = page.getByTestId('segment-overlay')
-    const sketchOriginLocation = { x: 600, y: 250 }
-    const darkThemeSegmentColor: [number, number, number] = [215, 215, 215]
-    const lightThemeSegmentColor: [number, number, number] = [90, 90, 90]
-
-    await test.step(`Get into sketch mode`, async () => {
-      await u.waitForAuthSkipAppStart()
-      await page.mouse.click(700, 200)
-      await expect(editSketchButton).toBeVisible()
-      await editSketchButton.click()
-
-      // We use the line tool as a proxy for sketch mode
-      await expect(lineToolButton).toBeVisible()
-      await expect(segmentOverlays).toHaveCount(4)
-      // but we allow more time to pass for animating to the sketch
-      await page.waitForTimeout(1000)
-    })
-
-    await test.step(`Check the sketch line color before`, async () => {
-      await expect
-        .poll(() =>
-          u.getGreatestPixDiff(sketchOriginLocation, darkThemeSegmentColor)
-        )
-        .toBeLessThan(15)
-    })
-
-    await test.step(`Change theme to light using command palette`, async () => {
-      await page.keyboard.press('ControlOrMeta+K')
-      await page.getByRole('option', { name: 'theme' }).click()
-      await page.getByRole('option', { name: 'light' }).click()
-      await expect(page.getByText('theme to "light"')).toBeVisible()
-
-      // Make sure we haven't left sketch mode
-      await expect(lineToolButton).toBeVisible()
-    })
-
-    await test.step(`Check the sketch line color after`, async () => {
-      await expect
-        .poll(() =>
-          u.getGreatestPixDiff(sketchOriginLocation, lightThemeSegmentColor)
-        )
-        .toBeLessThan(15)
-    })
-  })
 })

e2e/playwright/text-to-cad-tests.spec.ts

@@ -534,7 +534,7 @@ test.describe('Text-to-CAD tests', () => {
 
     // Ensure the final toast remains.
     await expect(page.getByText(`a 2x10 lego`)).not.toBeVisible()
-    await expect(page.getByText(`Prompt: "a 2x8 lego`)).not.toBeVisible()
+    await expect(page.getByText(`a 2x8 lego`)).not.toBeVisible()
     await expect(page.getByText(`a 2x4 lego`)).toBeVisible()
 
     // Ensure you can copy the code for the final model.
@@ -690,53 +690,40 @@ test(
   'Text-to-CAD functionality',
   { tag: '@electron' },
   async ({ browserName }, testInfo) => {
-    const projectName = 'project-000'
-    const prompt = 'lego 2x4'
-    const textToCadFileName = 'lego-2x4.kcl'
-
     const { electronApp, page, dir } = await setupElectron({ testInfo })
     const fileExists = () =>
-      fs.existsSync(join(dir, projectName, textToCadFileName))
+      fs.existsSync(join(dir, 'project-000', 'lego-2x4.kcl'))
 
-    const {
-      createAndSelectProject,
-      openFilePanel,
-      openKclCodePanel,
-      waitForPageLoad,
-    } = await getUtils(page, test)
+    const { createAndSelectProject, panesOpen } = await getUtils(page, test)
 
     await page.setViewportSize({ width: 1200, height: 500 })
 
-    // Locators
-    const projectMenuButton = page.getByRole('button', { name: projectName })
-    const textToCadFileButton = page.getByRole('listitem').filter({
-      has: page.getByRole('button', { name: textToCadFileName }),
-    })
-    const textToCadComment = page.getByText(
-      `// Generated by Text-to-CAD: ${prompt}`
-    )
+    await panesOpen(['code', 'files'])
 
     // Create and navigate to the project
     await createAndSelectProject('project-000')
 
     // Wait for Start Sketch otherwise you will not have access Text-to-CAD command
-    await waitForPageLoad()
-    await openFilePanel()
-    await openKclCodePanel()
+    await expect(
+      page.getByRole('button', { name: 'Start Sketch' })
+    ).toBeEnabled({
+      timeout: 20_000,
+    })
 
     await test.step(`Test file creation`, async () => {
-      await sendPromptFromCommandBar(page, prompt)
+      await sendPromptFromCommandBar(page, 'lego 2x4')
       // File is considered created if it shows up in the Project Files pane
-      await expect(textToCadFileButton).toBeVisible({ timeout: 20_000 })
+      const file = page.getByRole('button', { name: 'lego-2x4.kcl' })
+      await expect(file).toBeVisible({ timeout: 20_000 })
       expect(fileExists()).toBeTruthy()
     })
 
     await test.step(`Test file navigation`, async () => {
-      await expect(projectMenuButton).toContainText('main.kcl')
-      await textToCadFileButton.click()
+      const file = page.getByRole('button', { name: 'lego-2x4.kcl' })
+      await file.click()
+      const kclComment = page.getByText('Lego 2x4 Brick')
       // File can be navigated and loaded assuming a specific KCL comment is loaded into the KCL code pane
-      await expect(textToCadComment).toBeVisible({ timeout: 20_000 })
-      await expect(projectMenuButton).toContainText(textToCadFileName)
+      await expect(kclComment).toBeVisible({ timeout: 20_000 })
     })
 
     await test.step(`Test file deletion on rejection`, async () => {
@@ -750,8 +737,6 @@ test(
       )
       await expect(submittingToastMessage).toBeVisible()
       expect(fileExists()).toBeFalsy()
-      // Confirm we've navigated back to the main.kcl file after deletion
-      await expect(projectMenuButton).toContainText('main.kcl')
     })
 
     await electronApp.close()

electron-builder.yml

@@ -11,23 +11,16 @@ mac:
   category: public.app-category.developer-tools
   artifactName: "${productName}-${version}-${arch}-${os}.${ext}"
   target:
-    - target: dmg
+    - target: dmg 
       arch:
         - x64
         - arm64
-    - target: zip
+    - target: zip 
       arch:
         - x64
         - arm64
   notarize:
     teamId: 92H8YB3B95
-  fileAssociations:
-    - ext: kcl
-      name: kcl
-      mimeType: text/vnd.zoo.kcl
-      description: Zoo KCL File
-      role: Editor
-      rank: Owner
 
 win:
   artifactName: "${productName}-${version}-${arch}-${os}.${ext}"
@@ -45,12 +38,6 @@ win:
   sign: "./sign-win.js"
   publisherName: "KittyCAD Inc"  # needs to be exactly like on Digicert
   icon: "assets/icon.ico"
-  fileAssociations:
-    - ext: kcl
-      name: kcl
-      mimeType: text/vnd.zoo.kcl
-      description: Zoo KCL File
-      role: Editor
 
 msi:
   oneClick: false
@@ -60,6 +47,7 @@ nsis:
   oneClick: false
   perMachine: true
   allowElevation: true
+  license: "LICENSE"
   installerIcon: "assets/icon.ico"
   include: "./installer.nsh"
 
@@ -70,14 +58,8 @@ linux:
       arch:
         - x64
         - arm64
-  fileAssociations:
-    - ext: kcl
-      name: kcl
-      mimeType: text/vnd.zoo.kcl
-      description: Zoo KCL File
-      role: Editor
 
 publish:
   - provider: generic
-    url: https://dl.zoo.dev/releases/modeling-app
+    url: https://dl.zoo.dev/releases/modeling-app/test/electron-builder
     channel: latest

interface.d.ts

@@ -30,6 +30,8 @@ export interface IElectronAPI {
   join: typeof path.join
   sep: typeof path.sep
   rename: (prev: string, next: string) => typeof fs.rename
+  setBaseUrl: (value: string) => void
+  loadProjectAtStartup: () => Promise<ProjectState | null>
   packageJson: {
     name: string
   }

package.json

@@ -1,6 +1,6 @@
 {
   "name": "zoo-modeling-app",
-  "version": "0.25.1",
+  "version": "0.24.12",
   "private": true,
   "productName": "Zoo Modeling App",
   "author": {
@@ -34,12 +34,12 @@
     "@ts-stack/markdown": "^1.5.0",
     "@tweenjs/tween.js": "^23.1.1",
     "@xstate/inspect": "^0.8.0",
-    "@xstate/react": "^4.1.1",
+    "@xstate/react": "^3.2.2",
     "bonjour-service": "^1.2.1",
     "codemirror": "^6.0.1",
     "decamelize": "^6.0.0",
     "electron-squirrel-startup": "^1.0.1",
-    "electron-updater": "^6.3.0",
+    "electron-updater": "^6.2.1",
     "fuse.js": "^7.0.0",
     "html2canvas-pro": "^1.5.8",
     "isomorphic-fetch": "^3.0.0",
@@ -51,7 +51,7 @@
     "react": "^18.3.1",
     "react-dom": "^18.2.0",
     "react-hot-toast": "^2.4.1",
-    "react-hotkeys-hook": "^4.5.1",
+    "react-hotkeys-hook": "^4.5.0",
     "react-json-view": "^1.21.3",
     "react-modal": "^3.16.1",
     "react-modal-promise": "^1.0.2",
@@ -64,7 +64,7 @@
     "vscode-languageserver-protocol": "^3.17.5",
     "vscode-uri": "^3.0.8",
     "web-vitals": "^3.5.2",
-    "xstate": "^5.17.4"
+    "xstate": "^4.38.2"
   },
   "scripts": {
     "start": "vite",
@@ -88,7 +88,7 @@
     "build:wasm": "yarn wasm-prep && cd src/wasm-lib && wasm-pack build --release --target web --out-dir pkg && cargo test -p kcl-lib export_bindings && cd ../.. && yarn isomorphic-copy-wasm && yarn fmt",
     "remove-importmeta": "sed -i 's/import.meta.url/window.location.origin/g' \"./src/wasm-lib/pkg/wasm_lib.js\"; sed -i '' 's/import.meta.url/window.location.origin/g' \"./src/wasm-lib/pkg/wasm_lib.js\" || echo \"sed for both mac and linux\"",
     "wasm-prep": "rimraf src/wasm-lib/pkg && mkdirp src/wasm-lib/pkg && rimraf src/wasm-lib/kcl/bindings",
-    "lint": "eslint --fix src e2e packages/codemirror-lsp-client",
+    "lint": "eslint --fix src e2e",
     "bump-jsons": "echo \"$(jq --arg v \"$VERSION\" '.version=$v' package.json --indent 2)\" > package.json",
     "postinstall": "yarn xstate:typegen && ./node_modules/.bin/electron-rebuild",
     "xstate:typegen": "yarn xstate typegen \"src/**/*.ts?(x)\"",
@@ -137,6 +137,7 @@
     "@iarna/toml": "^2.2.5",
     "@lezer/generator": "^1.7.1",
     "@playwright/test": "^1.46.1",
+    "@tauri-apps/cli": "^2.0.0-rc.9",
     "@testing-library/jest-dom": "^5.14.1",
     "@testing-library/react": "^15.0.2",
     "@types/d3-force": "^3.0.10",
@@ -168,7 +169,7 @@
     "eslint": "^8.0.1",
     "eslint-config-react-app": "^7.0.1",
     "eslint-plugin-css-modules": "^2.12.0",
-    "eslint-plugin-import": "^2.30.0",
+    "eslint-plugin-import": "^2.25.0",
     "eslint-plugin-suggest-no-throw": "^1.0.0",
     "happy-dom": "^14.3.10",
     "http-server": "^14.1.1",

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

@@ -72,7 +72,6 @@ export class LanguageServerClient {
   async initialize() {
     // Start the client in the background.
     this.client.setNotifyFn(this.processNotifications.bind(this))
-    // eslint-disable-next-line @typescript-eslint/no-floating-promises
     this.client.start()
 
     this.ready = true
@@ -196,9 +195,6 @@ export class LanguageServerClient {
   }
 
   private processNotifications(notification: LSP.NotificationMessage) {
-    for (const plugin of this.plugins) {
-      // eslint-disable-next-line @typescript-eslint/no-floating-promises
-      plugin.processNotification(notification)
-    }
+    for (const plugin of this.plugins) plugin.processNotification(notification)
   }
 }

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

@@ -12,7 +12,6 @@ export default function lspFormatExt(
       run: (view: EditorView) => {
         let value = view.plugin(plugin)
         if (!value) return false
-        // eslint-disable-next-line @typescript-eslint/no-floating-promises
         value.requestFormatting()
         return true
       },

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

@@ -117,7 +117,6 @@ export class LanguageServerPlugin implements PluginValue {
 
     this.processLspNotification = options.processLspNotification
 
-    // eslint-disable-next-line @typescript-eslint/no-floating-promises
     this.initialize({
       documentText: this.getDocText(),
     })
@@ -150,7 +149,6 @@ export class LanguageServerPlugin implements PluginValue {
   }
 
   async initialize({ documentText }: { documentText: string }) {
-    // eslint-disable-next-line @typescript-eslint/no-misused-promises
     if (this.client.initializePromise) {
       await this.client.initializePromise
     }
@@ -164,9 +162,7 @@ export class LanguageServerPlugin implements PluginValue {
       },
     })
 
-    // eslint-disable-next-line @typescript-eslint/no-floating-promises
     this.requestSemanticTokens()
-    // eslint-disable-next-line @typescript-eslint/no-floating-promises
     this.updateFoldingRanges()
   }
 
@@ -229,9 +225,7 @@ export class LanguageServerPlugin implements PluginValue {
         contentChanges: [{ text: this.view.state.doc.toString() }],
       })
 
-      // eslint-disable-next-line @typescript-eslint/no-floating-promises
       this.requestSemanticTokens()
-      // eslint-disable-next-line @typescript-eslint/no-floating-promises
       this.updateFoldingRanges()
     } catch (e) {
       console.error(e)
@@ -532,9 +526,7 @@ export class LanguageServerPlugin implements PluginValue {
   processDiagnostics(params: PublishDiagnosticsParams) {
     if (params.uri !== this.getDocUri()) return
 
-    // Commented to avoid the lint.  See TODO below.
-    // const diagnostics =
-    params.diagnostics
+    const diagnostics = params.diagnostics
       .map(({ range, message, severity }) => ({
         from: posToOffset(this.view.state.doc, range.start)!,
         to: posToOffset(this.view.state.doc, range.end)!,

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 { reportRejection } from 'lib/trap'
 
 export function App() {
   const { project, file } = useLoaderData() as IndexLoaderData
@@ -81,7 +80,7 @@ export function App() {
   useEngineConnectionSubscriptions()
 
   const debounceSocketSend = throttle<EngineCommand>((message) => {
-    engineCommandManager.sendSceneCommand(message).catch(reportRejection)
+    engineCommandManager.sendSceneCommand(message)
   }, 1000 / 15)
   const handleMouseMove: MouseEventHandler<HTMLDivElement> = (e) => {
     if (state.matches('Sketch')) {
@@ -96,7 +95,7 @@ export function App() {
     })
 
     const newCmdId = uuidv4()
-    if (state.matches({ idle: 'showPlanes' })) return
+    if (state.matches('idle.showPlanes')) return
     if (context.store?.buttonDownInStream !== undefined) return
     debounceSocketSend({
       type: 'modeling_cmd_req',
@@ -123,11 +122,11 @@ export function App() {
         // Override the electron window draggable region behavior as well
         // when the button is down in the stream
         style={
-          isDesktop() && context.store?.buttonDownInStream
-            ? ({
-                '-webkit-app-region': 'no-drag',
-              } as React.CSSProperties)
-            : {}
+          {
+            '-webkit-app-region': context.store?.buttonDownInStream
+              ? 'no-drag'
+              : '',
+          } as React.CSSProperties
         }
         project={{ project, file }}
         enableMenu={true}

src/Router.tsx

@@ -41,7 +41,6 @@ import toast from 'react-hot-toast'
 import { coreDump } from 'lang/wasm'
 import { useMemo } from 'react'
 import { AppStateProvider } from 'AppState'
-import { reportRejection } from 'lib/trap'
 
 const createRouter = isDesktop() ? createHashRouter : createBrowserRouter
 
@@ -70,6 +69,19 @@ const router = createRouter([
         path: PATHS.INDEX,
         loader: async () => {
           const onDesktop = isDesktop()
+          if (onDesktop) {
+            const projectStartupFile =
+              await window.electron.loadProjectAtStartup()
+            if (projectStartupFile !== null) {
+              // Redirect to the file if we have a file path.
+              if (projectStartupFile.length > 0) {
+                return redirect(
+                  PATHS.FILE + '/' + encodeURIComponent(projectStartupFile)
+                )
+              }
+            }
+          }
+
           return onDesktop
             ? redirect(PATHS.HOME)
             : redirect(PATHS.FILE + '/%2F' + BROWSER_PROJECT_NAME)
@@ -174,23 +186,21 @@ function CoreDump() {
     []
   )
   useHotkeyWrapper(['mod + shift + .'], () => {
-    toast
-      .promise(
-        coreDump(coreDumpManager, true),
-        {
-          loading: 'Starting core dump...',
-          success: 'Core dump completed successfully',
-          error: 'Error while exporting core dump',
+    toast.promise(
+      coreDump(coreDumpManager, true),
+      {
+        loading: 'Starting core dump...',
+        success: 'Core dump completed successfully',
+        error: 'Error while exporting core dump',
+      },
+      {
+        success: {
+          // Note: this extended duration is especially important for Playwright e2e testing
+          // default duration is 2000 - https://react-hot-toast.com/docs/toast#default-durations
+          duration: 6000,
         },
-        {
-          success: {
-            // Note: this extended duration is especially important for Playwright e2e testing
-            // default duration is 2000 - https://react-hot-toast.com/docs/toast#default-durations
-            duration: 6000,
-          },
-        }
-      )
-      .catch(reportRejection)
+      }
+    )
   })
   return null
 }

src/Toolbar.tsx

@@ -20,8 +20,6 @@ import {
   ToolbarItemResolved,
   ToolbarModeName,
 } from 'lib/toolbar'
-import { isDesktop } from 'lib/isDesktop'
-import { openExternalBrowserIfDesktop } from 'lib/openWindow'
 
 export function Toolbar({
   className = '',
@@ -70,12 +68,12 @@ export function Toolbar({
    */
   const configCallbackProps: ToolbarItemCallbackProps = useMemo(
     () => ({
-      modelingState: state,
+      modelingStateMatches: state.matches,
       modelingSend: send,
       commandBarSend,
       sketchPathId,
     }),
-    [state, send, commandBarSend, sketchPathId]
+    [state.matches, send, commandBarSend, sketchPathId]
   )
 
   /**
@@ -290,11 +288,6 @@ const ToolbarItemTooltip = memo(function ToolbarItemContents({
   return (
     <Tooltip
       inert={false}
-      wrapperStyle={
-        isDesktop()
-          ? ({ '-webkit-app-region': 'no-drag' } as React.CSSProperties)
-          : {}
-      }
       position="bottom"
       wrapperClassName="!p-4 !pointer-events-auto"
       contentClassName="!text-left text-wrap !text-xs !p-0 !pb-2 flex gap-2 !max-w-none !w-72 flex-col items-stretch"
@@ -344,7 +337,6 @@ const ToolbarItemTooltip = memo(function ToolbarItemContents({
               <li key={link.label} className="contents">
                 <a
                   href={link.url}
-                  onClick={openExternalBrowserIfDesktop(link.url)}
                   target="_blank"
                   rel="noreferrer"
                   className="flex items-center rounded-sm p-1 no-underline text-inherit hover:bg-primary/10 hover:text-primary dark:hover:bg-chalkboard-70 dark:hover:text-inherit"

src/clientSideScene/CameraControls.ts

@@ -22,19 +22,18 @@ import {
   UnreliableSubscription,
 } from 'lang/std/engineConnection'
 import { EngineCommand } from 'lang/std/artifactGraph'
-import { toSync, uuidv4 } from 'lib/utils'
+import { uuidv4 } from 'lib/utils'
 import { deg2Rad } from 'lib/utils2d'
 import { isReducedMotion, roundOff, throttle } from 'lib/utils'
 import * as TWEEN from '@tweenjs/tween.js'
 import { isQuaternionVertical } from './helpers'
-import { reportRejection } from 'lib/trap'
 
 const ORTHOGRAPHIC_CAMERA_SIZE = 20
 const FRAMES_TO_ANIMATE_IN = 30
 
 const tempQuaternion = new Quaternion() // just used for maths
 
-export type CameraInteractionType = 'pan' | 'rotate' | 'zoom'
+type interactionType = 'pan' | 'rotate' | 'zoom'
 
 interface ThreeCamValues {
   position: Vector3
@@ -101,7 +100,6 @@ export class CameraControls {
       camProps.type === 'perspective' &&
       this.camera instanceof OrthographicCamera
     ) {
-      // eslint-disable-next-line @typescript-eslint/no-floating-promises
       this.usePerspectiveCamera()
     } else if (
       camProps.type === 'orthographic' &&
@@ -129,7 +127,6 @@ export class CameraControls {
   }
 
   throttledEngCmd = throttle((cmd: EngineCommand) => {
-    // eslint-disable-next-line @typescript-eslint/no-floating-promises
     this.engineCommandManager.sendSceneCommand(cmd)
   }, 1000 / 30)
 
@@ -142,7 +139,6 @@ export class CameraControls {
         ...convertThreeCamValuesToEngineCam(threeValues),
       },
     }
-    // eslint-disable-next-line @typescript-eslint/no-floating-promises
     this.engineCommandManager.sendSceneCommand(cmd)
   }, 1000 / 15)
 
@@ -155,7 +151,6 @@ export class CameraControls {
       this.lastPerspectiveCmd &&
       Date.now() - this.lastPerspectiveCmdTime >= lastCmdDelay
     ) {
-      // eslint-disable-next-line @typescript-eslint/no-floating-promises
       this.engineCommandManager.sendSceneCommand(this.lastPerspectiveCmd, true)
       this.lastPerspectiveCmdTime = Date.now()
     }
@@ -223,7 +218,6 @@ export class CameraControls {
         this.useOrthographicCamera()
       }
       if (this.camera instanceof OrthographicCamera && !camSettings.ortho) {
-        // eslint-disable-next-line @typescript-eslint/no-floating-promises
         this.usePerspectiveCamera()
       }
       if (this.camera instanceof PerspectiveCamera && camSettings.fov_y) {
@@ -255,7 +249,6 @@ export class CameraControls {
     const doZoom = () => {
       if (this.zoomDataFromLastFrame !== undefined) {
         this.handleStart()
-        // eslint-disable-next-line @typescript-eslint/no-floating-promises
         this.engineCommandManager.sendSceneCommand({
           type: 'modeling_cmd_req',
           cmd: {
@@ -273,7 +266,6 @@ export class CameraControls {
 
     const doMove = () => {
       if (this.moveDataFromLastFrame !== undefined) {
-        // eslint-disable-next-line @typescript-eslint/no-floating-promises
         this.engineCommandManager.sendSceneCommand({
           type: 'modeling_cmd_req',
           cmd: {
@@ -467,7 +459,6 @@ export class CameraControls {
 
     this.camera.quaternion.set(qx, qy, qz, qw)
     this.camera.updateProjectionMatrix()
-    // eslint-disable-next-line @typescript-eslint/no-floating-promises
     this.engineCommandManager.sendSceneCommand({
       type: 'modeling_cmd_req',
       cmd_id: uuidv4(),
@@ -550,7 +541,7 @@ export class CameraControls {
     const oldFov = this.camera.fov
 
     const viewHeightFactor = (fov: number) => {
-      /*       *
+      /*       * 
               /|
              / |
             /  |
@@ -938,7 +929,6 @@ export class CameraControls {
       }
 
       if (isReducedMotion()) {
-        // eslint-disable-next-line @typescript-eslint/no-floating-promises
         onComplete()
         return
       }
@@ -947,7 +937,7 @@ export class CameraControls {
         .to({ t: tweenEnd }, duration)
         .easing(TWEEN.Easing.Quadratic.InOut)
         .onUpdate(({ t }) => cameraAtTime(t))
-        .onComplete(toSync(onComplete, reportRejection))
+        .onComplete(onComplete)
         .start()
     })
   }
@@ -972,7 +962,6 @@ export class CameraControls {
             // Decrease the FOV
             currentFov = Math.max(currentFov - fovAnimationStep, targetFov)
             this.camera.updateProjectionMatrix()
-            // eslint-disable-next-line @typescript-eslint/no-floating-promises
             this.dollyZoom(currentFov)
             requestAnimationFrame(animateFovChange) // Continue the animation
           } else if (frameWaitOnFinish > 0) {
@@ -1002,7 +991,6 @@ export class CameraControls {
       this.lastPerspectiveFov = 4
       let currentFov = 4
       const initialCameraUp = this.camera.up.clone()
-      // eslint-disable-next-line @typescript-eslint/no-floating-promises
       this.usePerspectiveCamera()
       const tempVec = new Vector3()
 
@@ -1011,7 +999,6 @@ export class CameraControls {
           this.lastPerspectiveFov + (targetFov - this.lastPerspectiveFov) * t
         const currentUp = tempVec.lerpVectors(initialCameraUp, targetCamUp, t)
         this.camera.up.copy(currentUp)
-        // eslint-disable-next-line @typescript-eslint/no-floating-promises
         this.dollyZoom(currentFov)
       }
 
@@ -1040,7 +1027,6 @@ export class CameraControls {
     this.lastPerspectiveFov = 4
     let currentFov = 4
     const initialCameraUp = this.camera.up.clone()
-    // eslint-disable-next-line @typescript-eslint/no-floating-promises
     this.usePerspectiveCamera()
     const tempVec = new Vector3()
 
@@ -1189,7 +1175,7 @@ function convertThreeCamValuesToEngineCam({
   const lookAt = buildLookAt(64 / zoom, target, position)
   return {
     center: new Vector3(lookAt.center.x, lookAt.center.y, lookAt.center.z),
-    up: new Vector3(upVector.x, upVector.y, upVector.z),
+    up: new Vector3(0, 0, 1),
     vantage: new Vector3(lookAt.eye.x, lookAt.eye.y, lookAt.eye.z),
   }
 }
@@ -1219,8 +1205,8 @@ function _getInteractionType(
   enablePan: boolean,
   enableRotate: boolean,
   enableZoom: boolean
-): CameraInteractionType | 'none' {
-  let state: CameraInteractionType | 'none' = 'none'
+): interactionType | 'none' {
+  let state: interactionType | 'none' = 'none'
   if (enablePan && interactionGuards.pan.callback(event)) return 'pan'
   if (enableRotate && interactionGuards.rotate.callback(event)) return 'rotate'
   if (enableZoom && interactionGuards.zoom.dragCallback(event)) return 'zoom'

src/clientSideScene/ClientSideSceneComp.tsx

@@ -5,7 +5,7 @@ import { cameraMouseDragGuards } from 'lib/cameraControls'
 import { useSettingsAuthContext } from 'hooks/useSettingsAuthContext'
 import { ARROWHEAD, DEBUG_SHOW_BOTH_SCENES } from './sceneInfra'
 import { ReactCameraProperties } from './CameraControls'
-import { throttle, toSync } from 'lib/utils'
+import { throttle } from 'lib/utils'
 import {
   sceneInfra,
   kclManager,
@@ -44,7 +44,7 @@ import {
   removeSingleConstraintInfo,
 } from 'lang/modifyAst'
 import { ActionButton } from 'components/ActionButton'
-import { err, reportRejection, trap } from 'lib/trap'
+import { err, trap } from 'lib/trap'
 
 function useShouldHideScene(): { hideClient: boolean; hideServer: boolean } {
   const [isCamMoving, setIsCamMoving] = useState(false)
@@ -124,9 +124,9 @@ export const ClientSideScene = ({
     } else if (context.mouseState.type === 'isDragging') {
       cursor = 'grabbing'
     } else if (
-      state.matches({ Sketch: 'Line tool' }) ||
-      state.matches({ Sketch: 'Tangential arc to' }) ||
-      state.matches({ Sketch: 'Rectangle tool' })
+      state.matches('Sketch.Line tool') ||
+      state.matches('Sketch.Tangential arc to') ||
+      state.matches('Sketch.Rectangle tool')
     ) {
       cursor = 'crosshair'
     } else {
@@ -214,9 +214,9 @@ const Overlay = ({
     overlay.visible &&
     typeof context?.segmentHoverMap?.[pathToNodeString] === 'number' &&
     !(
-      state.matches({ Sketch: 'Line tool' }) ||
-      state.matches({ Sketch: 'Tangential arc to' }) ||
-      state.matches({ Sketch: 'Rectangle tool' })
+      state.matches('Sketch.Line tool') ||
+      state.matches('Sketch.Tangential arc to') ||
+      state.matches('Sketch.Rectangle tool')
     )
 
   return (
@@ -582,7 +582,7 @@ const ConstraintSymbol = ({
         }}
         // disabled={isConstrained || !convertToVarEnabled}
         // disabled={implicitDesc} TODO why does this change styles that are hard to override?
-        onClick={toSync(async () => {
+        onClick={async () => {
           if (!isConstrained) {
             send({
               type: 'Convert to variable',
@@ -616,14 +616,13 @@ const ConstraintSymbol = ({
               )
               if (!transform) return
               const { modifiedAst } = transform
-              // eslint-disable-next-line @typescript-eslint/no-floating-promises
               kclManager.updateAst(modifiedAst, true)
             } catch (e) {
               console.log('error', e)
             }
             toast.success('Constraint removed')
           }
-        }, reportRejection)}
+        }}
       >
         <CustomIcon name={name} />
       </button>
@@ -689,7 +688,7 @@ const ConstraintSymbol = ({
 
 const throttled = throttle((a: ReactCameraProperties) => {
   if (a.type === 'perspective' && a.fov) {
-    sceneInfra.camControls.dollyZoom(a.fov).catch(reportRejection)
+    sceneInfra.camControls.dollyZoom(a.fov)
   }
 }, 1000 / 15)
 
@@ -719,7 +718,6 @@ export const CamDebugSettings = () => {
           if (camSettings.type === 'perspective') {
             sceneInfra.camControls.useOrthographicCamera()
           } else {
-            // eslint-disable-next-line @typescript-eslint/no-floating-promises
             sceneInfra.camControls.usePerspectiveCamera(true)
           }
         }}
@@ -727,7 +725,7 @@ export const CamDebugSettings = () => {
       <div>
         <button
           onClick={() => {
-            sceneInfra.camControls.resetCameraPosition().catch(reportRejection)
+            sceneInfra.camControls.resetCameraPosition()
           }}
         >
           Reset Camera Position

src/clientSideScene/sceneEntities.ts

@@ -28,6 +28,7 @@ import {
   OnMouseEnterLeaveArgs,
   RAYCASTABLE_PLANE,
   SEGMENT_LENGTH_LABEL,
+  SEGMENT_LENGTH_LABEL_OFFSET_PX,
   SEGMENT_LENGTH_LABEL_TEXT,
   SKETCH_GROUP_SEGMENTS,
   SKETCH_LAYER,
@@ -101,8 +102,8 @@ import {
   getRectangleCallExpressions,
   updateRectangleSketch,
 } from 'lib/rectangleTool'
-import { getThemeColorForThreeJs, Themes } from 'lib/theme'
-import { err, reportRejection, trap } from 'lib/trap'
+import { getThemeColorForThreeJs } from 'lib/theme'
+import { err, trap } from 'lib/trap'
 import { CSS2DObject } from 'three/examples/jsm/renderers/CSS2DRenderer'
 import { Point3d } from 'wasm-lib/kcl/bindings/Point3d'
 
@@ -323,7 +324,6 @@ export class SceneEntities {
       )
     }
     sceneInfra.setCallbacks({
-      // eslint-disable-next-line @typescript-eslint/no-misused-promises
       onClick: async (args) => {
         if (!args) return
         if (args.mouseEvent.which !== 1) return
@@ -634,7 +634,6 @@ export class SceneEntities {
         draftExpressionsIndices,
       })
     sceneInfra.setCallbacks({
-      // eslint-disable-next-line @typescript-eslint/no-misused-promises
       onClick: async (args) => {
         if (!args) return
         if (args.mouseEvent.which !== 1) return
@@ -702,7 +701,7 @@ export class SceneEntities {
         if (profileStart) {
           sceneInfra.modelingSend({ type: 'CancelSketch' })
         } else {
-          await this.setUpDraftSegment(
+          this.setUpDraftSegment(
             sketchPathToNode,
             forward,
             up,
@@ -772,7 +771,6 @@ export class SceneEntities {
     })
 
     sceneInfra.setCallbacks({
-      // eslint-disable-next-line @typescript-eslint/no-misused-promises
       onMove: async (args) => {
         // Update the width and height of the draft rectangle
         const pathToNodeTwo = structuredClone(sketchPathToNode)
@@ -820,7 +818,6 @@ export class SceneEntities {
           this.updateSegment(seg, index, 0, _ast, orthoFactor, sketchGroup)
         )
       },
-      // eslint-disable-next-line @typescript-eslint/no-misused-promises
       onClick: async (args) => {
         // Commit the rectangle to the full AST/code and return to sketch.idle
         const cornerPoint = args.intersectionPoint?.twoD
@@ -895,11 +892,9 @@ export class SceneEntities {
   }) => {
     let addingNewSegmentStatus: 'nothing' | 'pending' | 'added' = 'nothing'
     sceneInfra.setCallbacks({
-      // eslint-disable-next-line @typescript-eslint/no-misused-promises
       onDragEnd: async () => {
         if (addingNewSegmentStatus !== 'nothing') {
           await this.tearDownSketch({ removeAxis: false })
-          // eslint-disable-next-line @typescript-eslint/no-floating-promises
           this.setupSketch({
             sketchPathToNode: pathToNode,
             maybeModdedAst: kclManager.ast,
@@ -916,7 +911,6 @@ export class SceneEntities {
           })
         }
       },
-      // eslint-disable-next-line @typescript-eslint/no-misused-promises
       onDrag: async ({
         selected,
         intersectionPoint,
@@ -964,7 +958,6 @@ export class SceneEntities {
 
             await kclManager.executeAstMock(mod.modifiedAst)
             await this.tearDownSketch({ removeAxis: false })
-            // eslint-disable-next-line @typescript-eslint/no-floating-promises
             this.setupSketch({
               sketchPathToNode: pathToNode,
               maybeModdedAst: kclManager.ast,
@@ -1168,7 +1161,7 @@ export class SceneEntities {
         )
       )
       sceneInfra.overlayCallbacks(callBacks)
-    })().catch(reportRejection)
+    })()
   }
 
   /**
@@ -1421,14 +1414,20 @@ export class SceneEntities {
       ) as CSS2DObject
       const labelWrapperElem = labelWrapper.element as HTMLDivElement
       const label = labelWrapperElem.children[0] as HTMLParagraphElement
-      label.innerText = `${roundOff(length)}`
+      label.innerText = `${roundOff(length)}${sceneInfra._baseUnit}`
       label.classList.add(SEGMENT_LENGTH_LABEL_TEXT)
-      const slope = (to[1] - from[1]) / (to[0] - from[0])
-      let slopeAngle = ((Math.atan(slope) * 180) / Math.PI) * -1
-      label.style.setProperty('--degree', `${slopeAngle}deg`)
-      label.style.setProperty('--x', `0px`)
-      label.style.setProperty('--y', `0px`)
-      labelWrapper.position.set((from[0] + to[0]) / 2, (from[1] + to[1]) / 2, 0)
+      const offsetFromMidpoint = new Vector2(to[0] - from[0], to[1] - from[1])
+        .normalize()
+        .rotateAround(new Vector2(0, 0), Math.PI / 2)
+        .multiplyScalar(SEGMENT_LENGTH_LABEL_OFFSET_PX * scale)
+      label.style.setProperty('--x', `${offsetFromMidpoint.x}px`)
+      label.style.setProperty('--y', `${offsetFromMidpoint.y}px`)
+      labelWrapper.position.set(
+        (from[0] + to[0]) / 2 + offsetFromMidpoint.x,
+        (from[1] + to[1]) / 2 + offsetFromMidpoint.y,
+        0
+      )
+
       labelGroup.visible = isHandlesVisible
     }
 
@@ -1466,25 +1465,6 @@ export class SceneEntities {
         to,
       })
   }
-  /**
-   * Update the base color of each of the THREEjs meshes
-   * that represent each of the sketch segments, to get the
-   * latest value from `sceneInfra._theme`
-   */
-  updateSegmentBaseColor(newColor: Themes.Light | Themes.Dark) {
-    const newColorThreeJs = getThemeColorForThreeJs(newColor)
-    Object.values(this.activeSegments).forEach((group) => {
-      group.userData.baseColor = newColorThreeJs
-      group.traverse((child) => {
-        if (
-          child instanceof Mesh &&
-          child.material instanceof MeshBasicMaterial
-        ) {
-          child.material.color.set(newColorThreeJs)
-        }
-      })
-    })
-  }
   removeSketchGrid() {
     if (this.axisGroup) this.scene.remove(this.axisGroup)
   }

src/components/AppHeader.module.css

@@ -6,9 +6,6 @@
   grid-template-columns: 1fr auto 1fr;
   user-select: none;
   -webkit-user-select: none;
-}
-
-.header.desktopApp {
   /* Make the header act as a handle to drag the electron app window,
    * per the electron docs: https://www.electronjs.org/docs/latest/tutorial/window-customization#set-custom-draggable-region
    * all interactive elements opt-out of this behavior by default in src/index.css

src/components/AppHeader.tsx

@@ -6,7 +6,6 @@ import { useSettingsAuthContext } from 'hooks/useSettingsAuthContext'
 import styles from './AppHeader.module.css'
 import { RefreshButton } from 'components/RefreshButton'
 import { CommandBarOpenButton } from './CommandBarOpenButton'
-import { isDesktop } from 'lib/isDesktop'
 
 interface AppHeaderProps extends React.PropsWithChildren {
   showToolbar?: boolean
@@ -33,9 +32,7 @@ export const AppHeader = ({
       className={
         'w-full grid ' +
         styles.header +
-        ` ${
-          isDesktop() ? styles.desktopApp + ' ' : ''
-        }overlaid-panes sticky top-0 z-20 px-2 items-start ` +
+        ' overlaid-panes sticky top-0 z-20 px-2 items-start ' +
         className
       }
       style={style}

src/components/AvailableVarsHelpers.tsx

@@ -151,7 +151,6 @@ export function useCalc({
         })
         if (trap(error)) return
       }
-      // eslint-disable-next-line @typescript-eslint/no-floating-promises
       executeAst({
         ast,
         engineCommandManager,

src/components/CamToggle.tsx

@@ -2,7 +2,6 @@ import { useState, useEffect } from 'react'
 import { EngineCommandManagerEvents } from 'lang/std/engineConnection'
 import { engineCommandManager, sceneInfra } from 'lib/singletons'
 import { throttle, isReducedMotion } from 'lib/utils'
-import { reportRejection } from 'lib/trap'
 
 const updateDollyZoom = throttle(
   (newFov: number) => sceneInfra.camControls.dollyZoom(newFov),
@@ -17,8 +16,8 @@ export const CamToggle = () => {
   useEffect(() => {
     engineCommandManager.addEventListener(
       EngineCommandManagerEvents.SceneReady,
-      () => {
-        sceneInfra.camControls.dollyZoom(fov).catch(reportRejection)
+      async () => {
+        sceneInfra.camControls.dollyZoom(fov)
       }
     )
   }, [])
@@ -27,11 +26,11 @@ export const CamToggle = () => {
     if (isPerspective) {
       isReducedMotion()
         ? sceneInfra.camControls.useOrthographicCamera()
-        : sceneInfra.camControls.animateToOrthographic().catch(reportRejection)
+        : sceneInfra.camControls.animateToOrthographic()
     } else {
       isReducedMotion()
-        ? sceneInfra.camControls.usePerspectiveCamera().catch(reportRejection)
-        : sceneInfra.camControls.animateToPerspective().catch(reportRejection)
+        ? sceneInfra.camControls.usePerspectiveCamera()
+        : sceneInfra.camControls.animateToPerspective()
     }
     setIsPerspective(!isPerspective)
   }

src/components/CommandBar/CommandArgOptionInput.tsx

@@ -71,17 +71,6 @@ function CommandArgOptionInput({
     inputRef.current?.focus()
     inputRef.current?.select()
   }, [inputRef])
-  useEffect(() => {
-    // work around to make sure the user doesn't have to press the down arrow key to focus the first option
-    // instead this makes it move from the first hit
-    const downArrowEvent = new KeyboardEvent('keydown', {
-      key: 'ArrowDown',
-      keyCode: 40,
-      which: 40,
-      bubbles: true,
-    })
-    inputRef?.current?.dispatchEvent(downArrowEvent)
-  }, [])
 
   // Filter the options based on the query,
   // resetting the query when the options change

src/components/CommandBar/CommandBarProvider.tsx

@@ -1,43 +1,53 @@
-import { createActorContext } from '@xstate/react'
+import { useMachine } from '@xstate/react'
 import { editorManager } from 'lib/singletons'
 import { commandBarMachine } from 'machines/commandBarMachine'
-import { useEffect } from 'react'
+import { createContext, useEffect } from 'react'
+import { EventFrom, StateFrom } from 'xstate'
 
-export const CommandsContext = createActorContext(
-  commandBarMachine.provide({
-    guards: {
-      'Command has no arguments': ({ context }) => {
-        return (
-          !context.selectedCommand?.args ||
-          Object.keys(context.selectedCommand?.args).length === 0
-        )
-      },
-      'All arguments are skippable': ({ context }) => {
-        return Object.values(context.selectedCommand!.args!).every(
-          (argConfig) => argConfig.skip
-        )
-      },
-    },
-  })
-)
+type CommandsContextType = {
+  commandBarState: StateFrom<typeof commandBarMachine>
+  commandBarSend: (event: EventFrom<typeof commandBarMachine>) => void
+}
+
+export const CommandsContext = createContext<CommandsContextType>({
+  commandBarState: commandBarMachine.initialState,
+  commandBarSend: () => {},
+})
 
 export const CommandBarProvider = ({
   children,
 }: {
   children: React.ReactNode
 }) => {
+  const [commandBarState, commandBarSend] = useMachine(commandBarMachine, {
+    devTools: true,
+    guards: {
+      'Command has no arguments': (context, _event) => {
+        return (
+          !context.selectedCommand?.args ||
+          Object.keys(context.selectedCommand?.args).length === 0
+        )
+      },
+      'All arguments are skippable': (context, _event) => {
+        return Object.values(context.selectedCommand!.args!).every(
+          (argConfig) => argConfig.skip
+        )
+      },
+    },
+  })
+
+  useEffect(() => {
+    editorManager.setCommandBarSend(commandBarSend)
+  })
+
   return (
-    <CommandsContext.Provider>
-      <CommandBarProviderInner>{children}</CommandBarProviderInner>
+    <CommandsContext.Provider
+      value={{
+        commandBarState,
+        commandBarSend,
+      }}
+    >
+      {children}
     </CommandsContext.Provider>
   )
 }
-function CommandBarProviderInner({ children }: { children: React.ReactNode }) {
-  const commandBarActor = CommandsContext.useActorRef()
-
-  useEffect(() => {
-    editorManager.setCommandBarSend(commandBarActor.send)
-  })
-
-  return children
-}

src/components/CommandBar/CommandBarReview.tsx

@@ -52,7 +52,7 @@ function CommandBarReview({ stepBack }: { stepBack: () => void }) {
     e.preventDefault()
     commandBarSend({
       type: 'Submit command',
-      output: argumentsToSubmit,
+      data: argumentsToSubmit,
     })
   }
 

src/components/CommandBar/CommandBarSelectionInput.tsx

@@ -9,7 +9,7 @@ import {
   getSelectionTypeDisplayText,
 } from 'lib/selections'
 import { modelingMachine } from 'machines/modelingMachine'
-import { useEffect, useMemo, useRef, useState } from 'react'
+import { useCallback, useEffect, useRef, useState } from 'react'
 import { StateFrom } from 'xstate'
 
 const semanticEntityNames: { [key: string]: Array<Selection['type']> } = {
@@ -48,15 +48,15 @@ function CommandBarSelectionInput({
   const { commandBarState, commandBarSend } = useCommandsContext()
   const [hasSubmitted, setHasSubmitted] = useState(false)
   const selection = useSelector(arg.machineActor, selectionSelector)
-  const selectionsByType = useMemo(() => {
+  const initSelectionsByType = useCallback(() => {
     const selectionRangeEnd = selection.codeBasedSelections[0]?.range[1]
     return !selectionRangeEnd || selectionRangeEnd === code.length
       ? 'none'
       : getSelectionType(selection)
   }, [selection, code])
-  const canSubmitSelection = useMemo<boolean>(
-    () => canSubmitSelectionArg(selectionsByType, arg),
-    [selectionsByType]
+  const selectionsByType = initSelectionsByType()
+  const [canSubmitSelection, setCanSubmitSelection] = useState<boolean>(
+    canSubmitSelectionArg(selectionsByType, arg)
   )
 
   useEffect(() => {
@@ -66,18 +66,26 @@ function CommandBarSelectionInput({
   // Fast-forward through this arg if it's marked as skippable
   // and we have a valid selection already
   useEffect(() => {
+    console.log('selection input effect', {
+      selectionsByType,
+      canSubmitSelection,
+      arg,
+    })
+    setCanSubmitSelection(canSubmitSelectionArg(selectionsByType, arg))
     const argValue = commandBarState.context.argumentsToSubmit[arg.name]
     if (canSubmitSelection && arg.skip && argValue === undefined) {
-      handleSubmit()
+      handleSubmit({
+        preventDefault: () => {},
+      } as React.FormEvent<HTMLFormElement>)
     }
-  }, [canSubmitSelection])
+  }, [selectionsByType, arg])
 
   function handleChange() {
     inputRef.current?.focus()
   }
 
-  function handleSubmit(e?: React.FormEvent<HTMLFormElement>) {
-    e?.preventDefault()
+  function handleSubmit(e: React.FormEvent<HTMLFormElement>) {
+    e.preventDefault()
 
     if (!canSubmitSelection) {
       setHasSubmitted(true)

src/components/CommandBarOpenButton.tsx

@@ -11,7 +11,6 @@ export function CommandBarOpenButton() {
     <button
       className="group rounded-full flex items-center justify-center gap-2 px-2 py-1 bg-primary/10 dark:bg-chalkboard-90 dark:backdrop-blur-sm border-primary hover:border-primary dark:border-chalkboard-50 dark:hover:border-inherit text-primary dark:text-inherit"
       onClick={() => commandBarSend({ type: 'Open' })}
-      data-testid="command-bar-open-button"
     >
       <span>Commands</span>
       <kbd className="bg-primary/10 dark:bg-chalkboard-80 dark:group-hover:bg-primary font-mono rounded-sm dark:text-inherit inline-block px-1 border-primary dark:border-chalkboard-90">

src/components/EngineCommands.tsx

@@ -1,9 +1,8 @@
 import { CommandLog } from 'lang/std/engineConnection'
 import { engineCommandManager } from 'lib/singletons'
-import { reportRejection } from 'lib/trap'
 import { useState, useEffect } from 'react'
 
-export function useEngineCommands(): [CommandLog[], () => void] {
+function useEngineCommands(): [CommandLog[], () => void] {
   const [engineCommands, setEngineCommands] = useState<CommandLog[]>(
     engineCommandManager.commandLogs
   )
@@ -78,11 +77,9 @@ export const EngineCommands = () => {
       />
       <button
         data-testid="custom-cmd-send-button"
-        onClick={() => {
-          engineCommandManager
-            .sendSceneCommand(JSON.parse(customCmd))
-            .catch(reportRejection)
-        }}
+        onClick={() =>
+          engineCommandManager.sendSceneCommand(JSON.parse(customCmd))
+        }
       >
         Send custom command
       </button>

src/components/FileMachineProvider.tsx

@@ -5,12 +5,13 @@ import { PATHS } from 'lib/paths'
 import React, { createContext } from 'react'
 import { toast } from 'react-hot-toast'
 import {
-  Actor,
   AnyStateMachine,
   ContextFrom,
+  EventFrom,
+  InterpreterFrom,
   Prop,
   StateFrom,
-  fromPromise,
+  assign,
 } from 'xstate'
 import { useCommandsContext } from 'hooks/useCommandsContext'
 import { fileMachine } from 'machines/fileMachine'
@@ -26,7 +27,7 @@ import { getNextDirName, getNextFileName } from 'lib/desktopFS'
 type MachineContext<T extends AnyStateMachine> = {
   state: StateFrom<T>
   context: ContextFrom<T>
-  send: Prop<Actor<T>, 'send'>
+  send: Prop<InterpreterFrom<T>, 'send'>
 }
 
 export const FileContext = createContext(
@@ -42,234 +43,239 @@ export const FileMachineProvider = ({
   const { commandBarSend } = useCommandsContext()
   const { project, file } = useRouteLoaderData(PATHS.FILE) as IndexLoaderData
 
-  const [state, send] = useMachine(
-    fileMachine.provide({
-      actions: {
-        renameToastSuccess: ({ event }) => {
-          if (event.type !== 'xstate.done.actor.rename-file') return
-          toast.success(event.output.message)
-        },
-        createToastSuccess: ({ event }) => {
-          if (event.type !== 'xstate.done.actor.create-and-open-file') return
-          toast.success(event.output.message)
-        },
-        toastSuccess: ({ event }) => {
-          if (
-            event.type !== 'xstate.done.actor.rename-file' &&
-            event.type !== 'xstate.done.actor.delete-file'
+  const [state, send] = useMachine(fileMachine, {
+    context: {
+      project,
+      selectedDirectory: project,
+    },
+    actions: {
+      navigateToFile: (context, event) => {
+        if (event.data && 'name' in event.data) {
+          commandBarSend({ type: 'Close' })
+          navigate(
+            `..${PATHS.FILE}/${encodeURIComponent(
+              context.selectedDirectory +
+                window.electron.path.sep +
+                event.data.name
+            )}`
           )
-            return
-          toast.success(event.output.message)
-        },
-        toastError: ({ event }) => {
-          if (event.type !== 'xstate.done.actor.rename-file') return
-          toast.error(event.output.message)
-        },
-        navigateToFile: ({ context, event }) => {
-          if (event.type !== 'xstate.done.actor.create-and-open-file') return
-          if (event.output && 'name' in event.output) {
-            commandBarSend({ type: 'Close' })
-            navigate(
-              `..${PATHS.FILE}/${encodeURIComponent(
-                context.selectedDirectory +
-                  window.electron.path.sep +
-                  event.output.name
-              )}`
-            )
-          } else if (
-            event.output &&
-            'path' in event.output &&
-            event.output.path.endsWith(FILE_EXT)
-          ) {
-            // Don't navigate to newly created directories
-            navigate(`..${PATHS.FILE}/${encodeURIComponent(event.output.path)}`)
-          }
-        },
+        } else if (
+          event.data &&
+          'path' in event.data &&
+          event.data.path.endsWith(FILE_EXT)
+        ) {
+          // Don't navigate to newly created directories
+          navigate(`..${PATHS.FILE}/${encodeURIComponent(event.data.path)}`)
+        }
       },
-      actors: {
-        readFiles: fromPromise(async ({ input }) => {
-          const newFiles =
-            (isDesktop() ? (await getProjectInfo(input.path)).children : []) ??
-            []
+      addFileToRenamingQueue: assign({
+        itemsBeingRenamed: (context, event) => [
+          ...context.itemsBeingRenamed,
+          event.data.path,
+        ],
+      }),
+      removeFileFromRenamingQueue: assign({
+        itemsBeingRenamed: (
+          context,
+          event: EventFrom<typeof fileMachine, 'done.invoke.rename-file'>
+        ) =>
+          context.itemsBeingRenamed.filter(
+            (path) => path !== event.data.oldPath
+          ),
+      }),
+      renameToastSuccess: (_, event) => toast.success(event.data.message),
+      createToastSuccess: (_, event) => toast.success(event.data.message),
+      toastSuccess: (_, event) =>
+        event.data && toast.success((event.data || '') + ''),
+      toastError: (_, event) => toast.error((event.data || '') + ''),
+    },
+    services: {
+      readFiles: async (context: ContextFrom<typeof fileMachine>) => {
+        const newFiles = isDesktop()
+          ? (await getProjectInfo(context.project.path)).children
+          : []
+        return {
+          ...context.project,
+          children: newFiles,
+        }
+      },
+      createAndOpenFile: async (context, event) => {
+        let createdName = event.data.name.trim() || DEFAULT_FILE_NAME
+        let createdPath: string
+
+        if (event.data.makeDir) {
+          let { name, path } = getNextDirName({
+            entryName: createdName,
+            baseDir: context.selectedDirectory.path,
+          })
+          createdName = name
+          createdPath = path
+          await window.electron.mkdir(createdPath)
+        } else {
+          const { name, path } = getNextFileName({
+            entryName: createdName,
+            baseDir: context.selectedDirectory.path,
+          })
+          createdName = name
+          createdPath = path
+          await window.electron.writeFile(createdPath, event.data.content ?? '')
+        }
+
+        return {
+          message: `Successfully created "${createdName}"`,
+          path: createdPath,
+        }
+      },
+      createFile: async (context, event) => {
+        let createdName = event.data.name.trim() || DEFAULT_FILE_NAME
+        let createdPath: string
+
+        if (event.data.makeDir) {
+          let { name, path } = getNextDirName({
+            entryName: createdName,
+            baseDir: context.selectedDirectory.path,
+          })
+          createdName = name
+          createdPath = path
+          await window.electron.mkdir(createdPath)
+        } else {
+          const { name, path } = getNextFileName({
+            entryName: createdName,
+            baseDir: context.selectedDirectory.path,
+          })
+          createdName = name
+          createdPath = path
+          await window.electron.writeFile(createdPath, event.data.content ?? '')
+        }
+
+        return {
+          path: createdPath,
+        }
+      },
+      renameFile: async (
+        context: ContextFrom<typeof fileMachine>,
+        event: EventFrom<typeof fileMachine, 'Rename file'>
+      ) => {
+        const { oldName, newName, isDir } = event.data
+        const name = newName
+          ? newName.endsWith(FILE_EXT) || isDir
+            ? newName
+            : newName + FILE_EXT
+          : DEFAULT_FILE_NAME
+        const oldPath = window.electron.path.join(
+          context.selectedDirectory.path,
+          oldName
+        )
+        const newPath = window.electron.path.join(
+          context.selectedDirectory.path,
+          name
+        )
+
+        // no-op
+        if (oldPath === newPath) {
           return {
-            ...input,
-            children: newFiles,
-          }
-        }),
-        createAndOpenFile: fromPromise(async ({ input }) => {
-          let createdName = input.name.trim() || DEFAULT_FILE_NAME
-          let createdPath: string
-
-          if (input.makeDir) {
-            let { name, path } = getNextDirName({
-              entryName: createdName,
-              baseDir: input.selectedDirectory.path,
-            })
-            createdName = name
-            createdPath = path
-            await window.electron.mkdir(createdPath)
-          } else {
-            const { name, path } = getNextFileName({
-              entryName: createdName,
-              baseDir: input.selectedDirectory.path,
-            })
-            createdName = name
-            createdPath = path
-            await window.electron.writeFile(createdPath, input.content ?? '')
-          }
-
-          return {
-            message: `Successfully created "${createdName}"`,
-            path: createdPath,
-          }
-        }),
-        createFile: fromPromise(async ({ input }) => {
-          let createdName = input.name.trim() || DEFAULT_FILE_NAME
-          let createdPath: string
-
-          if (input.makeDir) {
-            let { name, path } = getNextDirName({
-              entryName: createdName,
-              baseDir: input.selectedDirectory.path,
-            })
-            createdName = name
-            createdPath = path
-            await window.electron.mkdir(createdPath)
-          } else {
-            const { name, path } = getNextFileName({
-              entryName: createdName,
-              baseDir: input.selectedDirectory.path,
-            })
-            createdName = name
-            createdPath = path
-            await window.electron.writeFile(createdPath, input.content ?? '')
-          }
-
-          return {
-            path: createdPath,
-          }
-        }),
-        renameFile: fromPromise(async ({ input }) => {
-          const { oldName, newName, isDir } = input
-          const name = newName
-            ? newName.endsWith(FILE_EXT) || isDir
-              ? newName
-              : newName + FILE_EXT
-            : DEFAULT_FILE_NAME
-          const oldPath = window.electron.path.join(
-            input.selectedDirectory.path,
-            oldName
-          )
-          const newPath = window.electron.path.join(
-            input.selectedDirectory.path,
-            name
-          )
-
-          // no-op
-          if (oldPath === newPath) {
-            return {
-              message: `Old is the same as new.`,
-              newPath,
-              oldPath,
-            }
-          }
-
-          // if there are any siblings with the same name, report error.
-          const entries = await window.electron.readdir(
-            window.electron.path.dirname(newPath)
-          )
-          for (let entry of entries) {
-            if (entry === newName) {
-              return Promise.reject(new Error('Filename already exists.'))
-            }
-          }
-
-          window.electron.rename(oldPath, newPath)
-
-          if (!file) {
-            return Promise.reject(new Error('file is not defined'))
-          }
-
-          if (oldPath === file.path && project?.path) {
-            // If we just renamed the current file, navigate to the new path
-            navigate(`..${PATHS.FILE}/${encodeURIComponent(newPath)}`)
-          } else if (file?.path.includes(oldPath)) {
-            // If we just renamed a directory that the current file is in, navigate to the new path
-            navigate(
-              `..${PATHS.FILE}/${encodeURIComponent(
-                file.path.replace(oldPath, newPath)
-              )}`
-            )
-          }
-
-          return {
-            message: `Successfully renamed "${oldName}" to "${name}"`,
+            message: `Old is the same as new.`,
             newPath,
             oldPath,
           }
-        }),
-        deleteFile: fromPromise(async ({ input }) => {
-          const isDir = !!input.children
+        }
 
-          if (isDir) {
-            await window.electron
-              .rm(input.path, {
-                recursive: true,
-              })
-              .catch((e) => console.error('Error deleting directory', e))
-          } else {
-            await window.electron
-              .rm(input.path)
-              .catch((e) => console.error('Error deleting file', e))
+        // if there are any siblings with the same name, report error.
+        const entries = await window.electron.readdir(
+          window.electron.path.dirname(newPath)
+        )
+        for (let entry of entries) {
+          if (entry === newName) {
+            return Promise.reject(new Error('Filename already exists.'))
           }
+        }
 
-          // If there are no more files at all in the project, create a main.kcl
-          // for when we navigate to the root.
-          if (!project?.path) {
-            return Promise.reject(new Error('Project path not set.'))
-          }
+        window.electron.rename(oldPath, newPath)
 
-          const entries = await window.electron.readdir(project.path)
-          const hasKclEntries =
-            entries.filter((e: string) => e.endsWith('.kcl')).length !== 0
-          if (!hasKclEntries) {
-            await window.electron.writeFile(
-              window.electron.path.join(project.path, DEFAULT_PROJECT_KCL_FILE),
-              ''
-            )
-            // Refresh the route selected above because it's possible we're on
-            // the same path on the navigate, which doesn't cause anything to
-            // refresh, leaving a stale execution state.
-            navigate(0)
-            return {
-              message: 'No more files in project, created main.kcl',
-            }
-          }
+        if (!file) {
+          return Promise.reject(new Error('file is not defined'))
+        }
 
-          // If we just deleted the current file or one of its parent directories,
-          // navigate to the project root
-          if (
-            (input.path === file?.path || file?.path.includes(input.path)) &&
-            project?.path
-          ) {
-            navigate(`../${PATHS.FILE}/${encodeURIComponent(project.path)}`)
-          }
+        if (oldPath === file.path && project?.path) {
+          // If we just renamed the current file, navigate to the new path
+          navigate(`..${PATHS.FILE}/${encodeURIComponent(newPath)}`)
+        } else if (file?.path.includes(oldPath)) {
+          // If we just renamed a directory that the current file is in, navigate to the new path
+          navigate(
+            `..${PATHS.FILE}/${encodeURIComponent(
+              file.path.replace(oldPath, newPath)
+            )}`
+          )
+        }
 
-          return {
-            message: `Successfully deleted ${isDir ? 'folder' : 'file'} "${
-              input.name
-            }"`,
-          }
-        }),
+        return {
+          message: `Successfully renamed "${oldName}" to "${name}"`,
+          newPath,
+          oldPath,
+        }
       },
-    }),
-    {
-      input: {
-        project,
-        selectedDirectory: project,
+      deleteFile: async (
+        context: ContextFrom<typeof fileMachine>,
+        event: EventFrom<typeof fileMachine, 'Delete file'>
+      ) => {
+        const isDir = !!event.data.children
+
+        if (isDir) {
+          await window.electron
+            .rm(event.data.path, {
+              recursive: true,
+            })
+            .catch((e) => console.error('Error deleting directory', e))
+        } else {
+          await window.electron
+            .rm(event.data.path)
+            .catch((e) => console.error('Error deleting file', e))
+        }
+
+        // If there are no more files at all in the project, create a main.kcl
+        // for when we navigate to the root.
+        if (!project?.path) {
+          return Promise.reject(new Error('Project path not set.'))
+        }
+
+        const entries = await window.electron.readdir(project.path)
+        const hasKclEntries =
+          entries.filter((e: string) => e.endsWith('.kcl')).length !== 0
+        if (!hasKclEntries) {
+          await window.electron.writeFile(
+            window.electron.path.join(project.path, DEFAULT_PROJECT_KCL_FILE),
+            ''
+          )
+          // Refresh the route selected above because it's possible we're on
+          // the same path on the navigate, which doesn't cause anything to
+          // refresh, leaving a stale execution state.
+          navigate(0)
+          return
+        }
+
+        // If we just deleted the current file or one of its parent directories,
+        // navigate to the project root
+        if (
+          (event.data.path === file?.path ||
+            file?.path.includes(event.data.path)) &&
+          project?.path
+        ) {
+          navigate(`../${PATHS.FILE}/${encodeURIComponent(project.path)}`)
+        }
+
+        return `Successfully deleted ${isDir ? 'folder' : 'file'} "${
+          event.data.name
+        }"`
       },
-    }
-  )
+    },
+    guards: {
+      'Has at least 1 file': (_, event: EventFrom<typeof fileMachine>) => {
+        if (event.type !== 'done.invoke.read-files') return false
+        return !!event?.data?.children && event.data.children.length > 0
+      },
+      'Is not silent': (_, event) => !event.data?.silent,
+    },
+  })
 
   return (
     <FileContext.Provider

src/components/FileTree.tsx

@@ -176,12 +176,13 @@ const FileTreeItem = ({
         `import("${fileOrDir.path.replace(project.path, '.')}")\n` +
           codeManager.code
       )
-      // eslint-disable-next-line @typescript-eslint/no-floating-promises
       codeManager.writeToFile()
 
       // Prevent seeing the model built one piece at a time when changing files
-      // eslint-disable-next-line @typescript-eslint/no-floating-promises
-      kclManager.executeCode(true)
+      kclManager.isFirstRender = true
+      kclManager.executeCode(true).then(() => {
+        kclManager.isFirstRender = false
+      })
     } else {
       // Let the lsp servers know we closed a file.
       onFileClose(currentFile?.path || null, project?.path || null)
@@ -245,13 +246,13 @@ const FileTreeItem = ({
                   onClickCapture={(e) =>
                     fileSend({
                       type: 'Set selected directory',
-                      directory: fileOrDir,
+                      data: fileOrDir,
                     })
                   }
                   onFocusCapture={(e) =>
                     fileSend({
                       type: 'Set selected directory',
-                      directory: fileOrDir,
+                      data: fileOrDir,
                     })
                   }
                   onKeyDown={(e) => e.key === 'Enter' && e.preventDefault()}
@@ -298,13 +299,13 @@ const FileTreeItem = ({
                   onClickCapture={(e) => {
                     fileSend({
                       type: 'Set selected directory',
-                      directory: fileOrDir,
+                      data: fileOrDir,
                     })
                   }}
                   onFocusCapture={(e) =>
                     fileSend({
                       type: 'Set selected directory',
-                      directory: fileOrDir,
+                      data: fileOrDir,
                     })
                   }
                 >
@@ -390,14 +391,14 @@ interface FileTreeProps {
 export const FileTreeMenu = () => {
   const { send } = useFileContext()
 
-  function createFile() {
+  async function createFile() {
     send({
       type: 'Create file',
       data: { name: '', makeDir: false },
     })
   }
 
-  function createFolder() {
+  async function createFolder() {
     send({
       type: 'Create file',
       data: { name: '', makeDir: true },
@@ -484,7 +485,7 @@ export const FileTreeInner = ({
         onClickCapture={(e) => {
           fileSend({
             type: 'Set selected directory',
-            directory: fileContext.project,
+            data: fileContext.project,
           })
         }}
       >

src/components/Gizmo.tsx

@@ -27,7 +27,6 @@ import {
 } from './ContextMenu'
 import { Popover } from '@headlessui/react'
 import { CustomIcon } from './CustomIcon'
-import { reportRejection } from 'lib/trap'
 
 const CANVAS_SIZE = 80
 const FRUSTUM_SIZE = 0.5
@@ -68,9 +67,7 @@ export default function Gizmo() {
         <ContextMenuItem
           key={axisName}
           onClick={() => {
-            sceneInfra.camControls
-              .updateCameraToAxis(axisName as AxisNames)
-              .catch(reportRejection)
+            sceneInfra.camControls.updateCameraToAxis(axisName as AxisNames)
           }}
         >
           {axisSemantic} view
@@ -78,7 +75,7 @@ export default function Gizmo() {
       )),
       <ContextMenuItem
         onClick={() => {
-          sceneInfra.camControls.resetCameraPosition().catch(reportRejection)
+          sceneInfra.camControls.resetCameraPosition()
         }}
       >
         Reset view
@@ -302,7 +299,7 @@ const initializeMouseEvents = (
   const handleClick = () => {
     if (raycasterIntersect.current) {
       const axisName = raycasterIntersect.current.object.name as AxisNames
-      sceneInfra.camControls.updateCameraToAxis(axisName).catch(reportRejection)
+      sceneInfra.camControls.updateCameraToAxis(axisName)
     }
   }
 

src/components/HelpMenu.tsx

@@ -8,7 +8,6 @@ import { createAndOpenNewProject } from 'lib/desktopFS'
 import { useAbsoluteFilePath } from 'hooks/useAbsoluteFilePath'
 import { useLspContext } from './LspProvider'
 import { openExternalBrowserIfDesktop } from 'lib/openWindow'
-import { reportRejection } from 'lib/trap'
 
 const HelpMenuDivider = () => (
   <div className="h-[1px] bg-chalkboard-110 dark:bg-chalkboard-80" />
@@ -116,9 +115,7 @@ export function HelpMenu(props: React.PropsWithChildren) {
             if (isInProject) {
               navigate(filePath + PATHS.ONBOARDING.INDEX)
             } else {
-              createAndOpenNewProject({ onProjectOpen, navigate }).catch(
-                reportRejection
-              )
+              createAndOpenNewProject({ onProjectOpen, navigate })
             }
           }}
         >

src/components/Loading.tsx

@@ -11,8 +11,6 @@ import {
 
 import { engineCommandManager } from '../lib/singletons'
 
-import { Spinner } from './Spinner'
-
 const Loading = ({ children }: React.PropsWithChildren) => {
   const [error, setError] = useState<ConnectionError>(ConnectionError.Unset)
 
@@ -67,7 +65,17 @@ const Loading = ({ children }: React.PropsWithChildren) => {
       className="body-bg flex flex-col items-center justify-center h-screen"
       data-testid="loading"
     >
-      <Spinner />
+      <svg viewBox="0 0 10 10" className="w-8 h-8">
+        <circle
+          cx="5"
+          cy="5"
+          r="4"
+          stroke="var(--primary)"
+          fill="none"
+          strokeDasharray="4, 4"
+          className="animate-spin origin-center"
+        />
+      </svg>
       <p className="text-base mt-4 text-primary">{children || 'Loading'}</p>
       <p
         className={

src/components/LowerRightControls.tsx

@@ -11,8 +11,6 @@ import toast from 'react-hot-toast'
 import { CoreDumpManager } from 'lib/coredump'
 import openWindow, { openExternalBrowserIfDesktop } from 'lib/openWindow'
 import { NetworkMachineIndicator } from './NetworkMachineIndicator'
-import { ModelStateIndicator } from './ModelStateIndicator'
-import { reportRejection } from 'lib/trap'
 
 export function LowerRightControls({
   children,
@@ -26,7 +24,7 @@ export function LowerRightControls({
   const linkOverrideClassName =
     '!text-chalkboard-70 hover:!text-chalkboard-80 dark:!text-chalkboard-40 dark:hover:!text-chalkboard-30'
 
-  function reportbug(event: {
+  async function reportbug(event: {
     preventDefault: () => void
     stopPropagation: () => void
   }) {
@@ -35,9 +33,7 @@ export function LowerRightControls({
 
     if (!coreDumpManager) {
       // open default reporting option
-      openWindow(
-        'https://github.com/KittyCAD/modeling-app/issues/new/choose'
-      ).catch(reportRejection)
+      openWindow('https://github.com/KittyCAD/modeling-app/issues/new/choose')
     } else {
       toast
         .promise(
@@ -59,7 +55,7 @@ export function LowerRightControls({
           if (err) {
             openWindow(
               'https://github.com/KittyCAD/modeling-app/issues/new/choose'
-            ).catch(reportRejection)
+            )
           }
         })
     }
@@ -69,7 +65,6 @@ export function LowerRightControls({
     <section className="fixed bottom-2 right-2 flex flex-col items-end gap-3 pointer-events-none">
       {children}
       <menu className="flex items-center justify-end gap-3 pointer-events-auto">
-        {!location.pathname.startsWith(PATHS.HOME) && <ModelStateIndicator />}
         <a
           onClick={openExternalBrowserIfDesktop(
             `https://github.com/KittyCAD/modeling-app/releases/tag/v${APP_VERSION}`

src/components/LspProvider.tsx

@@ -160,9 +160,7 @@ export const LspProvider = ({ children }: { children: React.ReactNode }) => {
                 // Update the folding ranges, since the AST has changed.
                 // This is a hack since codemirror does not support async foldService.
                 // When they do we can delete this.
-                // eslint-disable-next-line @typescript-eslint/no-floating-promises
                 plugin.updateFoldingRanges()
-                // eslint-disable-next-line @typescript-eslint/no-floating-promises
                 plugin.requestSemanticTokens()
                 break
               case 'kcl/memoryUpdated':

src/components/ModelStateIndicator.tsx

@@ -1,45 +0,0 @@
-import { useEngineCommands } from './EngineCommands'
-import { Spinner } from './Spinner'
-import { CustomIcon } from './CustomIcon'
-
-export const ModelStateIndicator = () => {
-  const [commands] = useEngineCommands()
-
-  const lastCommandType = commands[commands.length - 1]?.type
-
-  let className = 'w-6 h-6 '
-  let icon = <Spinner className={className} />
-  let dataTestId = 'model-state-indicator'
-
-  if (lastCommandType === 'receive-reliable') {
-    className +=
-      'bg-chalkboard-20 dark:bg-chalkboard-80 !group-disabled:bg-chalkboard-30 !dark:group-disabled:bg-chalkboard-80 rounded-sm bg-succeed-10/30 dark:bg-succeed'
-    icon = (
-      <CustomIcon
-        data-testid={dataTestId + '-receive-reliable'}
-        name="checkmark"
-      />
-    )
-  } else if (lastCommandType === 'execution-done') {
-    className +=
-      'border-6 border border-solid border-chalkboard-60 dark:border-chalkboard-80 bg-chalkboard-20 dark:bg-chalkboard-80 !group-disabled:bg-chalkboard-30 !dark:group-disabled:bg-chalkboard-80 rounded-sm bg-succeed-10/30 dark:bg-succeed'
-    icon = (
-      <CustomIcon
-        data-testid={dataTestId + '-execution-done'}
-        name="checkmark"
-      />
-    )
-  } else if (lastCommandType === 'export-done') {
-    className +=
-      'border-6 border border-solid border-chalkboard-60 dark:border-chalkboard-80 bg-chalkboard-20 dark:bg-chalkboard-80 !group-disabled:bg-chalkboard-30 !dark:group-disabled:bg-chalkboard-80 rounded-sm bg-succeed-10/30 dark:bg-succeed'
-    icon = (
-      <CustomIcon data-testid={dataTestId + '-export-done'} name="checkmark" />
-    )
-  }
-
-  return (
-    <div className={className} data-testid="model-state-indicator">
-      {icon}
-    </div>
-  )
-}

src/components/ModelingSidebar/ModelingPanes/KclEditorMenu.tsx

@@ -8,7 +8,6 @@ import { editorShortcutMeta } from './KclEditorPane'
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
 import { kclManager } from 'lib/singletons'
 import { openExternalBrowserIfDesktop } from 'lib/openWindow'
-import { reportRejection } from 'lib/trap'
 
 export const KclEditorMenu = ({ children }: PropsWithChildren) => {
   const { enable: convertToVarEnabled, handleClick: handleConvertToVarClick } =
@@ -48,9 +47,7 @@ export const KclEditorMenu = ({ children }: PropsWithChildren) => {
           {convertToVarEnabled && (
             <Menu.Item>
               <button
-                onClick={() => {
-                  handleConvertToVarClick().catch(reportRejection)
-                }}
+                onClick={() => handleConvertToVarClick()}
                 className={styles.button}
               >
                 <span>Convert to Variable</span>

src/components/ModelingSidebar/ModelingSidebar.tsx

@@ -57,7 +57,6 @@ export function ModelingSidebar({ paneOpacity }: ModelingSidebarProps) {
       icon: 'printer3d',
       iconClassName: '!p-0',
       keybinding: 'Ctrl + Shift + M',
-      // eslint-disable-next-line @typescript-eslint/no-misused-promises
       action: async () => {
         commandBarSend({
           type: 'Find and select command',

src/components/NetworkHealthIndicator.tsx

@@ -4,8 +4,6 @@ import Tooltip from './Tooltip'
 import { ConnectingTypeGroup } from '../lang/std/engineConnection'
 import { useNetworkContext } from '../hooks/useNetworkContext'
 import { NetworkHealthState } from '../hooks/useNetworkStatus'
-import { toSync } from 'lib/utils'
-import { reportRejection } from 'lib/trap'
 
 export const NETWORK_HEALTH_TEXT: Record<NetworkHealthState, string> = {
   [NetworkHealthState.Ok]: 'Connected',
@@ -162,13 +160,13 @@ export const NetworkHealthIndicator = () => {
               </div>
               {issues[name as ConnectingTypeGroup] && (
                 <button
-                  onClick={toSync(async () => {
+                  onClick={async () => {
                     await navigator.clipboard.writeText(
                       JSON.stringify(error, null, 2) || ''
                     )
                     setHasCopied(true)
                     setTimeout(() => setHasCopied(false), 5000)
-                  }, reportRejection)}
+                  }}
                   className="flex w-fit gap-2 items-center bg-transparent text-sm p-1 py-0 my-0 -mx-1 text-destroy-80 dark:text-destroy-10 hover:bg-transparent border-transparent dark:border-transparent hover:border-destroy-80 dark:hover:border-destroy-80 dark:hover:bg-destroy-80"
                 >
                   {hasCopied ? 'Copied' : 'Copy Error'}

src/components/ProjectCard/ProjectCard.tsx

@@ -8,8 +8,6 @@ import Tooltip from '../Tooltip'
 import { DeleteConfirmationDialog } from './DeleteProjectDialog'
 import { ProjectCardRenameForm } from './ProjectCardRenameForm'
 import { Project } from 'lib/project'
-import { toSync } from 'lib/utils'
-import { reportRejection } from 'lib/trap'
 
 function ProjectCard({
   project,
@@ -167,10 +165,10 @@ function ProjectCard({
       {isConfirmingDelete && (
         <DeleteConfirmationDialog
           title="Delete Project"
-          onConfirm={toSync(async () => {
+          onConfirm={async () => {
             await handleDeleteProject(project)
             setIsConfirmingDelete(false)
-          }, reportRejection)}
+          }}
           onDismiss={() => setIsConfirmingDelete(false)}
         >
           <p className="my-4">

src/components/RefreshButton.tsx

@@ -6,8 +6,6 @@ import React, { useMemo } from 'react'
 import toast from 'react-hot-toast'
 import Tooltip from './Tooltip'
 import { useSettingsAuthContext } from 'hooks/useSettingsAuthContext'
-import { reportRejection } from 'lib/trap'
-import { toSync } from 'lib/utils'
 
 export const RefreshButton = ({ children }: React.PropsWithChildren) => {
   const { auth } = useSettingsAuthContext()
@@ -52,12 +50,11 @@ export const RefreshButton = ({ children }: React.PropsWithChildren) => {
         // Window may not be available in some environments
         window?.location.reload()
       })
-      .catch(reportRejection)
   }
 
   return (
     <button
-      onClick={toSync(refresh, reportRejection)}
+      onClick={refresh}
       className="p-1 m-0 bg-chalkboard-10/80 dark:bg-chalkboard-100/50 hover:bg-chalkboard-10 dark:hover:bg-chalkboard-100 rounded-full border border-solid border-chalkboard-20 dark:border-chalkboard-90"
     >
       <CustomIcon name="exclamationMark" className="w-5 h-5" />

src/components/Settings/AllSettingsFields.tsx

@@ -12,6 +12,7 @@ import { useLocation, useNavigate } from 'react-router-dom'
 import { isDesktop } from 'lib/isDesktop'
 import { ActionButton } from 'components/ActionButton'
 import { SettingsFieldInput } from './SettingsFieldInput'
+import { getInitialDefaultDir } from 'lib/desktop'
 import toast from 'react-hot-toast'
 import { APP_VERSION } from 'routes/Settings'
 import { PATHS } from 'lib/paths'
@@ -19,8 +20,6 @@ import { createAndOpenNewProject, getSettingsFolderPaths } from 'lib/desktopFS'
 import { useDotDotSlash } from 'hooks/useDotDotSlash'
 import { ForwardedRef, forwardRef, useEffect } from 'react'
 import { useLspContext } from 'components/LspProvider'
-import { toSync } from 'lib/utils'
-import { reportRejection } from 'lib/trap'
 
 interface AllSettingsFieldsProps {
   searchParamTab: SettingsLevel
@@ -55,7 +54,7 @@ export const AllSettingsFields = forwardRef(
           )
         : undefined
 
-    function restartOnboarding() {
+    async function restartOnboarding() {
       send({
         type: `set.app.onboardingStatus`,
         data: { level: 'user', value: '' },
@@ -83,7 +82,6 @@ export const AllSettingsFields = forwardRef(
           }
         }
       }
-      // eslint-disable-next-line @typescript-eslint/no-floating-promises
       navigateToOnboardingStart()
     }, [isFileSettings, navigate, state])
 
@@ -192,7 +190,7 @@ export const AllSettingsFields = forwardRef(
               {isDesktop() && (
                 <ActionButton
                   Element="button"
-                  onClick={toSync(async () => {
+                  onClick={async () => {
                     const paths = await getSettingsFolderPaths(
                       projectPath ? decodeURIComponent(projectPath) : undefined
                     )
@@ -201,7 +199,7 @@ export const AllSettingsFields = forwardRef(
                       return new Error('finalPath undefined')
                     }
                     window.electron.showInFolder(finalPath)
-                  }, reportRejection)}
+                  }}
                   iconStart={{
                     icon: 'folder',
                     size: 'sm',
@@ -213,14 +211,13 @@ export const AllSettingsFields = forwardRef(
               )}
               <ActionButton
                 Element="button"
-                onClick={() => {
+                onClick={async () => {
+                  const defaultDirectory = await getInitialDefaultDir()
                   send({
                     type: 'Reset settings',
-                    level: searchParamTab,
+                    defaultDirectory,
                   })
-                  toast.success(
-                    `Your ${searchParamTab}-level settings were reset`
-                  )
+                  toast.success('Settings restored to default')
                 }}
                 iconStart={{
                   icon: 'refresh',
@@ -229,7 +226,7 @@ export const AllSettingsFields = forwardRef(
                   bgClassName: 'bg-destroy-70',
                 }}
               >
-                Reset {searchParamTab}-level settings
+                Restore default settings
               </ActionButton>
             </div>
           </SettingsSection>

src/components/Settings/SettingsFieldInput.tsx

@@ -8,7 +8,7 @@ import {
 } from 'lib/settings/settingsTypes'
 import { getSettingInputType } from 'lib/settings/settingsUtils'
 import { useMemo } from 'react'
-import { EventFrom } from 'xstate'
+import { Event } from 'xstate'
 
 interface SettingsFieldInputProps {
   // We don't need the fancy types here,
@@ -59,7 +59,7 @@ export function SettingsFieldInput({
                   level: settingsLevel,
                   value: newValue,
                 },
-              } as unknown as EventFrom<WildcardSetEvent>)
+              } as unknown as Event<WildcardSetEvent>)
             }}
           />
         )
@@ -103,7 +103,7 @@ export function SettingsFieldInput({
                 level: settingsLevel,
                 value: e.target.value,
               },
-            } as unknown as EventFrom<WildcardSetEvent>)
+            } as unknown as Event<WildcardSetEvent>)
           }
         >
           {options &&
@@ -137,7 +137,7 @@ export function SettingsFieldInput({
                   level: settingsLevel,
                   value: e.target.value,
                 },
-              } as unknown as EventFrom<WildcardSetEvent>)
+              } as unknown as Event<WildcardSetEvent>)
             }
           }}
         />

src/components/SettingsAuthProvider.tsx

@@ -14,15 +14,16 @@ import {
   Themes,
 } from 'lib/theme'
 import decamelize from 'decamelize'
-import { Actor, AnyStateMachine, ContextFrom, Prop, StateFrom } from 'xstate'
+import {
+  AnyStateMachine,
+  ContextFrom,
+  InterpreterFrom,
+  Prop,
+  StateFrom,
+} from 'xstate'
 import { isDesktop } from 'lib/isDesktop'
 import { authCommandBarConfig } from 'lib/commandBarConfigs/authCommandConfig'
-import {
-  kclManager,
-  sceneInfra,
-  engineCommandManager,
-  sceneEntitiesManager,
-} from 'lib/singletons'
+import { kclManager, sceneInfra, engineCommandManager } from 'lib/singletons'
 import { uuidv4 } from 'lib/utils'
 import { IndexLoaderData } from 'lib/types'
 import { settings } from 'lib/settings/initialSettings'
@@ -38,7 +39,7 @@ import { saveSettings } from 'lib/settings/settingsUtils'
 type MachineContext<T extends AnyStateMachine> = {
   state: StateFrom<T>
   context: ContextFrom<T>
-  send: Prop<Actor<T>, 'send'>
+  send: Prop<InterpreterFrom<T>, 'send'>
 }
 
 type SettingsAuthContextType = {
@@ -49,7 +50,7 @@ type SettingsAuthContextType = {
 // a little hacky for sure, open to changing it
 // this implies that we should only even have one instance of this provider mounted at any one time
 // but I think that's a safe assumption
-let settingsStateRef: ContextFrom<typeof settingsMachine> | undefined
+let settingsStateRef: (typeof settingsMachine)['context'] | undefined
 export const getSettingsState = () => settingsStateRef
 
 export const SettingsAuthContext = createContext({} as SettingsAuthContextType)
@@ -100,20 +101,21 @@ export const SettingsAuthProviderBase = ({
   const { commandBarSend } = useCommandsContext()
 
   const [settingsState, settingsSend, settingsActor] = useMachine(
-    settingsMachine.provide({
+    settingsMachine,
+    {
+      context: loadedSettings,
       actions: {
         //TODO: batch all these and if that's difficult to do from tsx,
         // make it easy to do
 
-        setClientSideSceneUnits: ({ context, event }) => {
+        setClientSideSceneUnits: (context, event) => {
           const newBaseUnit =
             event.type === 'set.modeling.defaultUnit'
               ? (event.data.value as BaseUnit)
               : context.modeling.defaultUnit.current
           sceneInfra.baseUnit = newBaseUnit
         },
-        setEngineTheme: ({ context }) => {
-          // eslint-disable-next-line @typescript-eslint/no-floating-promises
+        setEngineTheme: (context) => {
           engineCommandManager.sendSceneCommand({
             cmd_id: uuidv4(),
             type: 'modeling_cmd_req',
@@ -124,7 +126,6 @@ export const SettingsAuthProviderBase = ({
           })
 
           const opposingTheme = getOppositeTheme(context.app.theme.current)
-          // eslint-disable-next-line @typescript-eslint/no-floating-promises
           engineCommandManager.sendSceneCommand({
             cmd_id: uuidv4(),
             type: 'modeling_cmd_req',
@@ -134,18 +135,16 @@ export const SettingsAuthProviderBase = ({
             },
           })
         },
-        setEngineScaleGridVisibility: ({ context }) => {
+        setEngineScaleGridVisibility: (context) => {
           engineCommandManager.setScaleGridVisibility(
             context.modeling.showScaleGrid.current
           )
         },
-        setClientTheme: ({ context }) => {
+        setClientTheme: (context) => {
           const opposingTheme = getOppositeTheme(context.app.theme.current)
           sceneInfra.theme = opposingTheme
-          sceneEntitiesManager.updateSegmentBaseColor(opposingTheme)
         },
-        setEngineEdges: ({ context }) => {
-          // eslint-disable-next-line @typescript-eslint/no-floating-promises
+        setEngineEdges: (context) => {
           engineCommandManager.sendSceneCommand({
             cmd_id: uuidv4(),
             type: 'modeling_cmd_req',
@@ -155,8 +154,7 @@ export const SettingsAuthProviderBase = ({
             },
           })
         },
-        toastSuccess: ({ event }) => {
-          if (!('data' in event)) return
+        toastSuccess: (_, event) => {
           const eventParts = event.type.replace(/^set./, '').split('.') as [
             keyof typeof settings,
             string
@@ -178,7 +176,7 @@ export const SettingsAuthProviderBase = ({
             id: `${event.type}.success`,
           })
         },
-        'Execute AST': ({ context, event }) => {
+        'Execute AST': (context, event) => {
           try {
             const allSettingsIncludesUnitChange =
               event.type === 'Set all settings' &&
@@ -195,8 +193,10 @@ export const SettingsAuthProviderBase = ({
               resetSettingsIncludesUnitChange
             ) {
               // Unit changes requires a re-exec of code
-              // eslint-disable-next-line @typescript-eslint/no-floating-promises
-              kclManager.executeCode(true)
+              kclManager.isFirstRender = true
+              kclManager.executeCode(true).then(() => {
+                kclManager.isFirstRender = false
+              })
             } else {
               // For any future logging we'd like to do
               // console.log(
@@ -207,13 +207,12 @@ export const SettingsAuthProviderBase = ({
             console.error('Error executing AST after settings change', e)
           }
         },
-        persistSettings: ({ context }) => {
-          // eslint-disable-next-line @typescript-eslint/no-floating-promises
-          saveSettings(context, loadedProject?.project?.path)
-        },
       },
-    }),
-    { input: loadedSettings }
+      services: {
+        'Persist settings': (context) =>
+          saveSettings(context, loadedProject?.project?.path),
+      },
+    }
   )
   settingsStateRef = settingsState.context
 
@@ -296,22 +295,19 @@ export const SettingsAuthProviderBase = ({
   }, [settingsState.context.textEditor.blinkingCursor.current])
 
   // Auth machine setup
-  const [authState, authSend, authActor] = useMachine(
-    authMachine.provide({
-      actions: {
-        goToSignInPage: () => {
-          navigate(PATHS.SIGN_IN)
-          // eslint-disable-next-line @typescript-eslint/no-floating-promises
-          logout()
-        },
-        goToIndexPage: () => {
-          if (location.pathname.includes(PATHS.SIGN_IN)) {
-            navigate(PATHS.INDEX)
-          }
-        },
+  const [authState, authSend, authActor] = useMachine(authMachine, {
+    actions: {
+      goToSignInPage: () => {
+        navigate(PATHS.SIGN_IN)
+        logout()
       },
-    })
-  )
+      goToIndexPage: () => {
+        if (location.pathname.includes(PATHS.SIGN_IN)) {
+          navigate(PATHS.INDEX)
+        }
+      },
+    },
+  })
 
   useStateMachineCommands({
     machineId: 'auth',
@@ -343,11 +339,13 @@ export const SettingsAuthProviderBase = ({
 
 export default SettingsAuthProvider
 
-export async function logout() {
+export function logout() {
   localStorage.removeItem(TOKEN_PERSIST_KEY)
-  if (isDesktop()) return Promise.resolve(null)
-  return fetch(withBaseUrl('/logout'), {
-    method: 'POST',
-    credentials: 'include',
-  })
+  return (
+    !isDesktop() &&
+    fetch(withBaseUrl('/logout'), {
+      method: 'POST',
+      credentials: 'include',
+    })
+  )
 }

src/components/Spinner.tsx

@@ -1,17 +0,0 @@
-import { SVGProps } from 'react'
-
-export const Spinner = (props: SVGProps<SVGSVGElement>) => {
-  return (
-    <svg viewBox="0 0 10 10" className={'w-8 h-8'} {...props}>
-      <circle
-        cx="5"
-        cy="5"
-        r="4"
-        stroke="var(--primary)"
-        fill="none"
-        strokeDasharray="4, 4"
-        className="animate-spin origin-center"
-      />
-    </svg>
-  )
-}

src/components/Stream.tsx

@@ -53,12 +53,13 @@ export const Stream = () => {
    * executed. If we can find a way to do this from a more
    * central place, we can move this code there.
    */
-  function executeCodeAndPlayStream() {
-    // eslint-disable-next-line @typescript-eslint/no-floating-promises
-    kclManager.executeCode(true).then(async () => {
-      await videoRef.current?.play().catch((e) => {
+  async function executeCodeAndPlayStream() {
+    kclManager.isFirstRender = true
+    kclManager.executeCode(true).then(() => {
+      videoRef.current?.play().catch((e) => {
         console.warn('Video playing was prevented', e, videoRef.current)
       })
+      kclManager.isFirstRender = false
       setStreamState(StreamState.Playing)
     })
   }
@@ -218,15 +219,15 @@ export const Stream = () => {
    * Play the vid
    */
   useEffect(() => {
-    if (!kclManager.isExecuting) {
-      setTimeout(() => {
+    if (!kclManager.isFirstRender) {
+      setTimeout(() =>
         // execute in the next event loop
         videoRef.current?.play().catch((e) => {
           console.warn('Video playing was prevented', e, videoRef.current)
         })
-      })
+      )
     }
-  }, [kclManager.isExecuting])
+  }, [kclManager.isFirstRender])
 
   useEffect(() => {
     if (
@@ -288,10 +289,9 @@ export const Stream = () => {
       },
     })
     if (state.matches('Sketch')) return
-    if (state.matches({ idle: 'showPlanes' })) return
+    if (state.matches('idle.showPlanes')) return
 
     if (!context.store?.didDragInStream && btnName(e).left) {
-      // eslint-disable-next-line @typescript-eslint/no-floating-promises
       sendSelectEventToEngine(
         e,
         videoRef.current,
@@ -382,15 +382,15 @@ export const Stream = () => {
           </div>
         </div>
       )}
-      {(!isNetworkOkay || isLoading) && (
+      {(!isNetworkOkay || isLoading || kclManager.isFirstRender) && (
         <div className="text-center absolute inset-0">
           <Loading>
-            {!isNetworkOkay && !isLoading ? (
+            {!isNetworkOkay && !isLoading && !kclManager.isFirstRender ? (
               <span data-testid="loading-stream">Stream disconnected...</span>
+            ) : !isLoading && kclManager.isFirstRender ? (
+              <span data-testid="loading-stream">Building scene...</span>
             ) : (
-              !isLoading && (
-                <span data-testid="loading-stream">Loading stream...</span>
-              )
+              <span data-testid="loading-stream">Loading stream...</span>
             )}
           </Loading>
         </div>

src/components/ToastTextToCad.tsx

@@ -5,7 +5,7 @@ import { isDesktop } from 'lib/isDesktop'
 import { PATHS } from 'lib/paths'
 import toast from 'react-hot-toast'
 import { TextToCad_type } from '@kittycad/lib/dist/types/src/models'
-import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
+import { useCallback, useEffect, useRef, useState } from 'react'
 import {
   Box3,
   Color,
@@ -15,7 +15,6 @@ import {
   LineSegments,
   Mesh,
   MeshBasicMaterial,
-  MOUSE,
   OrthographicCamera,
   Scene,
   Vector3,
@@ -27,18 +26,8 @@ import { sendTelemetry } from 'lib/textToCad'
 import { Themes } from 'lib/theme'
 import { ActionButton } from './ActionButton'
 import { commandBarMachine } from 'machines/commandBarMachine'
-import { EventFrom } from 'xstate'
+import { EventData, EventFrom } from 'xstate'
 import { fileMachine } from 'machines/fileMachine'
-import { reportRejection } from 'lib/trap'
-import {
-  CameraControls,
-  CameraInteractionType,
-} from 'clientSideScene/CameraControls'
-import {
-  cameraMouseDragGuards,
-  CameraSystem,
-  MouseGuard,
-} from 'lib/cameraControls'
 
 const CANVAS_SIZE = 128
 const PROMPT_TRUNCATE_LENGTH = 128
@@ -56,7 +45,7 @@ export function ToastTextToCadError({
   prompt: string
   commandBarSend: (
     event: EventFrom<typeof commandBarMachine>,
-    data?: unknown
+    data?: EventData
   ) => void
 }) {
   return (
@@ -123,19 +112,13 @@ export function ToastTextToCadSuccess({
   token?: string
   fileMachineSend: (
     event: EventFrom<typeof fileMachine>,
-    data?: unknown
+    data?: EventData
   ) => void
   settings: {
     theme: Themes
     highlightEdges: boolean
-    mouseControls: CameraSystem
   }
 }) {
-  const interactionGuards = useMemo(
-    () => cameraMouseDragGuards[settings.mouseControls],
-    [settings.mouseControls]
-  )
-  const controlsRef = useRef<OrbitControls | null>(null)
   const wrapperRef = useRef<HTMLDivElement | null>(null)
   const canvasRef = useRef<HTMLCanvasElement | null>(null)
   const animationRequestRef = useRef<number>()
@@ -184,59 +167,8 @@ export function ToastTextToCadSuccess({
     const ambientLight = new DirectionalLight(new Color('white'), 8.0)
     scene.add(ambientLight)
     const camera = createCamera()
-    // Because this listener is registered before the OrbitControls are created,
-    // it runs first and can block the OrbitControls from working.
-    renderer.domElement.addEventListener('pointerdown', (e) => {
-      if (!controlsRef.current) return
-      const newInteractionType = getCameraInteractionType({
-        interactionGuards,
-        event: e,
-      })
-      console.log('newInteractionType', newInteractionType)
-
-      if (newInteractionType === 'none') {
-        e.stopImmediatePropagation()
-      }
-
-      /**
-       * Update the OrbitControls to enable only the current interaction type.
-       * This is a hack to override the interaction types of the OrbitControls
-       * to match ours. In the future, we should roll our own class based on OrbitControls,
-       * which can handle interaction guards that are more complex than just mouse buttons.
-       */
-      if (newInteractionType === 'pan') {
-        controlsRef.current.enablePan = true
-        controlsRef.current.enableZoom = false
-        controlsRef.current.enableRotate = false
-        controlsRef.current.mouseButtons = {
-          LEFT: MOUSE.PAN,
-          MIDDLE: MOUSE.PAN,
-          RIGHT: MOUSE.PAN,
-        }
-      } else if (newInteractionType === 'zoom') {
-        controlsRef.current.enablePan = false
-        controlsRef.current.enableZoom = true
-        controlsRef.current.enableRotate = false
-        controlsRef.current.mouseButtons = {
-          LEFT: MOUSE.DOLLY,
-          MIDDLE: MOUSE.DOLLY,
-          RIGHT: MOUSE.DOLLY,
-        }
-      } else if (newInteractionType === 'rotate') {
-        controlsRef.current.enablePan = false
-        controlsRef.current.enableZoom = false
-        controlsRef.current.enableRotate = true
-        controlsRef.current.mouseButtons = {
-          LEFT: MOUSE.ROTATE,
-          MIDDLE: MOUSE.ROTATE,
-          RIGHT: MOUSE.ROTATE,
-        }
-      }
-
-      controls.update()
-    })
     const controls = new OrbitControls(camera, renderer.domElement)
-    controlsRef.current = controls
+    controls.enableDamping = true
     const loader = new GLTFLoader()
     const dracoLoader = new DRACOLoader()
     dracoLoader.setDecoderPath('/examples/jsm/libs/draco/')
@@ -337,7 +269,7 @@ export function ToastTextToCadSuccess({
   }, [])
 
   return (
-    <div className="flex gap-4 min-w-80 user-select-none" ref={wrapperRef}>
+    <div className="flex gap-4 min-w-80" ref={wrapperRef}>
       <div
         className="flex-none overflow-hidden"
         style={{ width: CANVAS_SIZE + 'px', height: CANVAS_SIZE + 'px' }}
@@ -365,7 +297,7 @@ export function ToastTextToCadSuccess({
             name={hasCopied ? 'Close' : 'Reject'}
             onClick={() => {
               if (!hasCopied) {
-                sendTelemetry(modelId, 'rejected', token).catch(reportRejection)
+                sendTelemetry(modelId, 'rejected', token)
               }
               if (isDesktop()) {
                 // Delete the file from the project
@@ -391,7 +323,6 @@ export function ToastTextToCadSuccess({
               }}
               name="Accept"
               onClick={() => {
-                // eslint-disable-next-line @typescript-eslint/no-floating-promises
                 sendTelemetry(modelId, 'accepted', token)
                 navigate(
                   `${PATHS.FILE}/${encodeURIComponent(
@@ -411,9 +342,7 @@ export function ToastTextToCadSuccess({
               }}
               name="Copy to clipboard"
               onClick={() => {
-                // eslint-disable-next-line @typescript-eslint/no-floating-promises
                 sendTelemetry(modelId, 'accepted', token)
-                // eslint-disable-next-line @typescript-eslint/no-floating-promises
                 navigator.clipboard.writeText(data.code || '// no code found')
                 setShowCopiedUi(true)
                 setHasCopied(true)
@@ -478,22 +407,3 @@ function traverseSceneToStyleObjects({
     }
   })
 }
-
-function getCameraInteractionType({
-  interactionGuards,
-  event,
-}: {
-  interactionGuards: MouseGuard
-  event: MouseEvent
-}): CameraInteractionType | 'none' {
-  if (interactionGuards.pan.callback(event)) {
-    return 'pan'
-  }
-  if (interactionGuards.zoom.dragCallback(event)) {
-    return 'zoom'
-  }
-  if (interactionGuards.rotate.callback(event)) {
-    return 'rotate'
-  }
-  return 'none'
-}

src/components/Tooltip.tsx

@@ -12,7 +12,6 @@ interface TooltipProps extends React.PropsWithChildren {
   position?: TooltipPosition
   wrapperClassName?: string
   contentClassName?: string
-  wrapperStyle?: React.CSSProperties
   delay?: number
   hoverOnly?: boolean
   inert?: boolean
@@ -23,7 +22,6 @@ export default function Tooltip({
   position = 'top',
   wrapperClassName: className,
   contentClassName,
-  wrapperStyle = {},
   delay = 200,
   hoverOnly = false,
   inert = true,
@@ -38,10 +36,7 @@ export default function Tooltip({
       } ${styles.tooltipWrapper} ${hoverOnly ? '' : styles.withFocus} ${
         styles[position]
       } ${className}`}
-      style={Object.assign(
-        { '--_delay': delay + 'ms' } as React.CSSProperties,
-        wrapperStyle
-      )}
+      style={{ '--_delay': delay + 'ms' } as React.CSSProperties}
     >
       <div className={`rounded ${styles.tooltip} ${contentClassName || ''}`}>
         {children}

src/components/UserSidebarMenu.tsx

@@ -133,7 +133,7 @@ const UserSidebarMenu = ({ user }: { user?: User }) => {
           Element: 'button',
           'data-testid': 'user-sidebar-sign-out',
           children: 'Sign out',
-          onClick: () => send({ type: 'Log out' }),
+          onClick: () => send('Log out'),
           className: '', // Just making TS's filter type coercion happy 😠
         },
       ].filter(

src/editor/manager.ts

@@ -1,7 +1,7 @@
 import { EditorView, ViewUpdate } from '@codemirror/view'
 import { EditorSelection, Annotation, Transaction } from '@codemirror/state'
 import { engineCommandManager } from 'lib/singletons'
-import { modelingMachine, ModelingMachineEvent } from 'machines/modelingMachine'
+import { ModelingMachineEvent } from 'machines/modelingMachine'
 import { Selections, processCodeMirrorRanges, Selection } from 'lib/selections'
 import { undo, redo } from '@codemirror/commands'
 import { CommandBarMachineEvent } from 'machines/commandBarMachine'
@@ -11,7 +11,6 @@ import {
   forEachDiagnostic,
   setDiagnosticsEffect,
 } from '@codemirror/lint'
-import { StateFrom } from 'xstate'
 
 const updateOutsideEditorAnnotation = Annotation.define<boolean>()
 export const updateOutsideEditorEvent = updateOutsideEditorAnnotation.of(true)
@@ -39,7 +38,7 @@ export default class EditorManager {
   private _lastEvent: { event: string; time: number } | null = null
 
   private _modelingSend: (eventInfo: ModelingMachineEvent) => void = () => {}
-  private _modelingState: StateFrom<typeof modelingMachine> | null = null
+  private _modelingEvent: ModelingMachineEvent | null = null
 
   private _commandBarSend: (eventInfo: CommandBarMachineEvent) => void =
     () => {}
@@ -81,8 +80,8 @@ export default class EditorManager {
     this._modelingSend = send
   }
 
-  set modelingState(state: StateFrom<typeof modelingMachine>) {
-    this._modelingState = state
+  set modelingEvent(event: ModelingMachineEvent) {
+    this._modelingEvent = event
   }
 
   setCommandBarSend(send: (eventInfo: CommandBarMachineEvent) => void) {
@@ -249,11 +248,13 @@ export default class EditorManager {
       return
     }
 
-    if (!this._modelingState) {
+    const ignoreEvents: ModelingMachineEvent['type'][] = ['change tool']
+
+    if (!this._modelingEvent) {
       return
     }
 
-    if (this._modelingState.matches({ Sketch: 'Change Tool' })) {
+    if (ignoreEvents.includes(this._modelingEvent.type)) {
       return
     }
 
@@ -285,9 +286,8 @@ export default class EditorManager {
 
     this._lastEvent = { event: stringEvent, time: Date.now() }
     this._modelingSend(eventInfo.modelingEvent)
-    eventInfo.engineEvents.forEach((event) => {
-      // eslint-disable-next-line @typescript-eslint/no-floating-promises
+    eventInfo.engineEvents.forEach((event) =>
       engineCommandManager.sendSceneCommand(event)
-    })
+    )
   }
 }

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

@@ -36,7 +36,6 @@ import { CopilotCompletionResponse } from 'wasm-lib/kcl/bindings/CopilotCompleti
 import { CopilotAcceptCompletionParams } from 'wasm-lib/kcl/bindings/CopilotAcceptCompletionParams'
 import { CopilotRejectCompletionParams } from 'wasm-lib/kcl/bindings/CopilotRejectCompletionParams'
 import { editorManager } from 'lib/singletons'
-import { reportRejection } from 'lib/trap'
 
 const copilotPluginAnnotation = Annotation.define<boolean>()
 export const copilotPluginEvent = copilotPluginAnnotation.of(true)
@@ -267,7 +266,7 @@ export class CompletionRequester implements PluginValue {
 
     if (!this.client.ready) return
     try {
-      this.requestCompletions().catch(reportRejection)
+      this.requestCompletions()
     } catch (e) {
       console.error(e)
     }
@@ -463,7 +462,7 @@ export class CompletionRequester implements PluginValue {
       annotations: [copilotPluginEvent, Transaction.addToHistory.of(true)],
     })
 
-    this.accept(ghostText.uuid).catch(reportRejection)
+    this.accept(ghostText.uuid)
     return true
   }
 
@@ -491,7 +490,7 @@ export class CompletionRequester implements PluginValue {
       ],
     })
 
-    this.reject().catch(reportRejection)
+    this.reject()
     return false
   }
 

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

@@ -96,7 +96,6 @@ export class KclPlugin implements PluginValue {
 
     const newCode = viewUpdate.state.doc.toString()
     codeManager.code = newCode
-    // eslint-disable-next-line @typescript-eslint/no-floating-promises
     codeManager.writeToFile()
 
     this.scheduleUpdateDoc()
@@ -118,7 +117,6 @@ export class KclPlugin implements PluginValue {
     }
 
     if (!this.client.ready) return
-    // eslint-disable-next-line @typescript-eslint/no-floating-promises
     kclManager.executeCode()
   }
 

src/editor/plugins/lsp/worker.ts

@@ -18,7 +18,7 @@ import {
   CopilotWorkerOptions,
 } from 'editor/plugins/lsp/types'
 import { EngineCommandManager } from 'lang/std/engineConnection'
-import { err, reportRejection } from 'lib/trap'
+import { err } from 'lib/trap'
 
 const intoServer: IntoServer = new IntoServer()
 const fromServer: FromServer | Error = FromServer.create()
@@ -60,8 +60,7 @@ export async function kclLspRun(
   }
 }
 
-// WebWorker message handler.
-onmessage = function (event: MessageEvent) {
+onmessage = function (event) {
   if (err(fromServer)) return
   const { worker, eventType, eventData }: LspWorkerEvent = event.data
 
@@ -71,7 +70,7 @@ onmessage = function (event: MessageEvent) {
         | KclWorkerOptions
         | CopilotWorkerOptions
       initialise(wasmUrl)
-        .then(async (instantiatedModule) => {
+        .then((instantiatedModule) => {
           console.log('Worker: WASM module loaded', worker, instantiatedModule)
           const config = new ServerConfig(
             intoServer,
@@ -82,7 +81,7 @@ onmessage = function (event: MessageEvent) {
           switch (worker) {
             case LspWorker.Kcl:
               const kclData = eventData as KclWorkerOptions
-              await kclLspRun(
+              kclLspRun(
                 config,
                 null,
                 kclData.token,
@@ -92,11 +91,7 @@ onmessage = function (event: MessageEvent) {
               break
             case LspWorker.Copilot:
               let copilotData = eventData as CopilotWorkerOptions
-              await copilotLspRun(
-                config,
-                copilotData.token,
-                copilotData.apiBaseUrl
-              )
+              copilotLspRun(config, copilotData.token, copilotData.apiBaseUrl)
               break
           }
         })
@@ -109,7 +104,7 @@ onmessage = function (event: MessageEvent) {
       intoServer.enqueue(data)
       const json: jsrpc.JSONRPCRequest = Codec.decode(data)
       if (null != json.id) {
-        // eslint-disable-next-line @typescript-eslint/no-floating-promises, @typescript-eslint/no-non-null-assertion
+        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
         fromServer.responses.get(json.id)!.then((response) => {
           const encoded = Codec.encode(response as jsrpc.JSONRPCResponse)
           postMessage(encoded)
@@ -120,17 +115,19 @@ onmessage = function (event: MessageEvent) {
       console.error('Worker: Unknown message type', worker, eventType)
   }
 }
-;(async () => {
+
+new Promise<void>(async (resolve) => {
   if (err(fromServer)) return
   for await (const requests of fromServer.requests) {
     const encoded = Codec.encode(requests as jsrpc.JSONRPCRequest)
     postMessage(encoded)
   }
-})().catch(reportRejection)
-;(async () => {
+})
+
+new Promise<void>(async (resolve) => {
   if (err(fromServer)) return
   for await (const notification of fromServer.notifications) {
     const encoded = Codec.encode(notification as jsrpc.JSONRPCRequest)
     postMessage(encoded)
   }
-})().catch(reportRejection)
+})

src/hooks/useCommandsContext.ts

@@ -1,10 +1,6 @@
 import { CommandsContext } from 'components/CommandBar/CommandBarProvider'
+import { useContext } from 'react'
 
 export const useCommandsContext = () => {
-  const commandBarActor = CommandsContext.useActorRef()
-  const commandBarState = CommandsContext.useSelector((state) => state)
-  return {
-    commandBarSend: commandBarActor.send,
-    commandBarState,
-  }
+  return useContext(CommandsContext)
 }

src/hooks/useEngineConnectionSubscriptions.ts

@@ -14,7 +14,7 @@ import {
   getSolid2dCodeRef,
   getWallCodeRef,
 } from 'lang/std/artifactGraph'
-import { err, reportRejection } from 'lib/trap'
+import { err } from 'lib/trap'
 import { DefaultPlaneStr, getFaceDetails } from 'clientSideScene/sceneEntities'
 import { getNodePathFromSourceRange } from 'lang/queryAst'
 
@@ -86,11 +86,9 @@ export function useEngineConnectionSubscriptions() {
     })
     const unSubClick = engineCommandManager.subscribeTo({
       event: 'select_with_point',
-      callback: (engineEvent) => {
-        ;(async () => {
-          const event = await getEventForSelectWithPoint(engineEvent)
-          event && send(event)
-        })().catch(reportRejection)
+      callback: async (engineEvent) => {
+        const event = await getEventForSelectWithPoint(engineEvent)
+        event && send(event)
       },
     })
     return () => {
@@ -103,120 +101,118 @@ export function useEngineConnectionSubscriptions() {
     const unSub = engineCommandManager.subscribeTo({
       event: 'select_with_point',
       callback: state.matches('Sketch no face')
-        ? ({ data }) => {
-            ;(async () => {
-              let planeOrFaceId = data.entity_id
-              if (!planeOrFaceId) return
-              if (
-                engineCommandManager.defaultPlanes?.xy === planeOrFaceId ||
-                engineCommandManager.defaultPlanes?.xz === planeOrFaceId ||
-                engineCommandManager.defaultPlanes?.yz === planeOrFaceId ||
-                engineCommandManager.defaultPlanes?.negXy === planeOrFaceId ||
-                engineCommandManager.defaultPlanes?.negXz === planeOrFaceId ||
-                engineCommandManager.defaultPlanes?.negYz === planeOrFaceId
-              ) {
-                let planeId = planeOrFaceId
-                const defaultPlaneStrMap: Record<string, DefaultPlaneStr> = {
-                  [engineCommandManager.defaultPlanes.xy]: 'XY',
-                  [engineCommandManager.defaultPlanes.xz]: 'XZ',
-                  [engineCommandManager.defaultPlanes.yz]: 'YZ',
-                  [engineCommandManager.defaultPlanes.negXy]: '-XY',
-                  [engineCommandManager.defaultPlanes.negXz]: '-XZ',
-                  [engineCommandManager.defaultPlanes.negYz]: '-YZ',
-                }
-                // TODO can we get this information from rust land when it creates the default planes?
-                // maybe returned from make_default_planes (src/wasm-lib/src/wasm.rs)
-                let zAxis: [number, number, number] = [0, 0, 1]
-                let yAxis: [number, number, number] = [0, 1, 0]
-
-                // get unit vector from camera position to target
-                const camVector = sceneInfra.camControls.camera.position
-                  .clone()
-                  .sub(sceneInfra.camControls.target)
-
-                if (engineCommandManager.defaultPlanes?.xy === planeId) {
-                  zAxis = [0, 0, 1]
-                  yAxis = [0, 1, 0]
-                  if (camVector.z < 0) {
-                    zAxis = [0, 0, -1]
-                    planeId = engineCommandManager.defaultPlanes?.negXy || ''
-                  }
-                } else if (engineCommandManager.defaultPlanes?.yz === planeId) {
-                  zAxis = [1, 0, 0]
-                  yAxis = [0, 0, 1]
-                  if (camVector.x < 0) {
-                    zAxis = [-1, 0, 0]
-                    planeId = engineCommandManager.defaultPlanes?.negYz || ''
-                  }
-                } else if (engineCommandManager.defaultPlanes?.xz === planeId) {
-                  zAxis = [0, 1, 0]
-                  yAxis = [0, 0, 1]
-                  planeId = engineCommandManager.defaultPlanes?.negXz || ''
-                  if (camVector.y < 0) {
-                    zAxis = [0, -1, 0]
-                    planeId = engineCommandManager.defaultPlanes?.xz || ''
-                  }
-                }
-
-                sceneInfra.modelingSend({
-                  type: 'Select default plane',
-                  data: {
-                    type: 'defaultPlane',
-                    planeId: planeId,
-                    plane: defaultPlaneStrMap[planeId],
-                    zAxis,
-                    yAxis,
-                  },
-                })
-                return
+        ? async ({ data }) => {
+            let planeOrFaceId = data.entity_id
+            if (!planeOrFaceId) return
+            if (
+              engineCommandManager.defaultPlanes?.xy === planeOrFaceId ||
+              engineCommandManager.defaultPlanes?.xz === planeOrFaceId ||
+              engineCommandManager.defaultPlanes?.yz === planeOrFaceId ||
+              engineCommandManager.defaultPlanes?.negXy === planeOrFaceId ||
+              engineCommandManager.defaultPlanes?.negXz === planeOrFaceId ||
+              engineCommandManager.defaultPlanes?.negYz === planeOrFaceId
+            ) {
+              let planeId = planeOrFaceId
+              const defaultPlaneStrMap: Record<string, DefaultPlaneStr> = {
+                [engineCommandManager.defaultPlanes.xy]: 'XY',
+                [engineCommandManager.defaultPlanes.xz]: 'XZ',
+                [engineCommandManager.defaultPlanes.yz]: 'YZ',
+                [engineCommandManager.defaultPlanes.negXy]: '-XY',
+                [engineCommandManager.defaultPlanes.negXz]: '-XZ',
+                [engineCommandManager.defaultPlanes.negYz]: '-YZ',
               }
-              const faceId = planeOrFaceId
-              const artifact = engineCommandManager.artifactGraph.get(faceId)
-              const extrusion = getExtrusionFromSuspectedExtrudeSurface(
-                faceId,
-                engineCommandManager.artifactGraph
-              )
+              // TODO can we get this information from rust land when it creates the default planes?
+              // maybe returned from make_default_planes (src/wasm-lib/src/wasm.rs)
+              let zAxis: [number, number, number] = [0, 0, 1]
+              let yAxis: [number, number, number] = [0, 1, 0]
 
-              if (artifact?.type !== 'cap' && artifact?.type !== 'wall') return
+              // get unit vector from camera position to target
+              const camVector = sceneInfra.camControls.camera.position
+                .clone()
+                .sub(sceneInfra.camControls.target)
 
-              const codeRef =
-                artifact.type === 'cap'
-                  ? getCapCodeRef(artifact, engineCommandManager.artifactGraph)
-                  : getWallCodeRef(artifact, engineCommandManager.artifactGraph)
-
-              const faceInfo = await getFaceDetails(faceId)
-              if (!faceInfo?.origin || !faceInfo?.z_axis || !faceInfo?.y_axis)
-                return
-              const { z_axis, y_axis, origin } = faceInfo
-              const sketchPathToNode = getNodePathFromSourceRange(
-                kclManager.ast,
-                err(codeRef) ? [0, 0] : codeRef.range
-              )
-
-              const extrudePathToNode = !err(extrusion)
-                ? getNodePathFromSourceRange(
-                    kclManager.ast,
-                    extrusion.codeRef.range
-                  )
-                : []
+              if (engineCommandManager.defaultPlanes?.xy === planeId) {
+                zAxis = [0, 0, 1]
+                yAxis = [0, 1, 0]
+                if (camVector.z < 0) {
+                  zAxis = [0, 0, -1]
+                  planeId = engineCommandManager.defaultPlanes?.negXy || ''
+                }
+              } else if (engineCommandManager.defaultPlanes?.yz === planeId) {
+                zAxis = [1, 0, 0]
+                yAxis = [0, 0, 1]
+                if (camVector.x < 0) {
+                  zAxis = [-1, 0, 0]
+                  planeId = engineCommandManager.defaultPlanes?.negYz || ''
+                }
+              } else if (engineCommandManager.defaultPlanes?.xz === planeId) {
+                zAxis = [0, 1, 0]
+                yAxis = [0, 0, 1]
+                planeId = engineCommandManager.defaultPlanes?.negXz || ''
+                if (camVector.y < 0) {
+                  zAxis = [0, -1, 0]
+                  planeId = engineCommandManager.defaultPlanes?.xz || ''
+                }
+              }
 
               sceneInfra.modelingSend({
                 type: 'Select default plane',
                 data: {
-                  type: 'extrudeFace',
-                  zAxis: [z_axis.x, z_axis.y, z_axis.z],
-                  yAxis: [y_axis.x, y_axis.y, y_axis.z],
-                  position: [origin.x, origin.y, origin.z].map(
-                    (num) => num / sceneInfra._baseUnitMultiplier
-                  ) as [number, number, number],
-                  sketchPathToNode,
-                  extrudePathToNode,
-                  cap: artifact.type === 'cap' ? artifact.subType : 'none',
-                  faceId: faceId,
+                  type: 'defaultPlane',
+                  planeId: planeId,
+                  plane: defaultPlaneStrMap[planeId],
+                  zAxis,
+                  yAxis,
                 },
               })
               return
-            })().catch(reportRejection)
+            }
+            const faceId = planeOrFaceId
+            const artifact = engineCommandManager.artifactGraph.get(faceId)
+            const extrusion = getExtrusionFromSuspectedExtrudeSurface(
+              faceId,
+              engineCommandManager.artifactGraph
+            )
+
+            if (artifact?.type !== 'cap' && artifact?.type !== 'wall') return
+
+            const codeRef =
+              artifact.type === 'cap'
+                ? getCapCodeRef(artifact, engineCommandManager.artifactGraph)
+                : getWallCodeRef(artifact, engineCommandManager.artifactGraph)
+
+            const faceInfo = await getFaceDetails(faceId)
+            if (!faceInfo?.origin || !faceInfo?.z_axis || !faceInfo?.y_axis)
+              return
+            const { z_axis, y_axis, origin } = faceInfo
+            const sketchPathToNode = getNodePathFromSourceRange(
+              kclManager.ast,
+              err(codeRef) ? [0, 0] : codeRef.range
+            )
+
+            const extrudePathToNode = !err(extrusion)
+              ? getNodePathFromSourceRange(
+                  kclManager.ast,
+                  extrusion.codeRef.range
+                )
+              : []
+
+            sceneInfra.modelingSend({
+              type: 'Select default plane',
+              data: {
+                type: 'extrudeFace',
+                zAxis: [z_axis.x, z_axis.y, z_axis.z],
+                yAxis: [y_axis.x, y_axis.y, y_axis.z],
+                position: [origin.x, origin.y, origin.z].map(
+                  (num) => num / sceneInfra._baseUnitMultiplier
+                ) as [number, number, number],
+                sketchPathToNode,
+                extrudePathToNode,
+                cap: artifact.type === 'cap' ? artifact.subType : 'none',
+                faceId: faceId,
+              },
+            })
+            return
           }
         : () => {},
     })

src/hooks/useRefreshSettings.ts

@@ -23,8 +23,7 @@ export function useRefreshSettings(routeId: string = PATHS.INDEX) {
   }
 
   useEffect(() => {
-    ctx.settings.send({
-      type: 'Set all settings',
+    ctx.settings.send('Set all settings', {
       settings: routeData,
     })
   }, [])

src/hooks/useStateMachineCommands.ts

@@ -1,5 +1,5 @@
 import { useEffect } from 'react'
-import { AnyStateMachine, Actor, StateFrom } from 'xstate'
+import { AnyStateMachine, InterpreterFrom, StateFrom } from 'xstate'
 import { createMachineCommand } from '../lib/createMachineCommand'
 import { useCommandsContext } from './useCommandsContext'
 import { modelingMachine } from 'machines/modelingMachine'
@@ -15,7 +15,6 @@ import { useKclContext } from 'lang/KclProvider'
 import { useNetworkContext } from 'hooks/useNetworkContext'
 import { NetworkHealthState } from 'hooks/useNetworkStatus'
 import { useAppState } from 'AppState'
-import { getActorNextEvents } from 'lib/utils'
 
 // This might not be necessary, AnyStateMachine from xstate is working
 export type AllMachines =
@@ -31,7 +30,7 @@ interface UseStateMachineCommandsArgs<
   machineId: T['id']
   state: StateFrom<T>
   send: Function
-  actor: Actor<T>
+  actor: InterpreterFrom<T>
   commandBarConfig?: StateMachineCommandSetConfig<T, S>
   allCommandsRequireNetwork?: boolean
   onCancel?: () => void
@@ -60,7 +59,7 @@ export default function useStateMachineCommands<
         overallState !== NetworkHealthState.Weak) ||
       isExecuting ||
       !isStreamReady
-    const newCommands = getActorNextEvents(state)
+    const newCommands = state.nextEvents
       .filter((_) => !allCommandsRequireNetwork || !disableAllButtons)
       .filter((e) => !['done.', 'error.'].some((n) => e.includes(n)))
       .flatMap((type) =>

src/hooks/useToolbarGuards.ts

@@ -3,14 +3,13 @@ import {
   createSetVarNameModal,
 } from 'components/SetVarNameModal'
 import { editorManager, kclManager } from 'lib/singletons'
-import { reportRejection, trap } from 'lib/trap'
+import { trap } from 'lib/trap'
 import { moveValueIntoNewVariable } from 'lang/modifyAst'
 import { isNodeSafeToReplace } from 'lang/queryAst'
 import { useEffect, useState } from 'react'
 import { useModelingContext } from './useModelingContext'
-import { PathToNode, SourceRange } from 'lang/wasm'
+import { PathToNode, SourceRange, parse, recast } from 'lang/wasm'
 import { useKclContext } from 'lang/KclProvider'
-import { toSync } from 'lib/utils'
 
 export const getVarNameModal = createSetVarNameModal(SetVarNameModal)
 
@@ -24,7 +23,8 @@ export function useConvertToVariable(range?: SourceRange) {
   }, [enable])
 
   useEffect(() => {
-    const parsed = ast
+    const parsed = parse(recast(ast))
+    if (trap(parsed)) return
 
     const meta = isNodeSafeToReplace(
       parsed,
@@ -63,7 +63,7 @@ export function useConvertToVariable(range?: SourceRange) {
     }
   }
 
-  editorManager.convertToVariableCallback = toSync(handleClick, reportRejection)
+  editorManager.convertToVariableCallback = handleClick
 
   return { enable, handleClick }
 }

src/index.css

@@ -267,8 +267,7 @@ code {
 }
 
 .segment-length-label-text {
-  transform: translate(var(--x, 0), var(--y, 0)) rotate(var(--degree, 0));
-  @apply font-mono body-bg px-2 pt-0.5 rounded-sm border border-chalkboard-110 dark:border-chalkboard-10;
+  transform: translate(var(--x, 0), var(--y, 0));
 }
 
 @layer components {
@@ -276,7 +275,7 @@ code {
     @apply font-mono text-xs inline-block px-0.5 py-[2px] rounded;
 
     /* This is the only place in our code where layout is impacted by theme.
-     * We may not want that later, if hotkeys are possibly visible
+     * We may not want that later, if hotkeys are possibly visible 
      * while switching theme, but more padding feels better in dark mode.
      */
     @apply dark:px-1;
@@ -288,11 +287,32 @@ code {
 }
 
 @layer utilities {
-  /* 
-    This is where your own custom Tailwind utility classes can go,
-    which lets you use them with @apply in your CSS, and get 
-    autocomplete in classNames in your JSX.
-  */
+  /* Modified from the very helpful https://www.transition.style/#in:circle:hesitate */
+  @keyframes circle-in-hesitate {
+    0% {
+      clip-path: circle(
+        var(--circle-size-start, 0%) at var(--circle-x, 50%)
+          var(--circle-y, 50%)
+      );
+    }
+    40% {
+      clip-path: circle(
+        var(--circle-size-mid, 40%) at var(--circle-x, 50%) var(--circle-y, 50%)
+      );
+    }
+    100% {
+      clip-path: circle(
+        var(--circle-size-end, 125%) at var(--circle-x, 50%)
+          var(--circle-y, 50%)
+      );
+    }
+  }
+
+  .in-circle-hesitate {
+    animation: var(--circle-duration, 2.5s)
+      var(--circle-timing, cubic-bezier(0.25, 1, 0.3, 1)) circle-in-hesitate
+      both;
+  }
 }
 
 #code-mirror-override .cm-scroller,

src/lang/KclSingleton.ts

@@ -60,6 +60,8 @@ export class KclManager {
   private _wasmInitFailedCallback: (arg: boolean) => void = () => {}
   private _executeCallback: () => void = () => {}
 
+  isFirstRender = true
+
   get ast() {
     return this._ast
   }
@@ -129,8 +131,8 @@ export class KclManager {
     if (!isExecuting && this.executeIsStale) {
       const args = this.executeIsStale
       this.executeIsStale = null
-      // eslint-disable-next-line @typescript-eslint/no-floating-promises
       this.executeAst(args)
+    } else {
     }
     this._isExecutingCallback(isExecuting)
   }
@@ -154,7 +156,6 @@ export class KclManager {
   constructor(engineCommandManager: EngineCommandManager) {
     this.engineCommandManager = engineCommandManager
 
-    // eslint-disable-next-line @typescript-eslint/no-floating-promises
     this.ensureWasmInit().then(() => {
       this.ast = this.safeParse(codeManager.code) || this.ast
     })
@@ -401,11 +402,9 @@ export class KclManager {
     // Update the code state and the editor.
     codeManager.updateCodeStateEditor(code)
     // Write back to the file system.
-    // eslint-disable-next-line @typescript-eslint/no-floating-promises
     codeManager.writeToFile()
 
     // execute the code.
-    // eslint-disable-next-line @typescript-eslint/no-floating-promises
     this.executeCode()
   }
   // There's overlapping responsibility between updateAst and executeAst.
@@ -544,7 +543,6 @@ function defaultSelectionFilter(
   programMemory: ProgramMemory,
   engineCommandManager: EngineCommandManager
 ) {
-  // eslint-disable-next-line @typescript-eslint/no-floating-promises
   programMemory.hasSketchOrExtrudeGroup() &&
     engineCommandManager.sendSceneCommand({
       type: 'modeling_cmd_req',

src/lang/langHelpers.ts

@@ -64,7 +64,6 @@ export async function executeAst({
   try {
     if (!useFakeExecutor) {
       engineCommandManager.endSession()
-      // eslint-disable-next-line @typescript-eslint/no-floating-promises
       engineCommandManager.startNewSession()
     }
     const programMemory = await (useFakeExecutor

src/lang/modifyAst.ts

@@ -1,5 +1,5 @@
 import { Selection } from 'lib/selections'
-import { err, reportRejection, trap } from 'lib/trap'
+import { err, trap } from 'lib/trap'
 import {
   Program,
   CallExpression,
@@ -938,119 +938,115 @@ export async function deleteFromSelection(
     const expressionIndex = pathToNode[1][0] as number
     astClone.body.splice(expressionIndex, 1)
     if (extrudeNameToDelete) {
-      await new Promise((resolve) => {
-        ;(async () => {
-          let currentVariableName = ''
-          const pathsDependingOnExtrude: Array<{
-            path: PathToNode
-            sketchName: string
-          }> = []
-          traverse(astClone, {
-            leave: (node) => {
-              if (node.type === 'VariableDeclaration') {
-                currentVariableName = ''
-              }
-            },
-            enter: (node, path) => {
-              ;(async () => {
-                if (node.type === 'VariableDeclaration') {
-                  currentVariableName = node.declarations[0].id.name
-                }
-                if (
-                  // match startSketchOn(${extrudeNameToDelete})
-                  node.type === 'CallExpression' &&
-                  node.callee.name === 'startSketchOn' &&
-                  node.arguments[0].type === 'Identifier' &&
-                  node.arguments[0].name === extrudeNameToDelete
-                ) {
-                  pathsDependingOnExtrude.push({
-                    path,
-                    sketchName: currentVariableName,
-                  })
-                }
-              })().catch(reportRejection)
-            },
-          })
-          const roundLiteral = (x: number) => createLiteral(roundOff(x))
-          const modificationDetails: {
-            parent: PipeExpression['body']
-            faceDetails: Models['FaceIsPlanar_type']
-            lastKey: number
-          }[] = []
-          for (const { path, sketchName } of pathsDependingOnExtrude) {
-            const parent = getNodeFromPath<PipeExpression['body']>(
-              astClone,
-              path.slice(0, -1)
-            )
-            if (err(parent)) {
-              return
+      await new Promise(async (resolve) => {
+        let currentVariableName = ''
+        const pathsDependingOnExtrude: Array<{
+          path: PathToNode
+          sketchName: string
+        }> = []
+        traverse(astClone, {
+          leave: (node) => {
+            if (node.type === 'VariableDeclaration') {
+              currentVariableName = ''
+            }
+          },
+          enter: async (node, path) => {
+            if (node.type === 'VariableDeclaration') {
+              currentVariableName = node.declarations[0].id.name
             }
-            const sketchToPreserve = sketchGroupFromKclValue(
-              programMemory.get(sketchName),
-              sketchName
-            )
-            if (err(sketchToPreserve)) return sketchToPreserve
-            console.log('sketchName', sketchName)
-            // Can't kick off multiple requests at once as getFaceDetails
-            // is three engine calls in one and they conflict
-            const faceDetails = await getFaceDetails(sketchToPreserve.on.id)
             if (
-              !(
-                faceDetails.origin &&
-                faceDetails.x_axis &&
-                faceDetails.y_axis &&
-                faceDetails.z_axis
-              )
+              // match startSketchOn(${extrudeNameToDelete})
+              node.type === 'CallExpression' &&
+              node.callee.name === 'startSketchOn' &&
+              node.arguments[0].type === 'Identifier' &&
+              node.arguments[0].name === extrudeNameToDelete
             ) {
-              return
+              pathsDependingOnExtrude.push({
+                path,
+                sketchName: currentVariableName,
+              })
             }
-            const lastKey = Number(path.slice(-1)[0][0])
-            modificationDetails.push({
-              parent: parent.node,
-              faceDetails,
-              lastKey,
-            })
+          },
+        })
+        const roundLiteral = (x: number) => createLiteral(roundOff(x))
+        const modificationDetails: {
+          parent: PipeExpression['body']
+          faceDetails: Models['FaceIsPlanar_type']
+          lastKey: number
+        }[] = []
+        for (const { path, sketchName } of pathsDependingOnExtrude) {
+          const parent = getNodeFromPath<PipeExpression['body']>(
+            astClone,
+            path.slice(0, -1)
+          )
+          if (err(parent)) {
+            return
           }
-          for (const { parent, faceDetails, lastKey } of modificationDetails) {
-            if (
-              !(
-                faceDetails.origin &&
-                faceDetails.x_axis &&
-                faceDetails.y_axis &&
-                faceDetails.z_axis
-              )
-            ) {
-              continue
-            }
-            parent[lastKey] = createCallExpressionStdLib('startSketchOn', [
-              createObjectExpression({
-                plane: createObjectExpression({
-                  origin: createObjectExpression({
-                    x: roundLiteral(faceDetails.origin.x),
-                    y: roundLiteral(faceDetails.origin.y),
-                    z: roundLiteral(faceDetails.origin.z),
-                  }),
-                  x_axis: createObjectExpression({
-                    x: roundLiteral(faceDetails.x_axis.x),
-                    y: roundLiteral(faceDetails.x_axis.y),
-                    z: roundLiteral(faceDetails.x_axis.z),
-                  }),
-                  y_axis: createObjectExpression({
-                    x: roundLiteral(faceDetails.y_axis.x),
-                    y: roundLiteral(faceDetails.y_axis.y),
-                    z: roundLiteral(faceDetails.y_axis.z),
-                  }),
-                  z_axis: createObjectExpression({
-                    x: roundLiteral(faceDetails.z_axis.x),
-                    y: roundLiteral(faceDetails.z_axis.y),
-                    z: roundLiteral(faceDetails.z_axis.z),
-                  }),
+          const sketchToPreserve = sketchGroupFromKclValue(
+            programMemory.get(sketchName),
+            sketchName
+          )
+          if (err(sketchToPreserve)) return sketchToPreserve
+          console.log('sketchName', sketchName)
+          // Can't kick off multiple requests at once as getFaceDetails
+          // is three engine calls in one and they conflict
+          const faceDetails = await getFaceDetails(sketchToPreserve.on.id)
+          if (
+            !(
+              faceDetails.origin &&
+              faceDetails.x_axis &&
+              faceDetails.y_axis &&
+              faceDetails.z_axis
+            )
+          ) {
+            return
+          }
+          const lastKey = Number(path.slice(-1)[0][0])
+          modificationDetails.push({
+            parent: parent.node,
+            faceDetails,
+            lastKey,
+          })
+        }
+        for (const { parent, faceDetails, lastKey } of modificationDetails) {
+          if (
+            !(
+              faceDetails.origin &&
+              faceDetails.x_axis &&
+              faceDetails.y_axis &&
+              faceDetails.z_axis
+            )
+          ) {
+            continue
+          }
+          parent[lastKey] = createCallExpressionStdLib('startSketchOn', [
+            createObjectExpression({
+              plane: createObjectExpression({
+                origin: createObjectExpression({
+                  x: roundLiteral(faceDetails.origin.x),
+                  y: roundLiteral(faceDetails.origin.y),
+                  z: roundLiteral(faceDetails.origin.z),
+                }),
+                x_axis: createObjectExpression({
+                  x: roundLiteral(faceDetails.x_axis.x),
+                  y: roundLiteral(faceDetails.x_axis.y),
+                  z: roundLiteral(faceDetails.x_axis.z),
+                }),
+                y_axis: createObjectExpression({
+                  x: roundLiteral(faceDetails.y_axis.x),
+                  y: roundLiteral(faceDetails.y_axis.y),
+                  z: roundLiteral(faceDetails.y_axis.z),
+                }),
+                z_axis: createObjectExpression({
+                  x: roundLiteral(faceDetails.z_axis.x),
+                  y: roundLiteral(faceDetails.z_axis.y),
+                  z: roundLiteral(faceDetails.z_axis.z),
                 }),
               }),
-            ])
-          }
-          resolve(true)
-        })().catch(reportRejection)
+            }),
+          ])
+        }
+        resolve(true)
       })
     }
     // await prom

src/lang/modifyAst/addFillet.test.ts

@@ -36,7 +36,7 @@ beforeAll(async () => {
       setMediaStream: () => {},
       setIsStreamReady: () => {},
       modifyGrid: async () => {},
-      callbackOnEngineLiteConnect: () => {
+      callbackOnEngineLiteConnect: async () => {
         resolve(true)
       },
     })

src/lang/modifyAst/addFillet.ts

@@ -49,22 +49,6 @@ export function applyFilletToSelection(
 ): void | Error {
   // 1. get AST
   let ast = kclManager.ast
-
-  // 2. modify ast clone with fillet and tag
-  const result = modifyAstWithFilletAndTag(ast, selection, radius)
-  if (err(result)) return result
-  const { modifiedAst, pathToFilletNode } = result
-
-  // 3. update ast
-  // eslint-disable-next-line @typescript-eslint/no-floating-promises
-  updateAstAndFocus(modifiedAst, pathToFilletNode)
-}
-
-function modifyAstWithFilletAndTag(
-  ast: Program,
-  selection: Selections,
-  radius: KclCommandValue
-): { modifiedAst: Program; pathToFilletNode: PathToNode } | Error {
   const astResult = insertRadiusIntoAst(ast, radius)
   if (err(astResult)) return astResult
 
@@ -93,7 +77,8 @@ function modifyAstWithFilletAndTag(
   if (trap(addFilletResult)) return addFilletResult
   const { modifiedAst, pathToFilletNode } = addFilletResult
 
-  return { modifiedAst, pathToFilletNode }
+  // 4. update ast
+  updateAstAndFocus(modifiedAst, pathToFilletNode)
 }
 
 function insertRadiusIntoAst(

src/lang/std/artifactGraph.test.ts

@@ -124,7 +124,6 @@ beforeAll(async () => {
       setMediaStream: () => {},
       setIsStreamReady: () => {},
       modifyGrid: async () => {},
-      // eslint-disable-next-line @typescript-eslint/no-misused-promises
       callbackOnEngineLiteConnect: async () => {
         const cacheEntries = Object.entries(codeToWriteCacheFor) as [
           CodeKey,

src/lang/std/artifactGraph.ts

@@ -3,8 +3,6 @@ import { Models } from '@kittycad/lib'
 import { getNodePathFromSourceRange } from 'lang/queryAst'
 import { err } from 'lib/trap'
 
-export type ArtifactId = string
-
 interface CommonCommandProperties {
   range: SourceRange
   pathToNode: PathToNode
@@ -12,7 +10,7 @@ interface CommonCommandProperties {
 
 export interface PlaneArtifact {
   type: 'plane'
-  pathIds: Array<ArtifactId>
+  pathIds: Array<string>
   codeRef: CommonCommandProperties
 }
 export interface PlaneArtifactRich {
@@ -23,16 +21,16 @@ export interface PlaneArtifactRich {
 
 export interface PathArtifact {
   type: 'path'
-  planeId: ArtifactId
-  segIds: Array<ArtifactId>
-  extrusionId: ArtifactId
-  solid2dId?: ArtifactId
+  planeId: string
+  segIds: Array<string>
+  extrusionId: string
+  solid2dId?: string
   codeRef: CommonCommandProperties
 }
 
 interface solid2D {
   type: 'solid2D'
-  pathId: ArtifactId
+  pathId: string
 }
 export interface PathArtifactRich {
   type: 'path'
@@ -44,10 +42,10 @@ export interface PathArtifactRich {
 
 interface SegmentArtifact {
   type: 'segment'
-  pathId: ArtifactId
-  surfaceId: ArtifactId
-  edgeIds: Array<ArtifactId>
-  edgeCutId?: ArtifactId
+  pathId: string
+  surfaceId: string
+  edgeIds: Array<string>
+  edgeCutId?: string
   codeRef: CommonCommandProperties
 }
 interface SegmentArtifactRich {
@@ -61,9 +59,9 @@ interface SegmentArtifactRich {
 
 interface ExtrusionArtifact {
   type: 'extrusion'
-  pathId: ArtifactId
-  surfaceIds: Array<ArtifactId>
-  edgeIds: Array<ArtifactId>
+  pathId: string
+  surfaceIds: Array<string>
+  edgeIds: Array<string>
   codeRef: CommonCommandProperties
 }
 interface ExtrusionArtifactRich {
@@ -76,23 +74,23 @@ interface ExtrusionArtifactRich {
 
 interface WallArtifact {
   type: 'wall'
-  segId: ArtifactId
-  edgeCutEdgeIds: Array<ArtifactId>
-  extrusionId: ArtifactId
-  pathIds: Array<ArtifactId>
+  segId: string
+  edgeCutEdgeIds: Array<string>
+  extrusionId: string
+  pathIds: Array<string>
 }
 interface CapArtifact {
   type: 'cap'
   subType: 'start' | 'end'
-  edgeCutEdgeIds: Array<ArtifactId>
-  extrusionId: ArtifactId
-  pathIds: Array<ArtifactId>
+  edgeCutEdgeIds: Array<string>
+  extrusionId: string
+  pathIds: Array<string>
 }
 
 interface ExtrudeEdge {
   type: 'extrudeEdge'
-  segId: ArtifactId
-  extrusionId: ArtifactId
+  segId: string
+  extrusionId: string
   subType: 'opposite' | 'adjacent'
 }
 
@@ -100,16 +98,16 @@ interface ExtrudeEdge {
 interface EdgeCut {
   type: 'edgeCut'
   subType: 'fillet' | 'chamfer'
-  consumedEdgeId: ArtifactId
-  edgeIds: Array<ArtifactId>
-  surfaceId: ArtifactId
+  consumedEdgeId: string
+  edgeIds: Array<string>
+  surfaceId: string
   codeRef: CommonCommandProperties
 }
 
 interface EdgeCutEdge {
   type: 'edgeCutEdge'
-  edgeCutId: ArtifactId
-  surfaceId: ArtifactId
+  edgeCutId: string
+  surfaceId: string
 }
 
 export type Artifact =
@@ -124,7 +122,7 @@ export type Artifact =
   | EdgeCutEdge
   | solid2D
 
-export type ArtifactGraph = Map<ArtifactId, Artifact>
+export type ArtifactGraph = Map<string, Artifact>
 
 export type EngineCommand = Models['WebSocketRequest_type']
 
@@ -151,7 +149,7 @@ export function createArtifactGraph({
   responseMap: ResponseMap
   ast: Program
 }) {
-  const myMap = new Map<ArtifactId, Artifact>()
+  const myMap = new Map<string, Artifact>()
 
   /** see docstring for {@link getArtifactsToUpdate} as to why this is needed */
   let currentPlaneId = ''
@@ -168,7 +166,7 @@ export function createArtifactGraph({
     const artifactsToUpdate = getArtifactsToUpdate({
       orderedCommand,
       responseMap,
-      getArtifact: (id: ArtifactId) => myMap.get(id),
+      getArtifact: (id: string) => myMap.get(id),
       currentPlaneId,
       ast,
     })
@@ -226,11 +224,11 @@ export function getArtifactsToUpdate({
   orderedCommand: OrderedCommand
   responseMap: ResponseMap
   /** Passing in a getter because we don't wan this function to update the map directly */
-  getArtifact: (id: ArtifactId) => Artifact | undefined
-  currentPlaneId: ArtifactId
+  getArtifact: (id: string) => Artifact | undefined
+  currentPlaneId: string
   ast: Program
 }): Array<{
-  id: ArtifactId
+  id: string
   artifact: Artifact
 }> {
   const pathToNode = getNodePathFromSourceRange(ast, range)
@@ -516,7 +514,7 @@ export function filterArtifacts<T extends Artifact['type'][]>(
         (!predicate ||
           predicate(value as Extract<Artifact, { type: T[number] }>))
     )
-  ) as Map<ArtifactId, Extract<Artifact, { type: T[number] }>>
+  ) as Map<string, Extract<Artifact, { type: T[number] }>>
 }
 
 export function getArtifactsOfTypes<T extends Artifact['type'][]>(
@@ -530,7 +528,7 @@ export function getArtifactsOfTypes<T extends Artifact['type'][]>(
     predicate?: (value: Extract<Artifact, { type: T[number] }>) => boolean
   },
   map: ArtifactGraph
-): Map<ArtifactId, Extract<Artifact, { type: T[number] }>> {
+): Map<string, Extract<Artifact, { type: T[number] }>> {
   return new Map(
     [...map].filter(
       ([key, value]) =>
@@ -539,7 +537,7 @@ export function getArtifactsOfTypes<T extends Artifact['type'][]>(
         (!predicate ||
           predicate(value as Extract<Artifact, { type: T[number] }>))
     )
-  ) as Map<ArtifactId, Extract<Artifact, { type: T[number] }>>
+  ) as Map<string, Extract<Artifact, { type: T[number] }>>
 }
 
 export function getArtifactOfTypes<T extends Artifact['type'][]>(
@@ -547,7 +545,7 @@ export function getArtifactOfTypes<T extends Artifact['type'][]>(
     key,
     types,
   }: {
-    key: ArtifactId
+    key: string
     types: T
   },
   map: ArtifactGraph
@@ -720,7 +718,7 @@ export function getExtrudeEdgeCodeRef(
 }
 
 export function getExtrusionFromSuspectedExtrudeSurface(
-  id: ArtifactId,
+  id: string,
   artifactGraph: ArtifactGraph
 ): ExtrusionArtifact | Error {
   const artifact = getArtifactOfTypes(
@@ -735,7 +733,7 @@ export function getExtrusionFromSuspectedExtrudeSurface(
 }
 
 export function getExtrusionFromSuspectedPath(
-  id: ArtifactId,
+  id: string,
   artifactGraph: ArtifactGraph
 ): ExtrusionArtifact | Error {
   const path = getArtifactOfTypes({ key: id, types: ['path'] }, artifactGraph)

src/lang/std/engineConnection.ts

@@ -18,7 +18,6 @@ import toast from 'react-hot-toast'
 import { SettingsViaQueryString } from 'lib/settings/settingsTypes'
 import { EXECUTE_AST_INTERRUPT_ERROR_MESSAGE } from 'lib/constants'
 import { KclManager } from 'lang/KclSingleton'
-import { reportRejection } from 'lib/trap'
 
 // TODO(paultag): This ought to be tweakable.
 const pingIntervalMs = 5_000
@@ -389,12 +388,11 @@ class EngineConnection extends EventTarget {
         default:
           if (this.isConnecting()) break
           // Means we never could do an initial connection. Reconnect everything.
-          if (!this.pingPongSpan.ping) this.connect().catch(reportRejection)
+          if (!this.pingPongSpan.ping) this.connect()
           break
       }
     }, pingIntervalMs)
 
-    // eslint-disable-next-line @typescript-eslint/no-floating-promises
     this.connect()
   }
 
@@ -1254,10 +1252,6 @@ export type CommandLog =
       type: 'execution-done'
       data: null
     }
-  | {
-      type: 'export-done'
-      data: null
-    }
 
 export enum EngineCommandManagerEvents {
   // engineConnection is available but scene setup may not have run
@@ -1466,7 +1460,6 @@ export class EngineCommandManager extends EventTarget {
       })
     )
 
-    // eslint-disable-next-line @typescript-eslint/no-misused-promises
     this.onEngineConnectionOpened = async () => {
       // Set the stream background color
       // This takes RGBA values from 0-1
@@ -1483,7 +1476,6 @@ export class EngineCommandManager extends EventTarget {
 
       // Sets the default line colors
       const opposingTheme = getOppositeTheme(this.settings.theme)
-      // eslint-disable-next-line @typescript-eslint/no-floating-promises
       this.sendSceneCommand({
         cmd_id: uuidv4(),
         type: 'modeling_cmd_req',
@@ -1494,7 +1486,6 @@ export class EngineCommandManager extends EventTarget {
       })
 
       // Set the edge lines visibility
-      // eslint-disable-next-line @typescript-eslint/no-floating-promises
       this.sendSceneCommand({
         type: 'modeling_cmd_req',
         cmd_id: uuidv4(),
@@ -1505,7 +1496,6 @@ export class EngineCommandManager extends EventTarget {
       })
 
       this._camControlsCameraChange()
-      // eslint-disable-next-line @typescript-eslint/no-floating-promises
       this.sendSceneCommand({
         // CameraControls subscribes to default_camera_get_settings response events
         // firing this at connection ensure the camera's are synced initially
@@ -1518,7 +1508,6 @@ export class EngineCommandManager extends EventTarget {
       // 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
-      // eslint-disable-next-line @typescript-eslint/no-floating-promises
       this.modifyGrid(!this.settings.showScaleGrid)?.then(async () => {
         await this.initPlanes()
         setIsStreamReady(true)
@@ -1722,7 +1711,6 @@ export class EngineCommandManager extends EventTarget {
         this.onEngineConnectionNewTrack as EventListener
       )
 
-      // eslint-disable-next-line @typescript-eslint/no-floating-promises
       this.engineConnection?.connect()
     }
     this.engineConnection.addEventListener(
@@ -1930,13 +1918,7 @@ export class EngineCommandManager extends EventTarget {
     } else if (cmd.type === 'export') {
       const promise = new Promise<null>((resolve, reject) => {
         this.pendingExport = {
-          resolve: (passThrough) => {
-            this.addCommandLog({
-              type: 'export-done',
-              data: null,
-            })
-            resolve(passThrough)
-          },
+          resolve,
           reject: (reason: string) => {
             this.exportIntent = null
             reject(reason)
@@ -2133,7 +2115,6 @@ export class EngineCommandManager extends EventTarget {
    * @param visible - whether to show or hide the scale grid
    */
   setScaleGridVisibility(visible: boolean) {
-    // eslint-disable-next-line @typescript-eslint/no-floating-promises
     this.modifyGrid(!visible)
   }
 

src/lang/wasm.ts

@@ -95,6 +95,8 @@ export const wasmUrl = () => {
       document.location.pathname.split('/').slice(0, -1).join('/') +
       '/wasm_lib_bg.wasm'
 
+  console.log(`Full URL for WASM: ${fullUrl}`)
+
   return fullUrl
 }
 
@@ -360,7 +362,6 @@ export const executor = async (
 ): Promise<ProgramMemory> => {
   if (err(programMemory)) return Promise.reject(programMemory)
 
-  // eslint-disable-next-line @typescript-eslint/no-floating-promises
   engineCommandManager.startNewSession()
   const _programMemory = await _executor(
     node,
@@ -570,7 +571,6 @@ export async function coreDump(
        a new GitHub issue for the user.
      */
     if (openGithubIssue && dump.github_issue_url) {
-      // eslint-disable-next-line @typescript-eslint/no-floating-promises
       openWindow(dump.github_issue_url)
     } else {
       console.error(

src/lib/cameraControls.ts

@@ -6,7 +6,7 @@ const META =
   PLATFORM === 'macos' ? 'Cmd' : PLATFORM === 'windows' ? 'Win' : 'Super'
 const ALT = PLATFORM === 'macos' ? 'Option' : 'Alt'
 
-const noModifiersPressed = (e: React.MouseEvent | MouseEvent) =>
+const noModifiersPressed = (e: React.MouseEvent) =>
   !e.ctrlKey && !e.shiftKey && !e.altKey && !e.metaKey
 
 export type CameraSystem =
@@ -53,14 +53,14 @@ export function mouseControlsToCameraSystem(
 
 interface MouseGuardHandler {
   description: string
-  callback: (e: React.MouseEvent | MouseEvent) => boolean
+  callback: (e: React.MouseEvent) => boolean
   lenientDragStartButton?: number
 }
 
 interface MouseGuardZoomHandler {
   description: string
-  dragCallback: (e: React.MouseEvent | MouseEvent) => boolean
-  scrollCallback: (e: React.MouseEvent | MouseEvent) => boolean
+  dragCallback: (e: React.MouseEvent) => boolean
+  scrollCallback: (e: React.MouseEvent) => boolean
   lenientDragStartButton?: number
 }
 
@@ -70,7 +70,7 @@ export interface MouseGuard {
   rotate: MouseGuardHandler
 }
 
-export const btnName = (e: React.MouseEvent | MouseEvent) => ({
+export const btnName = (e: React.MouseEvent) => ({
   middle: !!(e.buttons & 4) || e.button === 1,
   right: !!(e.buttons & 2) || e.button === 2,
   left: !!(e.buttons & 1) || e.button === 0,