fix unrelated test

* get pixel colour for e2e tests

* remove cleverness

.github/workflows/playwright.yml

@@ -46,12 +46,20 @@ jobs:
     - uses: KittyCAD/action-install-cli@main
     - name: Install dependencies
       run: yarn
+    - name: Cache Playwright Browsers
+      uses: actions/cache@v3
+      with:
+        path: |
+          ~/.cache/ms-playwright
+        key: ${{ runner.os }}-playwright-${{ hashFiles('**/package-lock.json') }}
+        restore-keys: |
+          ${{ runner.os }}-playwright-
     - name: Install Playwright Browsers
       run: yarn playwright install --with-deps
     - name: Download Wasm Cache
       id: download-wasm
       if: needs.check-rust-changes.outputs.rust-changed == 'false'
-      uses: dawidd6/action-download-artifact@v3
+      uses: dawidd6/action-download-artifact@v4
       continue-on-error: true
       with:
         github_token: ${{secrets.GITHUB_TOKEN}}
@@ -143,12 +151,20 @@ jobs:
         cache: 'yarn'
     - name: Install dependencies
       run: yarn
+    - name: Cache Playwright Browsers
+      uses: actions/cache@v3
+      with:
+        path: |
+          ~/.cache/ms-playwright
+        key: ${{ runner.os }}-playwright-${{ hashFiles('**/package-lock.json') }}
+        restore-keys: |
+          ${{ runner.os }}-playwright-
     - name: Install Playwright Browsers
       run: yarn playwright install --with-deps
     - name: Download Wasm Cache
       id: download-wasm
       if: needs.check-rust-changes.outputs.rust-changed == 'false'
-      uses: dawidd6/action-download-artifact@v3
+      uses: dawidd6/action-download-artifact@v4
       continue-on-error: true
       with:
         github_token: ${{secrets.GITHUB_TOKEN}}

Makefile

@@ -0,0 +1,14 @@
+.PHONY: dev
+
+WASM_LIB_FILES := $(wildcard src/wasm-lib/**/*.rs)
+
+dev: node_modules public/wasm_lib_bg.wasm
+	yarn start
+
+public/wasm_lib_bg.wasm: $(WASM_LIB_FILES)
+	yarn build:wasm-dev
+
+node_modules: package.json
+
+package.json:
+	yarn install

README.md

@@ -197,28 +197,32 @@ For more information on fuzzing you can check out
 
 ### Playwright
 
-First time running plawright locally, you'll need to add the secrets file
+For a portable way to run Playwright you'll need Docker.
+
+After that, open a terminal and run:
 
 ```bash
-touch ./e2e/playwright/playwright-secrets.env
-printf 'token="your-token"\nsnapshottoken="your-snapshot-token"' > ./e2e/playwright/playwright-secrets.env
+docker run --network host  --rm --init -it playwright/chrome:playwright-1.43.1
 ```
 
+and in another terminal, run:
+
+```bash
+PW_TEST_CONNECT_WS_ENDPOINT=ws://127.0.0.1:4444/ yarn playwright test --project="Google Chrome" <test suite>
+```
+
+An example of a `<test suite>` is: `e2e/playwright/flow-tests.spec.ts`
+
+YOU WILL NEED A PLAYWRIGHT-SECRETS.ENV FILE:
+
+
+```bash
+# ./e2e/playwright/playwright-secrets.env
+token=<your-token>
+snapshottoken=<your-snapshot-token>
+```
 then replace "your-token" with a dev token from dev.zoo.dev/account/api-tokens
 
-then:
-run playwright
-
-```
-yarn playwright test
-```
-
-run a specific test suite
-
-```
-yarn playwright test src/e2e-tests/example.spec.ts
-```
-
 run a specific test change the test from `test('...` to `test.only('...`
 (note if you commit this, the tests will instantly fail without running any of the tests)
 

e2e/playwright/snapshot-tests.spec.ts

@@ -406,7 +406,7 @@ test('Draft segments should look right', async ({ page, context }) => {
   await page.mouse.click(700, 200)
 
   await expect(page.locator('.cm-content')).toHaveText(
-    `const part001 = startSketchOn('XZ')`
+    `const sketch001 = startSketchOn('XZ')`
   )
 
   await page.waitForTimeout(300) // TODO detect animation ending, or disable animation
@@ -414,7 +414,7 @@ test('Draft segments should look right', async ({ page, context }) => {
   const startXPx = 600
   await page.mouse.click(startXPx + PUR * 10, 500 - PUR * 10)
   await expect(page.locator('.cm-content'))
-    .toHaveText(`const part001 = startSketchOn('XZ')
+    .toHaveText(`const sketch001 = startSketchOn('XZ')
   |> startProfileAt([9.06, -12.22], %)`)
   await page.waitForTimeout(100)
 
@@ -428,7 +428,7 @@ test('Draft segments should look right', async ({ page, context }) => {
   await page.waitForTimeout(100)
 
   await expect(page.locator('.cm-content'))
-    .toHaveText(`const part001 = startSketchOn('XZ')
+    .toHaveText(`const sketch001 = startSketchOn('XZ')
   |> startProfileAt([9.06, -12.22], %)
   |> line([9.14, 0], %)`)
 
@@ -465,7 +465,7 @@ test('Draft rectangles should look right', async ({ page, context }) => {
   await page.mouse.click(700, 200)
 
   await expect(page.locator('.cm-content')).toHaveText(
-    `const part001 = startSketchOn('XZ')`
+    `const sketch001 = startSketchOn('XZ')`
   )
 
   await page.waitForTimeout(500) // TODO detect animation ending, or disable animation
@@ -514,7 +514,7 @@ test.describe('Client side scene scale should match engine scale', () => {
     await page.mouse.click(700, 200)
 
     await expect(page.locator('.cm-content')).toHaveText(
-      `const part001 = startSketchOn('XZ')`
+      `const sketch001 = startSketchOn('XZ')`
     )
 
     await page.waitForTimeout(300) // TODO detect animation ending, or disable animation
@@ -522,7 +522,7 @@ test.describe('Client side scene scale should match engine scale', () => {
     const startXPx = 600
     await page.mouse.click(startXPx + PUR * 10, 500 - PUR * 10)
     await expect(page.locator('.cm-content'))
-      .toHaveText(`const part001 = startSketchOn('XZ')
+      .toHaveText(`const sketch001 = startSketchOn('XZ')
     |> startProfileAt([9.06, -12.22], %)`)
     await page.waitForTimeout(100)
 
@@ -532,7 +532,7 @@ test.describe('Client side scene scale should match engine scale', () => {
     await page.waitForTimeout(100)
 
     await expect(page.locator('.cm-content'))
-      .toHaveText(`const part001 = startSketchOn('XZ')
+      .toHaveText(`const sketch001 = startSketchOn('XZ')
     |> startProfileAt([9.06, -12.22], %)
     |> line([9.14, 0], %)`)
 
@@ -542,7 +542,7 @@ test.describe('Client side scene scale should match engine scale', () => {
     await page.mouse.click(startXPx + PUR * 30, 500 - PUR * 20)
 
     await expect(page.locator('.cm-content'))
-      .toHaveText(`const part001 = startSketchOn('XZ')
+      .toHaveText(`const sketch001 = startSketchOn('XZ')
     |> startProfileAt([9.06, -12.22], %)
     |> line([9.14, 0], %)
     |> tangentialArcTo([27.34, -3.08], %)`)
@@ -617,7 +617,7 @@ test.describe('Client side scene scale should match engine scale', () => {
     await page.mouse.click(700, 200)
 
     await expect(page.locator('.cm-content')).toHaveText(
-      `const part001 = startSketchOn('XZ')`
+      `const sketch001 = startSketchOn('XZ')`
     )
 
     await page.waitForTimeout(300) // TODO detect animation ending, or disable animation
@@ -625,7 +625,7 @@ test.describe('Client side scene scale should match engine scale', () => {
     const startXPx = 600
     await page.mouse.click(startXPx + PUR * 10, 500 - PUR * 10)
     await expect(page.locator('.cm-content'))
-      .toHaveText(`const part001 = startSketchOn('XZ')
+      .toHaveText(`const sketch001 = startSketchOn('XZ')
       |> startProfileAt([230.03, -310.32], %)`)
     await page.waitForTimeout(100)
 
@@ -635,7 +635,7 @@ test.describe('Client side scene scale should match engine scale', () => {
     await page.waitForTimeout(100)
 
     await expect(page.locator('.cm-content'))
-      .toHaveText(`const part001 = startSketchOn('XZ')
+      .toHaveText(`const sketch001 = startSketchOn('XZ')
       |> startProfileAt([230.03, -310.32], %)
       |> line([232.2, 0], %)`)
 
@@ -645,7 +645,7 @@ test.describe('Client side scene scale should match engine scale', () => {
     await page.mouse.click(startXPx + PUR * 30, 500 - PUR * 20)
 
     await expect(page.locator('.cm-content'))
-      .toHaveText(`const part001 = startSketchOn('XZ')
+      .toHaveText(`const sketch001 = startSketchOn('XZ')
       |> startProfileAt([230.03, -310.32], %)
       |> line([232.2, 0], %)
       |> tangentialArcTo([694.43, -78.12], %)`)

e2e/playwright/test-utils.ts

@@ -1,5 +1,6 @@
 import { test, expect, Page, Download } from '@playwright/test'
 import { EngineCommand } from '../../src/lang/std/engineConnection'
+import os from 'os'
 import fsp from 'fs/promises'
 import pixelMatch from 'pixelmatch'
 import { PNG } from 'pngjs'
@@ -96,6 +97,74 @@ async function waitForCmdReceive(page: Page, commandType: string) {
     .waitFor()
 }
 
+export const wiggleMove = async (
+  page: any,
+  x: number,
+  y: number,
+  steps: number,
+  dist: number,
+  ang: number,
+  amplitude: number,
+  freq: number
+) => {
+  const tau = Math.PI * 2
+  const deg = tau / 360
+  const step = dist / steps
+  for (let i = 0, j = 0; i < dist; i += step, j += 1) {
+    const [x1, y1] = [0, Math.sin((tau / steps) * j * freq) * amplitude]
+    const [x2, y2] = [
+      Math.cos(-ang * deg) * i - Math.sin(-ang * deg) * y1,
+      Math.sin(-ang * deg) * i + Math.cos(-ang * deg) * y1,
+    ]
+    const [xr, yr] = [x2, y2]
+    await page.mouse.move(x + xr, y + yr, { steps: 2 })
+  }
+}
+
+export const getMovementUtils = (opts: any) => {
+  // The way we truncate is kinda odd apparently, so we need this function
+  // "[k]itty[c]ad round"
+  const kcRound = (n: number) => Math.trunc(n * 100) / 100
+
+  // To translate between screen and engine ("[U]nit") coordinates
+  // NOTE: these pretty much can't be perfect because of screen scaling.
+  // Handle on a case-by-case.
+  const toU = (x: number, y: number) => [
+    kcRound(x * 0.0854),
+    kcRound(-y * 0.0854), // Y is inverted in our coordinate system
+  ]
+
+  // Turn the array into a string with specific formatting
+  const fromUToString = (xy: number[]) => `[${xy[0]}, ${xy[1]}]`
+
+  // Combine because used often
+  const toSU = (xy: number[]) => fromUToString(toU(xy[0], xy[1]))
+
+  // Make it easier to click around from center ("click [from] zero zero")
+  const click00 = (x: number, y: number) =>
+    opts.page.mouse.click(opts.center.x + x, opts.center.y + y)
+
+  // Relative clicker, must keep state
+  let last = { x: 0, y: 0 }
+  const click00r = (x?: number, y?: number) => {
+    // reset relative coordinates when anything is undefined
+    if (x === undefined || y === undefined) {
+      last.x = 0
+      last.y = 0
+      return
+    }
+
+    const ret = click00(last.x + x, last.y + y)
+    last.x += x
+    last.y += y
+
+    // Returns the new absolute coordinate if you need it.
+    return ret.then(() => [last.x, last.y])
+  }
+
+  return { toSU, click00r }
+}
+
 export async function getUtils(page: Page) {
   // Chrome devtools protocol session only works in Chromium
   const browserType = page.context().browser()?.browserType().name()
@@ -141,15 +210,20 @@ export async function getUtils(page: Page) {
       const angleXOffset = Math.cos(((angle - 180) * Math.PI) / 180) * px
       const angleYOffset = Math.sin(((angle - 180) * Math.PI) / 180) * px
       return {
-        x: bbox.x + angleXOffset,
-        y: bbox.y - angleYOffset,
+        x: Math.round(bbox.x + angleXOffset),
+        y: Math.round(bbox.y - angleYOffset),
       }
     },
+    getAngle: async (locator: string) => {
+      const overlay = page.locator(locator)
+      return Number(await overlay.getAttribute('data-overlay-angle'))
+    },
     getBoundingBox: async (locator: string) =>
       page
         .locator(locator)
         .boundingBox()
-        .then((box) => ({ x: box?.x || 0, y: box?.y || 0 })),
+        .then((box) => ({ ...box, x: box?.x || 0, y: box?.y || 0 })),
+    codeLocator: page.locator('.cm-content'),
     doAndWaitForCmd: async (
       fn: () => Promise<void>,
       commandType: string,
@@ -165,6 +239,30 @@ export async function getUtils(page: Page) {
         await closeDebugPanel(page)
       }
     },
+    /**
+     * Given an expected RGB value, diff if the channel with the largest difference
+     */
+    getGreatestPixDiff: async (
+      coords: { x: number; y: number },
+      expected: [number, number, number]
+    ): Promise<number> => {
+      const buffer = await page.screenshot({
+        fullPage: true,
+      })
+      const screenshot = await PNG.sync.read(buffer)
+      // most likely related to pixel density but the screenshots for webkit are 2x the size
+      // there might be a more robust way of doing this.
+      const pixMultiplier = browserType === 'webkit' ? 2 : 1
+      const index =
+        (screenshot.width * coords.y * pixMultiplier +
+          coords.x * pixMultiplier) *
+        4 // rbga is 4 channels
+      return Math.max(
+        Math.abs(screenshot.data[index] - expected[0]),
+        Math.abs(screenshot.data[index + 1] - expected[1]),
+        Math.abs(screenshot.data[index + 2] - expected[2])
+      )
+    },
     doAndWaitForImageDiff: (fn: () => Promise<any>, diffCount = 200) =>
       new Promise(async (resolve) => {
         await page.screenshot({
@@ -366,3 +464,8 @@ export const doExport = async (
     outputType: output.type,
   }
 }
+
+/**
+ * Gets the appropriate modifier key for the platform.
+ */
+export const metaModifier = os.platform() === 'darwin' ? 'Meta' : 'Control'

package.json

@@ -10,7 +10,7 @@
     "@fortawesome/react-fontawesome": "^0.2.0",
     "@headlessui/react": "^1.7.19",
     "@headlessui/tailwindcss": "^0.2.0",
-    "@kittycad/lib": "^0.0.63",
+    "@kittycad/lib": "^0.0.64",
     "@lezer/javascript": "^1.4.9",
     "@open-rpc/client-js": "^1.8.1",
     "@react-hook/resize-observer": "^2.0.1",
@@ -95,7 +95,8 @@
     "lint": "eslint --fix src",
     "bump-jsons": "echo \"$(jq --arg v \"$VERSION\" '.version=$v' package.json --indent 2)\" > package.json && echo \"$(jq --arg v \"$VERSION\" '.version=$v' src-tauri/tauri.conf.json --indent 2)\" > src-tauri/tauri.conf.json",
     "postinstall": "yarn xstate:typegen",
-    "xstate:typegen": "yarn xstate typegen \"src/**/*.ts?(x)\""
+    "xstate:typegen": "yarn xstate typegen \"src/**/*.ts?(x)\"",
+    "make:dev": "make dev"
   },
   "prettier": {
     "trailingComma": "es5",

playwright.config.ts

@@ -12,12 +12,12 @@ import { defineConfig, devices } from '@playwright/test'
 export default defineConfig({
   testDir: './e2e/playwright',
   /* Run tests in files in parallel */
-  fullyParallel: true,
+  fullyParallel: false,
   /* Fail the build on CI if you accidentally left test.only in the source code. */
   forbidOnly: !!process.env.CI,
   /* Retry on CI only */
   retries: process.env.CI ? 3 : 0,
-  /* Opt out of parallel tests on CI. */
+  /* Different amount of parallelism on CI and local. */
   workers: process.env.CI ? 1 : 1,
   /* Reporter to use. See https://playwright.dev/docs/test-reporters */
   reporter: 'html',
@@ -34,7 +34,14 @@ export default defineConfig({
   projects: [
     {
       name: 'Google Chrome',
-      use: { ...devices['Desktop Chrome'], channel: 'chrome' }, // or 'chrome-beta'
+      use: {
+        ...devices['Desktop Chrome'],
+        channel: 'chrome',
+        contextOptions: {
+          /* Chromium is the only one with these permission types */
+          permissions: ['clipboard-write', 'clipboard-read'],
+        },
+      }, // or 'chrome-beta'
     },
     {
       name: 'webkit',
@@ -72,7 +79,7 @@ export default defineConfig({
 
   /* Run your local dev server before starting the tests */
   webServer: {
-    command: 'yarn serve',
+    command: 'yarn start',
     // url: 'http://127.0.0.1:3000',
     reuseExistingServer: !process.env.CI,
   },

src/Router.tsx

@@ -12,6 +12,8 @@ import SignIn from './routes/SignIn'
 import { Auth } from './Auth'
 import { isTauri } from './lib/isTauri'
 import Home from './routes/Home'
+import { NetworkContext } from './hooks/useNetworkContext'
+import { useNetworkStatus } from './hooks/useNetworkStatus'
 import makeUrlPathRelative from './lib/makeUrlPathRelative'
 import DownloadAppBanner from 'components/DownloadAppBanner'
 import { WasmErrBanner } from 'components/WasmErrBanner'
@@ -155,5 +157,11 @@ const router = createBrowserRouter([
  * @returns RouterProvider
  */
 export const Router = () => {
-  return <RouterProvider router={router} />
+  const networkStatus = useNetworkStatus()
+
+  return (
+    <NetworkContext.Provider value={networkStatus}>
+      <RouterProvider router={router} />
+    </NetworkContext.Provider>
+  )
 }

src/Toolbar.tsx

@@ -3,13 +3,11 @@ import { isCursorInSketchCommandRange } from 'lang/util'
 import { engineCommandManager, kclManager } from 'lib/singletons'
 import { useModelingContext } from 'hooks/useModelingContext'
 import { useCommandsContext } from 'hooks/useCommandsContext'
+import { useNetworkContext } from 'hooks/useNetworkContext'
+import { NetworkHealthState } from 'hooks/useNetworkStatus'
 import { ActionButton } from 'components/ActionButton'
 import { isSingleCursorInPipe } from 'lang/queryAst'
 import { useKclContext } from 'lang/KclProvider'
-import {
-  NetworkHealthState,
-  useNetworkStatus,
-} from 'components/NetworkHealthIndicator'
 import { useStore } from 'useStore'
 import { ActionButtonDropdown } from 'components/ActionButtonDropdown'
 import { useHotkeys } from 'react-hotkeys-hook'
@@ -38,14 +36,16 @@ export function Toolbar({
   }, [engineCommandManager.artifactMap, context.selectionRanges])
 
   const toolbarButtonsRef = useRef<HTMLUListElement>(null)
-
-  const { overallState } = useNetworkStatus()
+  const { overallState } = useNetworkContext()
   const { isExecuting } = useKclContext()
   const { isStreamReady } = useStore((s) => ({
     isStreamReady: s.isStreamReady,
   }))
   const disableAllButtons =
-    overallState !== NetworkHealthState.Ok || isExecuting || !isStreamReady
+    (overallState !== NetworkHealthState.Ok &&
+      overallState !== NetworkHealthState.Weak) ||
+    isExecuting ||
+    !isStreamReady
 
   useHotkeys(
     'l',

src/clientSideScene/sceneEntities.ts

@@ -93,7 +93,10 @@ import { createGridHelper, orthoScale, perspScale } from './helpers'
 import { Models } from '@kittycad/lib'
 import { uuidv4 } from 'lib/utils'
 import { SegmentOverlayPayload, SketchDetails } from 'machines/modelingMachine'
-import { EngineCommandManager } from 'lang/std/engineConnection'
+import {
+  ArtifactMapCommand,
+  EngineCommandManager,
+} from 'lang/std/engineConnection'
 import {
   getRectangleCallExpressions,
   updateRectangleSketch,
@@ -759,14 +762,6 @@ export class SceneEntities {
 
           _ast = parse(recast(_ast))
 
-          console.log('onClick', {
-            sketchInit: sketchInit,
-            _ast,
-            x,
-            y,
-            truncatedAst,
-          })
-
           // Update the primary AST and unequip the rectangle tool
           await kclManager.executeAstMock(_ast)
           sceneInfra.modelingSend({ type: 'CancelSketch' })
@@ -1422,6 +1417,30 @@ export class SceneEntities {
             return ['plane', entity_id]
           }
           const artifact = this.engineCommandManager.artifactMap[entity_id]
+          // If we clicked on an extrude wall, we climb up the parent Id
+          // to get the sketch profile's face ID. If we clicked on an endcap,
+          // we already have it.
+          const targetId =
+            'additionalData' in artifact &&
+            artifact.additionalData?.type === 'cap'
+              ? entity_id
+              : artifact.parentId
+
+          // tsc cannot infer that target can have extrusions
+          // from the commandType (why?) so we need to cast it
+          const target = this.engineCommandManager.artifactMap?.[
+            targetId || ''
+          ] as ArtifactMapCommand & { extrusions?: string[] }
+
+          // TODO: We get the first extrusion command ID,
+          // which is fine while backend systems only support one extrusion.
+          // but we need to more robustly handle resolving to the correct extrusion
+          // if there are multiple.
+          const extrusions =
+            this.engineCommandManager.artifactMap?.[
+              target?.extrusions?.[0] || ''
+            ]
+
           if (artifact?.commandType !== 'solid3d_get_extrusion_face_info')
             return ['other', entity_id]
 
@@ -1429,10 +1448,13 @@ export class SceneEntities {
           if (!faceInfo?.origin || !faceInfo?.z_axis || !faceInfo?.y_axis)
             return ['other', entity_id]
           const { z_axis, y_axis, origin } = faceInfo
-          const pathToNode = getNodePathFromSourceRange(
+          const sketchPathToNode = getNodePathFromSourceRange(
             kclManager.ast,
             artifact.range
           )
+          const extrudePathToNode = extrusions?.range
+            ? getNodePathFromSourceRange(kclManager.ast, extrusions.range)
+            : []
 
           sceneInfra.modelingSend({
             type: 'Select default plane',
@@ -1443,7 +1465,8 @@ export class SceneEntities {
               position: [origin.x, origin.y, origin.z].map(
                 (num) => num / sceneInfra._baseUnitMultiplier
               ) as [number, number, number],
-              extrudeSegmentPathToNode: pathToNode,
+              sketchPathToNode,
+              extrudePathToNode,
               cap:
                 artifact?.additionalData?.type === 'cap'
                   ? artifact.additionalData.info
@@ -1455,7 +1478,6 @@ export class SceneEntities {
         }
 
         const faceResult = await checkExtrudeFaceClick()
-        console.log('faceResult', faceResult)
         if (faceResult[0] === 'face') return
 
         if (!args || !args.intersects?.[0]) return

src/components/CustomIcon.tsx

@@ -257,6 +257,14 @@ const CustomIconMap = {
       />
     </svg>
   ),
+  keyboard: (
+    <svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+      <path
+        d="M16 12V15H13.5M16 12V9M16 12H13.5M4 12V15H6.5M4 12V9M4 12H6.5M4 9V6H6.5M4 9H6.5M16 9V6H13.5M16 9H13.5M6.5 12V15M6.5 12H7.5M6.5 15H13.5M13.5 15V12M13.5 12H12.5M7.5 12V9M7.5 12H10M7.5 9H8.75M7.5 9H6.5M10 12V9M10 12H12.5M10 9H11.25M10 9H8.75M12.5 12V9M12.5 9H13.5M12.5 9H11.25M13.5 9V6M13.5 6H11.25M11.25 9V6M11.25 6H8.75M8.75 9V6M8.75 6H6.5M6.5 9V6"
+        stroke="currentColor"
+      />
+    </svg>
+  ),
   line: (
     <svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
       <path

src/components/HelpMenu.tsx

@@ -81,6 +81,12 @@ export function HelpMenu(props: React.PropsWithChildren) {
         >
           Release notes
         </HelpMenuItem>
+        <HelpMenuItem
+          as="button"
+          onClick={() => navigate('settings?tab=keybindings')}
+        >
+          Keyboard shortcuts
+        </HelpMenuItem>
         <HelpMenuItem
           as="button"
           onClick={() => {

src/components/Loading.tsx

@@ -1,14 +1,65 @@
 import { useEffect, useState } from 'react'
 
+import {
+  EngineConnectionStateType,
+  DisconnectingType,
+  EngineCommandManagerEvents,
+  EngineConnectionEvents,
+  ConnectionError,
+  CONNECTION_ERROR_TEXT,
+} from '../lang/std/engineConnection'
+
+import { engineCommandManager } from '../lib/singletons'
+
 const Loading = ({ children }: React.PropsWithChildren) => {
-  const [hasLongLoadTime, setHasLongLoadTime] = useState(false)
+  const [error, setError] = useState<ConnectionError>(ConnectionError.Unset)
+
   useEffect(() => {
+    const onConnectionStateChange = ({ detail: state }: CustomEvent) => {
+      if (
+        (state.type !== EngineConnectionStateType.Disconnected ||
+          state.type !== EngineConnectionStateType.Disconnecting) &&
+        state.value?.type !== DisconnectingType.Error
+      )
+        return
+      setError(state.value.value.error)
+    }
+
+    const onEngineAvailable = ({ detail: engineConnection }: CustomEvent) => {
+      engineConnection.addEventListener(
+        EngineConnectionEvents.ConnectionStateChanged,
+        onConnectionStateChange as EventListener
+      )
+    }
+
+    engineCommandManager.addEventListener(
+      EngineCommandManagerEvents.EngineAvailable,
+      onEngineAvailable as EventListener
+    )
+
+    return () => {
+      engineCommandManager.removeEventListener(
+        EngineCommandManagerEvents.EngineAvailable,
+        onEngineAvailable as EventListener
+      )
+      engineCommandManager.engineConnection?.removeEventListener(
+        EngineConnectionEvents.ConnectionStateChanged,
+        onConnectionStateChange as EventListener
+      )
+    }
+  }, [])
+
+  useEffect(() => {
+    // Don't set long loading time if there's a more severe error
+    if (error > ConnectionError.LongLoadingTime) return
+
     const timer = setTimeout(() => {
-      setHasLongLoadTime(true)
+      setError(ConnectionError.LongLoadingTime)
     }, 4000)
 
     return () => clearTimeout(timer)
-  }, [setHasLongLoadTime])
+  }, [error, setError])
+
   return (
     <div
       className="body-bg flex flex-col items-center justify-center h-screen"
@@ -29,10 +80,10 @@ const Loading = ({ children }: React.PropsWithChildren) => {
       <p
         className={
           'text-sm mt-4 text-primary/60 transition-opacity duration-500' +
-          (hasLongLoadTime ? ' opacity-100' : ' opacity-0')
+          (error !== ConnectionError.Unset ? ' opacity-100' : ' opacity-0')
         }
       >
-        Loading is taking longer than expected.
+        {CONNECTION_ERROR_TEXT[error]}
       </p>
     </div>
   )

src/components/LspProvider.tsx

@@ -13,7 +13,6 @@ import { LanguageSupport } from '@codemirror/language'
 import { useNavigate } from 'react-router-dom'
 import { paths } from 'lib/paths'
 import { FileEntry } from 'lib/types'
-import { NetworkHealthState, useNetworkStatus } from './NetworkHealthIndicator'
 import Worker from 'editor/plugins/lsp/worker.ts?worker'
 import {
   LspWorkerEventType,
@@ -23,6 +22,8 @@ import {
 } from 'editor/plugins/lsp/types'
 import { wasmUrl } from 'lang/wasm'
 import { PROJECT_ENTRYPOINT } from 'lib/constants'
+import { useNetworkContext } from 'hooks/useNetworkContext'
+import { NetworkHealthState } from 'hooks/useNetworkStatus'
 
 function getWorkspaceFolders(): LSP.WorkspaceFolder[] {
   return []
@@ -86,7 +87,7 @@ export const LspProvider = ({ children }: { children: React.ReactNode }) => {
   } = useSettingsAuthContext()
   const token = auth?.context.token
   const navigate = useNavigate()
-  const { overallState } = useNetworkStatus()
+  const { overallState } = useNetworkContext()
   const isNetworkOkay = overallState === NetworkHealthState.Ok
 
   // So this is a bit weird, we need to initialize the lsp server and client.

src/components/ModelingMachineProvider.tsx

@@ -453,7 +453,8 @@ export const ModelingMachineProvider = ({
             const { modifiedAst, pathToNode: pathToNewSketchNode } =
               sketchOnExtrudedFace(
                 kclManager.ast,
-                data.extrudeSegmentPathToNode,
+                data.sketchPathToNode,
+                data.extrudePathToNode,
                 kclManager.programMemory,
                 data.cap
               )

src/components/NetworkHealthIndicator.test.tsx

@@ -5,8 +5,8 @@ import { CommandBarProvider } from './CommandBar/CommandBarProvider'
 import {
   NETWORK_HEALTH_TEXT,
   NetworkHealthIndicator,
-  NetworkHealthState,
 } from './NetworkHealthIndicator'
+import { NetworkHealthState } from 'hooks/useNetworkStatus'
 
 function TestWrap({ children }: { children: React.ReactNode }) {
   // wrap in router and xState context
@@ -19,6 +19,7 @@ function TestWrap({ children }: { children: React.ReactNode }) {
   )
 }
 
+// Our Playwright tests for this are much more comprehensive.
 describe('NetworkHealthIndicator tests', () => {
   test('Renders the network indicator', () => {
     render(
@@ -29,21 +30,7 @@ describe('NetworkHealthIndicator tests', () => {
 
     fireEvent.click(screen.getByTestId('network-toggle'))
 
-    expect(screen.getByTestId('network')).toHaveTextContent(
-      NETWORK_HEALTH_TEXT[NetworkHealthState.Ok]
-    )
-  })
-
-  test('Responds to network changes', () => {
-    render(
-      <TestWrap>
-        <NetworkHealthIndicator />
-      </TestWrap>
-    )
-
-    fireEvent.offline(window)
-    fireEvent.click(screen.getByTestId('network-toggle'))
-
+    // Starts as disconnected
     expect(screen.getByTestId('network')).toHaveTextContent(
       NETWORK_HEALTH_TEXT[NetworkHealthState.Disconnected]
     )

src/components/NetworkHealthIndicator.tsx

@@ -1,26 +1,13 @@
 import { Popover } from '@headlessui/react'
-import { useEffect, useState } from 'react'
 import { ActionIcon, ActionIconProps } from './ActionIcon'
-import {
-  ConnectingType,
-  ConnectingTypeGroup,
-  DisconnectingType,
-  EngineConnectionState,
-  EngineConnectionStateType,
-  ErrorType,
-  initialConnectingTypeGroupState,
-} from '../lang/std/engineConnection'
-import { engineCommandManager } from '../lib/singletons'
 import Tooltip from './Tooltip'
-
-export enum NetworkHealthState {
-  Ok,
-  Issue,
-  Disconnected,
-}
+import { ConnectingTypeGroup } from '../lang/std/engineConnection'
+import { useNetworkContext } from '../hooks/useNetworkContext'
+import { NetworkHealthState } from '../hooks/useNetworkStatus'
 
 export const NETWORK_HEALTH_TEXT: Record<NetworkHealthState, string> = {
   [NetworkHealthState.Ok]: 'Connected',
+  [NetworkHealthState.Weak]: 'Weak',
   [NetworkHealthState.Issue]: 'Problem',
   [NetworkHealthState.Disconnected]: 'Offline',
 }
@@ -61,6 +48,10 @@ const overallConnectionStateColor: Record<NetworkHealthState, IconColorConfig> =
       icon: 'text-succeed-80 dark:text-succeed-10',
       bg: 'bg-succeed-10/30 dark:bg-succeed-80/50',
     },
+    [NetworkHealthState.Weak]: {
+      icon: 'text-warn-80 dark:text-warn-10',
+      bg: 'bg-warn-10 dark:bg-warn-80/80',
+    },
     [NetworkHealthState.Issue]: {
       icon: 'text-destroy-80 dark:text-destroy-10',
       bg: 'bg-destroy-10 dark:bg-destroy-80/80',
@@ -76,125 +67,11 @@ const overallConnectionStateIcon: Record<
   ActionIconProps['icon']
 > = {
   [NetworkHealthState.Ok]: 'network',
+  [NetworkHealthState.Weak]: 'network',
   [NetworkHealthState.Issue]: 'networkCrossedOut',
   [NetworkHealthState.Disconnected]: 'networkCrossedOut',
 }
 
-export function useNetworkStatus() {
-  const [steps, setSteps] = useState(initialConnectingTypeGroupState)
-  const [internetConnected, setInternetConnected] = useState<boolean>(true)
-  const [overallState, setOverallState] = useState<NetworkHealthState>(
-    NetworkHealthState.Ok
-  )
-  const [hasCopied, setHasCopied] = useState<boolean>(false)
-
-  const [error, setError] = useState<ErrorType | undefined>(undefined)
-
-  const issues: Record<ConnectingTypeGroup, boolean> = {
-    [ConnectingTypeGroup.WebSocket]: steps[ConnectingTypeGroup.WebSocket].some(
-      (a: [ConnectingType, boolean | undefined]) => a[1] === false
-    ),
-    [ConnectingTypeGroup.ICE]: steps[ConnectingTypeGroup.ICE].some(
-      (a: [ConnectingType, boolean | undefined]) => a[1] === false
-    ),
-    [ConnectingTypeGroup.WebRTC]: steps[ConnectingTypeGroup.WebRTC].some(
-      (a: [ConnectingType, boolean | undefined]) => a[1] === false
-    ),
-  }
-
-  const hasIssues: boolean =
-    issues[ConnectingTypeGroup.WebSocket] ||
-    issues[ConnectingTypeGroup.ICE] ||
-    issues[ConnectingTypeGroup.WebRTC]
-
-  useEffect(() => {
-    setOverallState(
-      !internetConnected
-        ? NetworkHealthState.Disconnected
-        : hasIssues
-        ? NetworkHealthState.Issue
-        : NetworkHealthState.Ok
-    )
-  }, [hasIssues, internetConnected])
-
-  useEffect(() => {
-    const onlineCallback = () => {
-      setSteps(initialConnectingTypeGroupState)
-      setInternetConnected(true)
-    }
-    const offlineCallback = () => {
-      setInternetConnected(false)
-    }
-    window.addEventListener('online', onlineCallback)
-    window.addEventListener('offline', offlineCallback)
-    return () => {
-      window.removeEventListener('online', onlineCallback)
-      window.removeEventListener('offline', offlineCallback)
-    }
-  }, [])
-
-  useEffect(() => {
-    engineCommandManager.onConnectionStateChange(
-      (engineConnectionState: EngineConnectionState) => {
-        let hasSetAStep = false
-
-        if (
-          engineConnectionState.type === EngineConnectionStateType.Connecting
-        ) {
-          const groups = Object.values(steps)
-          for (let group of groups) {
-            for (let step of group) {
-              if (step[0] !== engineConnectionState.value.type) continue
-              step[1] = true
-              hasSetAStep = true
-            }
-          }
-        }
-
-        if (
-          engineConnectionState.type === EngineConnectionStateType.Disconnecting
-        ) {
-          const groups = Object.values(steps)
-          for (let group of groups) {
-            for (let step of group) {
-              if (
-                engineConnectionState.value.type === DisconnectingType.Error
-              ) {
-                if (
-                  engineConnectionState.value.value.lastConnectingValue
-                    ?.type === step[0]
-                ) {
-                  step[1] = false
-                  hasSetAStep = true
-                }
-              }
-            }
-
-            if (engineConnectionState.value.type === DisconnectingType.Error) {
-              setError(engineConnectionState.value.value)
-            }
-          }
-        }
-
-        if (hasSetAStep) {
-          setSteps(steps)
-        }
-      }
-    )
-  }, [])
-
-  return {
-    hasIssues,
-    overallState,
-    internetConnected,
-    steps,
-    issues,
-    error,
-    setHasCopied,
-    hasCopied,
-  }
-}
-
 export const NetworkHealthIndicator = () => {
   const {
     hasIssues,
@@ -205,7 +82,7 @@ export const NetworkHealthIndicator = () => {
     error,
     setHasCopied,
     hasCopied,
-  } = useNetworkStatus()
+  } = useNetworkContext()
 
   return (
     <Popover className="relative">
@@ -259,18 +136,18 @@ export const NetworkHealthIndicator = () => {
                     size="lg"
                     icon={
                       hasIssueToIcon[
-                        issues[name as ConnectingTypeGroup].toString()
+                        String(issues[name as ConnectingTypeGroup])
                       ]
                     }
                     iconClassName={
                       hasIssueToIconColors[
-                        issues[name as ConnectingTypeGroup].toString()
+                        String(issues[name as ConnectingTypeGroup])
                       ].icon
                     }
                     bgClassName={
                       'rounded-sm ' +
                       hasIssueToIconColors[
-                        issues[name as ConnectingTypeGroup].toString()
+                        String(issues[name as ConnectingTypeGroup])
                       ].bg
                     }
                   />

src/components/ProjectSidebarMenu.tsx

@@ -5,7 +5,6 @@ import { paths } from 'lib/paths'
 import { isTauri } from '../lib/isTauri'
 import { Link } from 'react-router-dom'
 import { Fragment } from 'react'
-import { FileTree } from './FileTree'
 import { sep } from '@tauri-apps/api/path'
 import { Logo } from './Logo'
 import { APP_NAME } from 'lib/constants'

src/components/Settings/AllKeybindingsFields.tsx

@@ -0,0 +1,87 @@
+import {
+  InteractionMapItem,
+  interactionMap,
+  sortInteractionMapByCategory,
+} from 'lib/settings/initialKeybindings'
+import { ForwardedRef, forwardRef } from 'react'
+import { useLocation } from 'react-router-dom'
+
+interface AllKeybindingsFieldsProps {}
+
+export const AllKeybindingsFields = forwardRef(
+  (
+    props: AllKeybindingsFieldsProps,
+    scrollRef: ForwardedRef<HTMLDivElement>
+  ) => {
+    // This is how we will get the interaction map from the context
+    // in the future whene franknoirot/editable-hotkeys is merged.
+    // const { state } = useInteractionMapContext()
+
+    return (
+      <div className="relative overflow-y-auto pb-16">
+        <div ref={scrollRef} className="flex flex-col gap-12">
+          {Object.entries(interactionMap)
+            .sort(sortInteractionMapByCategory)
+            .map(([category, categoryItems]) => (
+              <div className="flex flex-col gap-4 px-2 pr-4">
+                <h2
+                  id={`category-${category}`}
+                  className="text-xl mt-6 first-of-type:mt-0 capitalize font-bold"
+                >
+                  {category}
+                </h2>
+                {categoryItems.map((item) => (
+                  <KeybindingField
+                    key={category + '-' + item.name}
+                    category={category}
+                    item={item}
+                  />
+                ))}
+              </div>
+            ))}
+        </div>
+      </div>
+    )
+  }
+)
+
+function KeybindingField({
+  item,
+  category,
+}: {
+  item: InteractionMapItem
+  category: string
+}) {
+  const location = useLocation()
+
+  return (
+    <div
+      className={
+        'flex gap-16 justify-between items-start py-1 px-2 -my-1 -mx-2 ' +
+        (location.hash === `#${item.name}`
+          ? 'bg-primary/5 dark:bg-chalkboard-90'
+          : '')
+      }
+      id={item.name}
+    >
+      <div>
+        <h3 className="text-lg font-normal capitalize tracking-wide">
+          {item.title}
+        </h3>
+        <p className="text-xs text-chalkboard-60 dark:text-chalkboard-50">
+          {item.description}
+        </p>
+      </div>
+      <div className="flex-1 flex flex-wrap justify-end gap-3">
+        {item.sequence.split(' ').map((chord, i) => (
+          <kbd
+            key={`${category}-${item.name}-${chord}-${i}`}
+            className="py-0.5 px-1.5 rounded bg-primary/10 dark:bg-chalkboard-80"
+          >
+            {chord}
+          </kbd>
+        ))}
+      </div>
+    </div>
+  )
+}

src/components/Settings/AllSettingsFields.tsx

@@ -0,0 +1,238 @@
+import decamelize from 'decamelize'
+import { useSettingsAuthContext } from 'hooks/useSettingsAuthContext'
+import { Setting } from 'lib/settings/initialSettings'
+import { SetEventTypes, SettingsLevel } from 'lib/settings/settingsTypes'
+import {
+  shouldHideSetting,
+  shouldShowSettingInput,
+} from 'lib/settings/settingsUtils'
+import { Fragment } from 'react/jsx-runtime'
+import { SettingsSection } from './SettingsSection'
+import { useLocation, useNavigate } from 'react-router-dom'
+import { isTauri } from 'lib/isTauri'
+import { ActionButton } from 'components/ActionButton'
+import { SettingsFieldInput } from './SettingsFieldInput'
+import { getInitialDefaultDir, showInFolder } from 'lib/tauri'
+import toast from 'react-hot-toast'
+import { APP_VERSION } from 'routes/Settings'
+import { createAndOpenNewProject, getSettingsFolderPaths } from 'lib/tauriFS'
+import { paths } from 'lib/paths'
+import { useDotDotSlash } from 'hooks/useDotDotSlash'
+import { sep } from '@tauri-apps/api/path'
+import { ForwardedRef, forwardRef } from 'react'
+
+interface AllSettingsFieldsProps {
+  searchParamTab: SettingsLevel
+  isFileSettings: boolean
+}
+
+export const AllSettingsFields = forwardRef(
+  (
+    { searchParamTab, isFileSettings }: AllSettingsFieldsProps,
+    scrollRef: ForwardedRef<HTMLDivElement>
+  ) => {
+    const location = useLocation()
+    const navigate = useNavigate()
+    const dotDotSlash = useDotDotSlash()
+    const {
+      settings: { send, context },
+    } = useSettingsAuthContext()
+
+    const projectPath =
+      isFileSettings && isTauri()
+        ? decodeURI(
+            location.pathname
+              .replace(paths.FILE + '/', '')
+              .replace(paths.SETTINGS, '')
+              .slice(0, decodeURI(location.pathname).lastIndexOf(sep()))
+          )
+        : undefined
+
+    function restartOnboarding() {
+      send({
+        type: `set.app.onboardingStatus`,
+        data: { level: 'user', value: '' },
+      })
+
+      if (isFileSettings) {
+        navigate(dotDotSlash(1) + paths.ONBOARDING.INDEX)
+      } else {
+        createAndOpenNewProject(navigate)
+      }
+    }
+
+    return (
+      <div className="relative overflow-y-auto">
+        <div ref={scrollRef} className="flex flex-col gap-4 px-2">
+          {Object.entries(context)
+            .filter(([_, categorySettings]) =>
+              // Filter out categories that don't have any non-hidden settings
+              Object.values(categorySettings).some(
+                (setting) => !shouldHideSetting(setting, searchParamTab)
+              )
+            )
+            .map(([category, categorySettings]) => (
+              <Fragment key={category}>
+                <h2
+                  id={`category-${category}`}
+                  className="text-xl mt-6 first-of-type:mt-0 capitalize font-bold"
+                >
+                  {decamelize(category, { separator: ' ' })}
+                </h2>
+                {Object.entries(categorySettings)
+                  .filter(
+                    // Filter out settings that don't have a Component or inputType
+                    // or are hidden on the current level or the current platform
+                    (item: [string, Setting<unknown>]) =>
+                      shouldShowSettingInput(item[1], searchParamTab)
+                  )
+                  .map(([settingName, s]) => {
+                    const setting = s as Setting
+                    const parentValue =
+                      setting[setting.getParentLevel(searchParamTab)]
+                    return (
+                      <SettingsSection
+                        title={decamelize(settingName, {
+                          separator: ' ',
+                        })}
+                        id={settingName}
+                        className={
+                          location.hash === `#${settingName}`
+                            ? 'bg-primary/5 dark:bg-chalkboard-90'
+                            : ''
+                        }
+                        key={`${category}-${settingName}-${searchParamTab}`}
+                        description={setting.description}
+                        settingHasChanged={
+                          setting[searchParamTab] !== undefined &&
+                          setting[searchParamTab] !==
+                            setting.getFallback(searchParamTab)
+                        }
+                        parentLevel={setting.getParentLevel(searchParamTab)}
+                        onFallback={() =>
+                          send({
+                            type: `set.${category}.${settingName}`,
+                            data: {
+                              level: searchParamTab,
+                              value:
+                                parentValue !== undefined
+                                  ? parentValue
+                                  : setting.getFallback(searchParamTab),
+                            },
+                          } as SetEventTypes)
+                        }
+                      >
+                        <SettingsFieldInput
+                          category={category}
+                          settingName={settingName}
+                          settingsLevel={searchParamTab}
+                          setting={setting}
+                        />
+                      </SettingsSection>
+                    )
+                  })}
+              </Fragment>
+            ))}
+          <h2 id="settings-resets" className="text-2xl mt-6 font-bold">
+            Resets
+          </h2>
+          <SettingsSection
+            title="Onboarding"
+            description="Replay the onboarding process"
+          >
+            <ActionButton
+              Element="button"
+              onClick={restartOnboarding}
+              iconStart={{
+                icon: 'refresh',
+                size: 'sm',
+                className: 'p-1',
+              }}
+            >
+              Replay Onboarding
+            </ActionButton>
+          </SettingsSection>
+          <SettingsSection
+            title="Reset settings"
+            description={`Restore settings to their default values. Your settings are saved in
+                    ${
+                      isTauri()
+                        ? ' a file in the app data folder for your OS.'
+                        : " your browser's local storage."
+                    }
+                  `}
+          >
+            <div className="flex flex-col items-start gap-4">
+              {isTauri() && (
+                <ActionButton
+                  Element="button"
+                  onClick={async () => {
+                    const paths = await getSettingsFolderPaths(
+                      projectPath ? decodeURIComponent(projectPath) : undefined
+                    )
+                    showInFolder(paths[searchParamTab])
+                  }}
+                  iconStart={{
+                    icon: 'folder',
+                    size: 'sm',
+                    className: 'p-1',
+                  }}
+                >
+                  Show in folder
+                </ActionButton>
+              )}
+              <ActionButton
+                Element="button"
+                onClick={async () => {
+                  const defaultDirectory = await getInitialDefaultDir()
+                  send({
+                    type: 'Reset settings',
+                    defaultDirectory,
+                  })
+                  toast.success('Settings restored to default')
+                }}
+                iconStart={{
+                  icon: 'refresh',
+                  size: 'sm',
+                  className: 'p-1 text-chalkboard-10',
+                  bgClassName: 'bg-destroy-70',
+                }}
+              >
+                Restore default settings
+              </ActionButton>
+            </div>
+          </SettingsSection>
+          <h2 id="settings-about" className="text-2xl mt-6 font-bold">
+            About Modeling App
+          </h2>
+          <div className="text-sm mb-12">
+            <p>
+              {/* This uses a Vite plugin, set in vite.config.ts
+                  to inject the version from package.json */}
+              App version {APP_VERSION}.{' '}
+              <a
+                href={`https://github.com/KittyCAD/modeling-app/releases/tag/v${APP_VERSION}`}
+                target="_blank"
+                rel="noopener noreferrer"
+              >
+                View release on GitHub
+              </a>
+            </p>
+            <p className="max-w-2xl mt-6">
+              Don't see the feature you want? Check to see if it's on{' '}
+              <a
+                href="https://github.com/KittyCAD/modeling-app/discussions"
+                target="_blank"
+                rel="noopener noreferrer"
+              >
+                our roadmap
+              </a>
+              , and start a discussion if you don't see it! Your feedback will
+              help us prioritize what to build next.
+            </p>
+          </div>
+        </div>
+      </div>
+    )
+  }
+)

src/components/Settings/KeybindingsSectionsList.tsx

@@ -0,0 +1,35 @@
+import {
+  interactionMap,
+  sortInteractionMapByCategory,
+} from 'lib/settings/initialKeybindings'
+
+interface KeybindingSectionsListProps {
+  scrollRef: React.RefObject<HTMLDivElement>
+}
+
+export function KeybindingsSectionsList({
+  scrollRef,
+}: KeybindingSectionsListProps) {
+  return (
+    <div className="flex w-32 flex-col gap-3 pr-2 py-1 border-0 border-r border-r-chalkboard-20 dark:border-r-chalkboard-90">
+      {Object.entries(interactionMap)
+        .sort(sortInteractionMapByCategory)
+        .map(([category]) => (
+          <button
+            key={category}
+            onClick={() =>
+              scrollRef.current
+                ?.querySelector(`#category-${category}`)
+                ?.scrollIntoView({
+                  block: 'center',
+                  behavior: 'smooth',
+                })
+            }
+            className="capitalize text-left border-none px-1"
+          >
+            {category}
+          </button>
+        ))}
+    </div>
+  )
+}

src/components/Settings/SettingsSearchBar.tsx

@@ -3,11 +3,23 @@ import { CustomIcon } from 'components/CustomIcon'
 import decamelize from 'decamelize'
 import Fuse from 'fuse.js'
 import { useSettingsAuthContext } from 'hooks/useSettingsAuthContext'
+import { interactionMap } from 'lib/settings/initialKeybindings'
 import { Setting } from 'lib/settings/initialSettings'
+import { SettingsLevel } from 'lib/settings/settingsTypes'
 import { useEffect, useMemo, useRef, useState } from 'react'
 import { useHotkeys } from 'react-hotkeys-hook'
 import { useNavigate } from 'react-router-dom'
 
+type ExtendedSettingsLevel = SettingsLevel | 'keybindings'
+
+export type SettingsSearchItem = {
+  name: string
+  displayName: string
+  description: string
+  category: string
+  level: ExtendedSettingsLevel
+}
+
 export function SettingsSearchBar() {
   const inputRef = useRef<HTMLInputElement>(null)
   useHotkeys(
@@ -21,29 +33,40 @@ export function SettingsSearchBar() {
   const navigate = useNavigate()
   const [query, setQuery] = useState('')
   const { settings } = useSettingsAuthContext()
-  const settingsAsSearchable = useMemo(
-    () =>
-      Object.entries(settings.state.context).flatMap(
+  const settingsAsSearchable: SettingsSearchItem[] = useMemo(
+    () => [
+      ...Object.entries(settings.state.context).flatMap(
         ([category, categorySettings]) =>
           Object.entries(categorySettings).flatMap(([settingName, setting]) => {
             const s = setting as Setting
-            return ['project', 'user']
+            return (['project', 'user'] satisfies SettingsLevel[])
               .filter((l) => s.hideOnLevel !== l)
               .map((l) => ({
                 category: decamelize(category, { separator: ' ' }),
-                settingName: settingName,
-                settingNameDisplay: decamelize(settingName, { separator: ' ' }),
-                setting: s,
-                level: l,
+                name: settingName,
+                description: s.description ?? '',
+                displayName: decamelize(settingName, { separator: ' ' }),
+                level: l as ExtendedSettingsLevel,
               }))
           })
       ),
+      ...Object.entries(interactionMap).flatMap(
+        ([category, categoryKeybindings]) =>
+          categoryKeybindings.map((keybinding) => ({
+            name: keybinding.name,
+            displayName: keybinding.title,
+            description: keybinding.description,
+            category: category,
+            level: 'keybindings' as ExtendedSettingsLevel,
+          }))
+      ),
+    ],
     [settings.state.context]
   )
   const [searchResults, setSearchResults] = useState(settingsAsSearchable)
 
   const fuse = new Fuse(settingsAsSearchable, {
-    keys: ['category', 'settingNameDisplay', 'setting.description'],
+    keys: ['category', 'displayName', 'description'],
     includeScore: true,
   })
 
@@ -52,16 +75,8 @@ export function SettingsSearchBar() {
     setSearchResults(query.length > 0 ? results : settingsAsSearchable)
   }, [query])
 
-  function handleSelection({
-    level,
-    settingName,
-  }: {
-    category: string
-    settingName: string
-    setting: Setting<unknown>
-    level: string
-  }) {
-    navigate(`?tab=${level}#${settingName}`)
+  function handleSelection({ level, name }: SettingsSearchItem) {
+    navigate(`?tab=${level}#${name}`)
   }
 
   return (
@@ -87,18 +102,18 @@ export function SettingsSearchBar() {
         <Combobox.Options className="absolute top-full mt-2 right-0 w-80 overflow-y-auto z-50 max-h-96 cursor-pointer bg-chalkboard-10 dark:bg-chalkboard-100 border border-solid border-primary dark:border-chalkboard-30 rounded">
           {searchResults?.map((option) => (
             <Combobox.Option
-              key={`${option.category}-${option.settingName}-${option.level}`}
+              key={`${option.category}-${option.name}-${option.level}`}
               value={option}
               className="flex flex-col items-start gap-2 px-4 py-2 ui-active:bg-primary/10 dark:ui-active:bg-chalkboard-90"
             >
               <p className="flex-grow text-base capitalize m-0 leading-none">
                 {option.level} ·{' '}
                 {decamelize(option.category, { separator: ' ' })} ·{' '}
-                {option.settingNameDisplay}
+                {option.displayName}
               </p>
-              {option.setting.description && (
+              {option.description && (
                 <p className="text-xs leading-tight text-chalkboard-70 dark:text-chalkboard-50">
-                  {option.setting.description}
+                  {option.description}
                 </p>
               )}
             </Combobox.Option>

src/components/Settings/SettingsSectionsList.tsx

@@ -0,0 +1,68 @@
+import decamelize from 'decamelize'
+import { useSettingsAuthContext } from 'hooks/useSettingsAuthContext'
+import { Setting } from 'lib/settings/initialSettings'
+import { SettingsLevel } from 'lib/settings/settingsTypes'
+import { shouldHideSetting } from 'lib/settings/settingsUtils'
+
+interface SettingsSectionsListProps {
+  searchParamTab: SettingsLevel
+  scrollRef: React.RefObject<HTMLDivElement>
+}
+
+export function SettingsSectionsList({
+  searchParamTab,
+  scrollRef,
+}: SettingsSectionsListProps) {
+  const {
+    settings: { context },
+  } = useSettingsAuthContext()
+  return (
+    <div className="flex w-32 flex-col gap-3 pr-2 py-1 border-0 border-r border-r-chalkboard-20 dark:border-r-chalkboard-90">
+      {Object.entries(context)
+        .filter(([_, categorySettings]) =>
+          // Filter out categories that don't have any non-hidden settings
+          Object.values(categorySettings).some(
+            (setting: Setting) => !shouldHideSetting(setting, searchParamTab)
+          )
+        )
+        .map(([category]) => (
+          <button
+            key={category}
+            onClick={() =>
+              scrollRef.current
+                ?.querySelector(`#category-${category}`)
+                ?.scrollIntoView({
+                  block: 'center',
+                  behavior: 'smooth',
+                })
+            }
+            className="capitalize text-left border-none px-1"
+          >
+            {decamelize(category, { separator: ' ' })}
+          </button>
+        ))}
+      <button
+        onClick={() =>
+          scrollRef.current?.querySelector(`#settings-resets`)?.scrollIntoView({
+            block: 'center',
+            behavior: 'smooth',
+          })
+        }
+        className="capitalize text-left border-none px-1"
+      >
+        Resets
+      </button>
+      <button
+        onClick={() =>
+          scrollRef.current?.querySelector(`#settings-about`)?.scrollIntoView({
+            block: 'center',
+            behavior: 'smooth',
+          })
+        }
+        className="capitalize text-left border-none px-1"
+      >
+        About
+      </button>
+    </div>
+  )
+}

src/components/Settings/SettingsTabs.tsx

@@ -34,6 +34,15 @@ export function SettingsTabs({
           )}
         </RadioGroup.Option>
       )}
+      <RadioGroup.Option value="keybindings">
+        {({ checked }) => (
+          <SettingsTabButton
+            checked={checked}
+            icon="keyboard"
+            text="Keybindings"
+          />
+        )}
+      </RadioGroup.Option>
     </RadioGroup>
   )
 }

src/components/Stream.tsx

@@ -4,8 +4,9 @@ import { getNormalisedCoordinates } from '../lib/utils'
 import Loading from './Loading'
 import { useSettingsAuthContext } from 'hooks/useSettingsAuthContext'
 import { useModelingContext } from 'hooks/useModelingContext'
+import { useNetworkContext } from 'hooks/useNetworkContext'
+import { NetworkHealthState } from 'hooks/useNetworkStatus'
 import { ClientSideScene } from 'clientSideScene/ClientSideSceneComp'
-import { NetworkHealthState, useNetworkStatus } from './NetworkHealthIndicator'
 import { butName } from 'lib/cameraControls'
 import { sendSelectEventToEngine } from 'lib/selections'
 
@@ -28,8 +29,43 @@ export const Stream = ({ className = '' }: { className?: string }) => {
   }))
   const { settings } = useSettingsAuthContext()
   const { state } = useModelingContext()
-  const { overallState } = useNetworkStatus()
-  const isNetworkOkay = overallState === NetworkHealthState.Ok
+  const { overallState } = useNetworkContext()
+
+  const isNetworkOkay =
+    overallState === NetworkHealthState.Ok ||
+    overallState === NetworkHealthState.Weak
+
+  // Linux has a default behavior to paste text on middle mouse up
+  // This adds a listener to block that pasting if the click target
+  // is not a text input, so users can move in the 3D scene with
+  // middle mouse drag with a text input focused without pasting.
+  useEffect(() => {
+    const handlePaste = (e: ClipboardEvent) => {
+      const isHtmlElement = e.target && e.target instanceof HTMLElement
+      const isEditable =
+        (isHtmlElement && !('explicitOriginalTarget' in e)) ||
+        ('explicitOriginalTarget' in e &&
+          ((e.explicitOriginalTarget as HTMLElement).contentEditable ===
+            'true' ||
+            ['INPUT', 'TEXTAREA'].some(
+              (tagName) =>
+                tagName === (e.explicitOriginalTarget as HTMLElement).tagName
+            )))
+      if (!isEditable) {
+        e.preventDefault()
+        e.stopPropagation()
+        e.stopImmediatePropagation()
+      }
+    }
+
+    globalThis?.window?.document?.addEventListener('paste', handlePaste, {
+      capture: true,
+    })
+    return () =>
+      globalThis?.window?.document?.removeEventListener('paste', handlePaste, {
+        capture: true,
+      })
+  }, [])
 
   useEffect(() => {
     if (
@@ -43,6 +79,7 @@ export const Stream = ({ className = '' }: { className?: string }) => {
   }, [mediaStream])
 
   const handleMouseDown: MouseEventHandler<HTMLDivElement> = (e) => {
+    if (!isNetworkOkay) return
     if (!videoRef.current) return
     if (state.matches('Sketch')) return
     if (state.matches('Sketch no face')) return
@@ -58,6 +95,7 @@ export const Stream = ({ className = '' }: { className?: string }) => {
   }
 
   const handleMouseUp: MouseEventHandler<HTMLDivElement> = (e) => {
+    if (!isNetworkOkay) return
     if (!videoRef.current) return
     setButtonDownInStream(undefined)
     if (state.matches('Sketch')) return
@@ -72,6 +110,7 @@ export const Stream = ({ className = '' }: { className?: string }) => {
   }
 
   const handleMouseMove: MouseEventHandler<HTMLVideoElement> = (e) => {
+    if (!isNetworkOkay) return
     if (state.matches('Sketch')) return
     if (state.matches('Sketch no face')) return
     if (!clickCoords) return
@@ -112,7 +151,7 @@ export const Stream = ({ className = '' }: { className?: string }) => {
       {!isNetworkOkay && !isLoading && (
         <div className="text-center absolute inset-0">
           <Loading>
-            <span data-testid="loading-stream">Stream disconnected</span>
+            <span data-testid="loading-stream">Stream disconnected...</span>
           </Loading>
         </div>
       )}

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

@@ -474,19 +474,13 @@ const completionRequester = (client: LanguageServerClient) => {
 }
 
 export const copilotPlugin = (options: LanguageServerOptions): Extension => {
-  let plugin: LanguageServerPlugin | null = null
-
   return [
     documentUri.of(options.documentUri),
     languageId.of('kcl'),
     workspaceFolders.of(options.workspaceFolders),
     ViewPlugin.define(
       (view) =>
-        (plugin = new LanguageServerPlugin(
-          options.client,
-          view,
-          options.allowHTMLContent
-        ))
+        new LanguageServerPlugin(options.client, view, options.allowHTMLContent)
     ),
     completionDecoration,
     Prec.highest(completionPlugin(options.client)),

src/hooks/useNetworkContext.tsx

@@ -0,0 +1,25 @@
+import { createContext, useContext } from 'react'
+import {
+  ConnectingTypeGroup,
+  initialConnectingTypeGroupState,
+} from '../lang/std/engineConnection'
+import { NetworkStatus, NetworkHealthState } from './useNetworkStatus'
+
+export const NetworkContext = createContext<NetworkStatus>({
+  hasIssues: undefined,
+  overallState: NetworkHealthState.Disconnected,
+  internetConnected: true,
+  steps: structuredClone(initialConnectingTypeGroupState),
+  issues: {
+    [ConnectingTypeGroup.WebSocket]: undefined,
+    [ConnectingTypeGroup.ICE]: undefined,
+    [ConnectingTypeGroup.WebRTC]: undefined,
+  },
+  error: undefined,
+  setHasCopied: (b: boolean) => {},
+  hasCopied: false,
+  pingPongHealth: undefined,
+} as NetworkStatus)
+export const useNetworkContext = () => {
+  return useContext(NetworkContext)
+}

src/hooks/useNetworkStatus.tsx

@@ -0,0 +1,228 @@
+import { useEffect, useState } from 'react'
+import {
+  ConnectingType,
+  ConnectingTypeGroup,
+  DisconnectingType,
+  EngineCommandManagerEvents,
+  EngineConnectionEvents,
+  EngineConnectionStateType,
+  ErrorType,
+  initialConnectingTypeGroupState,
+} from '../lang/std/engineConnection'
+import { engineCommandManager } from '../lib/singletons'
+
+export enum NetworkHealthState {
+  Ok,
+  Weak,
+  Issue,
+  Disconnected,
+}
+
+export interface NetworkStatus {
+  hasIssues: boolean | undefined
+  overallState: NetworkHealthState
+  internetConnected: boolean
+  steps: typeof initialConnectingTypeGroupState
+  issues: Record<ConnectingTypeGroup, boolean | undefined>
+  error: ErrorType | undefined
+  setHasCopied: (b: boolean) => void
+  hasCopied: boolean
+  pingPongHealth: undefined | 'OK' | 'TIMEOUT'
+}
+
+// Must be called from one place in the application.
+// We've chosen the <Router /> component for this.
+export function useNetworkStatus() {
+  const [steps, setSteps] = useState(
+    structuredClone(initialConnectingTypeGroupState)
+  )
+  const [internetConnected, setInternetConnected] = useState<boolean>(true)
+  const [overallState, setOverallState] = useState<NetworkHealthState>(
+    NetworkHealthState.Disconnected
+  )
+  const [pingPongHealth, setPingPongHealth] = useState<
+    undefined | 'OK' | 'TIMEOUT'
+  >(undefined)
+  const [hasCopied, setHasCopied] = useState<boolean>(false)
+
+  const [error, setError] = useState<ErrorType | undefined>(undefined)
+
+  const hasIssue = (i: [ConnectingType, boolean | undefined]) =>
+    i[1] === undefined ? i[1] : !i[1]
+
+  const [issues, setIssues] = useState<
+    Record<ConnectingTypeGroup, boolean | undefined>
+  >({
+    [ConnectingTypeGroup.WebSocket]: undefined,
+    [ConnectingTypeGroup.ICE]: undefined,
+    [ConnectingTypeGroup.WebRTC]: undefined,
+  })
+
+  const [hasIssues, setHasIssues] = useState<boolean | undefined>(undefined)
+  useEffect(() => {
+    setOverallState(
+      !internetConnected
+        ? NetworkHealthState.Disconnected
+        : hasIssues || hasIssues === undefined
+        ? NetworkHealthState.Issue
+        : pingPongHealth === 'TIMEOUT'
+        ? NetworkHealthState.Weak
+        : NetworkHealthState.Ok
+    )
+  }, [hasIssues, internetConnected, pingPongHealth])
+
+  useEffect(() => {
+    const onlineCallback = () => {
+      setInternetConnected(true)
+    }
+    const offlineCallback = () => {
+      setInternetConnected(false)
+      setSteps(structuredClone(initialConnectingTypeGroupState))
+    }
+    window.addEventListener('online', onlineCallback)
+    window.addEventListener('offline', offlineCallback)
+    return () => {
+      window.removeEventListener('online', onlineCallback)
+      window.removeEventListener('offline', offlineCallback)
+    }
+  }, [])
+
+  useEffect(() => {
+    const issues = {
+      [ConnectingTypeGroup.WebSocket]: steps[
+        ConnectingTypeGroup.WebSocket
+      ].reduce(
+        (acc: boolean | undefined, a) =>
+          acc === true || acc === undefined ? acc : hasIssue(a),
+        false
+      ),
+      [ConnectingTypeGroup.ICE]: steps[ConnectingTypeGroup.ICE].reduce(
+        (acc: boolean | undefined, a) =>
+          acc === true || acc === undefined ? acc : hasIssue(a),
+        false
+      ),
+      [ConnectingTypeGroup.WebRTC]: steps[ConnectingTypeGroup.WebRTC].reduce(
+        (acc: boolean | undefined, a) =>
+          acc === true || acc === undefined ? acc : hasIssue(a),
+        false
+      ),
+    }
+    setIssues(issues)
+  }, [steps])
+
+  useEffect(() => {
+    setHasIssues(
+      issues[ConnectingTypeGroup.WebSocket] ||
+        issues[ConnectingTypeGroup.ICE] ||
+        issues[ConnectingTypeGroup.WebRTC]
+    )
+  }, [issues])
+
+  useEffect(() => {
+    const onPingPongChange = ({ detail: state }: CustomEvent) => {
+      setPingPongHealth(state)
+    }
+
+    const onConnectionStateChange = ({
+      detail: engineConnectionState,
+    }: CustomEvent) => {
+      setSteps((steps) => {
+        let nextSteps = structuredClone(steps)
+
+        if (
+          engineConnectionState.type === EngineConnectionStateType.Connecting
+        ) {
+          const groups = Object.values(nextSteps)
+          for (let group of groups) {
+            for (let step of group) {
+              if (step[0] !== engineConnectionState.value.type) continue
+              step[1] = true
+            }
+          }
+        }
+
+        if (
+          engineConnectionState.type === EngineConnectionStateType.Disconnecting
+        ) {
+          const groups = Object.values(nextSteps)
+          for (let group of groups) {
+            for (let step of group) {
+              if (
+                engineConnectionState.value.type === DisconnectingType.Error
+              ) {
+                if (
+                  engineConnectionState.value.value.lastConnectingValue
+                    ?.type === step[0]
+                ) {
+                  step[1] = false
+                }
+              }
+            }
+
+            if (engineConnectionState.value.type === DisconnectingType.Error) {
+              setError(engineConnectionState.value.value)
+            }
+          }
+        }
+
+        // Reset the state of all steps if we have disconnected.
+        if (
+          engineConnectionState.type === EngineConnectionStateType.Disconnected
+        ) {
+          return structuredClone(initialConnectingTypeGroupState)
+        }
+
+        return nextSteps
+      })
+    }
+
+    const onEngineAvailable = ({ detail: engineConnection }: CustomEvent) => {
+      engineConnection.addEventListener(
+        EngineConnectionEvents.PingPongChanged,
+        onPingPongChange as EventListener
+      )
+      engineConnection.addEventListener(
+        EngineConnectionEvents.ConnectionStateChanged,
+        onConnectionStateChange as EventListener
+      )
+
+      // Tell EngineConnection to start firing events.
+      window.dispatchEvent(new CustomEvent('use-network-status-ready', {}))
+    }
+
+    engineCommandManager.addEventListener(
+      EngineCommandManagerEvents.EngineAvailable,
+      onEngineAvailable as EventListener
+    )
+
+    return () => {
+      engineCommandManager.removeEventListener(
+        EngineCommandManagerEvents.EngineAvailable,
+        onEngineAvailable as EventListener
+      )
+
+      // When the component is unmounted these should be assigned, but it's possible
+      // the component mounts and unmounts before engine is available.
+      engineCommandManager.engineConnection?.addEventListener(
+        EngineConnectionEvents.PingPongChanged,
+        onPingPongChange as EventListener
+      )
+      engineCommandManager.engineConnection?.addEventListener(
+        EngineConnectionEvents.ConnectionStateChanged,
+        onConnectionStateChange as EventListener
+      )
+    }
+  }, [])
+
+  return {
+    hasIssues,
+    overallState,
+    internetConnected,
+    steps,
+    issues,
+    error,
+    setHasCopied,
+    hasCopied,
+    pingPongHealth,
+  }
+}

src/hooks/useSetupEngineManager.ts

@@ -43,7 +43,7 @@ export function useSetupEngineManager(
     engineCommandManager.pool = settings.pool
   }
 
-  useLayoutEffect(() => {
+  const startEngineInstance = () => {
     // Load the engine command manager once with the initial width and height,
     // then we do not want to reload it.
     const { width: quadWidth, height: quadHeight } = getDimensions(
@@ -73,7 +73,12 @@ export function useSetupEngineManager(
       })
       hasSetNonZeroDimensions.current = true
     }
-  }, [streamRef?.current?.offsetWidth, streamRef?.current?.offsetHeight])
+  }
+
+  useLayoutEffect(startEngineInstance, [
+    streamRef?.current?.offsetWidth,
+    streamRef?.current?.offsetHeight,
+  ])
 
   useEffect(() => {
     const handleResize = deferExecution(() => {
@@ -96,8 +101,20 @@ export function useSetupEngineManager(
       }
     }, 500)
 
+    const onOnline = () => {
+      startEngineInstance()
+    }
+
+    const onOffline = () => {
+      engineCommandManager.tearDown()
+    }
+
+    window.addEventListener('online', onOnline)
+    window.addEventListener('offline', onOffline)
     window.addEventListener('resize', handleResize)
     return () => {
+      window.removeEventListener('online', onOnline)
+      window.removeEventListener('offline', onOffline)
       window.removeEventListener('resize', handleResize)
     }
   }, [])

src/hooks/useStateMachineCommands.ts

@@ -7,12 +7,10 @@ import { authMachine } from 'machines/authMachine'
 import { settingsMachine } from 'machines/settingsMachine'
 import { homeMachine } from 'machines/homeMachine'
 import { Command, CommandSetConfig, CommandSetSchema } from 'lib/commandTypes'
-import {
-  NetworkHealthState,
-  useNetworkStatus,
-} from 'components/NetworkHealthIndicator'
 import { useKclContext } from 'lang/KclProvider'
 import { useStore } from 'useStore'
+import { useNetworkContext } from 'hooks/useNetworkContext'
+import { NetworkHealthState } from 'hooks/useNetworkStatus'
 
 // This might not be necessary, AnyStateMachine from xstate is working
 export type AllMachines =
@@ -47,7 +45,7 @@ export default function useStateMachineCommands<
   onCancel,
 }: UseStateMachineCommandsArgs<T, S>) {
   const { commandBarSend } = useCommandsContext()
-  const { overallState } = useNetworkStatus()
+  const { overallState } = useNetworkContext()
   const { isExecuting } = useKclContext()
   const { isStreamReady } = useStore((s) => ({
     isStreamReady: s.isStreamReady,
@@ -55,7 +53,10 @@ export default function useStateMachineCommands<
 
   useEffect(() => {
     const disableAllButtons =
-      overallState !== NetworkHealthState.Ok || isExecuting || !isStreamReady
+      (overallState !== NetworkHealthState.Ok &&
+        overallState !== NetworkHealthState.Weak) ||
+      isExecuting ||
+      !isStreamReady
     const newCommands = state.nextEvents
       .filter((_) => !allCommandsRequireNetwork || !disableAllButtons)
       .filter((e) => !['done.', 'error.'].some((n) => e.includes(n)))

src/lang/modifyAst.test.ts

@@ -125,7 +125,7 @@ describe('Testing addSketchTo', () => {
       'yz'
     )
     const str = recast(result.modifiedAst)
-    expect(str).toBe(`const part001 = startSketchOn('YZ')
+    expect(str).toBe(`const sketch001 = startSketchOn('YZ')
   |> startProfileAt('default', %)
   |> line('default', %)
 `)
@@ -291,14 +291,25 @@ describe('testing sketchOnExtrudedFace', () => {
   |> extrude(5 + 7, %)`
     const ast = parse(code)
     const programMemory = await enginelessExecutor(ast)
-    const snippet = `line([9.7, 9.19], %)`
-    const range: [number, number] = [
-      code.indexOf(snippet),
-      code.indexOf(snippet) + snippet.length,
+    const segmentSnippet = `line([9.7, 9.19], %)`
+    const segmentRange: [number, number] = [
+      code.indexOf(segmentSnippet),
+      code.indexOf(segmentSnippet) + segmentSnippet.length,
     ]
-    const pathToNode = getNodePathFromSourceRange(ast, range)
+    const segmentPathToNode = getNodePathFromSourceRange(ast, segmentRange)
+    const extrudeSnippet = `extrude(5 + 7, %)`
+    const extrudeRange: [number, number] = [
+      code.indexOf(extrudeSnippet),
+      code.indexOf(extrudeSnippet) + extrudeSnippet.length,
+    ]
+    const extrudePathToNode = getNodePathFromSourceRange(ast, extrudeRange)
 
-    const { modifiedAst } = sketchOnExtrudedFace(ast, pathToNode, programMemory)
+    const { modifiedAst } = sketchOnExtrudedFace(
+      ast,
+      segmentPathToNode,
+      extrudePathToNode,
+      programMemory
+    )
     const newCode = recast(modifiedAst)
     expect(newCode).toContain(`const part001 = startSketchOn('-XZ')
   |> startProfileAt([3.58, 2.06], %)
@@ -306,7 +317,7 @@ describe('testing sketchOnExtrudedFace', () => {
   |> line([8.62, -9.57], %)
   |> close(%)
   |> extrude(5 + 7, %)
-const part002 = startSketchOn(part001, 'seg01')`)
+const sketch001 = startSketchOn(part001, 'seg01')`)
   })
   test('it should be able to extrude on close segments', async () => {
     const code = `const part001 = startSketchOn('-XZ')
@@ -317,14 +328,25 @@ const part002 = startSketchOn(part001, 'seg01')`)
   |> extrude(5 + 7, %)`
     const ast = parse(code)
     const programMemory = await enginelessExecutor(ast)
-    const snippet = `close(%)`
-    const range: [number, number] = [
-      code.indexOf(snippet),
-      code.indexOf(snippet) + snippet.length,
+    const segmentSnippet = `close(%)`
+    const segmentRange: [number, number] = [
+      code.indexOf(segmentSnippet),
+      code.indexOf(segmentSnippet) + segmentSnippet.length,
     ]
-    const pathToNode = getNodePathFromSourceRange(ast, range)
+    const segmentPathToNode = getNodePathFromSourceRange(ast, segmentRange)
+    const extrudeSnippet = `extrude(5 + 7, %)`
+    const extrudeRange: [number, number] = [
+      code.indexOf(extrudeSnippet),
+      code.indexOf(extrudeSnippet) + extrudeSnippet.length,
+    ]
+    const extrudePathToNode = getNodePathFromSourceRange(ast, extrudeRange)
 
-    const { modifiedAst } = sketchOnExtrudedFace(ast, pathToNode, programMemory)
+    const { modifiedAst } = sketchOnExtrudedFace(
+      ast,
+      segmentPathToNode,
+      extrudePathToNode,
+      programMemory
+    )
     const newCode = recast(modifiedAst)
     expect(newCode).toContain(`const part001 = startSketchOn('-XZ')
   |> startProfileAt([3.58, 2.06], %)
@@ -332,7 +354,7 @@ const part002 = startSketchOn(part001, 'seg01')`)
   |> line([8.62, -9.57], %)
   |> close(%, 'seg01')
   |> extrude(5 + 7, %)
-const part002 = startSketchOn(part001, 'seg01')`)
+const sketch001 = startSketchOn(part001, 'seg01')`)
   })
   test('it should be able to extrude on start-end caps', async () => {
     const code = `const part001 = startSketchOn('-XZ')
@@ -343,16 +365,23 @@ const part002 = startSketchOn(part001, 'seg01')`)
   |> extrude(5 + 7, %)`
     const ast = parse(code)
     const programMemory = await enginelessExecutor(ast)
-    const snippet = `startProfileAt([3.58, 2.06], %)`
-    const range: [number, number] = [
-      code.indexOf(snippet),
-      code.indexOf(snippet) + snippet.length,
+    const sketchSnippet = `startProfileAt([3.58, 2.06], %)`
+    const sketchRange: [number, number] = [
+      code.indexOf(sketchSnippet),
+      code.indexOf(sketchSnippet) + sketchSnippet.length,
     ]
-    const pathToNode = getNodePathFromSourceRange(ast, range)
+    const sketchPathToNode = getNodePathFromSourceRange(ast, sketchRange)
+    const extrudeSnippet = `extrude(5 + 7, %)`
+    const extrudeRange: [number, number] = [
+      code.indexOf(extrudeSnippet),
+      code.indexOf(extrudeSnippet) + extrudeSnippet.length,
+    ]
+    const extrudePathToNode = getNodePathFromSourceRange(ast, extrudeRange)
 
     const { modifiedAst } = sketchOnExtrudedFace(
       ast,
-      pathToNode,
+      sketchPathToNode,
+      extrudePathToNode,
       programMemory,
       'end'
     )
@@ -363,7 +392,47 @@ const part002 = startSketchOn(part001, 'seg01')`)
   |> line([8.62, -9.57], %)
   |> close(%)
   |> extrude(5 + 7, %)
-const part002 = startSketchOn(part001, 'END')`)
+const sketch001 = startSketchOn(part001, 'END')`)
+  })
+  test('it should ensure that the new sketch is inserted after the extrude', async () => {
+    const code = `const sketch001 = startSketchOn('-XZ')
+    |> startProfileAt([3.29, 7.86], %)
+    |> line([2.48, 2.44], %)
+    |> line([2.66, 1.17], %)
+    |> line([3.75, 0.46], %)
+    |> line([4.99, -0.46], %)
+    |> line([3.3, -2.12], %)
+    |> line([2.16, -3.33], %)
+    |> line([0.85, -3.08], %)
+    |> line([-0.18, -3.36], %)
+    |> line([-3.86, -2.73], %)
+    |> line([-17.67, 0.85], %)
+    |> close(%)
+    const part001 = extrude(5 + 7, sketch001)`
+    const ast = parse(code)
+    const programMemory = await enginelessExecutor(ast)
+    const segmentSnippet = `line([4.99, -0.46], %)`
+    const segmentRange: [number, number] = [
+      code.indexOf(segmentSnippet),
+      code.indexOf(segmentSnippet) + segmentSnippet.length,
+    ]
+    const segmentPathToNode = getNodePathFromSourceRange(ast, segmentRange)
+    const extrudeSnippet = `extrude(5 + 7, sketch001)`
+    const extrudeRange: [number, number] = [
+      code.indexOf(extrudeSnippet),
+      code.indexOf(extrudeSnippet) + extrudeSnippet.length,
+    ]
+    const extrudePathToNode = getNodePathFromSourceRange(ast, extrudeRange)
+
+    const { modifiedAst } = sketchOnExtrudedFace(
+      ast,
+      segmentPathToNode,
+      extrudePathToNode,
+      programMemory
+    )
+    const newCode = recast(modifiedAst)
+    expect(newCode).toContain(`const part001 = extrude(5 + 7, sketch001)
+const sketch002 = startSketchOn(part001, 'seg01')`)
   })
 })
 

src/lang/modifyAst.ts

@@ -34,6 +34,7 @@ import {
 } from './std/sketchcombos'
 import { DefaultPlaneStr } from 'clientSideScene/sceneEntities'
 import { isOverlap, roundOff } from 'lib/utils'
+import { KCL_DEFAULT_CONSTANT_PREFIXES } from 'lib/constants'
 import { ConstrainInfo } from './std/stdTypes'
 
 export function startSketchOnDefault(
@@ -42,7 +43,8 @@ export function startSketchOnDefault(
   name = ''
 ): { modifiedAst: Program; id: string; pathToNode: PathToNode } {
   const _node = { ...node }
-  const _name = name || findUniqueName(node, 'part')
+  const _name =
+    name || findUniqueName(node, KCL_DEFAULT_CONSTANT_PREFIXES.SKETCH)
 
   const startSketchOn = createCallExpressionStdLib('startSketchOn', [
     createLiteral(axis),
@@ -109,7 +111,8 @@ export function addSketchTo(
   name = ''
 ): { modifiedAst: Program; id: string; pathToNode: PathToNode } {
   const _node = { ...node }
-  const _name = name || findUniqueName(node, 'part')
+  const _name =
+    name || findUniqueName(node, KCL_DEFAULT_CONSTANT_PREFIXES.SKETCH)
 
   const startSketchOn = createCallExpressionStdLib('startSketchOn', [
     createLiteral(axis.toUpperCase()),
@@ -242,7 +245,7 @@ export function mutateObjExpProp(
 export function extrudeSketch(
   node: Program,
   pathToNode: PathToNode,
-  shouldPipe = true,
+  shouldPipe = false,
   distance = createLiteral(4) as Value
 ): {
   modifiedAst: Program
@@ -293,12 +296,22 @@ export function extrudeSketch(
       pathToExtrudeArg,
     }
   }
-  const name = findUniqueName(node, 'part')
+
+  // We're not creating a pipe expression,
+  // but rather a separate constant for the extrusion
+  const name = findUniqueName(node, KCL_DEFAULT_CONSTANT_PREFIXES.EXTRUDE)
   const VariableDeclaration = createVariableDeclaration(name, extrudeCall)
-  _node.body.splice(_node.body.length, 0, VariableDeclaration)
+
+  const sketchIndexInPathToNode =
+    pathToDecleration.findIndex((a) => a[0] === 'body') + 1
+  const sketchIndexInBody = pathToDecleration[
+    sketchIndexInPathToNode
+  ][0] as number
+  _node.body.splice(sketchIndexInBody + 1, 0, VariableDeclaration)
+
   const pathToExtrudeArg: PathToNode = [
     ['body', ''],
-    [_node.body.length, 'index'],
+    [sketchIndexInBody + 1, 'index'],
     ['declarations', 'VariableDeclaration'],
     [0, 'index'],
     ['init', 'VariableDeclarator'],
@@ -306,7 +319,7 @@ export function extrudeSketch(
     [0, 'index'],
   ]
   return {
-    modifiedAst: node,
+    modifiedAst: _node,
     pathToNode: [...pathToNode.slice(0, -1), [-1, 'index']],
     pathToExtrudeArg,
   }
@@ -314,31 +327,41 @@ export function extrudeSketch(
 
 export function sketchOnExtrudedFace(
   node: Program,
-  pathToNode: PathToNode,
+  sketchPathToNode: PathToNode,
+  extrudePathToNode: PathToNode,
   programMemory: ProgramMemory,
   cap: 'none' | 'start' | 'end' = 'none'
 ): { modifiedAst: Program; pathToNode: PathToNode } {
   let _node = { ...node }
-  const newSketchName = findUniqueName(node, 'part')
+  const newSketchName = findUniqueName(
+    node,
+    KCL_DEFAULT_CONSTANT_PREFIXES.SKETCH
+  )
   const { node: oldSketchNode } = getNodeFromPath<VariableDeclarator>(
     _node,
-    pathToNode,
+    sketchPathToNode,
     'VariableDeclarator',
     true
   )
   const oldSketchName = oldSketchNode.id.name
   const { node: expression } = getNodeFromPath<CallExpression>(
     _node,
-    pathToNode,
+    sketchPathToNode,
     'CallExpression'
   )
+  const { node: extrudeVarDec } = getNodeFromPath<VariableDeclarator>(
+    _node,
+    extrudePathToNode,
+    'VariableDeclarator'
+  )
+  const extrudeName = extrudeVarDec.id?.name
 
   let _tag = ''
   if (cap === 'none') {
     const { modifiedAst, tag } = addTagForSketchOnFace(
       {
         previousProgramMemory: programMemory,
-        pathToNode,
+        pathToNode: sketchPathToNode,
         node: _node,
       },
       expression.callee.name
@@ -352,13 +375,16 @@ export function sketchOnExtrudedFace(
   const newSketch = createVariableDeclaration(
     newSketchName,
     createCallExpressionStdLib('startSketchOn', [
-      createIdentifier(oldSketchName),
+      createIdentifier(extrudeName ? extrudeName : oldSketchName),
       createLiteral(_tag),
     ]),
     'const'
   )
 
-  const expressionIndex = pathToNode[1][0] as number
+  const expressionIndex = Math.max(
+    sketchPathToNode[1][0] as number,
+    extrudePathToNode[1][0] as number
+  )
   _node.body.splice(expressionIndex + 1, 0, newSketch)
   const newpathToNode: PathToNode = [
     ['body', ''],

src/lang/std/engineConnection.ts

@@ -1,5 +1,5 @@
 import { PathToNode, Program, SourceRange } from 'lang/wasm'
-import { VITE_KC_API_WS_MODELING_URL, VITE_KC_CONNECTION_TIMEOUT_MS } from 'env'
+import { VITE_KC_API_WS_MODELING_URL } from 'env'
 import { Models } from '@kittycad/lib'
 import { exportSave } from 'lib/exportSave'
 import { uuidv4 } from 'lib/utils'
@@ -9,7 +9,31 @@ import { DefaultPlanes } from 'wasm-lib/kcl/bindings/DefaultPlanes'
 
 let lastMessage = ''
 
-interface CommandInfo {
+// TODO(paultag): This ought to be tweakable.
+const pingIntervalMs = 10000
+
+type CommandTypes = Models['ModelingCmd_type']['type'] | 'batch'
+
+type CommandInfo =
+  | {
+      commandType: 'extrude'
+      // commandType: CommandTypes
+      range: SourceRange
+      pathToNode: PathToNode
+      /// uuid of the entity to extrude
+      target: string
+      parentId?: string
+    }
+  | {
+      commandType: 'start_path'
+      // commandType: CommandTypes
+      range: SourceRange
+      pathToNode: PathToNode
+      /// uuid of the entity that have been extruded
+      extrusions: string[]
+      parentId?: string
+    }
+  | {
       commandType: CommandTypes
       range: SourceRange
       pathToNode: PathToNode
@@ -26,16 +50,22 @@ interface CommandInfo {
           }
     }
 
+function isHighlightSetEntity_type(
+  data: any
+): data is Models['HighlightSetEntity_type'] {
+  return data.entity_id && data.sequence
+}
+
 type WebSocketResponse = Models['WebSocketResponse_type']
 type OkWebSocketResponseData = Models['OkWebSocketResponseData_type']
 
-interface ResultCommand extends CommandInfo {
+type ResultCommand = CommandInfo & {
   type: 'result'
   data: any
   raw: WebSocketResponse
   headVertexId?: string
 }
-interface FailedCommand extends CommandInfo {
+type FailedCommand = CommandInfo & {
   type: 'failed'
   errors: Models['FailureWebSocketResponse_type']['errors']
 }
@@ -48,12 +78,14 @@ interface ResolveCommand {
   data?: Models['OkModelingCmdResponse_type']
   errors?: Models['FailureWebSocketResponse_type']['errors']
 }
-interface PendingCommand extends CommandInfo {
+type PendingCommand = CommandInfo & {
   type: 'pending'
   promise: Promise<any>
   resolve: (val: ResolveCommand) => void
 }
 
+export type ArtifactMapCommand = ResultCommand | PendingCommand | FailedCommand
+
 /**
  * The ArtifactMap is a client-side representation of the artifacts that
  * have been sent to the server-side engine. It is used to keep track of
@@ -63,7 +95,7 @@ interface PendingCommand extends CommandInfo {
  * lines of KCL code that generated them.
  */
 export interface ArtifactMap {
-  [commandId: string]: ResultCommand | PendingCommand | FailedCommand
+  [commandId: string]: ArtifactMapCommand
 }
 
 interface NewTrackArgs {
@@ -110,9 +142,54 @@ export enum DisconnectingType {
   Quit = 'quit',
 }
 
+// Sorted by severity
+export enum ConnectionError {
+  Unset = 0,
+  LongLoadingTime,
+
+  LostVideoStream,
+  ICENegotiate,
+  DataChannelError,
+  WebSocketError,
+  LocalDescriptionInvalid,
+
+  // These are more severe than protocol errors because they don't even allow
+  // the program to do any protocol messages in the first place if they occur.
+  MissingAuthToken,
+  BadAuthToken,
+  TooManyConnections,
+
+  // An unknown error is the most severe because it has not been classified
+  // or encountered before.
+  Unknown,
+}
+
+export const CONNECTION_ERROR_TEXT: Record<ConnectionError, string> = {
+  [ConnectionError.Unset]: '',
+  [ConnectionError.LongLoadingTime]:
+    'Loading is taking longer than expected...',
+  [ConnectionError.LostVideoStream]:
+    'Lost connection to video stream... Reconnecting...',
+  [ConnectionError.ICENegotiate]: 'ICE negotiation failed.',
+  [ConnectionError.DataChannelError]: 'The data channel signaled an error.',
+  [ConnectionError.WebSocketError]: 'The websocket signaled an error.',
+  [ConnectionError.LocalDescriptionInvalid]:
+    'The local description is invalid.',
+  [ConnectionError.MissingAuthToken]:
+    'Your authorization token is missing; please login again.',
+  [ConnectionError.BadAuthToken]:
+    'Your authorization token is invalid; please login again.',
+  [ConnectionError.TooManyConnections]: 'There are too many connections.',
+  [ConnectionError.Unknown]:
+    'An unexpected error occurred. Please report this to us.',
+}
+
 export interface ErrorType {
-  // We may not necessary have an error to assign.
-  error?: Error
+  // The error we've encountered.
+  error: ConnectionError
+
+  // Additional context.
+  context?: any
 
   // We assign this in the state setter because we may have not failed at
   // a Connecting state, which we check for there.
@@ -127,7 +204,7 @@ export type DisconnectingValue =
 // These are ordered by the expected sequence.
 export enum ConnectingType {
   WebSocketConnecting = 'websocket-connecting',
-  WebSocketEstablished = 'websocket-established',
+  WebSocketOpen = 'websocket-open',
   PeerConnectionCreated = 'peer-connection-created',
   ICEServersSet = 'ice-servers-set',
   SetLocalDescription = 'set-local-description',
@@ -154,7 +231,7 @@ export const initialConnectingTypeGroupState: Record<
 > = {
   [ConnectingTypeGroup.WebSocket]: [
     [ConnectingType.WebSocketConnecting, undefined],
-    [ConnectingType.WebSocketEstablished, undefined],
+    [ConnectingType.WebSocketOpen, undefined],
   ],
   [ConnectingTypeGroup.ICE]: [
     [ConnectingType.PeerConnectionCreated, undefined],
@@ -176,7 +253,7 @@ export const initialConnectingTypeGroupState: Record<
 
 export type ConnectingValue =
   | State<ConnectingType.WebSocketConnecting, void>
-  | State<ConnectingType.WebSocketEstablished, void>
+  | State<ConnectingType.WebSocketOpen, void>
   | State<ConnectingType.PeerConnectionCreated, void>
   | State<ConnectingType.ICEServersSet, void>
   | State<ConnectingType.SetLocalDescription, void>
@@ -197,12 +274,28 @@ export type EngineConnectionState =
   | State<EngineConnectionStateType.Disconnecting, DisconnectingValue>
   | State<EngineConnectionStateType.Disconnected, void>
 
-/**
- * EngineConnection encapsulates the connection(s) to the Engine
- * for the EngineCommandManager; namely, the underlying WebSocket
- * and WebRTC connections.
- */
-class EngineConnection {
+export type PingPongState = 'OK' | 'TIMEOUT'
+
+export enum EngineConnectionEvents {
+  // Fires for each ping-pong success or failure.
+  PingPongChanged = 'ping-pong-changed', // (state: PingPongState) => void
+
+  // For now, this is only used by the NetworkHealthIndicator.
+  // We can eventually use it for more, but one step at a time.
+  ConnectionStateChanged = 'connection-state-changed', // (state: EngineConnectionState) => void
+
+  // These are used for the EngineCommandManager and were created
+  // before onConnectionStateChange existed.
+  ConnectionStarted = 'connection-started', // (engineConnection: EngineConnection) => void
+  Opened = 'opened', // (engineConnection: EngineConnection) => void
+  Closed = 'closed', // (engineConnection: EngineConnection) => void
+  NewTrack = 'new-track', // (track: NewTrackArgs) => void
+}
+
+// EngineConnection encapsulates the connection(s) to the Engine
+// for the EngineCommandManager; namely, the underlying WebSocket
+// and WebRTC connections.
+class EngineConnection extends EventTarget {
   websocket?: WebSocket
   pc?: RTCPeerConnection
   unreliableDataChannel?: RTCDataChannel
@@ -222,12 +315,13 @@ class EngineConnection {
     if (next.type === EngineConnectionStateType.Disconnecting) {
       const sub = next.value
       if (sub.type === DisconnectingType.Error) {
+        console.log(sub)
+
         // Record the last step we failed at.
         // (Check the current state that we're about to override that
         // it was a Connecting state.)
-        console.log(sub)
         if (this._state.type === EngineConnectionStateType.Connecting) {
-          if (!sub.value) sub.value = {}
+          if (!sub.value) sub.value = { error: ConnectionError.Unknown }
           sub.value.lastConnectingValue = this._state.value
         }
 
@@ -235,7 +329,12 @@ class EngineConnection {
       }
     }
     this._state = next
-    this.onConnectionStateChange(this._state)
+
+    this.dispatchEvent(
+      new CustomEvent(EngineConnectionEvents.ConnectionStateChanged, {
+        detail: this._state,
+      })
+    )
   }
 
   private failedConnTimeout: IsomorphicTimeout | null
@@ -243,95 +342,82 @@ class EngineConnection {
   readonly url: string
   private readonly token?: string
 
-  /**For now, this is only used by the NetworkHealthIndicator.
-   * We can eventually use it for more, but one step at a time.
-   */
-  private onConnectionStateChange: (state: EngineConnectionState) => void
-
-  /**
-   * Used for the EngineCommandManager, created before
-   * onConnectionStateChange existed.
-   */
-  private onEngineConnectionOpen: (engineConnection: EngineConnection) => void
-  /**
-   * Used for the EngineCommandManager, created before
-   * onConnectionStateChange existed.
-   */
-  private onConnectionStarted: (engineConnection: EngineConnection) => void
-  /**
-   * Used for the EngineCommandManager, created before
-   * onConnectionStateChange existed.
-   */
-  private onClose: (engineConnection: EngineConnection) => void
-  /**
-   * Used for the EngineCommandManager, created before
-   * onConnectionStateChange existed.
-   */
-  private onNewTrack: (track: NewTrackArgs) => void
-
-  /**
-   * @todo actual type is `ClientMetrics`
-   */
+  // TODO: actual type is ClientMetrics
   public webrtcStatsCollector?: () => Promise<WebRTCClientMetrics>
   private engineCommandManager: EngineCommandManager
 
+  private pingPongSpan: { ping?: Date; pong?: Date }
+
   constructor({
     engineCommandManager,
     url,
     token,
-    onConnectionStateChange = () => {},
-    onNewTrack = () => {},
-    onEngineConnectionOpen = () => {},
-    onConnectionStarted = () => {},
-    onClose = () => {},
   }: {
     engineCommandManager: EngineCommandManager
     url: string
     token?: string
-    onConnectionStateChange?: (state: EngineConnectionState) => void
-    onEngineConnectionOpen?: (engineConnection: EngineConnection) => void
-    onConnectionStarted?: (engineConnection: EngineConnection) => void
-    onClose?: (engineConnection: EngineConnection) => void
-    onNewTrack?: (track: NewTrackArgs) => void
   }) {
+    super()
+
     this.engineCommandManager = engineCommandManager
     this.url = url
     this.token = token
     this.failedConnTimeout = null
-    this.onConnectionStateChange = onConnectionStateChange
-    this.onEngineConnectionOpen = onEngineConnectionOpen
-    this.onConnectionStarted = onConnectionStarted
 
-    this.onClose = onClose
-    this.onNewTrack = onNewTrack
-
-    // TODO(paultag): This ought to be tweakable.
-    const pingIntervalMs = 10000
+    this.pingPongSpan = { ping: undefined, pong: undefined }
 
     // Without an interval ping, our connection will timeout.
-    let pingInterval = setInterval(() => {
+    setInterval(() => {
       switch (this.state.type as EngineConnectionStateType) {
         case EngineConnectionStateType.ConnectionEstablished:
+          // If there was no reply to the last ping, report a timeout.
+          if (this.pingPongSpan.ping && !this.pingPongSpan.pong) {
+            this.dispatchEvent(
+              new CustomEvent(EngineConnectionEvents.PingPongChanged, {
+                detail: 'TIMEOUT',
+              })
+            )
+            // Otherwise check the time between was >= pingIntervalMs,
+            // and if it was, then it's bad network health.
+          } else if (this.pingPongSpan.ping && this.pingPongSpan.pong) {
+            if (
+              Math.abs(
+                this.pingPongSpan.pong.valueOf() -
+                  this.pingPongSpan.ping.valueOf()
+              ) >= pingIntervalMs
+            ) {
+              this.dispatchEvent(
+                new CustomEvent(EngineConnectionEvents.PingPongChanged, {
+                  detail: 'TIMEOUT',
+                })
+              )
+            } else {
+              this.dispatchEvent(
+                new CustomEvent(EngineConnectionEvents.PingPongChanged, {
+                  detail: 'OK',
+                })
+              )
+            }
+          }
+
           this.send({ type: 'ping' })
+          this.pingPongSpan.ping = new Date()
+          this.pingPongSpan.pong = undefined
           break
         case EngineConnectionStateType.Disconnecting:
         case EngineConnectionStateType.Disconnected:
-          clearInterval(pingInterval)
+          // Reconnect if we have disconnected.
+          if (!this.isConnecting()) this.connect(true)
           break
         default:
+          if (this.isConnecting()) break
+          // Means we never could do an initial connection. Reconnect everything.
+          if (!this.pingPongSpan.ping) this.connect(true)
           break
       }
     }, pingIntervalMs)
 
-    const connectionTimeoutMs = VITE_KC_CONNECTION_TIMEOUT_MS
-    let connectRetryInterval = setInterval(() => {
-      if (this.state.type !== EngineConnectionStateType.Disconnected) return
-
-      // Only try reconnecting when completely disconnected.
-      clearInterval(connectRetryInterval)
-      console.log('Trying to reconnect')
     this.connect()
-    }, connectionTimeoutMs)
   }
 
   isConnecting() {
@@ -357,18 +443,23 @@ class EngineConnection {
    * This will attempt the full handshake, and retry if the connection
    * did not establish.
    */
-  connect() {
+  connect(reconnecting?: boolean) {
     if (this.isConnecting() || this.isReady()) {
       return
     }
 
-    // Information on the connect transaction
-
     const createPeerConnection = () => {
       this.pc = new RTCPeerConnection({
         bundlePolicy: 'max-bundle',
       })
 
+      // Other parts of the application expect pc to be initialized when firing.
+      this.dispatchEvent(
+        new CustomEvent(EngineConnectionEvents.ConnectionStarted, {
+          detail: this,
+        })
+      )
+
       // Data channels MUST BE specified before SDP offers because requesting
       // them affects what our needs are!
       const DATACHANNEL_NAME_UMC = 'unreliable_modeling_cmds'
@@ -422,7 +513,11 @@ class EngineConnection {
           // dance is it safest to connect the video tracks / stream
           case 'connected':
             // Let the browser attach to the video stream now
-            this.onNewTrack({ conn: this, mediaStream: this.mediaStream! })
+            this.dispatchEvent(
+              new CustomEvent(EngineConnectionEvents.NewTrack, {
+                detail: { conn: this, mediaStream: this.mediaStream! },
+              })
+            )
             break
           case 'failed':
             this.disconnectAll()
@@ -431,9 +526,8 @@ class EngineConnection {
               value: {
                 type: DisconnectingType.Error,
                 value: {
-                  error: new Error(
-                    'failed to negotiate ice connection; restarting'
-                  ),
+                  error: ConnectionError.ICENegotiate,
+                  context: event,
                 },
               },
             }
@@ -552,7 +646,10 @@ class EngineConnection {
           this.state = { type: EngineConnectionStateType.ConnectionEstablished }
 
           this.engineCommandManager.inSequence = 1
-          this.onEngineConnectionOpen(this)
+
+          this.dispatchEvent(
+            new CustomEvent(EngineConnectionEvents.Opened, { detail: this })
+          )
         })
 
         this.unreliableDataChannel.addEventListener('close', (event) => {
@@ -568,7 +665,8 @@ class EngineConnection {
             value: {
               type: DisconnectingType.Error,
               value: {
-                error: new Error(event.toString()),
+                error: ConnectionError.DataChannelError,
+                context: event,
               },
             },
           }
@@ -599,6 +697,7 @@ class EngineConnection {
       })
     }
 
+    const createWebSocketConnection = () => {
       this.state = {
         type: EngineConnectionStateType.Connecting,
         value: {
@@ -613,7 +712,7 @@ class EngineConnection {
         this.state = {
           type: EngineConnectionStateType.Connecting,
           value: {
-          type: ConnectingType.WebSocketEstablished,
+            type: ConnectingType.WebSocketOpen,
           },
         }
 
@@ -626,6 +725,10 @@ class EngineConnection {
             headers: { Authorization: `Bearer ${this.token}` },
           })
         }
+
+        // Send an initial ping
+        this.send({ type: 'ping' })
+        this.pingPongSpan.ping = new Date()
       })
 
       this.websocket.addEventListener('close', (event) => {
@@ -641,7 +744,8 @@ class EngineConnection {
           value: {
             type: DisconnectingType.Error,
             value: {
-            error: new Error(event.toString()),
+              error: ConnectionError.WebSocketError,
+              context: event,
             },
           },
         }
@@ -655,6 +759,8 @@ class EngineConnection {
         // when assuming we're the only consumer or that all messages will
         // be carefully formatted here.
 
+        console.log(event)
+
         if (typeof event.data !== 'string') {
           return
         }
@@ -675,21 +781,39 @@ class EngineConnection {
               `Error in response to request ${message.request_id}:\n${errorsString}
   failed cmd type was ${artifactThatFailed?.commandType}`
             )
+            console.log(artifactThatFailed)
           } else {
             console.error(`Error from server:\n${errorsString}`)
           }
+
+          const firstError = message?.errors[0]
+          if (firstError.error_code === 'auth_token_invalid') {
+            this.state = {
+              type: EngineConnectionStateType.Disconnecting,
+              value: {
+                type: DisconnectingType.Error,
+                value: {
+                  error: ConnectionError.BadAuthToken,
+                  context: firstError.message,
+                },
+              },
+            }
+            this.disconnectAll()
+          }
           return
         }
 
         let resp = message.resp
 
         // If there's no body to the response, we can bail here.
-      // !resp.type is usually "pong" response for our "ping"
         if (!resp || !resp.type) {
           return
         }
 
         switch (resp.type) {
+          case 'pong':
+            this.pingPongSpan.pong = new Date()
+            break
           case 'ice_server_info':
             let ice_servers = resp.data?.ice_servers
 
@@ -758,10 +882,7 @@ failed cmd type was ${artifactThatFailed?.commandType}`
                 return this.pc?.setLocalDescription(offer).then(() => {
                   this.send({
                     type: 'sdp_offer',
-                  offer: {
-                    sdp: offer.sdp || '',
-                    type: offer.type,
-                  },
+                    offer: offer as Models['RtcSessionDescription_type'],
                   })
                   this.state = {
                     type: EngineConnectionStateType.Connecting,
@@ -771,8 +892,7 @@ failed cmd type was ${artifactThatFailed?.commandType}`
                   }
                 })
               })
-            .catch((error: Error) => {
-              console.error(error)
+              .catch((err: Error) => {
                 // The local description is invalid, so there's no point continuing.
                 this.disconnectAll()
                 this.state = {
@@ -780,7 +900,8 @@ failed cmd type was ${artifactThatFailed?.commandType}`
                   value: {
                     type: DisconnectingType.Error,
                     value: {
-                    error,
+                      error: ConnectionError.LocalDescriptionInvalid,
+                      context: err,
                     },
                   },
                 }
@@ -841,28 +962,15 @@ failed cmd type was ${artifactThatFailed?.commandType}`
             break
         }
       })
+    }
 
-    const connectionTimeoutMs = VITE_KC_CONNECTION_TIMEOUT_MS
-    if (this.failedConnTimeout) {
-      clearTimeout(this.failedConnTimeout)
-      this.failedConnTimeout = null
+    if (reconnecting) {
+      createWebSocketConnection()
+    } else {
+      window.addEventListener('use-network-status-ready', () => {
+        createWebSocketConnection()
+      })
     }
-    this.failedConnTimeout = setTimeout(() => {
-      if (this.isReady()) {
-        return
-      }
-      this.failedConnTimeout = null
-      this.state = {
-        type: EngineConnectionStateType.Disconnecting,
-        value: {
-          type: DisconnectingType.Timeout,
-        },
-      }
-      this.disconnectAll()
-      this.finalizeIfAllConnectionsClosed()
-    }, connectionTimeoutMs)
-
-    this.onConnectionStarted(this)
   }
   // Do not change this back to an object or any, we should only be sending the
   // WebSocketRequest type!
@@ -903,8 +1011,6 @@ failed cmd type was ${artifactThatFailed?.commandType}`
 export type EngineCommand = Models['WebSocketRequest_type']
 type ModelTypes = Models['OkModelingCmdResponse_type']['type']
 
-type CommandTypes = Models['ModelingCmd_type']['type'] | 'batch'
-
 type UnreliableResponses = Extract<
   Models['OkModelingCmdResponse_type'],
   { type: 'highlight_set_entity' | 'camera_drag_move' }
@@ -914,6 +1020,8 @@ export interface UnreliableSubscription<T extends UnreliableResponses['type']> {
   callback: (data: Extract<UnreliableResponses, { type: T }>) => void
 }
 
+// TODO: Should eventually be replaced with native EventTarget event system,
+// as it manages events in a more familiar way to other developers.
 export interface Subscription<T extends ModelTypes> {
   event: T
   callback: (
@@ -941,6 +1049,10 @@ export type CommandLog =
       data: null
     }
 
+export enum EngineCommandManagerEvents {
+  EngineAvailable = 'engine-available',
+}
+
 /**
  * The EngineCommandManager is the main interface to the Engine for Modeling App.
  *
@@ -951,7 +1063,7 @@ export type CommandLog =
  * It also maintains an {@link artifactMap} that keeps track of the state of each
  * command, and the artifacts that have been generated by those commands.
  */
-export class EngineCommandManager {
+export class EngineCommandManager extends EventTarget {
   /**
    * The artifactMap is a client-side representation of the commands that have been sent
    * to the server-side geometry engine, and the state of their resulting artifacts.
@@ -1020,10 +1132,9 @@ export class EngineCommandManager {
     }
   } = {} as any
 
-  callbacksEngineStateConnection: ((state: EngineConnectionState) => void)[] =
-    []
-
   constructor(pool?: string) {
+    super()
+
     this.engineConnection = undefined
     this.pool = pool
   }
@@ -1088,14 +1199,22 @@ export class EngineCommandManager {
       engineCommandManager: this,
       url,
       token,
-      onConnectionStateChange: (state: EngineConnectionState) => {
-        for (let cb of this.callbacksEngineStateConnection) {
-          cb(state)
-        }
-      },
-      onEngineConnectionOpen: () => {
+    })
+
+    this.dispatchEvent(
+      new CustomEvent(EngineCommandManagerEvents.EngineAvailable, {
+        detail: this.engineConnection,
+      })
+    )
+
+    this.engineConnection.addEventListener(
+      EngineConnectionEvents.Opened,
+      () => {
         // Set the stream background color
-        this.sendSceneCommand({
+        // This takes RGBA values from 0-1
+        // So we convert from the conventional 0-255 found in Figma
+
+        void this.sendSceneCommand({
           type: 'modeling_cmd_req',
           cmd_id: uuidv4(),
           cmd: {
@@ -1141,14 +1260,58 @@ export class EngineCommandManager {
           setIsStreamReady(true)
           await executeCode()
         })
-      },
-      onClose: () => {
+      }
+    )
+
+    this.engineConnection.addEventListener(
+      EngineConnectionEvents.Closed,
+      () => {
         setIsStreamReady(false)
-      },
-      onConnectionStarted: (engineConnection) => {
+      }
+    )
+
+    this.engineConnection.addEventListener(
+      EngineConnectionEvents.ConnectionStarted,
+      ({ detail: engineConnection }: any) => {
+        engineConnection?.pc?.addEventListener(
+          'datachannel',
+          (event: RTCDataChannelEvent) => {
+            let unreliableDataChannel = event.channel
+
+            unreliableDataChannel.addEventListener(
+              'message',
+              (event: MessageEvent) => {
+                const result: UnreliableResponses = JSON.parse(event.data)
+                Object.values(
+                  this.unreliableSubscriptions[result.type] || {}
+                ).forEach(
+                  // TODO: There is only one response that uses the unreliable channel atm,
+                  // highlight_set_entity, if there are more it's likely they will all have the same
+                  // sequence logic, but I'm not sure if we use a single global sequence or a sequence
+                  // per unreliable subscription.
+                  (callback) => {
+                    let data = result?.data
+                    if (isHighlightSetEntity_type(data)) {
+                      if (
+                        data.sequence !== undefined &&
+                        data.sequence > this.inSequence
+                      ) {
+                        this.inSequence = data.sequence
+                        callback(result)
+                      }
+                    }
+                  }
+                )
+              }
+            )
+          }
+        )
+
         // When the EngineConnection starts a connection, we want to register
         // callbacks into the WebSocket/PeerConnection.
-        engineConnection.websocket?.addEventListener('message', (event) => {
+        engineConnection.websocket?.addEventListener('message', ((
+          event: MessageEvent
+        ) => {
           if (event.data instanceof ArrayBuffer) {
             // If the data is an ArrayBuffer, it's  the result of an export command,
             // because in all other cases we send JSON strings. But in the case of
@@ -1179,23 +1342,36 @@ export class EngineCommandManager {
               this.handleFailedModelingCommand(message.request_id, message)
             }
           }
-        })
-      },
-      onNewTrack: ({ mediaStream }) => {
+        }) as EventListener)
+
+        this.engineConnection?.addEventListener(
+          EngineConnectionEvents.NewTrack,
+          (({ detail: { mediaStream } }: CustomEvent<NewTrackArgs>) => {
             console.log('received track', mediaStream)
 
             mediaStream.getVideoTracks()[0].addEventListener('mute', () => {
-          console.log('peer is not sending video to us')
-          // this.engineConnection?.close()
-          // this.engineConnection?.connect()
+              if (this.engineConnection) {
+                this.engineConnection.state = {
+                  type: EngineConnectionStateType.Disconnecting,
+                  value: {
+                    type: DisconnectingType.Error,
+                    value: {
+                      error: ConnectionError.LostVideoStream,
+                    },
+                  },
+                }
+              }
             })
 
             setMediaStream(mediaStream)
-      },
-    })
+          }) as EventListener
+        )
 
         this.engineConnection?.connect()
       }
+    )
+  }
+
   handleResize({
     streamWidth,
     streamHeight,
@@ -1443,9 +1619,6 @@ export class EngineCommandManager {
   ) {
     delete this.unreliableSubscriptions[event][id]
   }
-  onConnectionStateChange(callback: (state: EngineConnectionState) => void) {
-    this.callbacksEngineStateConnection.push(callback)
-  }
   // We make this a separate function so we can call it from wasm.
   clearDefaultPlanes() {
     this.defaultPlanes = null
@@ -1662,9 +1835,12 @@ export class EngineCommandManager {
       if (command.type === 'solid3d_get_extrusion_face_info') {
         const edgeArtifact = this.artifactMap[command.edge_id]
         // edges's parent id is to the original "start_path" artifact
-        if (edgeArtifact?.parentId) return edgeArtifact.parentId
+        if (edgeArtifact && edgeArtifact.parentId) {
+          return edgeArtifact.parentId
+        }
       }
       if (command.type === 'close_path') return command.path_id
+      if (command.type === 'extrude') return command.target
       // handle other commands that have a parent here
     }
     const pathToNode = ast
@@ -1679,6 +1855,33 @@ export class EngineCommandManager {
       promise,
       resolve,
     }
+    if (command.type === 'extrude') {
+      this.artifactMap[id] = {
+        range: range || [0, 0],
+        pathToNode,
+        type: 'pending',
+        commandType: 'extrude',
+        parentId: getParentId(),
+        promise,
+        target: command.target,
+        resolve,
+      }
+      const target = this.artifactMap[command.target]
+      if (target.commandType === 'start_path') {
+        // tsc cannot infer that target can have extrusions
+        // from the commandType (why?) so we need to cast it
+        const typedTarget = target as (
+          | PendingCommand
+          | ResultCommand
+          | FailedCommand
+        ) & { extrusions?: string[] }
+        if (typedTarget?.extrusions?.length) {
+          typedTarget.extrusions.push(id)
+        } else {
+          typedTarget.extrusions = [id]
+        }
+      }
+    }
     return promise
   }
   async handlePendingBatchCommand(

src/lib/constants.ts

@@ -44,5 +44,13 @@ export const RELEVANT_FILE_TYPES = [
 ] as const
 /** The default name for a tutorial project */
 export const ONBOARDING_PROJECT_NAME = 'Tutorial Project $nn'
+/**
+ * The default starting constant name for various modeling operations.
+ * These are used to generate unique names for new objects.
+ * */
+export const KCL_DEFAULT_CONSTANT_PREFIXES = {
+  SKETCH: 'sketch',
+  EXTRUDE: 'extrude',
+} as const
 /** The default KCL length expression */
 export const KCL_DEFAULT_LENGTH = `5`

src/lib/selections.ts

@@ -318,7 +318,6 @@ function resetAndSetEngineEntitySelectionCmds(
   selections: SelectionToEngine[]
 ): Models['WebSocketRequest_type'][] {
   if (!engineCommandManager.engineConnection?.isReady()) {
-    console.log('engine connection is not ready')
     return []
   }
   return [

src/lib/settings/initialKeybindings.ts

@@ -0,0 +1,182 @@
+import { isTauri } from 'lib/isTauri'
+
+export type InteractionMapItem = {
+  name: string
+  sequence: string
+  title: string
+  description: string
+}
+
+/**
+ * Controls both the available names for interaction map categories
+ * and the order in which they are displayed.
+ */
+export const interactionMapCategories = [
+  'Sketching',
+  'Modeling',
+  'Command Palette',
+  'Settings',
+  'Panes',
+  'Code Editor',
+  'File Tree',
+  'Miscellaneous',
+]
+
+type InteractionMapCategory = (typeof interactionMapCategories)[number]
+
+/**
+ * A temporary implementation of the interaction map for
+ * display purposes only.
+ * @todo Implement a proper interaction map
+ * that can be edited, saved, and loaded. This is underway in the
+ * franknoirot/editable-hotkeys branch.
+ */
+export const interactionMap: Record<
+  InteractionMapCategory,
+  InteractionMapItem[]
+> = {
+  Settings: [
+    {
+      name: 'toggle-settings',
+      sequence: isTauri() ? 'Meta+,' : 'Shift+Meta+,',
+      title: 'Toggle Settings',
+      description: 'Opens the settings dialog. Always available.',
+    },
+    {
+      name: 'settings-search',
+      sequence: 'Control+.',
+      title: 'Settings Search',
+      description:
+        'Focus the settings search input. Available when settings are open.',
+    },
+  ],
+  'Command Palette': [
+    {
+      name: 'toggle-command-palette',
+      sequence: 'Meta+K',
+      title: 'Toggle Command Palette',
+      description: 'Always available. Use Ctrl+/ on Windows/Linux.',
+    },
+  ],
+  Panes: [
+    {
+      name: 'toggle-code-pane',
+      sequence: 'Shift+C',
+      title: 'Toggle Code Pane',
+      description:
+        'Available while modeling when not typing in the code editor.',
+    },
+    {
+      name: 'toggle-variables-pane',
+      sequence: 'Shift+V',
+      title: 'Toggle Variables Pane',
+      description:
+        'Available while modeling when not typing in the code editor.',
+    },
+    {
+      name: 'toggle-logs-pane',
+      sequence: 'Shift+L',
+      title: 'Toggle Logs Pane',
+      description:
+        'Available while modeling when not typing in the code editor.',
+    },
+    {
+      name: 'toggle-errors-pane',
+      sequence: 'Shift+E',
+      title: 'Toggle Errors Pane',
+      description:
+        'Available while modeling when not typing in the code editor.',
+    },
+  ],
+  Sketching: [
+    {
+      name: 'enter-sketch-mode',
+      sequence: 'S',
+      title: 'Enter Sketch Mode',
+      description:
+        'Available while modeling when not typing in the code editor.',
+    },
+    {
+      name: 'unequip-sketch-tool',
+      sequence: 'Escape',
+      title: 'Unequip Sketch Tool',
+      description:
+        'Unequips the current sketch tool. Available while sketching.',
+    },
+    {
+      name: 'exit-sketch-mode',
+      sequence: 'Escape',
+      title: 'Exit Sketch Mode',
+      description: 'Available while sketching, if no sketch tool is equipped.',
+    },
+    {
+      name: 'toggle-line-tool',
+      sequence: 'L',
+      title: 'Toggle Line Tool',
+      description:
+        'Available while sketching, when not typing in the code editor.',
+    },
+    {
+      name: 'toggle-rectangle-tool',
+      sequence: 'R',
+      title: 'Toggle Rectangle Tool',
+      description:
+        'Available while sketching, when not typing in the code editor.',
+    },
+    {
+      name: 'toggle-arc-tool',
+      sequence: 'A',
+      title: 'Toggle Arc Tool',
+      description:
+        'Available while sketching, when not typing in the code editor.',
+    },
+  ],
+  Modeling: [
+    {
+      name: 'extrude',
+      sequence: 'E',
+      title: 'Extrude',
+      description:
+        'Available while modeling with either a face selected or an empty selection, when not typing in the code editor.',
+    },
+  ],
+  'Code Editor': [
+    {
+      name: 'format-code',
+      sequence: 'Shift+Alt+F',
+      title: 'Format Code',
+      description:
+        'Nicely formats the KCL code in the editor, available when the editor is focused.',
+    },
+  ],
+  'File Tree': [
+    {
+      name: 'rename-file',
+      sequence: 'Enter',
+      title: 'Rename File/Folder',
+      description:
+        'Available when a file or folder is selected in the file tree.',
+    },
+    {
+      name: 'delete-file',
+      sequence: 'Meta+Backspace',
+      title: 'Delete File/Folder',
+      description:
+        'Available when a file or folder is selected in the file tree.',
+    },
+  ],
+}
+
+/**
+ * Sorts interaction map categories by their order in the
+ * `interactionMapCategories` array.
+ */
+export function sortInteractionMapByCategory(
+  [categoryA]: [InteractionMapCategory, InteractionMapItem[]],
+  [categoryB]: [InteractionMapCategory, InteractionMapItem[]]
+) {
+  return (
+    interactionMapCategories.indexOf(categoryA) -
+    interactionMapCategories.indexOf(categoryB)
+  )
+}

src/machines/modelingMachine.ts

@@ -145,7 +145,8 @@ export type ModelingMachineEvent =
         | {
             type: 'extrudeFace'
             position: [number, number, number]
-            extrudeSegmentPathToNode: PathToNode
+            sketchPathToNode: PathToNode
+            extrudePathToNode: PathToNode
             cap: 'start' | 'end' | 'none'
             faceId: string
           }
@@ -883,7 +884,7 @@ export const modelingMachine = createMachine(
         const { modifiedAst, pathToExtrudeArg } = extrudeSketch(
           ast,
           pathToNode,
-          true,
+          false,
           'variableName' in distance
             ? distance.variableIdentifierAst
             : distance.valueAst

src/routes/Settings.tsx

@@ -1,28 +1,17 @@
-import { ActionButton } from '../components/ActionButton'
-import { SetEventTypes, SettingsLevel } from 'lib/settings/settingsTypes'
+import { SettingsLevel } from 'lib/settings/settingsTypes'
 import { useLocation, useNavigate, useSearchParams } from 'react-router-dom'
 import { useHotkeys } from 'react-hotkeys-hook'
 import { paths } from 'lib/paths'
-import { useSettingsAuthContext } from 'hooks/useSettingsAuthContext'
 import { useDotDotSlash } from 'hooks/useDotDotSlash'
-import { createAndOpenNewProject, getSettingsFolderPaths } from 'lib/tauriFS'
-import { sep } from '@tauri-apps/api/path'
-import { isTauri } from 'lib/isTauri'
-import toast from 'react-hot-toast'
 import { Fragment, useEffect, useRef } from 'react'
-import { Setting } from 'lib/settings/initialSettings'
-import decamelize from 'decamelize'
 import { Dialog, Transition } from '@headlessui/react'
 import { CustomIcon } from 'components/CustomIcon'
-import {
-  shouldHideSetting,
-  shouldShowSettingInput,
-} from 'lib/settings/settingsUtils'
-import { getInitialDefaultDir, showInFolder } from 'lib/tauri'
 import { SettingsSearchBar } from 'components/Settings/SettingsSearchBar'
 import { SettingsTabs } from 'components/Settings/SettingsTabs'
-import { SettingsSection } from 'components/Settings/SettingsSection'
-import { SettingsFieldInput } from 'components/Settings/SettingsFieldInput'
+import { SettingsSectionsList } from 'components/Settings/SettingsSectionsList'
+import { AllSettingsFields } from 'components/Settings/AllSettingsFields'
+import { AllKeybindingsFields } from 'components/Settings/AllKeybindingsFields'
+import { KeybindingsSectionsList } from 'components/Settings/KeybindingsSectionsList'
 
 export const APP_VERSION = import.meta.env.PACKAGE_VERSION || 'unknown'
 
@@ -33,40 +22,12 @@ export const Settings = () => {
   const location = useLocation()
   const isFileSettings = location.pathname.includes(paths.FILE)
   const searchParamTab =
-    (searchParams.get('tab') as SettingsLevel) ??
+    (searchParams.get('tab') as SettingsLevel | 'keybindings') ??
     (isFileSettings ? 'project' : 'user')
-  const projectPath =
-    isFileSettings && isTauri()
-      ? decodeURI(
-          location.pathname
-            .replace(paths.FILE + '/', '')
-            .replace(paths.SETTINGS, '')
-            .slice(0, decodeURI(location.pathname).lastIndexOf(sep()))
-        )
-      : undefined
 
   const scrollRef = useRef<HTMLDivElement>(null)
   const dotDotSlash = useDotDotSlash()
   useHotkeys('esc', () => navigate(dotDotSlash()))
-  const {
-    settings: {
-      send,
-      state: { context },
-    },
-  } = useSettingsAuthContext()
-
-  function restartOnboarding() {
-    send({
-      type: `set.app.onboardingStatus`,
-      data: { level: 'user', value: '' },
-    })
-
-    if (isFileSettings) {
-      navigate(dotDotSlash(1) + paths.ONBOARDING.INDEX)
-    } else {
-      createAndOpenNewProject(navigate)
-    }
-  }
 
   // Scroll to the hash on load if it exists
   useEffect(() => {
@@ -137,233 +98,24 @@ export const Settings = () => {
                 gridTemplateRows: '1fr',
               }}
             >
-              <div className="flex w-32 flex-col gap-3 pr-2 py-1 border-0 border-r border-r-chalkboard-20 dark:border-r-chalkboard-90">
-                {Object.entries(context)
-                  .filter(([_, categorySettings]) =>
-                    // Filter out categories that don't have any non-hidden settings
-                    Object.values(categorySettings).some(
-                      (setting: Setting) =>
-                        !shouldHideSetting(setting, searchParamTab)
-                    )
-                  )
-                  .map(([category]) => (
-                    <button
-                      key={category}
-                      onClick={() =>
-                        scrollRef.current
-                          ?.querySelector(`#category-${category}`)
-                          ?.scrollIntoView({
-                            block: 'center',
-                            behavior: 'smooth',
-                          })
-                      }
-                      className="capitalize text-left border-none px-1"
-                    >
-                      {decamelize(category, { separator: ' ' })}
-                    </button>
-                  ))}
-                <button
-                  onClick={() =>
-                    scrollRef.current
-                      ?.querySelector(`#settings-resets`)
-                      ?.scrollIntoView({
-                        block: 'center',
-                        behavior: 'smooth',
-                      })
-                  }
-                  className="capitalize text-left border-none px-1"
-                >
-                  Resets
-                </button>
-                <button
-                  onClick={() =>
-                    scrollRef.current
-                      ?.querySelector(`#settings-about`)
-                      ?.scrollIntoView({
-                        block: 'center',
-                        behavior: 'smooth',
-                      })
-                  }
-                  className="capitalize text-left border-none px-1"
-                >
-                  About
-                </button>
-              </div>
-              <div className="relative overflow-y-auto">
-                <div ref={scrollRef} className="flex flex-col gap-4 px-2">
-                  {Object.entries(context)
-                    .filter(([_, categorySettings]) =>
-                      // Filter out categories that don't have any non-hidden settings
-                      Object.values(categorySettings).some(
-                        (setting) => !shouldHideSetting(setting, searchParamTab)
-                      )
-                    )
-                    .map(([category, categorySettings]) => (
-                      <Fragment key={category}>
-                        <h2
-                          id={`category-${category}`}
-                          className="text-xl mt-6 first-of-type:mt-0 capitalize font-bold"
-                        >
-                          {decamelize(category, { separator: ' ' })}
-                        </h2>
-                        {Object.entries(categorySettings)
-                          .filter(
-                            // Filter out settings that don't have a Component or inputType
-                            // or are hidden on the current level or the current platform
-                            (item: [string, Setting<unknown>]) =>
-                              shouldShowSettingInput(item[1], searchParamTab)
-                          )
-                          .map(([settingName, s]) => {
-                            const setting = s as Setting
-                            const parentValue =
-                              setting[setting.getParentLevel(searchParamTab)]
-                            return (
-                              <SettingsSection
-                                title={decamelize(settingName, {
-                                  separator: ' ',
-                                })}
-                                id={settingName}
-                                className={
-                                  location.hash === `#${settingName}`
-                                    ? 'bg-primary/10 dark:bg-chalkboard-90'
-                                    : ''
-                                }
-                                key={`${category}-${settingName}-${searchParamTab}`}
-                                description={setting.description}
-                                settingHasChanged={
-                                  setting[searchParamTab] !== undefined &&
-                                  setting[searchParamTab] !==
-                                    setting.getFallback(searchParamTab)
-                                }
-                                parentLevel={setting.getParentLevel(
-                                  searchParamTab
-                                )}
-                                onFallback={() =>
-                                  send({
-                                    type: `set.${category}.${settingName}`,
-                                    data: {
-                                      level: searchParamTab,
-                                      value:
-                                        parentValue !== undefined
-                                          ? parentValue
-                                          : setting.getFallback(searchParamTab),
-                                    },
-                                  } as SetEventTypes)
-                                }
-                              >
-                                <SettingsFieldInput
-                                  category={category}
-                                  settingName={settingName}
-                                  settingsLevel={searchParamTab}
-                                  setting={setting}
+              {searchParamTab !== 'keybindings' ? (
+                <>
+                  <SettingsSectionsList
+                    searchParamTab={searchParamTab}
+                    scrollRef={scrollRef}
                   />
-                              </SettingsSection>
-                            )
-                          })}
-                      </Fragment>
-                    ))}
-                  <h2 id="settings-resets" className="text-2xl mt-6 font-bold">
-                    Resets
-                  </h2>
-                  <SettingsSection
-                    title="Onboarding"
-                    description="Replay the onboarding process"
-                  >
-                    <ActionButton
-                      Element="button"
-                      onClick={restartOnboarding}
-                      iconStart={{
-                        icon: 'refresh',
-                        size: 'sm',
-                        className: 'p-1',
-                      }}
-                    >
-                      Replay Onboarding
-                    </ActionButton>
-                  </SettingsSection>
-                  <SettingsSection
-                    title="Reset settings"
-                    description={`Restore settings to their default values. Your settings are saved in
-                    ${
-                      isTauri()
-                        ? ' a file in the app data folder for your OS.'
-                        : " your browser's local storage."
-                    }
-                  `}
-                  >
-                    <div className="flex flex-col items-start gap-4">
-                      {isTauri() && (
-                        <ActionButton
-                          Element="button"
-                          onClick={async () => {
-                            const paths = await getSettingsFolderPaths(
-                              projectPath
-                                ? decodeURIComponent(projectPath)
-                                : undefined
-                            )
-                            showInFolder(paths[searchParamTab])
-                          }}
-                          iconStart={{
-                            icon: 'folder',
-                            size: 'sm',
-                            className: 'p-1',
-                          }}
-                        >
-                          Show in folder
-                        </ActionButton>
+                  <AllSettingsFields
+                    searchParamTab={searchParamTab}
+                    isFileSettings={isFileSettings}
+                    ref={scrollRef}
+                  />
+                </>
+              ) : (
+                <>
+                  <KeybindingsSectionsList scrollRef={scrollRef} />
+                  <AllKeybindingsFields ref={scrollRef} />
+                </>
               )}
-                      <ActionButton
-                        Element="button"
-                        onClick={async () => {
-                          const defaultDirectory = await getInitialDefaultDir()
-                          send({
-                            type: 'Reset settings',
-                            defaultDirectory,
-                          })
-                          toast.success('Settings restored to default')
-                        }}
-                        iconStart={{
-                          icon: 'refresh',
-                          size: 'sm',
-                          className: 'p-1 text-chalkboard-10',
-                          bgClassName: 'bg-destroy-70',
-                        }}
-                      >
-                        Restore default settings
-                      </ActionButton>
-                    </div>
-                  </SettingsSection>
-                  <h2 id="settings-about" className="text-2xl mt-6 font-bold">
-                    About Modeling App
-                  </h2>
-                  <div className="text-sm mb-12">
-                    <p>
-                      {/* This uses a Vite plugin, set in vite.config.ts
-                  to inject the version from package.json */}
-                      App version {APP_VERSION}.{' '}
-                      <a
-                        href={`https://github.com/KittyCAD/modeling-app/releases/tag/v${APP_VERSION}`}
-                        target="_blank"
-                        rel="noopener noreferrer"
-                      >
-                        View release on GitHub
-                      </a>
-                    </p>
-                    <p className="max-w-2xl mt-6">
-                      Don't see the feature you want? Check to see if it's on{' '}
-                      <a
-                        href="https://github.com/KittyCAD/modeling-app/discussions"
-                        target="_blank"
-                        rel="noopener noreferrer"
-                      >
-                        our roadmap
-                      </a>
-                      , and start a discussion if you don't see it! Your
-                      feedback will help us prioritize what to build next.
-                    </p>
-                  </div>
-                </div>
-              </div>
             </div>
           </Dialog.Panel>
         </Transition.Child>

src/wasm-lib/Cargo.toml

@@ -16,7 +16,7 @@ gloo-utils = "0.2.0"
 kcl-lib = { path = "kcl" }
 kittycad = { workspace = true }
 serde_json = "1.0.116"
-tokio = { version = "1.37.0", features = ["sync"] }
+tokio = { version = "1.38.0", features = ["sync"] }
 toml = "0.8.13"
 uuid = { version = "1.8.0", features = ["v4", "js", "serde"] }
 wasm-bindgen = "0.2.91"
@@ -24,12 +24,12 @@ wasm-bindgen-futures = "0.4.42"
 
 [dev-dependencies]
 anyhow = "1"
-image = "0.24.9"
+image = { version = "0.25.1", default-features = false, features = ["png"] }
 kittycad = { workspace = true, default-features = true }
 pretty_assertions = "1.4.0"
 reqwest = { version = "0.11.26", default-features = false }
-tokio = { version = "1.37.0", features = ["rt-multi-thread", "macros", "time"] }
-twenty-twenty = "0.7"
+tokio = { version = "1.38.0", features = ["rt-multi-thread", "macros", "time"] }
+twenty-twenty = "0.8"
 uuid = { version = "1.8.0", features = ["v4", "js", "serde"] }
 
 [target.'cfg(target_arch = "wasm32")'.dependencies]
@@ -53,20 +53,21 @@ features = [
 panic = "abort"
 debug = true
 
+[profile.dev]
+debug = 0
+
+[profile.test]
+debug = "line-tables-only"
+
 [workspace]
 members = [
 	"derive-docs",
-	"grackle",
 	"kcl",
 	"kcl-macros",
 ]
 
 [workspace.dependencies]
 kittycad = { version = "0.3.3", default-features = false, features = ["js", "requests"] }
-kittycad-execution-plan = "0.1.6"
-kittycad-execution-plan-macros = "0.1.9"
-kittycad-execution-plan-traits = "0.1.14"
-kittycad-modeling-cmds = "0.2.24"
 kittycad-modeling-session = "0.1.4"
 
 [[test]]
@@ -79,8 +80,5 @@ path = "tests/modify/main.rs"
 
 # Example: how to point modeling-api at a different repo (e.g. a branch or a local clone)
 #[patch."https://github.com/KittyCAD/modeling-api"]
-#kittycad-execution-plan = { path = "../../../modeling-api/execution-plan" }
-#kittycad-execution-plan-macros = { path = "../../../modeling-api/execution-plan-macros" }
-#kittycad-execution-plan-traits = { path = "../../../modeling-api/execution-plan-traits" }
 #kittycad-modeling-cmds = { path = "../../../modeling-api/modeling-cmds" }
 #kittycad-modeling-session = { path = "../../../modeling-api/modeling-session" }

src/wasm-lib/grackle/Cargo.toml

@@ -6,7 +6,7 @@ description = "A new executor for KCL which compiles to Execution Plans"
 # See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html
 
 [dependencies]
-image = { version = "0.24.7", default-features = false, features = ["png"] }
+image = { version = "0.25.1", default-features = false, features = ["png"] }
 kcl-lib = { path = "../kcl" }
 kittycad = { workspace = true }
 kittycad-execution-plan = { workspace = true }
@@ -16,7 +16,7 @@ kittycad-modeling-cmds = { workspace = true }
 kittycad-modeling-session = { workspace = true }
 thiserror = "1.0.61"
 tokio = { version = "1.37.0", features = ["macros", "rt"] }
-twenty-twenty = "0.7.0"
+twenty-twenty = "0.8.0"
 uuid = "1.8"
 
 [dev-dependencies]

src/wasm-lib/grackle/src/binding_scope.rs

@@ -1,270 +0,0 @@
-use std::collections::HashMap;
-
-use kcl_lib::ast::types::{LiteralIdentifier, LiteralValue};
-use kittycad_execution_plan::constants;
-use kittycad_execution_plan_traits::Primitive;
-
-use super::{native_functions, Address};
-use crate::{CompileError, KclFunction};
-
-/// KCL values which can be written to KCEP memory.
-/// This is recursive. For example, the bound value might be an array, which itself contains bound values.
-#[derive(Debug, Clone)]
-#[cfg_attr(test, derive(PartialEq))]
-pub enum EpBinding {
-    /// A KCL value which gets stored in a particular address in KCEP memory.
-    Single(Address),
-    /// A sequence of KCL values, indexed by their position in the sequence.
-    Sequence {
-        length_at: Address,
-        elements: Vec<EpBinding>,
-    },
-    /// A sequence of KCL values, indexed by their identifier.
-    Map {
-        length_at: Address,
-        properties: HashMap<String, EpBinding>,
-    },
-    /// Not associated with a KCEP address.
-    Constant(Primitive),
-    /// Not associated with a KCEP address.
-    Function(KclFunction),
-    /// SketchGroups have their own storage.
-    SketchGroup { index: usize },
-}
-
-impl From<KclFunction> for EpBinding {
-    fn from(f: KclFunction) -> Self {
-        Self::Function(f)
-    }
-}
-
-impl EpBinding {
-    /// Look up the given property of this binding.
-    pub fn property_of(&self, property: LiteralIdentifier) -> Result<&Self, CompileError> {
-        match property {
-            LiteralIdentifier::Identifier(_) => todo!("Support identifier properties"),
-            LiteralIdentifier::Literal(litval) => match litval.value {
-                // Arrays can be indexed by integers.
-                LiteralValue::IInteger(i) => match self {
-                    EpBinding::Sequence { elements, length_at: _ } => {
-                        let i = usize::try_from(i).map_err(|_| CompileError::InvalidIndex(i.to_string()))?;
-                        elements
-                            .get(i)
-                            .ok_or(CompileError::IndexOutOfBounds { i, len: elements.len() })
-                    }
-                    EpBinding::Map { .. } => Err(CompileError::CannotIndex),
-                    EpBinding::SketchGroup { .. } => Err(CompileError::CannotIndex),
-                    EpBinding::Single(_) => Err(CompileError::CannotIndex),
-                    EpBinding::Function(_) => Err(CompileError::CannotIndex),
-                    EpBinding::Constant(_) => Err(CompileError::CannotIndex),
-                },
-                // Objects can be indexed by string properties.
-                LiteralValue::String(property) => match self {
-                    EpBinding::Single(_) => Err(CompileError::NoProperties),
-                    EpBinding::Function(_) => Err(CompileError::NoProperties),
-                    EpBinding::Constant(_) => Err(CompileError::CannotIndex),
-                    EpBinding::SketchGroup { .. } => Err(CompileError::NoProperties),
-                    EpBinding::Sequence { .. } => Err(CompileError::ArrayDoesNotHaveProperties),
-                    EpBinding::Map {
-                        properties,
-                        length_at: _,
-                    } => properties
-                        .get(&property)
-                        .ok_or(CompileError::UndefinedProperty { property }),
-                },
-                // It's never valid to index by a fractional number.
-                LiteralValue::Fractional(num) => Err(CompileError::InvalidIndex(num.to_string())),
-                LiteralValue::Bool(b) => Err(CompileError::InvalidIndex(b.to_string())),
-            },
-        }
-    }
-}
-
-/// A set of bindings in a particular scope.
-/// Bindings are KCL values that get "compiled" into KCEP values, which are stored in KCEP memory
-/// at a particular KCEP address.
-/// Bindings are referenced by the name of their KCL identifier.
-///
-/// KCL has multiple scopes -- each function has a scope for its own local variables and parameters.
-/// So when referencing a variable, it might be in this scope, or the parent scope. So, each environment
-/// has to keep track of parent environments. The root environment has no parent, and is used for KCL globals
-/// (e.g. the prelude of stdlib functions).
-///
-/// These are called "Environments" in the "Crafting Interpreters" book.
-#[derive(Debug)]
-pub struct BindingScope {
-    // KCL value which are stored in EP memory.
-    ep_bindings: HashMap<String, EpBinding>,
-    /// KCL functions. They do NOT get stored in EP memory.
-    parent: Option<Box<BindingScope>>,
-}
-
-impl BindingScope {
-    /// The parent scope for every program, before the user has defined anything.
-    /// Only includes some stdlib functions.
-    /// This is usually known as the "prelude" in other languages. It's the stdlib functions that
-    /// are already imported for you when you start coding.
-    pub fn prelude() -> Self {
-        Self {
-            // TODO: Actually put the stdlib prelude in here,
-            // things like `startSketchAt` and `line`.
-            ep_bindings: HashMap::from([
-                ("E".into(), EpBinding::Constant(constants::E)),
-                ("PI".into(), EpBinding::Constant(constants::PI)),
-                ("id".into(), EpBinding::from(KclFunction::Id(native_functions::Id))),
-                ("abs".into(), EpBinding::from(KclFunction::Abs(native_functions::Abs))),
-                (
-                    "acos".into(),
-                    EpBinding::from(KclFunction::Acos(native_functions::Acos)),
-                ),
-                (
-                    "asin".into(),
-                    EpBinding::from(KclFunction::Asin(native_functions::Asin)),
-                ),
-                (
-                    "atan".into(),
-                    EpBinding::from(KclFunction::Atan(native_functions::Atan)),
-                ),
-                (
-                    "ceil".into(),
-                    EpBinding::from(KclFunction::Ceil(native_functions::Ceil)),
-                ),
-                ("cos".into(), EpBinding::from(KclFunction::Cos(native_functions::Cos))),
-                (
-                    "floor".into(),
-                    EpBinding::from(KclFunction::Floor(native_functions::Floor)),
-                ),
-                ("ln".into(), EpBinding::from(KclFunction::Ln(native_functions::Ln))),
-                (
-                    "log10".into(),
-                    EpBinding::from(KclFunction::Log10(native_functions::Log10)),
-                ),
-                (
-                    "log2".into(),
-                    EpBinding::from(KclFunction::Log2(native_functions::Log2)),
-                ),
-                ("sin".into(), EpBinding::from(KclFunction::Sin(native_functions::Sin))),
-                (
-                    "sqrt".into(),
-                    EpBinding::from(KclFunction::Sqrt(native_functions::Sqrt)),
-                ),
-                ("tan".into(), EpBinding::from(KclFunction::Tan(native_functions::Tan))),
-                (
-                    "toDegrees".into(),
-                    EpBinding::from(KclFunction::ToDegrees(native_functions::ToDegrees)),
-                ),
-                (
-                    "toRadians".into(),
-                    EpBinding::from(KclFunction::ToRadians(native_functions::ToRadians)),
-                ),
-                ("add".into(), EpBinding::from(KclFunction::Add(native_functions::Add))),
-                ("log".into(), EpBinding::from(KclFunction::Log(native_functions::Log))),
-                ("max".into(), EpBinding::from(KclFunction::Max(native_functions::Max))),
-                ("min".into(), EpBinding::from(KclFunction::Min(native_functions::Min))),
-                (
-                    "startSketchAt".into(),
-                    EpBinding::from(KclFunction::StartSketchAt(native_functions::sketch::StartSketchAt)),
-                ),
-                (
-                    "lineTo".into(),
-                    EpBinding::from(KclFunction::LineTo(native_functions::sketch::LineTo)),
-                ),
-                (
-                    "line".into(),
-                    EpBinding::from(KclFunction::Line(native_functions::sketch::Line)),
-                ),
-                (
-                    "xLineTo".into(),
-                    EpBinding::from(KclFunction::XLineTo(native_functions::sketch::XLineTo)),
-                ),
-                (
-                    "xLine".into(),
-                    EpBinding::from(KclFunction::XLine(native_functions::sketch::XLine)),
-                ),
-                (
-                    "yLineTo".into(),
-                    EpBinding::from(KclFunction::YLineTo(native_functions::sketch::YLineTo)),
-                ),
-                (
-                    "yLine".into(),
-                    EpBinding::from(KclFunction::YLine(native_functions::sketch::YLine)),
-                ),
-                (
-                    "tangentialArcTo".into(),
-                    EpBinding::from(KclFunction::TangentialArcTo(native_functions::sketch::TangentialArcTo)),
-                ),
-                (
-                    "extrude".into(),
-                    EpBinding::from(KclFunction::Extrude(native_functions::sketch::Extrude)),
-                ),
-                (
-                    "close".into(),
-                    EpBinding::from(KclFunction::Close(native_functions::sketch::Close)),
-                ),
-            ]),
-            parent: None,
-        }
-    }
-
-    /// Add a new scope, e.g. for new function calls.
-    pub fn add_scope(&mut self) {
-        // Move all data from `self` into `this`.
-        let this_parent = self.parent.take();
-        let this_ep_bindings = self.ep_bindings.drain().collect();
-        let this = Self {
-            ep_bindings: this_ep_bindings,
-            parent: this_parent,
-        };
-        // Turn `self` into a new scope, with the old `self` as its parent.
-        self.parent = Some(Box::new(this));
-    }
-
-    //// Remove a scope, e.g. when exiting a function call.
-    pub fn remove_scope(&mut self) {
-        // The scope is finished, so erase all its local variables.
-        self.ep_bindings.clear();
-        // Pop the stack -- the parent scope is now the current scope.
-        let p = self.parent.take().expect("cannot remove the root scope");
-        self.parent = p.parent;
-        self.ep_bindings = p.ep_bindings;
-    }
-
-    /// Add a binding (e.g. defining a new variable)
-    pub fn bind(&mut self, identifier: String, binding: EpBinding) {
-        self.ep_bindings.insert(identifier, binding);
-    }
-
-    /// Look up a binding.
-    pub fn get(&self, identifier: &str) -> Option<&EpBinding> {
-        if let Some(b) = self.ep_bindings.get(identifier) {
-            // The name was found in this scope.
-            Some(b)
-        } else if let Some(ref parent) = self.parent {
-            // Check the next scope outwards.
-            parent.get(identifier)
-        } else {
-            // There's no outer scope, and it wasn't found, so there's nowhere else to look.
-            None
-        }
-    }
-
-    /// Look up a function bound to the given identifier.
-    pub fn get_fn(&self, identifier: &str) -> GetFnResult {
-        if let Some(x) = self.get(identifier) {
-            match x {
-                EpBinding::Function(f) => GetFnResult::Found(f),
-                _ => GetFnResult::NonCallable,
-            }
-        } else if let Some(ref parent) = self.parent {
-            parent.get_fn(identifier)
-        } else {
-            GetFnResult::NotFound
-        }
-    }
-}
-
-pub enum GetFnResult<'a> {
-    Found(&'a KclFunction),
-    NonCallable,
-    NotFound,
-}

src/wasm-lib/grackle/src/error.rs

@@ -1,84 +0,0 @@
-use kcl_lib::ast::types::RequiredParamAfterOptionalParam;
-use kittycad_execution_plan::{ExecutionError, ExecutionFailed, Instruction};
-
-use crate::String2;
-
-#[derive(Debug, thiserror::Error, PartialEq, Clone)]
-pub enum CompileError {
-    #[error("the name {name} was not defined")]
-    Undefined { name: String },
-    #[error("the function {fn_name} requires at least {required} arguments but you only supplied {actual}")]
-    NotEnoughArgs {
-        fn_name: String2,
-        required: usize,
-        actual: usize,
-    },
-    #[error("the function {fn_name} accepts at most {maximum} arguments but you supplied {actual}")]
-    TooManyArgs {
-        fn_name: String2,
-        maximum: usize,
-        actual: usize,
-    },
-    #[error("you tried to call {name} but it's not a function")]
-    NotCallable { name: String },
-    #[error("you're trying to use an operand that isn't compatible with the given arithmetic operator: {0}")]
-    InvalidOperand(&'static str),
-    #[error("you cannot use the value {0} as an index")]
-    InvalidIndex(String),
-    #[error("you tried to index into a value that isn't an array. Only arrays have numeric indices!")]
-    CannotIndex,
-    #[error("you tried to get the element {i} but that index is out of bounds. The array only has a length of {len}")]
-    IndexOutOfBounds { i: usize, len: usize },
-    #[error("you tried to access the property of a value that doesn't have any properties")]
-    NoProperties,
-    #[error("you tried to access a property of an array, but arrays don't have properties. They do have numeric indexes though, try using an index e.g. [0]")]
-    ArrayDoesNotHaveProperties,
-    #[error(
-        "you tried to read the '.{property}' of an object, but the object doesn't have any properties with that key"
-    )]
-    UndefinedProperty { property: String },
-    #[error("{0}")]
-    BadParamOrder(RequiredParamAfterOptionalParam),
-    #[error("A KCL function cannot have anything after its return value")]
-    MultipleReturns,
-    #[error("A KCL function must end with a return statement, but your function doesn't have one.")]
-    NoReturnStmt,
-    #[error("You used the %, which means \"substitute this argument for the value to the left in this |> pipeline\". But there is no such value, because you're not calling a pipeline.")]
-    NotInPipeline,
-    #[error("The function '{fn_name}' expects a parameter of type {expected} as argument number {arg_number} but you supplied {actual}")]
-    ArgWrongType {
-        fn_name: &'static str,
-        expected: &'static str,
-        actual: String,
-        arg_number: usize,
-    },
-}
-
-#[derive(Debug, thiserror::Error)]
-#[allow(clippy::large_enum_variant)]
-pub enum Error {
-    #[error("{0}")]
-    Compile(#[from] CompileError),
-    #[error("Failed on instruction {instruction_index}:\n{error}\n\nInstruction contents were {instruction:#?}")]
-    Execution {
-        error: ExecutionError,
-        instruction: Instruction,
-        instruction_index: usize,
-    },
-}
-
-impl From<ExecutionFailed> for Error {
-    fn from(
-        ExecutionFailed {
-            error,
-            instruction,
-            instruction_index,
-        }: ExecutionFailed,
-    ) -> Self {
-        Self::Execution {
-            error,
-            instruction: instruction.expect("no instruction"),
-            instruction_index,
-        }
-    }
-}

src/wasm-lib/grackle/src/kcl_value_group.rs

@@ -1,14 +0,0 @@
-use kcl_lib::ast::{self, types::BinaryPart};
-
-pub type SingleValue = kcl_lib::ast::types::Value;
-
-pub fn into_single_value(value: ast::types::BinaryPart) -> SingleValue {
-    match value {
-        BinaryPart::Literal(e) => SingleValue::Literal(e),
-        BinaryPart::Identifier(e) => SingleValue::Identifier(e),
-        BinaryPart::BinaryExpression(e) => SingleValue::BinaryExpression(e),
-        BinaryPart::CallExpression(e) => SingleValue::CallExpression(e),
-        BinaryPart::UnaryExpression(e) => SingleValue::UnaryExpression(e),
-        BinaryPart::MemberExpression(e) => SingleValue::MemberExpression(e),
-    }
-}

src/wasm-lib/grackle/src/lib.rs

@@ -1,729 +0,0 @@
-mod binding_scope;
-mod error;
-mod kcl_value_group;
-mod native_functions;
-#[cfg(test)]
-mod tests;
-
-use std::collections::HashMap;
-
-use kcl_lib::{
-    ast,
-    ast::types::{BodyItem, FunctionExpressionParts, KclNone, LiteralValue, Program},
-};
-use kcl_value_group::into_single_value;
-use kittycad_execution_plan::{
-    self as ep, instruction::SourceRange as KcvmSourceRange, Destination, Instruction, InstructionKind,
-};
-use kittycad_execution_plan_traits as ept;
-use kittycad_execution_plan_traits::{Address, NumericPrimitive};
-use kittycad_modeling_session::Session;
-
-use crate::{
-    binding_scope::{BindingScope, EpBinding, GetFnResult},
-    error::{CompileError, Error},
-    kcl_value_group::SingleValue,
-};
-
-/// Execute a KCL program by compiling into an execution plan, then running that.
-pub async fn execute(ast: Program, session: &mut Option<Session>) -> Result<ep::Memory, Error> {
-    let mut planner = Planner::new();
-    let (plan, _retval) = planner.build_plan(ast)?;
-    let mut mem = ep::Memory::default();
-    ep::execute(&mut mem, plan, session).await?;
-    Ok(mem)
-}
-
-/// Compiles KCL programs into Execution Plans.
-#[derive(Debug)]
-struct Planner {
-    /// Maps KCL identifiers to what they hold, and where in KCEP virtual memory they'll be written to.
-    binding_scope: BindingScope,
-    /// Next available KCVM virtual machine memory address.
-    next_addr: Address,
-    /// Next available KCVM sketch group index.
-    next_sketch_group: usize,
-}
-
-impl Planner {
-    pub fn new() -> Self {
-        Self {
-            binding_scope: BindingScope::prelude(),
-            next_addr: Address::ZERO,
-            next_sketch_group: 0,
-        }
-    }
-
-    /// If successful, return the KCEP instructions for executing the given program.
-    /// If the program is a function with a return, then it also returns the KCL function's return value.
-    fn build_plan(&mut self, program: Program) -> Result<(Vec<Instruction>, Option<EpBinding>), CompileError> {
-        program
-            .body
-            .into_iter()
-            .try_fold((Vec::new(), None), |(mut instructions, mut retval), item| {
-                if retval.is_some() {
-                    return Err(CompileError::MultipleReturns);
-                }
-                let mut ctx = Context::default();
-                let instructions_for_this_node = match item {
-                    BodyItem::ExpressionStatement(node) => {
-                        self.plan_to_compute_single(&mut ctx, SingleValue::from(node.expression))?
-                            .instructions
-                    }
-                    BodyItem::VariableDeclaration(node) => self.plan_to_bind(node)?,
-                    BodyItem::ReturnStatement(node) => {
-                        let EvalPlan { instructions, binding } =
-                            self.plan_to_compute_single(&mut ctx, SingleValue::from(node.argument))?;
-                        retval = Some(binding);
-                        instructions
-                    }
-                };
-                instructions.extend(instructions_for_this_node);
-                Ok((instructions, retval))
-            })
-    }
-
-    /// Emits instructions which, when run, compute a given KCL value and store it in memory.
-    /// Returns the instructions, and the destination address of the value.
-    fn plan_to_compute_single(&mut self, ctx: &mut Context, value: SingleValue) -> Result<EvalPlan, CompileError> {
-        match value {
-            SingleValue::None(KclNone { start, end }) => {
-                let address = self.next_addr.offset_by(1);
-                Ok(EvalPlan {
-                    instructions: vec![Instruction::from_range(
-                        InstructionKind::SetPrimitive {
-                            address,
-                            value: ept::Primitive::Nil,
-                        },
-                        KcvmSourceRange([start, end]),
-                    )],
-                    binding: EpBinding::Single(address),
-                })
-            }
-            SingleValue::FunctionExpression(expr) => {
-                let FunctionExpressionParts {
-                    start: _,
-                    end: _,
-                    params_required,
-                    params_optional,
-                    body,
-                } = expr.into_parts().map_err(CompileError::BadParamOrder)?;
-                Ok(EvalPlan {
-                    instructions: Vec::new(),
-                    binding: EpBinding::from(KclFunction::UserDefined(UserDefinedFunction {
-                        params_optional,
-                        params_required,
-                        body,
-                    })),
-                })
-            }
-            SingleValue::Literal(expr) => {
-                let kcep_val = kcl_literal_to_kcep_literal(expr.value);
-                // KCEP primitives always have size of 1, because each address holds 1 primitive.
-                let size = 1;
-                let address = self.next_addr.offset_by(size);
-                Ok(EvalPlan {
-                    instructions: vec![Instruction::from_range(
-                        InstructionKind::SetPrimitive {
-                            address,
-                            value: kcep_val,
-                        },
-                        KcvmSourceRange([expr.start, expr.end]),
-                    )],
-                    binding: EpBinding::Single(address),
-                })
-            }
-            SingleValue::Identifier(expr) => {
-                // The KCL parser interprets bools as identifiers.
-                // Consider changing them to be KCL literals instead.
-                let b = if expr.name == "true" {
-                    Some(true)
-                } else if expr.name == "false" {
-                    Some(false)
-                } else {
-                    None
-                };
-                if let Some(b) = b {
-                    let address = self.next_addr.offset_by(1);
-                    return Ok(EvalPlan {
-                        instructions: vec![Instruction::from_range(
-                            InstructionKind::SetPrimitive {
-                                address,
-                                value: ept::Primitive::Bool(b),
-                            },
-                            KcvmSourceRange([expr.start, expr.end]),
-                        )],
-                        binding: EpBinding::Single(address),
-                    });
-                }
-
-                // This identifier is just duplicating a binding.
-                // So, don't emit any instructions, because the value has already been computed.
-                // Just return the address that it was stored at after being computed.
-                let previously_bound_to = self
-                    .binding_scope
-                    .get(&expr.name)
-                    .ok_or(CompileError::Undefined { name: expr.name })?;
-                Ok(EvalPlan {
-                    instructions: Vec::new(),
-                    binding: previously_bound_to.clone(),
-                })
-            }
-            SingleValue::UnaryExpression(expr) => {
-                let operand = self.plan_to_compute_single(ctx, into_single_value(expr.argument))?;
-                let EpBinding::Single(binding) = operand.binding else {
-                    return Err(CompileError::InvalidOperand(
-                        "you tried to use a composite value (e.g. array or object) as the operand to some math",
-                    ));
-                };
-                let destination = self.next_addr.offset_by(1);
-                let mut plan = operand.instructions;
-                plan.push(Instruction::from_range(
-                    InstructionKind::UnaryArithmetic {
-                        arithmetic: ep::UnaryArithmetic {
-                            operation: match expr.operator {
-                                ast::types::UnaryOperator::Neg => ep::UnaryOperation::Neg,
-                                ast::types::UnaryOperator::Not => ep::UnaryOperation::Not,
-                            },
-                            operand: ep::Operand::Reference(binding),
-                        },
-                        destination: Destination::Address(destination),
-                    },
-                    KcvmSourceRange([expr.start, expr.end]),
-                ));
-                Ok(EvalPlan {
-                    instructions: plan,
-                    binding: EpBinding::Single(destination),
-                })
-            }
-            SingleValue::BinaryExpression(expr) => {
-                let l = self.plan_to_compute_single(ctx, into_single_value(expr.left))?;
-                let r = self.plan_to_compute_single(ctx, into_single_value(expr.right))?;
-                let EpBinding::Single(l_binding) = l.binding else {
-                    return Err(CompileError::InvalidOperand(
-                        "you tried to use a composite value (e.g. array or object) as the operand to some math",
-                    ));
-                };
-                let EpBinding::Single(r_binding) = r.binding else {
-                    return Err(CompileError::InvalidOperand(
-                        "you tried to use a composite value (e.g. array or object) as the operand to some math",
-                    ));
-                };
-                let destination = self.next_addr.offset_by(1);
-                let mut plan = Vec::with_capacity(l.instructions.len() + r.instructions.len() + 1);
-                plan.extend(l.instructions);
-                plan.extend(r.instructions);
-                plan.push(Instruction::from_range(
-                    InstructionKind::BinaryArithmetic {
-                        arithmetic: ep::BinaryArithmetic {
-                            operation: match expr.operator {
-                                ast::types::BinaryOperator::Add => ep::BinaryOperation::Add,
-                                ast::types::BinaryOperator::Sub => ep::BinaryOperation::Sub,
-                                ast::types::BinaryOperator::Mul => ep::BinaryOperation::Mul,
-                                ast::types::BinaryOperator::Div => ep::BinaryOperation::Div,
-                                ast::types::BinaryOperator::Mod => ep::BinaryOperation::Mod,
-                                ast::types::BinaryOperator::Pow => ep::BinaryOperation::Pow,
-                            },
-                            operand0: ep::Operand::Reference(l_binding),
-                            operand1: ep::Operand::Reference(r_binding),
-                        },
-                        destination: Destination::Address(destination),
-                    },
-                    KcvmSourceRange([expr.start, expr.end]),
-                ));
-                Ok(EvalPlan {
-                    instructions: plan,
-                    binding: EpBinding::Single(destination),
-                })
-            }
-            SingleValue::CallExpression(expr) => {
-                // Make a plan to compute all the arguments to this call.
-                let (mut instructions, args) = expr.arguments.into_iter().try_fold(
-                    (Vec::new(), Vec::new()),
-                    |(mut acc_instrs, mut acc_args), argument| {
-                        let EvalPlan {
-                            instructions: new_instructions,
-                            binding: arg,
-                        } = self.plan_to_compute_single(ctx, SingleValue::from(argument))?;
-                        acc_instrs.extend(new_instructions);
-                        acc_args.push(arg);
-                        Ok((acc_instrs, acc_args))
-                    },
-                )?;
-                // Look up the function being called.
-                let callee = match self.binding_scope.get_fn(&expr.callee.name) {
-                    GetFnResult::Found(f) => f,
-                    GetFnResult::NonCallable => {
-                        return Err(CompileError::NotCallable {
-                            name: expr.callee.name.clone(),
-                        });
-                    }
-                    GetFnResult::NotFound => {
-                        return Err(CompileError::Undefined {
-                            name: expr.callee.name.clone(),
-                        })
-                    }
-                };
-
-                // Emit instructions to call that function with the given arguments.
-                use native_functions::Callable;
-                let mut ctx = native_functions::Context {
-                    next_address: &mut self.next_addr,
-                    next_sketch_group: &mut self.next_sketch_group,
-                };
-                let EvalPlan {
-                    instructions: eval_instrs,
-                    binding,
-                } = match callee {
-                    KclFunction::Id(f) => f.call(&mut ctx, args)?,
-                    KclFunction::Abs(f) => f.call(&mut ctx, args)?,
-                    KclFunction::Acos(f) => f.call(&mut ctx, args)?,
-                    KclFunction::Asin(f) => f.call(&mut ctx, args)?,
-                    KclFunction::Atan(f) => f.call(&mut ctx, args)?,
-                    KclFunction::Ceil(f) => f.call(&mut ctx, args)?,
-                    KclFunction::Cos(f) => f.call(&mut ctx, args)?,
-                    KclFunction::Floor(f) => f.call(&mut ctx, args)?,
-                    KclFunction::Ln(f) => f.call(&mut ctx, args)?,
-                    KclFunction::Log10(f) => f.call(&mut ctx, args)?,
-                    KclFunction::Log2(f) => f.call(&mut ctx, args)?,
-                    KclFunction::Sin(f) => f.call(&mut ctx, args)?,
-                    KclFunction::Sqrt(f) => f.call(&mut ctx, args)?,
-                    KclFunction::Tan(f) => f.call(&mut ctx, args)?,
-                    KclFunction::ToDegrees(f) => f.call(&mut ctx, args)?,
-                    KclFunction::ToRadians(f) => f.call(&mut ctx, args)?,
-                    KclFunction::Log(f) => f.call(&mut ctx, args)?,
-                    KclFunction::Max(f) => f.call(&mut ctx, args)?,
-                    KclFunction::Min(f) => f.call(&mut ctx, args)?,
-                    KclFunction::StartSketchAt(f) => f.call(&mut ctx, args)?,
-                    KclFunction::Extrude(f) => f.call(&mut ctx, args)?,
-                    KclFunction::LineTo(f) => f.call(&mut ctx, args)?,
-                    KclFunction::Line(f) => f.call(&mut ctx, args)?,
-                    KclFunction::XLineTo(f) => f.call(&mut ctx, args)?,
-                    KclFunction::XLine(f) => f.call(&mut ctx, args)?,
-                    KclFunction::YLineTo(f) => f.call(&mut ctx, args)?,
-                    KclFunction::YLine(f) => f.call(&mut ctx, args)?,
-                    KclFunction::TangentialArcTo(f) => f.call(&mut ctx, args)?,
-                    KclFunction::Add(f) => f.call(&mut ctx, args)?,
-                    KclFunction::Close(f) => f.call(&mut ctx, args)?,
-                    KclFunction::UserDefined(f) => {
-                        let UserDefinedFunction {
-                            params_optional,
-                            params_required,
-                            body: function_body,
-                        } = f.clone();
-                        let num_required_params = params_required.len();
-                        self.binding_scope.add_scope();
-
-                        // Bind the call's arguments to the names of the function's parameters.
-                        let num_actual_params = args.len();
-                        let mut arg_iter = args.into_iter();
-                        let max_params = params_required.len() + params_optional.len();
-                        if num_actual_params > max_params {
-                            return Err(CompileError::TooManyArgs {
-                                fn_name: "".into(),
-                                maximum: max_params,
-                                actual: num_actual_params,
-                            });
-                        }
-
-                        // Bind required parameters
-                        for param in params_required {
-                            let arg = arg_iter.next().ok_or(CompileError::NotEnoughArgs {
-                                fn_name: "".into(),
-                                required: num_required_params,
-                                actual: num_actual_params,
-                            })?;
-                            self.binding_scope.bind(param.identifier.name, arg);
-                        }
-
-                        // Bind optional parameters
-                        for param in params_optional {
-                            let Some(arg) = arg_iter.next() else {
-                                break;
-                            };
-                            self.binding_scope.bind(param.identifier.name, arg);
-                        }
-
-                        let (instructions, retval) = self.build_plan(function_body)?;
-                        let Some(retval) = retval else {
-                            return Err(CompileError::NoReturnStmt);
-                        };
-                        self.binding_scope.remove_scope();
-                        EvalPlan {
-                            instructions,
-                            binding: retval,
-                        }
-                    }
-                };
-
-                // Combine the "evaluate arguments" plan with the "call function" plan.
-                instructions.extend(eval_instrs);
-                Ok(EvalPlan { instructions, binding })
-            }
-            SingleValue::MemberExpression(mut expr) => {
-                let source_range = KcvmSourceRange([expr.start, expr.end]);
-                let parse = move || {
-                    let mut stack = Vec::new();
-                    loop {
-                        stack.push((expr.property, expr.computed));
-                        match expr.object {
-                            ast::types::MemberObject::MemberExpression(subexpr) => {
-                                expr = subexpr;
-                            }
-                            ast::types::MemberObject::Identifier(id) => return (stack, id),
-                        }
-                    }
-                };
-                let (mut properties, id) = parse();
-                let name = id.name;
-                let mut binding = self.binding_scope.get(&name).ok_or(CompileError::Undefined { name })?;
-                if properties.iter().any(|(_property, computed)| *computed) {
-                    // There's a computed property, so the property/index can only be determined at runtime.
-                    let mut instructions: Vec<Instruction> = Vec::new();
-                    let starting_address = match binding {
-                        EpBinding::Sequence { length_at, elements: _ } => *length_at,
-                        EpBinding::Map {
-                            length_at,
-                            properties: _,
-                        } => *length_at,
-                        _ => return Err(CompileError::CannotIndex),
-                    };
-                    let mut structure_start = ep::Operand::Literal(starting_address.into());
-                    properties.reverse();
-                    for (property, _computed) in properties {
-                        let source_range = KcvmSourceRange([property.start(), property.end()]);
-                        // Where is the member stored?
-                        let addr_of_member = match property {
-                            // If it's some identifier, then look up where that identifier will be stored.
-                            // That's the memory address the index/property should be in.
-                            ast::types::LiteralIdentifier::Identifier(id) => {
-                                let b = self
-                                    .binding_scope
-                                    .get(&id.name)
-                                    .ok_or(CompileError::Undefined { name: id.name })?;
-                                match b {
-                                    EpBinding::Single(addr) => ep::Operand::Reference(*addr),
-                                    // TODO use a better error message here
-                                    other => return Err(CompileError::InvalidIndex(format!("{other:?}"))),
-                                }
-                            }
-                            // If the index is a literal, then just use it.
-                            ast::types::LiteralIdentifier::Literal(litval) => {
-                                ep::Operand::Literal(kcl_literal_to_kcep_literal(litval.value))
-                            }
-                        };
-
-                        // Find the address of the member, push to stack.
-                        instructions.push(Instruction::from_range(
-                            InstructionKind::AddrOfMember {
-                                member: addr_of_member,
-                                start: structure_start,
-                            },
-                            source_range,
-                        ));
-                        // If there's another member after this one, its starting object is the
-                        // address we just pushed to the stack.
-                        structure_start = ep::Operand::StackPop;
-                    }
-
-                    // The final address is on the stack.
-                    // Move it to addressable memory.
-                    let final_prop_addr = self.next_addr.offset_by(1);
-                    instructions.push(Instruction::from_range(
-                        InstructionKind::CopyLen {
-                            source_range: ep::Operand::StackPop,
-                            destination_range: ep::Operand::Literal(final_prop_addr.into()),
-                        },
-                        source_range,
-                    ));
-
-                    Ok(EvalPlan {
-                        instructions,
-                        binding: EpBinding::Single(final_prop_addr),
-                    })
-                } else {
-                    // Compiler optimization:
-                    // Because there are no computed properties, we can resolve the property chain
-                    // at compile-time. Just jump to the right property at each step in the chain.
-                    for (property, _) in properties {
-                        binding = binding.property_of(property)?;
-                    }
-                    Ok(EvalPlan {
-                        instructions: Vec::new(),
-                        binding: binding.clone(),
-                    })
-                }
-            }
-            SingleValue::PipeSubstitution(_expr) => {
-                if let Some(ref binding) = ctx.pipe_substitution {
-                    Ok(EvalPlan {
-                        instructions: Vec::new(),
-                        binding: binding.clone(),
-                    })
-                } else {
-                    Err(CompileError::NotInPipeline)
-                }
-            }
-            SingleValue::PipeExpression(expr) => {
-                let mut bodies = expr.body.into_iter();
-
-                // Get the first expression (i.e. body) of the pipeline.
-                let first = bodies.next().expect("Pipe expression must have > 1 item");
-                let EvalPlan {
-                    mut instructions,
-                    binding: mut current_value,
-                } = self.plan_to_compute_single(ctx, SingleValue::from(first))?;
-
-                // Handle the remaining bodies.
-                for body in bodies {
-                    let value = SingleValue::from(body);
-                    // This body will probably contain a % (pipe substitution character).
-                    // So it needs to know what the previous pipeline body's value is,
-                    // to replace the % with that value.
-                    ctx.pipe_substitution = Some(current_value.clone());
-                    let EvalPlan {
-                        instructions: instructions_for_this_body,
-                        binding,
-                    } = self.plan_to_compute_single(ctx, value)?;
-                    instructions.extend(instructions_for_this_body);
-                    current_value = binding;
-                }
-                // Before we return, clear the pipe substitution, because nothing outside this
-                // pipeline should be able to use it anymore.
-                ctx.pipe_substitution = None;
-                Ok(EvalPlan {
-                    instructions,
-                    binding: current_value,
-                })
-            }
-            SingleValue::ObjectExpression(expr) => {
-                let length_at = self.next_addr.offset_by(1);
-                let key_count = expr.properties.len();
-                // Compute elements
-                let (instructions_for_each_element, bindings, keys) = expr.properties.into_iter().try_fold(
-                    (Vec::new(), HashMap::new(), Vec::with_capacity(key_count)),
-                    |(mut acc_instrs, mut acc_properties, mut acc_keys), property| {
-                        let key = property.key.name;
-                        acc_keys.push(key.clone());
-
-                        // Some elements will have their own length header (e.g. arrays).
-                        // For all other elements, we'll need to add a length header.
-                        let element_has_its_own_header = matches!(
-                            SingleValue::from(property.value.clone()),
-                            SingleValue::ArrayExpression(_) | SingleValue::ObjectExpression(_)
-                        );
-                        let element_needs_its_own_header = !element_has_its_own_header;
-                        let length_at = element_needs_its_own_header.then(|| self.next_addr.offset_by(1));
-
-                        let instrs_for_this_element = {
-                            // If this element of the array is a single value, then binding it is
-                            // straightforward -- you got a single binding, no need to change anything.
-                            let EvalPlan { instructions, binding } =
-                                self.plan_to_compute_single(ctx, SingleValue::from(property.value))?;
-                            acc_properties.insert(key, binding);
-                            instructions
-                        };
-                        // If we decided to add a length header for this element,
-                        // this is where we actually add it.
-                        if let Some(length_at) = length_at {
-                            let length_of_this_element = (self.next_addr - length_at) - 1;
-                            // Append element's length
-                            acc_instrs.push(Instruction::from_range(
-                                InstructionKind::SetPrimitive {
-                                    address: length_at,
-                                    value: length_of_this_element.into(),
-                                },
-                                KcvmSourceRange([expr.start, expr.end]),
-                            ));
-                        }
-                        // Append element's value
-                        acc_instrs.extend(instrs_for_this_element);
-                        Ok((acc_instrs, acc_properties, acc_keys))
-                    },
-                )?;
-                // The array's overall instructions are:
-                // - Write a length header
-                // - Write everything to calculate its elements.
-                let mut instructions = vec![Instruction::from_range(
-                    InstructionKind::SetPrimitive {
-                        address: length_at,
-                        value: ept::ObjectHeader {
-                            properties: keys,
-                            size: (self.next_addr - length_at) - 1,
-                        }
-                        .into(),
-                    },
-                    KcvmSourceRange([expr.start, expr.end]),
-                )];
-                instructions.extend(instructions_for_each_element);
-                let binding = EpBinding::Map {
-                    length_at,
-                    properties: bindings,
-                };
-                Ok(EvalPlan { instructions, binding })
-            }
-            SingleValue::ArrayExpression(expr) => {
-                let length_at = self.next_addr.offset_by(1);
-                let element_count = expr.elements.len();
-                // Compute elements
-                let (instructions_for_each_element, bindings) = expr.elements.into_iter().try_fold(
-                    (Vec::new(), Vec::new()),
-                    |(mut acc_instrs, mut acc_bindings), element| {
-                        // Some elements will have their own length header (e.g. arrays).
-                        // For all other elements, we'll need to add a length header.
-                        let element_has_its_own_header = matches!(
-                            SingleValue::from(element.clone()),
-                            SingleValue::ArrayExpression(_) | SingleValue::ObjectExpression(_)
-                        );
-                        let element_needs_its_own_header = !element_has_its_own_header;
-                        let length_at = element_needs_its_own_header.then(|| self.next_addr.offset_by(1));
-
-                        let instrs_for_this_element = {
-                            // If this element of the array is a single value, then binding it is
-                            // straightforward -- you got a single binding, no need to change anything.
-                            let EvalPlan { instructions, binding } =
-                                self.plan_to_compute_single(ctx, SingleValue::from(element))?;
-                            acc_bindings.push(binding);
-                            instructions
-                        };
-                        // If we decided to add a length header for this element,
-                        // this is where we actually add it.
-                        if let Some(length_at) = length_at {
-                            let length_of_this_element = (self.next_addr - length_at) - 1;
-                            // Append element's length
-                            acc_instrs.push(Instruction::from_range(
-                                InstructionKind::SetPrimitive {
-                                    address: length_at,
-                                    value: length_of_this_element.into(),
-                                },
-                                KcvmSourceRange([expr.start, expr.end]),
-                            ));
-                        }
-                        // Append element's value
-                        acc_instrs.extend(instrs_for_this_element);
-                        Ok((acc_instrs, acc_bindings))
-                    },
-                )?;
-                // The array's overall instructions are:
-                // - Write a length header
-                // - Write everything to calculate its elements.
-                let mut instructions = vec![Instruction::from_range(
-                    InstructionKind::SetPrimitive {
-                        address: length_at,
-                        value: ept::ListHeader {
-                            count: element_count,
-                            size: (self.next_addr - length_at) - 1,
-                        }
-                        .into(),
-                    },
-                    KcvmSourceRange([expr.start, expr.end]),
-                )];
-                instructions.extend(instructions_for_each_element);
-                let binding = EpBinding::Sequence {
-                    length_at,
-                    elements: bindings,
-                };
-                Ok(EvalPlan { instructions, binding })
-            }
-        }
-    }
-
-    /// Emits instructions which, when run, compute a given KCL value and store it in memory.
-    /// Returns the instructions.
-    /// Also binds the value to a name.
-    fn plan_to_bind(
-        &mut self,
-        declarations: ast::types::VariableDeclaration,
-    ) -> Result<Vec<Instruction>, CompileError> {
-        let mut ctx = Context::default();
-        declarations
-            .declarations
-            .into_iter()
-            .try_fold(Vec::new(), |mut acc, declaration| {
-                let EvalPlan { instructions, binding } =
-                    self.plan_to_compute_single(&mut ctx, SingleValue::from(declaration.init))?;
-                self.binding_scope.bind(declaration.id.name, binding);
-                acc.extend(instructions);
-                Ok(acc)
-            })
-    }
-}
-
-/// Every KCL literal value is equivalent to an Execution Plan value, and therefore can be
-/// bound to some KCL name and Execution Plan address.
-fn kcl_literal_to_kcep_literal(expr: LiteralValue) -> ept::Primitive {
-    match expr {
-        LiteralValue::IInteger(x) => ept::Primitive::NumericValue(NumericPrimitive::Integer(x)),
-        LiteralValue::Fractional(x) => ept::Primitive::NumericValue(NumericPrimitive::Float(x)),
-        LiteralValue::String(x) => ept::Primitive::String(x),
-        LiteralValue::Bool(b) => ept::Primitive::Bool(b),
-    }
-}
-
-/// Instructions that can compute some value.
-struct EvalPlan {
-    /// The instructions which will compute the value.
-    instructions: Vec<Instruction>,
-    /// Where the value will be stored.
-    binding: EpBinding,
-}
-
-/// Either an owned string, or a static string. Either way it can be read and moved around.
-pub type String2 = std::borrow::Cow<'static, str>;
-
-#[derive(Debug, Clone)]
-struct UserDefinedFunction {
-    params_optional: Vec<ast::types::Parameter>,
-    params_required: Vec<ast::types::Parameter>,
-    body: ast::types::Program,
-}
-
-impl PartialEq for UserDefinedFunction {
-    fn eq(&self, other: &Self) -> bool {
-        self.params_optional == other.params_optional && self.params_required == other.params_required
-    }
-}
-
-impl Eq for UserDefinedFunction {}
-
-#[derive(Debug, Clone)]
-#[cfg_attr(test, derive(Eq, PartialEq))]
-enum KclFunction {
-    Id(native_functions::Id),
-    Abs(native_functions::Abs),
-    Acos(native_functions::Acos),
-    Asin(native_functions::Asin),
-    Atan(native_functions::Atan),
-    Ceil(native_functions::Ceil),
-    Cos(native_functions::Cos),
-    Floor(native_functions::Floor),
-    Ln(native_functions::Ln),
-    Log10(native_functions::Log10),
-    Log2(native_functions::Log2),
-    Sin(native_functions::Sin),
-    Sqrt(native_functions::Sqrt),
-    Tan(native_functions::Tan),
-    ToDegrees(native_functions::ToDegrees),
-    ToRadians(native_functions::ToRadians),
-    StartSketchAt(native_functions::sketch::StartSketchAt),
-    LineTo(native_functions::sketch::LineTo),
-    Line(native_functions::sketch::Line),
-    XLineTo(native_functions::sketch::XLineTo),
-    XLine(native_functions::sketch::XLine),
-    YLineTo(native_functions::sketch::YLineTo),
-    YLine(native_functions::sketch::YLine),
-    TangentialArcTo(native_functions::sketch::TangentialArcTo),
-    Add(native_functions::Add),
-    Log(native_functions::Log),
-    Max(native_functions::Max),
-    Min(native_functions::Min),
-    UserDefined(UserDefinedFunction),
-    Extrude(native_functions::sketch::Extrude),
-    Close(native_functions::sketch::Close),
-}
-
-/// Context used when compiling KCL.
-#[derive(Default, Debug)]
-struct Context {
-    pipe_substitution: Option<EpBinding>,
-}

src/wasm-lib/grackle/src/native_functions.rs

@@ -1,165 +0,0 @@
-//! Defines functions which are written in Rust, but called from KCL.
-//! This includes some of the stdlib, e.g. `startSketchAt`.
-//! But some other stdlib functions will be written in KCL.
-
-use kittycad_execution_plan::{
-    BinaryArithmetic, BinaryOperation, Destination, Instruction, InstructionKind, Operand, UnaryArithmetic,
-    UnaryOperation,
-};
-use kittycad_execution_plan_traits::Address;
-
-use crate::{CompileError, EpBinding, EvalPlan};
-
-pub mod sketch;
-
-pub trait Callable {
-    fn call(&self, ctx: &mut Context<'_>, args: Vec<EpBinding>) -> Result<EvalPlan, CompileError>;
-}
-
-#[derive(Debug)]
-pub struct Context<'a> {
-    pub next_address: &'a mut Address,
-    pub next_sketch_group: &'a mut usize,
-}
-
-impl<'a> Context<'a> {
-    pub fn assign_sketch_group(&mut self) -> usize {
-        let out = *self.next_sketch_group;
-        *self.next_sketch_group += 1;
-        out
-    }
-}
-
-/// Unary operator macro to quickly create new bindings.
-macro_rules! define_unary {
-  () => {};
-  ($h:ident$( $r:ident)*) => {
-    #[derive(Debug, Clone)]
-    #[cfg_attr(test, derive(Eq, PartialEq))]
-    pub struct $h;
-
-    impl Callable for $h {
-        fn call(&self, ctx: &mut Context<'_>, mut args: Vec<EpBinding>) -> Result<EvalPlan, CompileError> {
-            if args.len() > 1 {
-                return Err(CompileError::TooManyArgs {
-                    fn_name: "$h".into(),
-                    maximum: 1,
-                    actual: args.len(),
-                });
-            }
-
-            let not_enough_args = CompileError::NotEnoughArgs {
-                fn_name: "$h".into(),
-                required: 1,
-                actual: args.len(),
-            };
-
-            let EpBinding::Single(arg0) = args.pop().ok_or(not_enough_args.clone())? else {
-                return Err(CompileError::InvalidOperand("A single value binding is expected"));
-            };
-
-            let destination = ctx.next_address.offset_by(1);
-            let instructions = vec![
-              Instruction::from(InstructionKind::UnaryArithmetic {
-                arithmetic: UnaryArithmetic {
-                  operation: UnaryOperation::$h,
-                  operand: Operand::Reference(arg0)
-                },
-                destination: Destination::Address(destination)
-              })
-            ];
-
-            Ok(EvalPlan {
-                instructions,
-                binding: EpBinding::Single(destination),
-            })
-        }
-    }
-
-    define_unary!($($r)*);
-  };
-}
-
-define_unary!(Abs Acos Asin Atan Ceil Cos Floor Ln Log10 Log2 Sin Sqrt Tan ToDegrees ToRadians);
-
-/// The identity function. Always returns its first input.
-/// Implemented purely on the KCL side so it doesn't need to be in the
-/// define_unary! macro above.
-#[derive(Debug, Clone)]
-#[cfg_attr(test, derive(Eq, PartialEq))]
-pub struct Id;
-
-impl Callable for Id {
-    fn call(&self, _: &mut Context<'_>, args: Vec<EpBinding>) -> Result<EvalPlan, CompileError> {
-        if args.len() > 1 {
-            return Err(CompileError::TooManyArgs {
-                fn_name: "id".into(),
-                maximum: 1,
-                actual: args.len(),
-            });
-        }
-        let arg = args
-            .first()
-            .ok_or(CompileError::NotEnoughArgs {
-                fn_name: "id".into(),
-                required: 1,
-                actual: 0,
-            })?
-            .clone();
-        Ok(EvalPlan {
-            instructions: Vec::new(),
-            binding: arg,
-        })
-    }
-}
-
-/// Binary operator macro to quickly create new bindings.
-macro_rules! define_binary {
-  () => {};
-  ($h:ident$( $r:ident)*) => {
-    #[derive(Debug, Clone)]
-    #[cfg_attr(test, derive(Eq, PartialEq))]
-    pub struct $h;
-
-    impl Callable for $h {
-        fn call(&self, ctx: &mut Context<'_>, mut args: Vec<EpBinding>) -> Result<EvalPlan, CompileError> {
-          let len = args.len();
-          if len > 2 {
-              return Err(CompileError::TooManyArgs {
-                  fn_name: "$h".into(),
-                  maximum: 2,
-                  actual: len,
-              });
-          }
-          let not_enough_args = CompileError::NotEnoughArgs {
-              fn_name: "$h".into(),
-              required: 2,
-              actual: len,
-          };
-          const ERR: &str = "cannot use composite values (e.g. array) as arguments to $h";
-          let EpBinding::Single(arg1) = args.pop().ok_or(not_enough_args.clone())? else {
-              return Err(CompileError::InvalidOperand(ERR));
-          };
-          let EpBinding::Single(arg0) = args.pop().ok_or(not_enough_args)? else {
-              return Err(CompileError::InvalidOperand(ERR));
-          };
-          let destination = ctx.next_address.offset_by(1);
-          Ok(EvalPlan {
-              instructions: vec![Instruction::from(InstructionKind::BinaryArithmetic {
-                  arithmetic: BinaryArithmetic {
-                      operation: BinaryOperation::$h,
-                      operand0: Operand::Reference(arg0),
-                      operand1: Operand::Reference(arg1),
-                  },
-                  destination: Destination::Address(destination),
-              })],
-              binding: EpBinding::Single(destination),
-          })
-        }
-    }
-
-    define_binary!($($r)*);
-  };
-}
-
-define_binary!(Add Log Max Min);

src/wasm-lib/grackle/src/native_functions/sketch.rs

@@ -1,8 +0,0 @@
-//! Native functions for sketching on the plane.
-
-pub mod helpers;
-pub mod stdlib_functions;
-
-pub use stdlib_functions::{
-    Close, Extrude, Line, LineTo, StartSketchAt, TangentialArcTo, XLine, XLineTo, YLine, YLineTo,
-};

src/wasm-lib/grackle/src/native_functions/sketch/helpers.rs

@@ -1,202 +0,0 @@
-use kittycad_execution_plan::{api_request::ApiRequest, Destination, Instruction, InstructionKind};
-use kittycad_execution_plan_traits::{Address, InMemory};
-use kittycad_modeling_cmds::{id::ModelingCmdId, ModelingCmdEndpoint};
-
-use crate::{binding_scope::EpBinding, error::CompileError};
-
-/// Emit instructions for an API call with no parameters.
-pub fn no_arg_api_call(instrs: &mut Vec<Instruction>, endpoint: ModelingCmdEndpoint, cmd_id: ModelingCmdId) {
-    instrs.push(Instruction::from(InstructionKind::ApiRequest(ApiRequest {
-        endpoint,
-        store_response: None,
-        arguments: vec![],
-        cmd_id,
-    })))
-}
-
-/// Emit instructions for an API call with the given parameters.
-/// The API parameters are stored in the EP memory stack.
-/// So, they have to be pushed onto the stack in the right order,
-/// i.e. the reverse order in which the API call's Rust struct defines the fields.
-pub fn stack_api_call<const N: usize>(
-    instrs: &mut Vec<Instruction>,
-    endpoint: ModelingCmdEndpoint,
-    store_response: Option<Address>,
-    cmd_id: ModelingCmdId,
-    data: [Vec<kittycad_execution_plan_traits::Primitive>; N],
-) {
-    let arguments = vec![InMemory::StackPop; data.len()];
-    instrs.extend(data.map(|data| Instruction::from(InstructionKind::StackPush { data })));
-    instrs.push(Instruction::from(InstructionKind::ApiRequest(ApiRequest {
-        endpoint,
-        store_response,
-        arguments,
-        cmd_id,
-    })))
-}
-
-pub fn sg_binding(
-    b: EpBinding,
-    fn_name: &'static str,
-    expected: &'static str,
-    arg_number: usize,
-) -> Result<usize, CompileError> {
-    match b {
-        EpBinding::SketchGroup { index } => Ok(index),
-        EpBinding::Single(_) => Err(CompileError::ArgWrongType {
-            fn_name,
-            expected,
-            actual: "single".to_owned(),
-            arg_number,
-        }),
-        EpBinding::Sequence { .. } => Err(CompileError::ArgWrongType {
-            fn_name,
-            expected,
-            actual: "array".to_owned(),
-            arg_number,
-        }),
-        EpBinding::Map { .. } => Err(CompileError::ArgWrongType {
-            fn_name,
-            expected,
-            actual: "object".to_owned(),
-            arg_number,
-        }),
-        EpBinding::Function(_) => Err(CompileError::ArgWrongType {
-            fn_name,
-            expected,
-            actual: "function".to_owned(),
-            arg_number,
-        }),
-        EpBinding::Constant(_) => Err(CompileError::ArgWrongType {
-            fn_name,
-            expected,
-            actual: "constant".to_owned(),
-            arg_number,
-        }),
-    }
-}
-pub fn single_binding(
-    b: EpBinding,
-    fn_name: &'static str,
-    expected: &'static str,
-    arg_number: usize,
-) -> Result<Address, CompileError> {
-    match b {
-        EpBinding::Single(a) => Ok(a),
-        EpBinding::SketchGroup { .. } => Err(CompileError::ArgWrongType {
-            fn_name,
-            expected,
-            actual: "SketchGroup".to_owned(),
-            arg_number,
-        }),
-        EpBinding::Sequence { .. } => Err(CompileError::ArgWrongType {
-            fn_name,
-            expected,
-            actual: "array".to_owned(),
-            arg_number,
-        }),
-        EpBinding::Map { .. } => Err(CompileError::ArgWrongType {
-            fn_name,
-            expected,
-            actual: "object".to_owned(),
-            arg_number,
-        }),
-        EpBinding::Function(_) => Err(CompileError::ArgWrongType {
-            fn_name,
-            expected,
-            actual: "function".to_owned(),
-            arg_number,
-        }),
-        EpBinding::Constant(_) => Err(CompileError::ArgWrongType {
-            fn_name,
-            expected,
-            actual: "constant".to_owned(),
-            arg_number,
-        }),
-    }
-}
-
-pub fn sequence_binding(
-    b: EpBinding,
-    fn_name: &'static str,
-    expected: &'static str,
-    arg_number: usize,
-) -> Result<Vec<EpBinding>, CompileError> {
-    match b {
-        EpBinding::Sequence { elements, .. } => Ok(elements),
-        EpBinding::Single(_) => Err(CompileError::ArgWrongType {
-            fn_name,
-            expected,
-            actual: "single".to_owned(),
-            arg_number,
-        }),
-        EpBinding::SketchGroup { .. } => Err(CompileError::ArgWrongType {
-            fn_name,
-            expected,
-            actual: "SketchGroup".to_owned(),
-            arg_number,
-        }),
-        EpBinding::Map { .. } => Err(CompileError::ArgWrongType {
-            fn_name,
-            expected,
-            actual: "object".to_owned(),
-            arg_number,
-        }),
-        EpBinding::Function(_) => Err(CompileError::ArgWrongType {
-            fn_name,
-            expected,
-            actual: "function".to_owned(),
-            arg_number,
-        }),
-        EpBinding::Constant(_) => Err(CompileError::ArgWrongType {
-            fn_name,
-            expected,
-            actual: "constant".to_owned(),
-            arg_number,
-        }),
-    }
-}
-
-/// Extract a 2D point from an argument to a KCL Function.
-pub fn arg_point2d(
-    arg: EpBinding,
-    fn_name: &'static str,
-    instructions: &mut Vec<Instruction>,
-    ctx: &mut crate::native_functions::Context<'_>,
-    arg_number: usize,
-) -> Result<Address, CompileError> {
-    let expected = "2D point (array with length 2)";
-    let elements = sequence_binding(arg, fn_name, "an array of length 2", arg_number)?;
-    if elements.len() != 2 {
-        return Err(CompileError::ArgWrongType {
-            fn_name,
-            expected,
-            actual: format!("array of length {}", elements.len()),
-            arg_number: 0,
-        });
-    }
-    // KCL stores points as an array.
-    // KC API stores them as Rust objects laid flat out in memory.
-    let start = ctx.next_address.offset_by(2);
-    let start_x = start;
-    let start_y = start + 1;
-    let start_z = start + 2;
-    instructions.extend([
-        Instruction::from(InstructionKind::Copy {
-            source: single_binding(elements[0].clone(), fn_name, "number", arg_number)?,
-            destination: Destination::Address(start_x),
-            length: 1,
-        }),
-        Instruction::from(InstructionKind::Copy {
-            source: single_binding(elements[1].clone(), fn_name, "number", arg_number)?,
-            destination: Destination::Address(start_y),
-            length: 1,
-        }),
-        Instruction::from(InstructionKind::SetPrimitive {
-            address: start_z,
-            value: 0.0.into(),
-        }),
-    ]);
-    ctx.next_address.offset_by(1); // After we pushed 0.0 here, just above.
-    Ok(start)
-}

src/wasm-lib/grackle/src/native_functions/sketch/stdlib_functions.rs

@@ -1,853 +0,0 @@
-use kittycad_execution_plan::{
-    api_request::ApiRequest,
-    sketch_types::{self, Axes, BasePath, Plane, SketchGroup},
-    BinaryArithmetic, BinaryOperation, Destination, Instruction, InstructionKind, Operand,
-};
-use kittycad_execution_plan_traits::{Address, InMemory, Primitive, Value};
-use kittycad_modeling_cmds::{
-    shared::{Point3d, Point4d},
-    ModelingCmdEndpoint,
-};
-use uuid::Uuid;
-
-use super::helpers::{arg_point2d, no_arg_api_call, sg_binding, single_binding, stack_api_call};
-use crate::{binding_scope::EpBinding, error::CompileError, native_functions::Callable, EvalPlan};
-
-#[derive(PartialEq)]
-pub enum At {
-    RelativeXY,
-    AbsoluteXY,
-    RelativeX,
-    AbsoluteX,
-    RelativeY,
-    AbsoluteY,
-}
-
-impl At {
-    pub fn is_relative(&self) -> bool {
-        *self == At::RelativeX || *self == At::RelativeY || *self == At::RelativeXY
-    }
-}
-
-#[derive(Debug, Clone)]
-#[cfg_attr(test, derive(Eq, PartialEq))]
-pub struct Close;
-
-impl Callable for Close {
-    fn call(
-        &self,
-        _ctx: &mut crate::native_functions::Context<'_>,
-        args: Vec<EpBinding>,
-    ) -> Result<EvalPlan, CompileError> {
-        let mut instructions = Vec::new();
-        let fn_name = "close";
-        // Get all required params.
-        let mut args_iter = args.into_iter();
-        let Some(sketch_group) = args_iter.next() else {
-            return Err(CompileError::NotEnoughArgs {
-                fn_name: fn_name.into(),
-                required: 1,
-                actual: 1,
-            });
-        };
-        // Check param type.
-        let sg = sg_binding(sketch_group, fn_name, "sketch group", 1)?;
-        let cmd_id = Uuid::new_v4().into();
-        instructions.extend([
-            // Push the path ID onto the stack.
-            Instruction::from(InstructionKind::SketchGroupCopyFrom {
-                destination: Destination::StackPush,
-                length: 1,
-                source: sg,
-                offset: SketchGroup::path_id_offset(),
-            }),
-            // Call the 'extrude' API request.
-            Instruction::from(InstructionKind::ApiRequest(ApiRequest {
-                endpoint: ModelingCmdEndpoint::ClosePath,
-                store_response: None,
-                arguments: vec![
-                    // Target (path ID)
-                    InMemory::StackPop,
-                ],
-                cmd_id,
-            })),
-        ]);
-
-        Ok(EvalPlan {
-            instructions,
-            binding: EpBinding::SketchGroup { index: sg },
-        })
-    }
-}
-#[derive(Debug, Clone)]
-#[cfg_attr(test, derive(Eq, PartialEq))]
-pub struct Extrude;
-
-impl Callable for Extrude {
-    fn call(
-        &self,
-        _ctx: &mut crate::native_functions::Context<'_>,
-        args: Vec<EpBinding>,
-    ) -> Result<EvalPlan, CompileError> {
-        let mut instructions = Vec::new();
-        let fn_name = "extrude";
-        // Get all required params.
-        let mut args_iter = args.into_iter();
-        let Some(height) = args_iter.next() else {
-            return Err(CompileError::NotEnoughArgs {
-                fn_name: fn_name.into(),
-                required: 2,
-                actual: 0,
-            });
-        };
-        let Some(sketch_group) = args_iter.next() else {
-            return Err(CompileError::NotEnoughArgs {
-                fn_name: fn_name.into(),
-                required: 2,
-                actual: 1,
-            });
-        };
-        // Check param type.
-        let height = single_binding(height, fn_name, "numeric height", 0)?;
-        let sg = sg_binding(sketch_group, fn_name, "sketch group", 1)?;
-        let cmd_id = Uuid::new_v4().into();
-        instructions.extend([
-            // Push the `cap` bool onto the stack.
-            Instruction::from(InstructionKind::StackPush {
-                data: vec![true.into()],
-            }),
-            // Push the path ID onto the stack.
-            Instruction::from(InstructionKind::SketchGroupCopyFrom {
-                destination: Destination::StackPush,
-                length: 1,
-                source: sg,
-                offset: SketchGroup::path_id_offset(),
-            }),
-            // Call the 'extrude' API request.
-            Instruction::from(InstructionKind::ApiRequest(ApiRequest {
-                endpoint: ModelingCmdEndpoint::Extrude,
-                store_response: None,
-                arguments: vec![
-                    // Target
-                    InMemory::StackPop,
-                    // Height
-                    InMemory::Address(height),
-                    // Cap
-                    InMemory::StackPop,
-                ],
-                cmd_id,
-            })),
-        ]);
-
-        // TODO: make an ExtrudeGroup and store it.
-        Ok(EvalPlan {
-            instructions,
-            binding: EpBinding::Single(Address::ZERO + 999),
-        })
-    }
-}
-
-#[derive(Debug, Clone)]
-#[cfg_attr(test, derive(Eq, PartialEq))]
-pub struct LineTo;
-
-impl Callable for LineTo {
-    fn call(
-        &self,
-        ctx: &mut crate::native_functions::Context<'_>,
-        args: Vec<EpBinding>,
-    ) -> Result<EvalPlan, CompileError> {
-        LineBare::call(ctx, "lineTo", args, LineBareOptions { at: At::AbsoluteXY })
-    }
-}
-
-#[derive(Debug, Clone)]
-#[cfg_attr(test, derive(Eq, PartialEq))]
-pub struct Line;
-
-impl Callable for Line {
-    fn call(
-        &self,
-        ctx: &mut crate::native_functions::Context<'_>,
-        args: Vec<EpBinding>,
-    ) -> Result<EvalPlan, CompileError> {
-        LineBare::call(ctx, "line", args, LineBareOptions { at: At::RelativeXY })
-    }
-}
-
-#[derive(Debug, Clone)]
-#[cfg_attr(test, derive(Eq, PartialEq))]
-pub struct XLineTo;
-
-impl Callable for XLineTo {
-    fn call(
-        &self,
-        ctx: &mut crate::native_functions::Context<'_>,
-        args: Vec<EpBinding>,
-    ) -> Result<EvalPlan, CompileError> {
-        LineBare::call(ctx, "xLineTo", args, LineBareOptions { at: At::AbsoluteX })
-    }
-}
-
-#[derive(Debug, Clone)]
-#[cfg_attr(test, derive(Eq, PartialEq))]
-pub struct XLine;
-
-impl Callable for XLine {
-    fn call(
-        &self,
-        ctx: &mut crate::native_functions::Context<'_>,
-        args: Vec<EpBinding>,
-    ) -> Result<EvalPlan, CompileError> {
-        LineBare::call(ctx, "xLine", args, LineBareOptions { at: At::RelativeX })
-    }
-}
-
-#[derive(Debug, Clone)]
-#[cfg_attr(test, derive(Eq, PartialEq))]
-pub struct YLineTo;
-
-impl Callable for YLineTo {
-    fn call(
-        &self,
-        ctx: &mut crate::native_functions::Context<'_>,
-        args: Vec<EpBinding>,
-    ) -> Result<EvalPlan, CompileError> {
-        LineBare::call(ctx, "yLineTo", args, LineBareOptions { at: At::AbsoluteY })
-    }
-}
-
-#[derive(Debug, Clone)]
-#[cfg_attr(test, derive(Eq, PartialEq))]
-pub struct YLine;
-
-impl Callable for YLine {
-    fn call(
-        &self,
-        ctx: &mut crate::native_functions::Context<'_>,
-        args: Vec<EpBinding>,
-    ) -> Result<EvalPlan, CompileError> {
-        LineBare::call(ctx, "yLine", args, LineBareOptions { at: At::RelativeY })
-    }
-}
-
-#[derive(Debug, Clone)]
-#[cfg_attr(test, derive(Eq, PartialEq))]
-/// Exposes all the possible arguments the `line` modeling command can take.
-/// Reduces code for the other line functions needed.
-/// We do not expose this to the developer since it does not align with
-/// the documentation (there is no "lineBare").
-pub struct LineBare;
-
-/// Used to configure the call to handle different line variants.
-pub struct LineBareOptions {
-    /// Where to start coordinates at, ex: At::RelativeXY.
-    at: At,
-}
-
-impl LineBare {
-    fn call(
-        ctx: &mut crate::native_functions::Context<'_>,
-        fn_name: &'static str,
-        args: Vec<EpBinding>,
-        opts: LineBareOptions,
-    ) -> Result<EvalPlan, CompileError> {
-        let mut instructions = Vec::new();
-
-        let required = 2;
-
-        let mut args_iter = args.into_iter();
-
-        let Some(to) = args_iter.next() else {
-            return Err(CompileError::NotEnoughArgs {
-                fn_name: fn_name.into(),
-                required,
-                actual: args_iter.count(),
-            });
-        };
-
-        let Some(sketch_group) = args_iter.next() else {
-            return Err(CompileError::NotEnoughArgs {
-                fn_name: fn_name.into(),
-                required,
-                actual: args_iter.count(),
-            });
-        };
-
-        let tag = match args_iter.next() {
-            Some(a) => a,
-            None => {
-                // Write an empty string and use that.
-                let empty_string_addr = ctx.next_address.offset_by(1);
-                instructions.push(Instruction::from(InstructionKind::SetPrimitive {
-                    address: empty_string_addr,
-                    value: String::new().into(),
-                }));
-                EpBinding::Single(empty_string_addr)
-            }
-        };
-
-        // Check the type of required params.
-        // We don't check `to` here because it can take on either a
-        // EpBinding::Sequence or EpBinding::Single.
-
-        let sg = sg_binding(sketch_group, fn_name, "sketch group", 1)?;
-        let tag = single_binding(tag, fn_name, "string tag", 2)?;
-        let id = Uuid::new_v4();
-
-        // Start of the path segment (which is a straight line).
-        let length_of_3d_point = Point3d::<f64>::default().into_parts().len();
-        let start_of_line = ctx.next_address.offset_by(1);
-
-        // Reserve space for the line's end, and the `relative: bool` field.
-        ctx.next_address.offset_by(length_of_3d_point + 1);
-        let new_sg_index = ctx.assign_sketch_group();
-
-        // Copy based on the options.
-        match opts {
-            LineBareOptions { at: At::AbsoluteXY, .. } | LineBareOptions { at: At::RelativeXY, .. } => {
-                // Push the `to` 2D point onto the stack.
-                let EpBinding::Sequence { elements, length_at: _ } = to.clone() else {
-                    return Err(CompileError::InvalidOperand("Must pass a list of length 2"));
-                };
-                let &[EpBinding::Single(el0), EpBinding::Single(el1)] = elements.as_slice() else {
-                    return Err(CompileError::InvalidOperand("Must pass a sequence here."));
-                };
-                instructions.extend([
-                    // X
-                    Instruction::from(InstructionKind::Copy {
-                        source: el0,
-                        length: 1,
-                        destination: Destination::StackPush,
-                    }),
-                    // Y
-                    Instruction::from(InstructionKind::Copy {
-                        source: el1,
-                        length: 1,
-                        destination: Destination::StackExtend,
-                    }),
-                    // Z
-                    Instruction::from(InstructionKind::StackExtend { data: vec![0.0.into()] }),
-                ]);
-            }
-            LineBareOptions { at: At::AbsoluteX, .. } | LineBareOptions { at: At::RelativeX, .. } => {
-                let EpBinding::Single(addr) = to else {
-                    return Err(CompileError::InvalidOperand("Must pass a single value here."));
-                };
-                instructions.extend([
-                    Instruction::from(InstructionKind::Copy {
-                        // X
-                        source: addr,
-                        length: 1,
-                        destination: Destination::StackPush,
-                    }),
-                    Instruction::from(InstructionKind::StackExtend {
-                        data: vec![Primitive::from(0.0)],
-                    }), // Y
-                    Instruction::from(InstructionKind::StackExtend {
-                        data: vec![Primitive::from(0.0)],
-                    }), // Z
-                ]);
-            }
-            LineBareOptions { at: At::AbsoluteY, .. } | LineBareOptions { at: At::RelativeY, .. } => {
-                let EpBinding::Single(addr) = to else {
-                    return Err(CompileError::InvalidOperand("Must pass a single value here."));
-                };
-                instructions.extend([
-                    // X
-                    Instruction::from(InstructionKind::StackPush {
-                        data: vec![Primitive::from(0.0)],
-                    }),
-                    // Y
-                    Instruction::from(InstructionKind::Copy {
-                        source: addr,
-                        length: 1,
-                        destination: Destination::StackExtend,
-                    }),
-                    // Z
-                    Instruction::from(InstructionKind::StackExtend {
-                        data: vec![Primitive::from(0.0)],
-                    }),
-                ]);
-            }
-        }
-
-        instructions.extend([
-            // Append the new path segment to memory.
-            // First comes its tag.
-            Instruction::from(InstructionKind::SetPrimitive {
-                address: start_of_line,
-                value: "Line".to_owned().into(),
-            }),
-            // Then its end
-            Instruction::from(InstructionKind::StackPop {
-                destination: Some(Destination::Address(start_of_line + 1)),
-            }),
-            // Then its `relative` field.
-            Instruction::from(InstructionKind::SetPrimitive {
-                address: start_of_line + 1 + length_of_3d_point,
-                value: opts.at.is_relative().into(),
-            }),
-            // Push the path ID onto the stack.
-            Instruction::from(InstructionKind::SketchGroupCopyFrom {
-                destination: Destination::StackPush,
-                length: 1,
-                source: sg,
-                offset: SketchGroup::path_id_offset(),
-            }),
-            // Send the ExtendPath request
-            Instruction::from(InstructionKind::ApiRequest(ApiRequest {
-                endpoint: ModelingCmdEndpoint::ExtendPath,
-                store_response: None,
-                arguments: vec![
-                    // Path ID
-                    InMemory::StackPop,
-                    // Segment
-                    InMemory::Address(start_of_line),
-                ],
-                cmd_id: id.into(),
-            })),
-            // Push the new segment in SketchGroup format.
-            //      Path tag.
-            Instruction::from(InstructionKind::StackPush {
-                data: vec![Primitive::from("ToPoint".to_owned())],
-            }),
-            //      `BasePath::from` point.
-            // Place them in the secondary stack to prepare ToPoint structure.
-            Instruction::from(InstructionKind::SketchGroupGetLastPoint {
-                source: sg,
-                destination: Destination::StackExtend,
-            }),
-        ]);
-
-        // Reserve space for the segment last point
-        let to_point_from = ctx.next_address.offset_by(2);
-
-        instructions.extend([
-            // Copy to the primary stack as well to be worked with.
-            Instruction::from(InstructionKind::SketchGroupGetLastPoint {
-                source: sg,
-                destination: Destination::Address(to_point_from),
-            }),
-        ]);
-
-        //      `BasePath::to` point.
-
-        // The copy here depends on the incoming `to` data.
-        // Sometimes it's a list, sometimes it's single datum.
-        // And the relative/not relative matters. When relative, we need to
-        // copy coords from `from` into the new `to` coord that don't change.
-        // At least everything else can be built up from these "primitives".
-        if let EpBinding::Sequence { elements, length_at: _ } = to.clone() {
-            if let &[EpBinding::Single(el0), EpBinding::Single(el1)] = elements.as_slice() {
-                match opts {
-                    // ToPoint { from: { x1, y1 }, to: { x1 + x2, y1 + y2 } }
-                    LineBareOptions { at: At::RelativeXY, .. } => {
-                        instructions.extend([
-                            Instruction::from(InstructionKind::BinaryArithmetic {
-                                arithmetic: BinaryArithmetic {
-                                    operation: BinaryOperation::Add,
-                                    operand0: Operand::Reference(to_point_from + 0),
-                                    operand1: Operand::Reference(el0),
-                                },
-                                destination: Destination::StackExtend,
-                            }),
-                            Instruction::from(InstructionKind::BinaryArithmetic {
-                                arithmetic: BinaryArithmetic {
-                                    operation: BinaryOperation::Add,
-                                    operand0: Operand::Reference(to_point_from + 1),
-                                    operand1: Operand::Reference(el1),
-                                },
-                                destination: Destination::StackExtend,
-                            }),
-                        ]);
-                    }
-                    // ToPoint { from: { x1, y1 }, to: { x2, y2 } }
-                    LineBareOptions { at: At::AbsoluteXY, .. } => {
-                        // Otherwise just directly copy the new points.
-                        instructions.extend([
-                            Instruction::from(InstructionKind::Copy {
-                                source: el0,
-                                length: 1,
-                                destination: Destination::StackExtend,
-                            }),
-                            Instruction::from(InstructionKind::Copy {
-                                source: el1,
-                                length: 1,
-                                destination: Destination::StackExtend,
-                            }),
-                        ]);
-                    }
-                    _ => {
-                        return Err(CompileError::InvalidOperand(
-                            "A Sequence with At::...X or At::...Y is not valid here. Must be At::...XY.",
-                        ));
-                    }
-                }
-            }
-        } else if let EpBinding::Single(addr) = to {
-            match opts {
-                // ToPoint { from: { x1, y1 }, to: { x1 + x2, y1 } }
-                LineBareOptions { at: At::RelativeX } => {
-                    instructions.extend([
-                        Instruction::from(InstructionKind::BinaryArithmetic {
-                            arithmetic: BinaryArithmetic {
-                                operation: BinaryOperation::Add,
-                                operand0: Operand::Reference(to_point_from + 0),
-                                operand1: Operand::Reference(addr),
-                            },
-                            destination: Destination::StackExtend,
-                        }),
-                        Instruction::from(InstructionKind::Copy {
-                            source: to_point_from + 1,
-                            length: 1,
-                            destination: Destination::StackExtend,
-                        }),
-                    ]);
-                }
-                // ToPoint { from: { x1, y1 }, to: { x2, y1 } }
-                LineBareOptions { at: At::AbsoluteX } => {
-                    instructions.extend([
-                        Instruction::from(InstructionKind::Copy {
-                            source: addr,
-                            length: 1,
-                            destination: Destination::StackExtend,
-                        }),
-                        Instruction::from(InstructionKind::Copy {
-                            source: to_point_from + 1,
-                            length: 1,
-                            destination: Destination::StackExtend,
-                        }),
-                    ]);
-                }
-                // ToPoint { from: { x1, y1 }, to: { x1, y1 + y2 } }
-                LineBareOptions { at: At::RelativeY } => {
-                    instructions.extend([
-                        Instruction::from(InstructionKind::Copy {
-                            source: to_point_from + 0,
-                            length: 1,
-                            destination: Destination::StackExtend,
-                        }),
-                        Instruction::from(InstructionKind::BinaryArithmetic {
-                            arithmetic: BinaryArithmetic {
-                                operation: BinaryOperation::Add,
-                                operand0: Operand::Reference(to_point_from + 1),
-                                operand1: Operand::Reference(addr),
-                            },
-                            destination: Destination::StackExtend,
-                        }),
-                    ]);
-                }
-                // ToPoint { from: { x1, y1 }, to: { x1, y2 } }
-                LineBareOptions { at: At::AbsoluteY } => {
-                    instructions.extend([
-                        Instruction::from(InstructionKind::Copy {
-                            source: to_point_from + 0,
-                            length: 1,
-                            destination: Destination::StackExtend,
-                        }),
-                        Instruction::from(InstructionKind::Copy {
-                            source: addr,
-                            length: 1,
-                            destination: Destination::StackExtend,
-                        }),
-                    ]);
-                }
-                _ => {
-                    return Err(CompileError::InvalidOperand(
-                        "A Single binding with At::...XY is not valid here.",
-                    ));
-                }
-            }
-        } else {
-            return Err(CompileError::InvalidOperand(
-                "Must be a sequence or single value binding.",
-            ));
-        }
-
-        instructions.extend([
-            //      `BasePath::name` string.
-            Instruction::from(InstructionKind::Copy {
-                source: tag,
-                length: 1,
-                destination: Destination::StackExtend,
-            }),
-            // Update the SketchGroup with its new segment.
-            Instruction::from(InstructionKind::SketchGroupAddSegment {
-                destination: new_sg_index,
-                segment: InMemory::StackPop,
-                source: sg,
-            }),
-        ]);
-
-        Ok(EvalPlan {
-            instructions,
-            binding: EpBinding::SketchGroup { index: new_sg_index },
-        })
-    }
-}
-
-#[derive(Debug, Clone)]
-#[cfg_attr(test, derive(Eq, PartialEq))]
-pub struct StartSketchAt;
-
-impl Callable for StartSketchAt {
-    fn call(
-        &self,
-        ctx: &mut crate::native_functions::Context<'_>,
-        args: Vec<EpBinding>,
-    ) -> Result<EvalPlan, CompileError> {
-        let mut instructions = Vec::new();
-        // First, before we send any API calls, let's validate the arguments to this function.
-        let mut args_iter = args.into_iter();
-        let Some(start) = args_iter.next() else {
-            return Err(CompileError::NotEnoughArgs {
-                fn_name: "startSketchAt".into(),
-                required: 1,
-                actual: 0,
-            });
-        };
-        let start_point = arg_point2d(start, "startSketchAt", &mut instructions, ctx, 0)?;
-        let tag = match args_iter.next() {
-            None => None,
-            Some(b) => Some(single_binding(b, "startSketchAt", "a single string", 1)?),
-        };
-
-        // Define some constants:
-        let axes = Axes {
-            x: Point3d { x: 1.0, y: 0.0, z: 0.0 },
-            y: Point3d { x: 0.0, y: 1.0, z: 0.0 },
-            z: Point3d { x: 0.0, y: 0.0, z: 1.0 },
-        };
-        let origin = Point3d::default();
-
-        // Now the function can start.
-        // First API call: make the plane.
-        let plane_id = Uuid::new_v4();
-        stack_api_call(
-            &mut instructions,
-            ModelingCmdEndpoint::MakePlane,
-            None,
-            plane_id.into(),
-            [
-                Some(true).into_parts(), // hide
-                vec![false.into()],      // clobber
-                vec![60.0.into()],       // size
-                axes.y.into_parts(),
-                axes.x.into_parts(),
-                origin.into_parts(),
-            ],
-        );
-
-        // Next, enter sketch mode.
-        stack_api_call(
-            &mut instructions,
-            ModelingCmdEndpoint::EnableSketchMode,
-            None,
-            Uuid::new_v4().into(),
-            [
-                Some(axes.z).into_parts(),
-                vec![false.into()],    // adjust camera
-                vec![false.into()],    // animated
-                vec![false.into()],    // ortho mode
-                vec![plane_id.into()], // entity id (plane in this case)
-            ],
-        );
-
-        // Then start a path
-        let path_id = Uuid::new_v4();
-        no_arg_api_call(&mut instructions, ModelingCmdEndpoint::StartPath, path_id.into());
-
-        // Move the path pen to the given point.
-        instructions.push(Instruction::from(InstructionKind::StackPush {
-            data: vec![path_id.into()],
-        }));
-        instructions.push(Instruction::from(InstructionKind::ApiRequest(ApiRequest {
-            endpoint: ModelingCmdEndpoint::MovePathPen,
-            store_response: None,
-            arguments: vec![InMemory::StackPop, InMemory::Address(start_point)],
-            cmd_id: Uuid::new_v4().into(),
-        })));
-
-        // Starting a sketch creates a sketch group.
-        // Updating the sketch will update this sketch group later.
-        let sketch_group = SketchGroup {
-            id: path_id,
-            position: origin,
-            rotation: Point4d {
-                x: 0.0,
-                y: 0.0,
-                z: 0.0,
-                w: 1.0,
-            },
-            // Below: Must copy the existing data (from the arguments to this KCL function)
-            // over these values after writing to memory.
-            path_first: BasePath {
-                from: Default::default(),
-                to: Default::default(),
-                name: Default::default(),
-            },
-            path_rest: Vec::new(),
-            on: sketch_types::SketchSurface::Plane(Plane {
-                id: plane_id,
-                value: sketch_types::PlaneType::XY,
-                origin,
-                axes,
-            }),
-            axes,
-            entity_id: Some(plane_id),
-        };
-        let sketch_group_index = ctx.assign_sketch_group();
-        instructions.extend([
-            Instruction::from(InstructionKind::SketchGroupSet {
-                sketch_group,
-                destination: sketch_group_index,
-            }),
-            // As mentioned above: Copy the existing data over the `path_first`.
-            Instruction::from(InstructionKind::SketchGroupSetBasePath {
-                source: sketch_group_index,
-                from: InMemory::Address(start_point),
-                to: InMemory::Address(start_point),
-                name: tag.map(InMemory::Address),
-            }),
-        ]);
-
-        Ok(EvalPlan {
-            instructions,
-            binding: EpBinding::SketchGroup {
-                index: sketch_group_index,
-            },
-        })
-    }
-}
-
-#[derive(Debug, Clone)]
-#[cfg_attr(test, derive(Eq, PartialEq))]
-pub struct TangentialArcTo;
-
-impl Callable for TangentialArcTo {
-    fn call(
-        &self,
-        ctx: &mut crate::native_functions::Context<'_>,
-        args: Vec<EpBinding>,
-    ) -> Result<EvalPlan, CompileError> {
-        let mut instructions = Vec::new();
-        let fn_name = "tangential_arc_to";
-        // Get both required params.
-        let mut args_iter = args.into_iter();
-        let Some(to) = args_iter.next() else {
-            return Err(CompileError::NotEnoughArgs {
-                fn_name: fn_name.into(),
-                required: 2,
-                actual: 0,
-            });
-        };
-        let Some(sketch_group) = args_iter.next() else {
-            return Err(CompileError::NotEnoughArgs {
-                fn_name: fn_name.into(),
-                required: 2,
-                actual: 1,
-            });
-        };
-        let tag = match args_iter.next() {
-            Some(a) => a,
-            None => {
-                // Write an empty string and use that.
-                let empty_string_addr = ctx.next_address.offset_by(1);
-                instructions.push(Instruction::from(InstructionKind::SetPrimitive {
-                    address: empty_string_addr,
-                    value: String::new().into(),
-                }));
-                EpBinding::Single(empty_string_addr)
-            }
-        };
-        // Check the type of required params.
-        let to = arg_point2d(to, fn_name, &mut instructions, ctx, 0)?;
-        let sg = sg_binding(sketch_group, fn_name, "sketch group", 1)?;
-        let tag = single_binding(tag, fn_name, "string tag", 2)?;
-        let id = Uuid::new_v4();
-        // Start of the path segment (which is a straight line).
-        let length_of_3d_point = Point3d::<f64>::default().into_parts().len();
-        let start_of_tangential_arc = ctx.next_address.offset_by(1);
-        // Reserve space for the line's end, and the `relative: bool` field.
-        ctx.next_address.offset_by(length_of_3d_point + 1);
-        let new_sg_index = ctx.assign_sketch_group();
-        instructions.extend([
-            // Push the `to` 2D point onto the stack.
-            Instruction::from(InstructionKind::Copy {
-                source: to,
-                length: 2,
-                destination: Destination::StackPush,
-            }),
-            // Make it a 3D point.
-            Instruction::from(InstructionKind::StackExtend { data: vec![0.0.into()] }),
-            // Append the new path segment to memory.
-            // First comes its tag.
-            Instruction::from(InstructionKind::SetPrimitive {
-                address: start_of_tangential_arc,
-                value: "TangentialArcTo".to_owned().into(),
-            }),
-            // Then its to
-            Instruction::from(InstructionKind::StackPop {
-                destination: Some(Destination::Address(start_of_tangential_arc + 1)),
-            }),
-            // Then its `angle_snap_increment` field.
-            Instruction::from(InstructionKind::SetPrimitive {
-                address: start_of_tangential_arc + 1 + length_of_3d_point,
-                value: Primitive::from("None".to_owned()),
-            }),
-            // Push the path ID onto the stack.
-            Instruction::from(InstructionKind::SketchGroupCopyFrom {
-                destination: Destination::StackPush,
-                length: 1,
-                source: sg,
-                offset: SketchGroup::path_id_offset(),
-            }),
-            // Send the ExtendPath request
-            Instruction::from(InstructionKind::ApiRequest(ApiRequest {
-                endpoint: ModelingCmdEndpoint::ExtendPath,
-                store_response: None,
-                arguments: vec![
-                    // Path ID
-                    InMemory::StackPop,
-                    // Segment
-                    InMemory::Address(start_of_tangential_arc),
-                ],
-                cmd_id: id.into(),
-            })),
-            // Push the new segment in SketchGroup format.
-            //      Path tag.
-            Instruction::from(InstructionKind::StackPush {
-                data: vec![Primitive::from("ToPoint".to_owned())],
-            }),
-            //      `BasePath::from` point.
-            Instruction::from(InstructionKind::SketchGroupGetLastPoint {
-                source: sg,
-                destination: Destination::StackExtend,
-            }),
-            //      `BasePath::to` point.
-            Instruction::from(InstructionKind::Copy {
-                source: start_of_tangential_arc + 1,
-                length: 2,
-                destination: Destination::StackExtend,
-            }),
-            //      `BasePath::name` string.
-            Instruction::from(InstructionKind::Copy {
-                source: tag,
-                length: 1,
-                destination: Destination::StackExtend,
-            }),
-            // Update the SketchGroup with its new segment.
-            Instruction::from(InstructionKind::SketchGroupAddSegment {
-                destination: new_sg_index,
-                segment: InMemory::StackPop,
-                source: sg,
-            }),
-        ]);
-
-        Ok(EvalPlan {
-            instructions,
-            binding: EpBinding::SketchGroup { index: new_sg_index },
-        })
-    }
-}

src/wasm-lib/kcl/Cargo.toml

@@ -25,11 +25,9 @@ futures = { version = "0.3.30" }
 git_rev = "0.1.0"
 gltf-json = "1.4.1"
 kittycad = { workspace = true, features = ["clap"] }
-kittycad-execution-plan-macros = { workspace = true }
-kittycad-execution-plan-traits = { workspace = true }
 lazy_static = "1.4.0"
 mime_guess = "2.0.4"
-parse-display = "0.9.0"
+parse-display = "0.9.1"
 reqwest = { version = "0.11.26", default-features = false, features = ["stream", "rustls-tls"] }
 ropey = "1.6.1"
 schemars = { version = "0.8.17", features = ["impl_json_schema", "url", "uuid1"] }
@@ -48,7 +46,7 @@ zip = { version = "2.0.0", default-features = false }
 
 [target.'cfg(target_arch = "wasm32")'.dependencies]
 js-sys = { version = "0.3.69" }
-tokio = { version = "1.37.0", features = ["sync", "time"] }
+tokio = { version = "1.38.0", features = ["sync", "time"] }
 tower-lsp = { version = "0.20.0", default-features = false, features = ["runtime-agnostic"] }
 wasm-bindgen = "0.2.91"
 wasm-bindgen-futures = "0.4.42"
@@ -57,8 +55,8 @@ web-sys = { version = "0.3.69", features = ["console"] }
 [target.'cfg(not(target_arch = "wasm32"))'.dependencies]
 approx = "0.5"
 bson = { version = "2.10.0", features = ["uuid-1", "chrono"] }
-tokio = { version = "1.37.0", features = ["full"] }
-tokio-tungstenite = { version = "0.21.0", features = ["rustls-tls-native-roots"] }
+tokio = { version = "1.38.0", features = ["full"] }
+tokio-tungstenite = { version = "0.23.0", features = ["rustls-tls-native-roots"] }
 tower-lsp = { version = "0.20.0", features = ["proposed"] }
 
 [features]
@@ -79,12 +77,12 @@ convert_case = "0.6.0"
 criterion = "0.5.1"
 expectorate = "1.1.0"
 iai = "0.1"
-image = "0.24.9"
+image = {version = "0.25.1", default-features = false, features = ["png"] }
 insta = { version = "1.38.0", features = ["json"] }
 itertools = "0.13.0"
 pretty_assertions = "1.4.0"
 tokio = { version = "1.37.0", features = ["rt-multi-thread", "macros", "time"] }
-twenty-twenty = "0.7.0"
+twenty-twenty = "0.8.0"
 
 [[bench]]
 name = "compiler_benchmark_criterion"

src/wasm-lib/kcl/src/executor.rs

@@ -4,7 +4,6 @@ use std::{collections::HashMap, sync::Arc};
 
 use anyhow::Result;
 use async_recursion::async_recursion;
-use kittycad_execution_plan_macros::ExecutionPlanValue;
 use parse_display::{Display, FromStr};
 use schemars::JsonSchema;
 use serde::{Deserialize, Serialize};
@@ -721,7 +720,7 @@ impl Point2d {
     }
 }
 
-#[derive(Debug, Deserialize, Serialize, PartialEq, Clone, ts_rs::TS, JsonSchema, ExecutionPlanValue)]
+#[derive(Debug, Deserialize, Serialize, PartialEq, Clone, ts_rs::TS, JsonSchema)]
 #[ts(export)]
 pub struct Point3d {
     pub x: f64,

src/wasm-lib/kcl/src/std/sketch.rs

@@ -3,7 +3,6 @@
 use anyhow::Result;
 use derive_docs::stdlib;
 use kittycad::types::{Angle, ModelingCmd, Point3D};
-use kittycad_execution_plan_macros::ExecutionPlanValue;
 use parse_display::{Display, FromStr};
 use schemars::JsonSchema;
 use serde::{Deserialize, Serialize};
@@ -745,7 +744,7 @@ pub enum SketchData {
 }
 
 /// Data for a plane.
-#[derive(Debug, Clone, Deserialize, Serialize, PartialEq, ts_rs::TS, JsonSchema, ExecutionPlanValue)]
+#[derive(Debug, Clone, Deserialize, Serialize, PartialEq, ts_rs::TS, JsonSchema)]
 #[ts(export)]
 #[serde(rename_all = "camelCase")]
 pub enum PlaneData {

yarn.lock

@@ -1880,10 +1880,10 @@
   resolved "https://registry.yarnpkg.com/@juggle/resize-observer/-/resize-observer-3.4.0.tgz#08d6c5e20cf7e4cc02fd181c4b0c225cd31dbb60"
   integrity sha512-dfLbk+PwWvFzSxwk3n5ySL0hfBog779o8h68wK/7/APo/7cgyWp5jcXockbxdk5kFRkbeXWm4Fbi9FrdN381sA==
 
-"@kittycad/lib@^0.0.63":
-  version "0.0.63"
-  resolved "https://registry.yarnpkg.com/@kittycad/lib/-/lib-0.0.63.tgz#cc70cf1c0780543bbca6f55aae40d0904cfd45d7"
-  integrity sha512-fDpGnycumT1xI/tSubRZzU9809/7s+m06w2EuJzxowgFrdIlvThnIHVf3EYvSujdFb0bHR/LZjodAw2ocXkXZw==
+"@kittycad/lib@^0.0.64":
+  version "0.0.64"
+  resolved "https://registry.yarnpkg.com/@kittycad/lib/-/lib-0.0.64.tgz#0cea0788cd8af4a8964ddbf7152028affadcb17f"
+  integrity sha512-qHyvNYKbhsfR5aXLFrdKrBQ4JI+0G0v096oROD3HatJ+AIzg5H0THmI+rMnQ9L4zx4U6n1A9gLi7ZQjSsZsleg==
   dependencies:
     node-fetch "3.3.2"
     openapi-types "^12.0.0"
@@ -8234,16 +8234,7 @@ string-natural-compare@^3.0.1:
   resolved "https://registry.yarnpkg.com/string-natural-compare/-/string-natural-compare-3.0.1.tgz#7a42d58474454963759e8e8b7ae63d71c1e7fdf4"
   integrity sha512-n3sPwynL1nwKi3WJ6AIsClwBMa0zTi54fn2oLU6ndfTSIO05xaznjSf15PcBZU6FNWbmN5Q6cxT4V5hGvB4taw==
 
-"string-width-cjs@npm:string-width@^4.2.0":
-  version "4.2.3"
-  resolved "https://registry.yarnpkg.com/string-width/-/string-width-4.2.3.tgz#269c7117d27b05ad2e536830a8ec895ef9c6d010"
-  integrity sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==
-  dependencies:
-    emoji-regex "^8.0.0"
-    is-fullwidth-code-point "^3.0.0"
-    strip-ansi "^6.0.1"
-
-string-width@^4.1.0, string-width@^4.2.0, string-width@^4.2.3:
+"string-width-cjs@npm:string-width@^4.2.0", string-width@^4.1.0, string-width@^4.2.0, string-width@^4.2.3:
   version "4.2.3"
   resolved "https://registry.yarnpkg.com/string-width/-/string-width-4.2.3.tgz#269c7117d27b05ad2e536830a8ec895ef9c6d010"
   integrity sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==
@@ -8316,14 +8307,7 @@ string_decoder@~1.1.1:
   dependencies:
     safe-buffer "~5.1.0"
 
-"strip-ansi-cjs@npm:strip-ansi@^6.0.1":
-  version "6.0.1"
-  resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-6.0.1.tgz#9e26c63d30f53443e9489495b2105d37b67a85d9"
-  integrity sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==
-  dependencies:
-    ansi-regex "^5.0.1"
-
-strip-ansi@^6.0.0, strip-ansi@^6.0.1:
+"strip-ansi-cjs@npm:strip-ansi@^6.0.1", strip-ansi@^6.0.0, strip-ansi@^6.0.1:
   version "6.0.1"
   resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-6.0.1.tgz#9e26c63d30f53443e9489495b2105d37b67a85d9"
   integrity sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==
@@ -9305,7 +9289,7 @@ workerpool@6.2.1:
   resolved "https://registry.yarnpkg.com/workerpool/-/workerpool-6.2.1.tgz#46fc150c17d826b86a008e5a4508656777e9c343"
   integrity sha512-ILEIE97kDZvF9Wb9f6h5aXK4swSlKGUcOEGiIYb2OOu/IrDU9iwj0fD//SsA6E5ibwJxpEvhullJY4Sl4GcpAw==
 
-"wrap-ansi-cjs@npm:wrap-ansi@^7.0.0":
+"wrap-ansi-cjs@npm:wrap-ansi@^7.0.0", wrap-ansi@^7.0.0:
   version "7.0.0"
   resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-7.0.0.tgz#67e145cff510a6a6984bdf1152911d69d2eb9e43"
   integrity sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==
@@ -9323,15 +9307,6 @@ wrap-ansi@^6.2.0:
     string-width "^4.1.0"
     strip-ansi "^6.0.0"
 
-wrap-ansi@^7.0.0:
-  version "7.0.0"
-  resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-7.0.0.tgz#67e145cff510a6a6984bdf1152911d69d2eb9e43"
-  integrity sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==
-  dependencies:
-    ansi-styles "^4.0.0"
-    string-width "^4.1.0"
-    strip-ansi "^6.0.0"
-
 wrap-ansi@^8.1.0:
   version "8.1.0"
   resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-8.1.0.tgz#56dc22368ee570face1b49819975d9b9a5ead214"