Stress Grackle with lambda calculus gymnastics

Support compiling logical not and sign-flipping negation.

.codespellrc

@@ -0,0 +1,3 @@
+[codespell]
+ignore-words-list: crate,everytime
+skip: **/target,node_modules,build,**/Cargo.lock

.env.development

@@ -0,0 +1,6 @@
+VITE_KC_API_WS_MODELING_URL=wss://api.dev.zoo.dev/ws/modeling/commands
+VITE_KC_API_BASE_URL=https://api.dev.zoo.dev
+VITE_KC_SITE_BASE_URL=https://dev.zoo.dev
+VITE_KC_SKIP_AUTH=false
+VITE_KC_CONNECTION_TIMEOUT_MS=5000
+VITE_KC_SENTRY_DSN=

.env.production

@@ -0,0 +1,6 @@
+VITE_KC_API_WS_MODELING_URL=wss://api.zoo.dev/ws/modeling/commands
+VITE_KC_API_BASE_URL=https://api.zoo.dev
+VITE_KC_SITE_BASE_URL=https://zoo.dev
+VITE_KC_SKIP_AUTH=false
+VITE_KC_CONNECTION_TIMEOUT_MS=15000
+VITE_KC_SENTRY_DSN=https://a814f2f66734989a90367f48feee28ca@o1042111.ingest.sentry.io/4505789425844224

.eslintignore

@@ -0,0 +1 @@
+src/wasm-lib/*

.eslintrc

@@ -0,0 +1,30 @@
+{
+    "parser": "@typescript-eslint/parser",
+    "parserOptions": {
+      "project": "./tsconfig.json"
+    },
+    "plugins": [
+      "css-modules"
+    ],
+    "extends": [
+      "react-app",
+      "react-app/jest",
+      "plugin:css-modules/recommended"
+    ],
+    "rules": {
+      "semi": [
+        "error",
+        "never"
+      ],
+      "react-hooks/exhaustive-deps": "off",
+      "@typescript-eslint/no-floating-promises": "warn"
+    },
+    "overrides": [
+      {
+        "files": ["e2e/**/*.ts"], // Update the pattern based on your file structure
+        "rules": {
+          "testing-library/prefer-screen-queries": "off"
+        }
+      }
+    ]
+}

.github/dependabot.yml

@@ -0,0 +1,23 @@
+# To get started with Dependabot version updates, you'll need to specify which
+# package ecosystems to update and where the package manifests are located.
+# Please see the documentation for all configuration options:
+# https://help.github.com/github/administering-a-repository/configuration-options-for-dependency-updates
+
+version: 2
+updates:
+    - package-ecosystem: 'npm' # See documentation for possible values
+      directory: '/' # Location of package manifests
+      schedule:
+          interval: 'daily'
+    - package-ecosystem: 'github-actions' # See documentation for possible values
+      directory: '/' # Location of package manifests
+      schedule:
+          interval: 'daily'
+    - package-ecosystem: 'cargo' # See documentation for possible values
+      directory: '/src/wasm-lib/' # Location of package manifests
+      schedule:
+          interval: 'daily'
+    - package-ecosystem: 'cargo' # See documentation for possible values
+      directory: '/src-tauri/' # Location of package manifests
+      schedule:
+          interval: 'daily'

.github/workflows/build.yml

@@ -1,73 +0,0 @@
-name: Build
-
-on:
-  push:
-    tags:
-      - 'v*'
-  pull_request:
-
-jobs:
-  build:
-    runs-on: ${{ matrix.os }}
-    strategy:
-      matrix:
-        os: [macos-latest, ubuntu-latest, windows-latest]
-    steps:
-      - uses: actions/checkout@v2
-      - name: install ubuntu system dependencies
-        if: matrix.os == 'ubuntu-latest'
-        run: |
-          sudo apt-get update
-          sudo apt-get install -y libgtk-3-dev libwebkit2gtk-4.0-dev libayatana-appindicator3-dev librsvg2-dev libwebkit2gtk-4.0-dev
-        # libgdk-pixbuf2.0-dev libsoup2.4-dev libjavascriptcoregtk-4.0-dev
-      - name: Sync node version and setup cache
-        uses: actions/setup-node@v3
-        with:
-          node-version: '18.x'
-          cache: 'yarn' # Set this to npm, yarn or pnpm.
-      - run: yarn install
-      - name: Rust setup
-        uses: dtolnay/rust-toolchain@stable
-      - name: wasm prep
-        shell: bash
-        run: |
-          mkdir src/wasm-lib/pkg; cd src/wasm-lib
-          npx wasm-pack build --target web --out-dir pkg
-          cd ../../
-          cp src/wasm-lib/pkg/wasm_lib_bg.wasm public
-      - name: macos sed
-        if: matrix.os == 'macos-latest'
-        shell: bash
-        run: |
-          sed -i '' 's/import.meta.url//g' "./src/wasm-lib/pkg/wasm_lib.js"
-      - name: ubuntu and windows sed
-        if: matrix.os != 'macos-latest'
-        shell: bash
-        run: |
-          sed -i 's/import.meta.url//g' "./src/wasm-lib/pkg/wasm_lib.js"
-      - name: add missing import
-        shell: bash
-        run: |
-          yarn add-missing-import
-          pwd
-          ls -la
-          yarn fmt
-      # - name: tauri build
-      #   shell: bash
-      #   run: yarn tauri build
-      # - uses: actions/upload-artifact@v2
-      #   with:
-      #     name: tauri-app
-      #     path: src-tauri/target/release/bundle
-      - name: Build the app
-        uses: tauri-apps/tauri-action@v0
-
-        env:
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-          CI: false
-        with:
-          tagName: ${{ github.ref_name }} # This only works if your workflow triggers on new tags.
-          releaseName: 'App Name v__VERSION__' # tauri-action replaces \_\_VERSION\_\_ with the app version.
-          releaseBody: 'See the assets to download and install this version.'
-          releaseDraft: true
-          prerelease: false

.github/workflows/cargo-build.yml

@@ -0,0 +1,50 @@
+on:
+  push:
+    branches:
+      - main
+    paths:
+      - '**.rs'
+      - '**/Cargo.toml'
+      - '**/Cargo.lock'
+      - '**/rust-toolchain.toml'
+      - .github/workflows/cargo-build.yml
+  pull_request:
+    paths:
+      - '**.rs'
+      - '**/Cargo.toml'
+      - '**/Cargo.lock'
+      - '**/rust-toolchain.toml'
+      - .github/workflows/cargo-build.yml
+concurrency:
+  group: ${{ github.workflow }}-${{ github.head_ref || github.run_id }}
+  cancel-in-progress: true
+name: cargo build
+jobs:
+  cargobuild:
+    name: cargo build
+    runs-on: ubuntu-latest
+    strategy:
+      matrix:
+        dir: ['src/wasm-lib']
+    steps:
+      - uses: actions/checkout@v4
+
+      - name: Install latest rust
+        uses: actions-rs/toolchain@v1
+        with:
+            toolchain: stable
+            override: true
+
+      - name: install dependencies
+        if: matrix.dir ==  'src-tauri'
+        run: |
+          sudo apt-get update
+          sudo apt-get install -y libgtk-3-dev libwebkit2gtk-4.0-dev libappindicator3-dev librsvg2-dev patchelf
+      - name: Rust Cache
+        uses: Swatinem/rust-cache@v2.6.1
+
+      - name: Run cargo build
+        run: |
+          cd "${{ matrix.dir }}"
+          cargo build --all
+        shell: bash

.github/workflows/cargo-clippy.yml

@@ -0,0 +1,49 @@
+on:
+  push:
+    branches:
+      - main
+    paths:
+      - '**/Cargo.toml'
+      - '**/Cargo.lock'
+      - '**/rust-toolchain.toml'
+      - '**.rs'
+      - .github/workflows/cargo-clippy.yml
+  pull_request:
+    paths:
+      - '**/Cargo.toml'
+      - '**/Cargo.lock'
+      - '**/rust-toolchain.toml'
+      - '**.rs'
+      - .github/workflows/cargo-build.yml
+concurrency:
+  group: ${{ github.workflow }}-${{ github.head_ref || github.run_id }}
+  cancel-in-progress: true
+name: cargo clippy
+jobs:
+  cargoclippy:
+    name: cargo clippy
+    runs-on: ubuntu-latest
+    strategy:
+      matrix:
+        dir: ['src/wasm-lib']
+    steps:
+      - uses: actions/checkout@v4
+      - name: Install latest rust
+        uses: actions-rs/toolchain@v1
+        with:
+            toolchain: stable
+            override: true
+            components: clippy
+
+      - name: install dependencies
+        if: matrix.dir ==  'src-tauri'
+        run: |
+          sudo apt-get update
+          sudo apt-get install -y libgtk-3-dev libwebkit2gtk-4.0-dev libappindicator3-dev librsvg2-dev patchelf
+      - name: Rust Cache
+        uses: Swatinem/rust-cache@v2.6.1
+
+      - name: Run clippy
+        run: |
+          cd "${{ matrix.dir }}"
+          cargo clippy --all --tests --benches -- -D warnings

.github/workflows/cargo-criterion.yml

@@ -0,0 +1,40 @@
+on:
+  push:
+    branches:
+      - main
+    paths:
+      - '**.rs'
+      - '**/Cargo.toml'
+      - '**/Cargo.lock'
+      - '**/rust-toolchain.toml'
+      - .github/workflows/cargo-criterion.yml
+  pull_request:
+    paths:
+      - '**.rs'
+      - '**/Cargo.toml'
+      - '**/Cargo.lock'
+      - '**/rust-toolchain.toml'
+      - .github/workflows/cargo-criterion.yml
+  workflow_dispatch:
+permissions: read-all
+concurrency:
+  group: ${{ github.workflow }}-${{ github.head_ref || github.run_id }}
+  cancel-in-progress: true
+name: cargo criterion
+jobs:
+  cargocriterion:
+    name: cargo criterion
+    runs-on: ubuntu-latest-8-cores
+    steps:
+      - uses: actions/checkout@v4
+      - uses: dtolnay/rust-toolchain@stable
+      - name: Install dependencies
+        run: |
+          cargo install cargo-criterion
+      - name: Rust Cache
+        uses: Swatinem/rust-cache@v2.6.1
+      - name: Benchmark kcl library
+        shell: bash
+        run: |-
+          cd src/wasm-lib/kcl; cargo criterion
+

.github/workflows/cargo-fmt.yml

@@ -0,0 +1,48 @@
+on:
+  push:
+    branches:
+      - main
+    paths:
+      - '**/Cargo.toml'
+      - '**/Cargo.lock'
+      - '**/rust-toolchain.toml'
+      - '**.rs'
+      - .github/workflows/cargo-fmt.yml
+  pull_request:
+    paths:
+      - '**/Cargo.toml'
+      - '**/Cargo.lock'
+      - '**/rust-toolchain.toml'
+      - '**.rs'
+      - .github/workflows/cargo-fmt.yml
+permissions:
+  packages: read
+  contents: read
+concurrency:
+  group: ${{ github.workflow }}-${{ github.head_ref || github.run_id }}
+  cancel-in-progress: true
+name: cargo fmt
+jobs:
+  cargofmt:
+    name: cargo fmt
+    runs-on: ubuntu-latest
+    strategy:
+      matrix:
+        dir: ['src/wasm-lib', 'src-tauri']
+    steps:
+      - uses: actions/checkout@v4
+      - name: Install latest rust
+        uses: actions-rs/toolchain@v1
+        with:
+            toolchain: stable
+            override: true
+            components: rustfmt
+
+      - name: Rust Cache
+        uses: Swatinem/rust-cache@v2.6.1
+
+      - name: Run cargo fmt
+        run: |
+          cd "${{ matrix.dir }}"
+          cargo fmt -- --check
+        shell: bash

.github/workflows/cargo-test.yml

@@ -0,0 +1,55 @@
+on:
+  push:
+    branches:
+      - main
+    paths:
+      - '**.rs'
+      - '**/Cargo.toml'
+      - '**/Cargo.lock'
+      - '**/rust-toolchain.toml'
+      - .github/workflows/cargo-test.yml
+  pull_request:
+    paths:
+      - '**.rs'
+      - '**/Cargo.toml'
+      - '**/Cargo.lock'
+      - '**/rust-toolchain.toml'
+      - .github/workflows/cargo-test.yml
+  workflow_dispatch:
+permissions: read-all
+concurrency:
+  group: ${{ github.workflow }}-${{ github.head_ref || github.run_id }}
+  cancel-in-progress: true
+name: cargo test
+jobs:
+  cargotest:
+    name: cargo test
+    runs-on: ubuntu-latest-8-cores
+    strategy:
+      matrix:
+        dir: ['src/wasm-lib']
+    steps:
+      - uses: actions/checkout@v4
+      - name: Install latest rust
+        uses: actions-rs/toolchain@v1
+        with:
+          toolchain: stable
+          override: true
+      - name: install dependencies
+        if: matrix.dir ==  'src-tauri'
+        run: |
+          sudo apt-get update
+          sudo apt-get install -y libgtk-3-dev libwebkit2gtk-4.0-dev libappindicator3-dev librsvg2-dev patchelf
+      - uses: taiki-e/install-action@cargo-llvm-cov
+      - uses: taiki-e/install-action@nextest
+      - name: Rust Cache
+        uses: Swatinem/rust-cache@v2.6.1
+      - name: cargo test
+        shell: bash
+        run: |-
+          cd "${{ matrix.dir }}"
+          cargo nextest run --workspace --no-fail-fast -P ci
+        env:
+          KITTYCAD_API_TOKEN: ${{secrets.KITTYCAD_API_TOKEN}}
+          RUST_MIN_STACK: 10485760000
+

.github/workflows/ci.yml

@@ -0,0 +1,373 @@
+name: CI
+
+on:
+  pull_request:
+  push:
+    branches:
+      - main
+  release:
+    types: [published]
+  schedule:
+    - cron: '0 4 * * *'
+  # Daily at 04:00 AM UTC
+  # Will checkout the last commit from the default branch (main as of 2023-10-04)
+
+env:
+  BUILD_RELEASE: ${{ github.event_name == 'release' || github.event_name == 'schedule' || github.event_name == 'pull_request' && contains(github.event.pull_request.title, 'Cut release v') }}
+
+concurrency:
+  group: ${{ github.workflow }}-${{ github.head_ref || github.run_id }}
+  cancel-in-progress: true
+
+jobs:
+  check-format:
+    runs-on: 'ubuntu-latest'
+    steps:
+      - uses: actions/checkout@v4
+      - uses: actions/setup-node@v4
+        with:
+          node-version-file: '.nvmrc'
+          cache: 'yarn'
+      - run: yarn install
+      - run: yarn fmt-check
+
+  check-types:
+    runs-on: ubuntu-latest
+
+    steps:
+      - uses: actions/checkout@v4
+      - uses: actions/setup-node@v4
+        with:
+          node-version-file: '.nvmrc'
+          cache: 'yarn'
+      - run: yarn install
+      - uses: Swatinem/rust-cache@v2
+        with:
+          workspaces: './src/wasm-lib'
+
+      - run: yarn build:wasm
+      - run: yarn tsc
+
+
+  check-typos: 
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+      - name: Set up Python
+        uses: actions/setup-python@v5
+      - name: Install codespell
+        run: |
+            python -m pip install codespell
+      - name: Run codespell
+        run: codespell --config .codespellrc # Edit this file to tweak the typo list and other configuration.
+
+
+  build-test-web:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+
+      - uses: actions/setup-node@v4
+        with:
+          node-version-file: '.nvmrc'
+          cache: 'yarn'
+
+      - run: yarn install
+
+      - uses: Swatinem/rust-cache@v2
+        with:
+          workspaces: './src/wasm-lib'
+
+      - run: yarn build:wasm
+
+      - run: yarn simpleserver:ci
+
+      - run: yarn test:nowatch
+
+      - run: yarn test:cov
+
+
+  prepare-json-files:
+    runs-on: ubuntu-latest  # seperate job on Ubuntu for easy string manipulations (compared to Windows)
+    outputs:
+      version: ${{ steps.export_version.outputs.version }}
+    steps:
+      - uses: actions/checkout@v4
+
+      - uses: actions/setup-node@v4
+        with:
+          node-version-file: '.nvmrc'
+          cache: 'yarn'
+          
+      - name: Set nightly version
+        if: github.event_name == 'schedule'
+        run: |
+          VERSION=$(date +'%-y.%-m.%-d') yarn bump-jsons
+          echo "$(jq --arg url 'https://dl.zoo.dev/releases/modeling-app/nightly/last_update.json' \
+            '.tauri.updater.endpoints[]=$url' src-tauri/tauri.release.conf.json --indent 2)" > src-tauri/tauri.release.conf.json
+
+      - uses: actions/upload-artifact@v3
+        if: github.event_name == 'schedule'
+        with:
+          path: |
+            package.json
+            src-tauri/tauri.conf.json
+            src-tauri/tauri.release.conf.json
+
+      - id: export_version
+        run: echo "version=`cat package.json | jq -r '.version'`" >> "$GITHUB_OUTPUT"
+
+
+  build-test-apps:
+    needs: [prepare-json-files]
+    runs-on: ${{ matrix.os }}
+    strategy:
+      fail-fast: false
+      matrix:
+        os: [macos-latest, ubuntu-latest, windows-latest]
+    steps:
+      - uses: actions/checkout@v4
+
+      - uses: actions/download-artifact@v3
+
+      - name: Copy updated .json files
+        if: github.event_name == 'schedule'
+        run: |
+          ls -l artifact
+          cp artifact/package.json package.json
+          cp artifact/src-tauri/tauri.conf.json src-tauri/tauri.conf.json
+          cp artifact/src-tauri/tauri.release.conf.json src-tauri/tauri.release.conf.json 
+
+      - name: Install ubuntu system dependencies
+        if: matrix.os == 'ubuntu-latest'
+        run: >
+          sudo apt-get update &&
+          sudo apt-get install -y
+          libgtk-3-dev
+          libgtksourceview-3.0-dev
+          webkit2gtk-4.0
+          libappindicator3-dev
+          webkit2gtk-driver
+          xvfb
+
+      - name: Sync node version and setup cache
+        uses: actions/setup-node@v4
+        with:
+          node-version-file: '.nvmrc'
+          cache: 'yarn' # Set this to npm, yarn or pnpm.
+
+      - run: yarn install
+
+      - name: Setup Rust
+        uses: dtolnay/rust-toolchain@stable
+
+      - name: Setup Rust cache
+        uses: swatinem/rust-cache@v2
+        with:
+          workspaces: './src-tauri -> target'
+
+      - uses: Swatinem/rust-cache@v2
+        with:
+          workspaces: './src/wasm-lib'
+
+      - name: Run build:wasm manually
+        shell: bash
+        env:
+          MODE: ${{ env.BUILD_RELEASE == 'true' && '--release' || '--debug' }}
+        run: |
+          mkdir src/wasm-lib/pkg; cd src/wasm-lib
+          echo "building with ${{ env.MODE }}"
+          npx wasm-pack build --target web --out-dir pkg ${{ env.MODE }}
+          cd ../../
+          cp src/wasm-lib/pkg/wasm_lib_bg.wasm public
+
+      - name: Run vite build (build:both)
+        run: yarn vite build --mode ${{ env.BUILD_RELEASE == 'true' && 'production' || 'development' }}
+
+      - name: Fix format
+        run: yarn fmt
+
+      - name: Install Universal target (MacOS only)
+        if: matrix.os == 'macos-latest'
+        run: |
+          rustup target add aarch64-apple-darwin
+
+      - name: Prepare certificate and variables (Windows only)
+        if: ${{ matrix.os == 'windows-latest' && env.BUILD_RELEASE == 'true' }}
+        run: |
+          echo "${{secrets.SM_CLIENT_CERT_FILE_B64 }}" | base64 --decode > /d/Certificate_pkcs12.p12
+          cat /d/Certificate_pkcs12.p12
+          echo "::set-output name=version::${GITHUB_REF#refs/tags/v}"
+          echo "SM_HOST=${{ secrets.SM_HOST }}" >> "$GITHUB_ENV"
+          echo "SM_API_KEY=${{ secrets.SM_API_KEY }}" >> "$GITHUB_ENV"
+          echo "SM_CLIENT_CERT_FILE=D:\\Certificate_pkcs12.p12" >> "$GITHUB_ENV"
+          echo "SM_CLIENT_CERT_PASSWORD=${{ secrets.SM_CLIENT_CERT_PASSWORD }}" >> "$GITHUB_ENV"
+          echo "C:\Program Files (x86)\Windows Kits\10\App Certification Kit" >> $GITHUB_PATH
+          echo "C:\Program Files (x86)\Microsoft SDKs\Windows\v10.0A\bin\NETFX 4.8 Tools" >> $GITHUB_PATH
+          echo "C:\Program Files\DigiCert\DigiCert One Signing Manager Tools" >> $GITHUB_PATH
+        shell: bash
+
+      - name: Setup certicate with SSM KSP (Windows only)
+        if: ${{ matrix.os == 'windows-latest' && env.BUILD_RELEASE == 'true' }}
+        run: |
+          curl -X GET  https://one.digicert.com/signingmanager/api-ui/v1/releases/smtools-windows-x64.msi/download -H "x-api-key:%SM_API_KEY%" -o smtools-windows-x64.msi
+          msiexec /i smtools-windows-x64.msi /quiet /qn
+          smksp_registrar.exe list
+          smctl.exe keypair ls
+          C:\Windows\System32\certutil.exe -csp "DigiCert Signing Manager KSP" -key -user
+          smksp_cert_sync.exe
+        shell: cmd
+
+      - name: Build the app (debug)
+        uses: tauri-apps/tauri-action@v0
+        if: ${{ env.BUILD_RELEASE == 'false' }}
+        with:
+          includeRelease: false
+          includeDebug: true
+          args: ${{ matrix.os == 'macos-latest' && '--target universal-apple-darwin' || '' }}
+
+      - name: Build the app (release) and sign
+        uses: tauri-apps/tauri-action@v0
+        if: ${{ env.BUILD_RELEASE == 'true' }}
+        env:
+          TAURI_PRIVATE_KEY: ${{ secrets.TAURI_PRIVATE_KEY }}
+          TAURI_KEY_PASSWORD: ${{ secrets.TAURI_KEY_PASSWORD }}
+          APPLE_CERTIFICATE: ${{ secrets.APPLE_CERTIFICATE }}
+          APPLE_CERTIFICATE_PASSWORD: ${{ secrets.APPLE_CERTIFICATE_PASSWORD }}
+          APPLE_SIGNING_IDENTITY: ${{ secrets.APPLE_SIGNING_IDENTITY }}
+          APPLE_ID: ${{ secrets.APPLE_ID }}
+          APPLE_PASSWORD: ${{ secrets.APPLE_PASSWORD }}
+          APPLE_TEAM_ID: ${{ secrets.APPLE_TEAM_ID }}
+          TAURI_CONF_ARGS: "--config ${{ matrix.os == 'windows-latest' && 'src-tauri\\tauri.release.conf.json' || 'src-tauri/tauri.release.conf.json' }}"
+        with:
+          args: "${{ matrix.os == 'macos-latest' && '--target universal-apple-darwin' || '' }} ${{ env.TAURI_CONF_ARGS }}"
+
+      - uses: actions/upload-artifact@v3
+        if: matrix.os != 'ubuntu-latest'
+        env:
+          PREFIX: ${{ matrix.os == 'macos-latest' && 'src-tauri/target/universal-apple-darwin' || 'src-tauri/target' }}
+          MODE: ${{ env.BUILD_RELEASE == 'true' && 'release' || 'debug' }}
+        with:
+          path: "${{ env.PREFIX }}/${{ env.MODE }}/bundle/*/*"
+
+      - name: Run e2e tests (linux only)
+        if: matrix.os == 'ubuntu-latest'
+        run: |
+          cargo install tauri-driver
+          source .env.${{ env.BUILD_RELEASE == 'true' && 'production' || 'development' }}
+          export VITE_KC_API_BASE_URL
+          xvfb-run yarn test:e2e:tauri
+        env:
+          E2E_APPLICATION: "./src-tauri/target/${{ env.BUILD_RELEASE == 'true' && 'release' || 'debug' }}/zoo-modeling-app"
+          KITTYCAD_API_TOKEN: ${{ env.BUILD_RELEASE == 'true' && secrets.KITTYCAD_API_TOKEN || secrets.KITTYCAD_API_TOKEN_DEV }}
+
+
+  publish-apps-release:
+    runs-on: ubuntu-latest
+    if: ${{ github.event_name == 'release' || github.event_name == 'schedule' }}
+    needs: [check-format, check-types, check-typos, build-test-web, prepare-json-files, build-test-apps]
+    env:
+      VERSION_NO_V: ${{ needs.prepare-json-files.outputs.version }}
+      VERSION: ${{ github.event_name == 'release' && format('v{0}', needs.prepare-json-files.outputs.version) || needs.prepare-json-files.outputs.version }}
+      PUB_DATE: ${{ github.event_name == 'release' && github.event.release.created_at || github.event.repository.updated_at }}
+      NOTES: ${{ github.event_name == 'release' && github.event.release.body || format('Nightly build, commit {0}', github.sha) }}
+      BUCKET_DIR: ${{ github.event_name == 'release' && 'dl.kittycad.io/releases/modeling-app' || 'dl.kittycad.io/releases/modeling-app/nightly' }}
+      WEBSITE_DIR: ${{ github.event_name == 'release' && 'dl.zoo.dev/releases/modeling-app' || 'dl.zoo.dev/releases/modeling-app/nightly' }}
+    steps:
+      - uses: actions/download-artifact@v3
+
+      - name: Generate the update static endpoint
+        run: |
+          ls -l artifact/*/*oo*
+          DARWIN_SIG=`cat artifact/macos/*.app.tar.gz.sig`
+          WINDOWS_SIG=`cat artifact/msi/*.msi.zip.sig`
+          RELEASE_DIR=https://${WEBSITE_DIR}/${VERSION}
+          jq --null-input \
+            --arg version "${VERSION}" \
+            --arg pub_date "${PUB_DATE}" \
+            --arg notes "${NOTES}" \
+            --arg darwin_sig "$DARWIN_SIG" \
+            --arg darwin_url "$RELEASE_DIR/macos/Zoo%20Modeling%20App.app.tar.gz" \
+            --arg windows_sig "$WINDOWS_SIG" \
+            --arg windows_url "$RELEASE_DIR/msi/Zoo%20Modeling%20App_${VERSION_NO_V}_x64_en-US.msi.zip" \
+            '{
+              "version": $version,
+              "pub_date": $pub_date,
+              "notes": $notes,
+              "platforms": {
+                "darwin-x86_64": {
+                  "signature": $darwin_sig,
+                  "url": $darwin_url
+                },
+                "darwin-aarch64": {
+                  "signature": $darwin_sig,
+                  "url": $darwin_url
+                },
+                "windows-x86_64": {
+                  "signature": $windows_sig,
+                  "url": $windows_url
+                }
+              }
+            }' > last_update.json
+            cat last_update.json
+
+      - name: Generate the download static endpoint
+        run: |
+          RELEASE_DIR=https://${WEBSITE_DIR}/${VERSION}
+          jq --null-input \
+            --arg version "${VERSION}" \
+            --arg pub_date "${PUB_DATE}" \
+            --arg notes "${NOTES}" \
+            --arg darwin_url "$RELEASE_DIR/dmg/Zoo%20Modeling%20App_${VERSION_NO_V}_universal.dmg" \
+            --arg windows_url "$RELEASE_DIR/msi/Zoo%20Modeling%20App_${VERSION_NO_V}_x64_en-US.msi" \
+            '{
+              "version": $version,
+              "pub_date": $pub_date,
+              "notes": $notes,
+              "platforms": {
+                "dmg-universal": {
+                  "url": $darwin_url
+                },
+                "msi-x86_64": {
+                  "url": $windows_url
+                }
+              }
+            }' > last_download.json
+            cat last_download.json
+
+      - name: Authenticate to Google Cloud
+        uses: 'google-github-actions/auth@v2.0.0'
+        with:
+          credentials_json: '${{ secrets.GOOGLE_CLOUD_DL_SA }}'
+
+      - name: Set up Google Cloud SDK
+        uses: google-github-actions/setup-gcloud@v2.0.0
+        with:
+          project_id: kittycadapi
+
+      - name: Upload release files to public bucket
+        uses: google-github-actions/upload-cloud-storage@v2.0.0
+        with:
+          path: artifact
+          glob: '*/Zoo*'
+          parent: false
+          destination: ${{ env.BUCKET_DIR }}/${{ env.VERSION }}
+
+      - name: Upload update endpoint to public bucket
+        uses: google-github-actions/upload-cloud-storage@v2.0.0
+        with:
+          path: last_update.json
+          destination: ${{ env.BUCKET_DIR }}
+
+      - name: Upload download endpoint to public bucket
+        uses: google-github-actions/upload-cloud-storage@v2.0.0
+        with:
+          path: last_download.json
+          destination: ${{ env.BUCKET_DIR }}
+
+      - name: Upload release files to Github
+        if: ${{ github.event_name == 'release' }}
+        uses: softprops/action-gh-release@v1
+        with:
+          files: 'artifact/*/Zoo*'

.github/workflows/playwright.yml

@@ -0,0 +1,116 @@
+name: Playwright Tests
+on:
+  push:
+    branches: [ main ]
+  pull_request:
+    branches: [ main ]
+jobs:
+  playwright-ubuntu:
+    timeout-minutes: 60
+    runs-on: ubuntu-latest
+    steps:
+    - uses: actions/checkout@v4
+    - uses: actions/setup-node@v4
+      with:
+        node-version-file: '.nvmrc'
+        cache: 'yarn'
+    - uses: KittyCAD/action-install-cli@v0.2.16
+    - name: Install dependencies
+      run: yarn
+    - name: Install Playwright Browsers
+      run: yarn playwright install --with-deps
+    - name: Setup Rust
+      uses: dtolnay/rust-toolchain@stable
+    - name: Cache wasm
+      uses: Swatinem/rust-cache@v2
+      with:
+        workspaces: './src/wasm-lib'
+    - name: build wasm
+      run: yarn build:wasm
+    - name: build web
+      run: yarn build:local
+    - name: Run ubuntu/chrome snapshots
+      run: yarn playwright test --project="Google Chrome" --update-snapshots e2e/playwright/snapshot-tests.spec.ts
+      env:
+        CI: true
+        token: ${{ secrets.KITTYCAD_API_TOKEN_DEV }}
+        snapshottoken: ${{ secrets.KITTYCAD_API_TOKEN }}
+    - uses: actions/upload-artifact@v3
+      if: always()
+      with:
+        name: playwright-report
+        path: playwright-report/
+        retention-days: 30
+    - name: check for changes
+      id: git-check
+      run: |
+          git add .
+          if git status | grep -q "Changes to be committed"
+          then
+            echo "::set-output name=modified::true"
+          else
+            echo "::set-output name=modified::false"
+          fi
+    - name: Commit changes, if any
+      if: steps.git-check.outputs.modified == 'true'
+      run: |
+        git add .
+        git config --local user.email "github-actions[bot]@users.noreply.github.com"
+        git config --local user.name "github-actions[bot]"
+        git remote set-url origin https://${{ github.actor }}:${{ secrets.GITHUB_TOKEN }}@github.com/${{ github.repository }}.git
+        git fetch origin
+        echo ${{ github.head_ref }}
+        git checkout ${{ github.head_ref }}
+        # TODO when safari works on ubuntu remove the os part of the commit message
+        git commit -am "A snapshot a day keeps the bugs away! 📷🐛 (OS: ubuntu)" || true
+        git push
+        git push origin ${{ github.head_ref }}
+    - name: Run ubuntu/chrome flow
+      run: yarn playwright test --project="Google Chrome" e2e/playwright/flow-tests.spec.ts
+      env:
+        CI: true
+        token: ${{ secrets.KITTYCAD_API_TOKEN_DEV }}
+    - uses: actions/upload-artifact@v3
+      if: always()
+      with:
+        name: playwright-report
+        path: playwright-report/
+        retention-days: 30
+
+  playwright-macos:
+    timeout-minutes: 60
+    runs-on: macos-latest
+    needs: playwright-ubuntu
+    steps:
+    - uses: actions/checkout@v4
+    - uses: actions/setup-node@v4
+      with:
+        node-version-file: '.nvmrc'
+        cache: 'yarn'
+    - name: Install dependencies
+      run: yarn
+    - name: Install Playwright Browsers
+      run: yarn playwright install --with-deps
+    - name: Setup Rust
+      uses: dtolnay/rust-toolchain@stable
+    - name: Cache wasm
+      uses: Swatinem/rust-cache@v2
+      with:
+        workspaces: './src/wasm-lib'
+    - name: build wasm
+      run: yarn build:wasm
+    - name: build web
+      run: yarn build:local
+    - name: Run macos/safari flow
+      # safari doesn't work on Ubuntu because of the same reason tauri doesn't (webRTC issues)
+      # TODO remove this and the matrix and run all tests on ubuntu when this is fixed
+      run: yarn playwright test --project="webkit" e2e/playwright/flow-tests.spec.ts
+      env:
+        CI: true
+        token: ${{ secrets.KITTYCAD_API_TOKEN_DEV }}
+    - uses: actions/upload-artifact@v3
+      if: always()
+      with:
+        name: playwright-report
+        path: playwright-report/
+        retention-days: 30

.github/workflows/test.yml

@@ -1,20 +0,0 @@
-# on pull requests, setup node, run `yarn install` and `yarn test:nowatch`
-
-name: Test
-
-on: [pull_request]
-
-jobs:
-  test:
-    runs-on: ubuntu-latest
-    steps:
-      - uses: actions/checkout@v2
-      - uses: actions/setup-node@v1
-        with:
-          node-version: '16.x'
-      - run: yarn install
-      - run: yarn build:wasm:ci
-      - run: yarn simpleserver:ci
-      - run: yarn test:nowatch
-      - run: yarn test:cov
-      - run: yarn test:rust

.github/workflows/update-dev-branch.yml

@@ -0,0 +1,29 @@
+name: update-dev-branch
+
+on:
+  push:
+    branches:
+      - main
+    pull_request:
+      paths:
+        - .github/workflows/update-dev-branch.yml
+
+permissions:
+  contents: write
+
+jobs:
+  update-branch:
+    runs-on: ubuntu-latest
+
+    steps:
+      - uses: actions/checkout@v4
+      - shell: bash
+        run: |
+          # checkout our branch
+          git checkout dev || git checkout -b dev
+          # fetch origin
+          git fetch origin
+          # reset to main
+          git reset --hard origin/main
+          # force push it
+          git push -f origin dev

.gitignore

@@ -22,6 +22,31 @@ npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
 
+.idea
+.vscode
+src/wasm-lib/.idea
+src/wasm-lib/.vscode
+
 # rust
 src/wasm-lib/target
+src/wasm-lib/bindings
+src/wasm-lib/kcl/bindings
 public/wasm_lib_bg.wasm
+src/wasm-lib/lcov.info
+
+e2e/playwright/playwright-secrets.env
+e2e/playwright/temp1.png
+e2e/playwright/temp2.png
+# exports from snapshot-tests.spec.ts
+e2e/playwright/export-snapshots/*.ply
+e2e/playwright/export-snapshots/*.obj
+e2e/playwright/export-snapshots/*.step
+e2e/playwright/export-snapshots/*.stl
+e2e/playwright/export-snapshots/*binary.gltf
+e2e/playwright/export-snapshots/*embedded.gltf
+
+
+/test-results/
+/playwright-report/
+/blob-report/
+/playwright/.cache/

.husky/pre-push

@@ -0,0 +1,4 @@
+#!/usr/bin/env sh
+. "$(dirname -- "$0")/_/husky.sh"
+
+yarn fmt-check

.nvmrc

@@ -0,0 +1 @@
+v20.5.0

.prettierignore

@@ -0,0 +1,13 @@
+# Ignore artifacts:
+build
+coverage
+
+# Ignore Rust projects:
+*.rs
+target
+src/wasm-lib/pkg
+src/wasm-lib/kcl/bindings
+e2e/playwright/export-snapshots
+
+# XState generated files
+src/machines/modelingMachine.typegen.ts

.vscode/settings.json

@@ -1,5 +1,7 @@
 {
     "cSpell.words": [
         "geos"
-    ]
+    ],
+    "editor.tabSize": 2,
+    "editor.insertSpaces": true,
 }

LICENSE

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2023 The Zoo Authors
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

README.md

@@ -1,48 +1,286 @@
-## Kurt demo project
+![Zoo Modeling App](/public/zma-logomark-outlined.png)
 
-live at [untitled-app.kittycad.io](https://untitled-app.kittycad.io/)
+## Zoo Modeling App
 
-Not sure what to call this, it's both a language/interpreter and a UI that uses the language as the source of truth model the user build with direct-manipulation with the UI.
+live at [app.zoo.dev](https://app.zoo.dev/)
 
-It might make sense to split this repo up at some point, but not the lang and the UI are all togther in a react app
+A CAD application from the future, brought to you by the [Zoo team](https://zoo.dev).
 
-Originally Presented on 10/01/2023
+Modeling App is our take on what a modern modelling experience can be. It is applying several lessons learned in the decades since most major CAD tools came into existence:
 
-[Video](https://drive.google.com/file/d/183_wjqGdzZ8EEZXSqZ3eDcJocYPCyOdC/view?pli=1)
+- All artifacts—including parts and assemblies—should be represented as human-readable code. At the end of the day, your CAD project should be "plain text"
+  - This makes version control—which is a solved problem in software engineering—trivial for CAD
+- All GUI (or point-and-click) interactions should be actions performed on this code representation under the hood
+  - This unlocks a hybrid approach to modeling. Whether you point-and-click as you always have or you write your own KCL code, you are performing the same action in Modeling App
+- Everything graphics _has_ to be built for the GPU
+  - Most CAD applications have had to retrofit support for GPUs, but our geometry engine is made for GPUs (primarily Nvidia's Vulkan), getting the order of magnitude rendering performance boost with it
+- Make the resource-intensive pieces of an application auto-scaling
+  - One of the bottlenecks of today's hardware design tools is that they all rely on the local machine's resources to do the hardest parts, which include geometry rendering and analysis. Our geometry engine parallelizes rendering and just sends video frames back to the app (seriously, inspect source, it's just a `<video>` element), and our API will offload analysis as we build it in
 
-[demo-slides.pdf](https://github.com/KittyCAD/Eng/files/10398178/demo.pdf)
+We are excited about what a small team of people could build in a short time with our API. We welcome you to try our API, build your own applications, or contribute to ours!
 
-## To run, there are a couple steps since we're compiling rust to WASM, you'll need to have rust stuff installed, then
+Modeling App is a _hybrid_ user interface for CAD modeling. You can point-and-click to design parts (and soon assemblies), but everything you make is really just [`kcl` code](https://github.com/KittyCAD/kcl-experiments) under the hood. All of your CAD models can be checked into source control such as GitHub and responsibly versioned, rolled back, and more.
+
+The 3D view in Modeling App is just a video stream from our hosted geometry engine. The app sends new modeling commands to the engine via WebSockets, which returns back video frames of the view within the engine.
+
+## Tools
+
+- UI
+  - [React](https://react.dev/)
+  - [Headless UI](https://headlessui.com/)
+  - [TailwindCSS](https://tailwindcss.com/)
+  - [XState](https://xstate.js.org/)
+- Networking
+  - WebSockets (via [KittyCAD TS client](https://github.com/KittyCAD/kittycad.ts))
+- Code Editor
+  - [CodeMirror](https://codemirror.net/)
+  - Custom WASM LSP Server
+- Modeling
+  - [KittyCAD TypeScript client](https://github.com/KittyCAD/kittycad.ts)
+
+[Original demo video](https://drive.google.com/file/d/183_wjqGdzZ8EEZXSqZ3eDcJocYPCyOdC/view?pli=1)
+
+[Original demo slides](https://github.com/KittyCAD/Eng/files/10398178/demo.pdf)
+
+## Get started
+
+We recommend downloading the latest application binary from [our Releases page](https://github.com/KittyCAD/modeling-app/releases). If you don't see your platform or architecture supported there, please file an issue.
+
+## Running a development build
+
+First, [install Rust via `rustup`](https://www.rust-lang.org/tools/install). This project uses a lot of Rust compiled to [WASM](https://webassembly.org/) within it. We always use the latest stable version of Rust, so you may need to run `rustup update stable`. Then, run:
 
 ```
 yarn install
 ```
-then
+
+followed by:
+
 ```
-yarn build:wasm
+yarn build:wasm-dev
 ```
+
 That will build the WASM binary and put in the `public` dir (though gitignored)
 
-finally
+finally, to run the web app only, run:
+
 ```
 yarn start
 ```
 
-and `yarn test` you would have need to have built the WASM previously. The tests need to download the binary from a server, so if you've already got `yarn start` running, that will work, otherwise running
-```
-yarn simpleserver
-```
-in one terminal
-and 
+## Developing in Chrome
+
+Chrome is in the process of rolling out a new default which
+[blocks Third-Party Cookies](https://developer.chrome.com/en/docs/privacy-sandbox/third-party-cookie-phase-out/).
+If you're having trouble logging into the `modeling-app`, you may need to
+enable third-party cookies. You can enable third-party cookies by clicking on
+the eye with a slash through it in the URL bar, and clicking on "Enable
+Third-Party Cookies".
+
+## Running tests
+
+First, start the dev server following "Running a development build" above.
+
+Then in another terminal tab, run:
+
 ```
 yarn test
 ```
-in another.
 
-If you want to edit the rust files, you can cd into `src/wasm-lib` and then use the usual rust commands, `cargo build`, `cargo test`, when you want to bring the changes back to the web-app, a fresh `yarn build:wasm` in the root will be needed.
+Which will run our suite of [Vitest unit](https://vitest.dev/) and [React Testing Library E2E](https://testing-library.com/docs/react-testing-library/intro/) tests, in interactive mode by default.
 
-Worth noting that the integration of the WASM into this project is very hacky because I'm really pushing create-react-app further than what's practical, but focusing on features atm rather than the setup.
+For running the rust (not tauri rust though) only, you can
+```bash
+cd src/wasm-lib
+cargo test
+```
+
+## Tauri
+
+To spin up up tauri dev, `yarn install` and `yarn build:wasm-dev` need to have been done before hand then
+
+```
+yarn tauri dev
+```
+
+Will spin up the web app before opening up the tauri dev desktop app. Note that it's probably a good idea to close the browser tab that gets opened since at the time of writing they can conflict.
+
+The dev instance automatically opens up the browser devtools which can be disabled by [commenting it out](https://github.com/KittyCAD/modeling-app/blob/main/src-tauri/src/main.rs#L92.)
+
+To build, run `yarn tauri build`, or `yarn tauri build --debug` to keep access to the devtools.
+
+Note that these became separate apps on Macos, so make sure you open the right one after a build 😉
+![image](https://github.com/KittyCAD/modeling-app/assets/29681384/a08762c5-8d16-42d8-a02f-a5efc9ae5551)
 
 <img width="1232" alt="image" src="https://user-images.githubusercontent.com/29681384/211947063-46164bb4-7bdd-45cb-9a76-2f40c71a24aa.png">
 
 <img width="1232" alt="image (1)" src="https://user-images.githubusercontent.com/29681384/211947073-e76b4933-bef5-4636-bc4d-e930ac8e290f.png">
+
+## Before submitting a PR
+
+Before you submit a contribution PR to this repo, please ensure that:
+
+- There is a corresponding issue for the changes you want to make, so that discussion of approach can be had before work begins.
+- You have separated out refactoring commits from feature commits as much as possible
+- You have run all of the following commands locally:
+  - `yarn fmt`
+  - `yarn tsc`
+  - `yarn test`
+  - Here they are all together: `yarn fmt && yarn tsc && yarn test`
+
+## Release a new version
+
+1. Bump the versions in the .json files by creating a `Cut release v{x}.{y}.{z}` PR, committing the changes from
+
+```bash
+VERSION=x.y.z yarn run bump-jsons
+```
+
+The PR may serve as a place to discuss the human-readable changelog and extra QA. A quick way of getting PR's merged since the last bump is to [use this PR filter](https://github.com/KittyCAD/modeling-app/pulls?q=is%3Apr+sort%3Aupdated-desc+is%3Amerged+), open up the browser console and past in the following
+
+```typescript
+console.log(
+  '- ' +
+    Array.from(
+      document.querySelectorAll('[data-hovercard-type="pull_request"]')
+    ).map((a) => `[${a.innerText}](${a.href})`).join(`
+- `)
+)
+```
+grab the md list and delete any that are older than the last bump
+
+2. Merge the PR
+
+3. Create a new release and tag pointing to the bump version commit using semantic versioning `v{x}.{y}.{z}`
+
+4. A new Action kicks in at https://github.com/KittyCAD/modeling-app/actions, uploading artifacts to the release
+
+## Fuzzing the parser
+
+Make sure you install cargo fuzz:
+
+```bash
+$ cargo install cargo-fuzz
+```
+
+```bash
+$ cd src/wasm-lib/kcl
+
+# list the fuzz targets
+$ cargo fuzz list
+
+# run the parser fuzzer
+$ cargo +nightly fuzz run parser
+```
+
+For more information on fuzzing you can check out
+[this guide](https://rust-fuzz.github.io/book/cargo-fuzz.html).
+
+
+### Playwright
+
+First time running plawright locally, you'll need to add the secrets file
+```bash
+touch ./e2e/playwright/playwright-secrets.env
+echo 'token="your-token"\nsnapshottoken="your-snapshot-token"' > ./e2e/playwright/playwright-secrets2.env
+```
+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)
+
+run headed
+```
+yarn playwright test --headed
+```
+
+run with step through debugger
+```
+PWDEBUG=1 yarn playwright test
+```
+However, if you want a debugger I recommend using VSCode and the `playwright` extension, as the above command is a cruder debugger that steps into every function call which is annoying.
+With the extension you can set a breakpoint after `waitForDefaultPlanesVisibilityChange` in order to skip app loading, then the vscode debugger's "step over" is much better for being able to stay at the right level of abstraction as you debug the code.
+
+If you want to limit to a single browser use `--project="webkit"` or `firefox`, `Google Chrome`
+Or comment out browsers in `playwright.config.ts`.
+
+note chromium has encoder compat issues which is why were testing against the branded 'Google Chrome'
+
+You may consider using the VSCode extension, it's useful for running individual threads, but some some reason the "record a test" is locked to chromium with we can't use. A work around is to us the CI `yarn playwright codegen -b wk --load-storage ./store localhost:3000`
+
+<details>
+<summary>
+
+Where `./store` should look like this
+
+</summary>
+
+```JSON
+{
+  "cookies": [],
+  "origins": [
+    {
+      "origin": "http://localhost:3000",
+      "localStorage": [
+        {
+          "name": "store",
+          "value": "{\"state\":{\"openPanes\":[\"code\"]},\"version\":0}"
+        },
+        {
+          "name": "persistCode",
+          "value": ""
+        },
+        {
+          "name": "TOKEN_PERSIST_KEY",
+          "value": "your-token"
+        }
+      ]
+    }
+  ]
+}
+```
+
+</details>
+
+
+However because much of our tests involve clicking in the stream at specific locations, it's code-gen looks `await page.locator('video').click();` when really we need to use a pixel coord, so I think it's of limited use.
+
+#### Some notes on CI
+
+The tests are broken into snapshot tests and non-snapshot tests, and they run in that order, they automatically commit new snap shots, so if you see an image commit check it was an intended change. If we have non-determinism in the snapshots such that they are always committing new images, hopefully this annoyance makes us fix them asap, if you notice this happening let Kurt know. But for the odd occasion  `git reset --hard HEAD~ && git push -f` is your friend.
+
+How to interpret failing playwright tests?
+If your tests fail, click through to the action and see that the tests failed on a line that includes `await page.getByTestId('loading').waitFor({ state: 'detached' })`, this means the test fail because the stream never started. It's you choice if you want to re-run the test, or ignore the failure.
+
+We run on ubuntu and macos, because safari doesn't work on linux because of the dreaded "no RTCPeerConnection variable" error. But linux runs first and then macos for the same reason that we limit the number of parallel tests to 1 because we limit stream connections per user, so tests would start failing we if let them run together.
+
+If something fails on CI you can download the artifact, unzip it and then open `playwright-report/data/<UUID>.zip` with https://trace.playwright.dev/ to see what happened.
+
+#### Getting started writing a playwright test in our app
+
+Besides following the instructions above and using the playwright docs, our app is weird because of the whole stream thing, which means our testing is weird. Because we've just figured out this stuff and therefore docs might go stale quick here's a 15min vid/tutorial
+
+https://github.com/KittyCAD/modeling-app/assets/29681384/6f5e8e85-1003-4fd9-be7f-f36ce833942d
+
+<details>
+
+<summary>
+Ps for the debug panel, the following JSON is useful for snapping the camera
+</summary>
+
+```JSON
+{"type":"modeling_cmd_req","cmd_id":"054e5472-e5e9-4071-92d7-1ce3bac61956","cmd":{"type":"default_camera_look_at","center":{"x":15,"y":0,"z":0},"up":{"x":0,"y":0,"z":1},"vantage":{"x":30,"y":30,"z":30}}}
+```
+
+</details>

babel.config.js

@@ -0,0 +1,3 @@
+module.exports = {
+  presets: ["@babel/preset-env"],
+}

docs/kcl/types.md

@@ -0,0 +1,75 @@
+# Types
+
+`KCL` defines the following types and keywords the language.
+
+All these types can be nested in various forms where nesting applies. Like
+arrays can hold objects and vice versa.
+
+## Boolean
+
+`true` or `false` work when defining values.
+
+## Variable declaration
+
+Variables are defined with the `let` keyword like so:
+
+```
+let myBool = false
+```
+
+## Array
+
+An array is defined with `[]` braces. What is inside the brackets can
+be of any type. For example, the following is completely valid:
+
+```
+let myArray = ["thing", 2, false]
+```
+
+If you want to get a value from an array you can use the index like so:
+`myArray[0]`.
+
+
+## Object
+
+An object is defined with `{}` braces. Here is an example object:
+
+```
+let myObj = {a: 0, b: "thing"}
+```
+
+We support two different ways of getting properties from objects, you can call
+`myObj.a` or `myObj["a"]` both work.
+
+
+## Functions
+
+We also have support for defining your own functions. Functions can take in any
+type of argument. Below is an example of the syntax:
+
+```
+fn myFn = (x) => {
+  return x
+}
+```
+
+As you can see above `myFn` just returns whatever it is given.
+
+
+## Binary expressions
+
+You can also do math! Let's show an example below:
+
+```
+let myMathExpression = 3 + 1 * 2 / 3 - 7
+```
+
+You can nest expressions in parenthesis as well:
+
+```
+let myMathExpression = 3 + (1 * 2 / (3 - 7))
+```
+
+Please if you find any issues using any of the above expressions or syntax
+please file an issue with the `ast` label on the [modeling-app
+repo](https://github.com/KittyCAD/modeling-app/issues/new).

e2e/playwright/export-snapshots/step-.step

@@ -0,0 +1,494 @@
+ISO-10303-21;
+HEADER;
+FILE_DESCRIPTION((('kittycad.io export')), '2;1');
+FILE_NAME('dump.step', '1970-01-01T00:00:00.0+00:00', ('Author unknown'), ('Organization unknown'), 'kittycad.io beta', 'kittycad.io', 'Authorization unknown');
+FILE_SCHEMA(('AP203_CONFIGURATION_CONTROLLED_3D_DESIGN_OF_MECHANICAL_PARTS_AND_ASSEMBLIES_MIM_LF'));
+ENDSEC;
+DATA;
+#1 = (
+  LENGTH_UNIT()
+  NAMED_UNIT(*)
+  SI_UNIT($, .METRE.)
+);
+#2 = UNCERTAINTY_MEASURE_WITH_UNIT(0.00001, #1, 'DISTANCE_ACCURACY_VALUE', $);
+#3 = (
+  GEOMETRIC_REPRESENTATION_CONTEXT(3)
+  GLOBAL_UNCERTAINTY_ASSIGNED_CONTEXT((#2))
+  GLOBAL_UNIT_ASSIGNED_CONTEXT((#1))
+  REPRESENTATION_CONTEXT('', '3D')
+);
+#4 = CARTESIAN_POINT('NONE', (0, 0, -0));
+#5 = VERTEX_POINT('NONE', #4);
+#6 = CARTESIAN_POINT('NONE', (0, -0.0254, -0));
+#7 = VERTEX_POINT('NONE', #6);
+#8 = CARTESIAN_POINT('NONE', (0, -0.0254, 0.1016));
+#9 = VERTEX_POINT('NONE', #8);
+#10 = CARTESIAN_POINT('NONE', (0, 0, 0.1016));
+#11 = VERTEX_POINT('NONE', #10);
+#12 = CARTESIAN_POINT('NONE', (0.07861346939195568, -0.0254, -0));
+#13 = VERTEX_POINT('NONE', #12);
+#14 = CARTESIAN_POINT('NONE', (0.07861346939195568, -0.0254, 0.1016));
+#15 = VERTEX_POINT('NONE', #14);
+#16 = CARTESIAN_POINT('NONE', (0.1511633881344551, -0.07619999999999998, -0));
+#17 = VERTEX_POINT('NONE', #16);
+#18 = CARTESIAN_POINT('NONE', (0.1511633881344551, -0.07619999999999998, 0.1016));
+#19 = VERTEX_POINT('NONE', #18);
+#20 = CARTESIAN_POINT('NONE', (0.2413, -0.0762, -0));
+#21 = VERTEX_POINT('NONE', #20);
+#22 = CARTESIAN_POINT('NONE', (0.2413, -0.0762, 0.1016));
+#23 = VERTEX_POINT('NONE', #22);
+#24 = CARTESIAN_POINT('NONE', (0.2413, -0.0635, -0));
+#25 = VERTEX_POINT('NONE', #24);
+#26 = CARTESIAN_POINT('NONE', (0.2413, -0.0635, 0.1016));
+#27 = VERTEX_POINT('NONE', #26);
+#28 = CARTESIAN_POINT('NONE', (0.1551676827532182, -0.0635, -0));
+#29 = VERTEX_POINT('NONE', #28);
+#30 = CARTESIAN_POINT('NONE', (0.1551676827532182, -0.0635, 0.1016));
+#31 = VERTEX_POINT('NONE', #30);
+#32 = CARTESIAN_POINT('NONE', (0.06448028432509392, 0, -0));
+#33 = VERTEX_POINT('NONE', #32);
+#34 = CARTESIAN_POINT('NONE', (0.06448028432509392, 0, 0.1016));
+#35 = VERTEX_POINT('NONE', #34);
+#36 = CARTESIAN_POINT('NONE', (0.14618599799650817, 0.03810000000000001, -0));
+#37 = VERTEX_POINT('NONE', #36);
+#38 = CARTESIAN_POINT('NONE', (0.14618599799650817, 0.03810000000000001, 0.1016));
+#39 = VERTEX_POINT('NONE', #38);
+#40 = CARTESIAN_POINT('NONE', (0.2413, 0.0381, -0));
+#41 = VERTEX_POINT('NONE', #40);
+#42 = CARTESIAN_POINT('NONE', (0.2413, 0.0381, 0.1016));
+#43 = VERTEX_POINT('NONE', #42);
+#44 = CARTESIAN_POINT('NONE', (0.2413, 0.0508, -0));
+#45 = VERTEX_POINT('NONE', #44);
+#46 = CARTESIAN_POINT('NONE', (0.2413, 0.0508, 0.1016));
+#47 = VERTEX_POINT('NONE', #46);
+#48 = CARTESIAN_POINT('NONE', (0.14337047578094278, 0.0508, -0));
+#49 = VERTEX_POINT('NONE', #48);
+#50 = CARTESIAN_POINT('NONE', (0.14337047578094278, 0.0508, 0.1016));
+#51 = VERTEX_POINT('NONE', #50);
+#52 = CARTESIAN_POINT('NONE', (0.08889999999999999, 0.0254, -0));
+#53 = VERTEX_POINT('NONE', #52);
+#54 = CARTESIAN_POINT('NONE', (0.08889999999999999, 0.0254, 0.1016));
+#55 = VERTEX_POINT('NONE', #54);
+#56 = CARTESIAN_POINT('NONE', (0, 0.0254, -0));
+#57 = VERTEX_POINT('NONE', #56);
+#58 = CARTESIAN_POINT('NONE', (0, 0.0254, 0.1016));
+#59 = VERTEX_POINT('NONE', #58);
+#60 = DIRECTION('NONE', (0, -1, 0));
+#61 = VECTOR('NONE', #60, 1);
+#62 = CARTESIAN_POINT('NONE', (0, 0, -0));
+#63 = LINE('NONE', #62, #61);
+#64 = DIRECTION('NONE', (0, 0, 1));
+#65 = VECTOR('NONE', #64, 1);
+#66 = CARTESIAN_POINT('NONE', (0, -0.0254, -0));
+#67 = LINE('NONE', #66, #65);
+#68 = DIRECTION('NONE', (0, -1, 0));
+#69 = VECTOR('NONE', #68, 1);
+#70 = CARTESIAN_POINT('NONE', (0, 0, 0.1016));
+#71 = LINE('NONE', #70, #69);
+#72 = DIRECTION('NONE', (0, 0, 1));
+#73 = VECTOR('NONE', #72, 1);
+#74 = CARTESIAN_POINT('NONE', (0, 0, -0));
+#75 = LINE('NONE', #74, #73);
+#76 = DIRECTION('NONE', (1, 0, 0));
+#77 = VECTOR('NONE', #76, 1);
+#78 = CARTESIAN_POINT('NONE', (0, -0.0254, -0));
+#79 = LINE('NONE', #78, #77);
+#80 = DIRECTION('NONE', (0, 0, 1));
+#81 = VECTOR('NONE', #80, 1);
+#82 = CARTESIAN_POINT('NONE', (0.07861346939195568, -0.0254, -0));
+#83 = LINE('NONE', #82, #81);
+#84 = DIRECTION('NONE', (1, 0, 0));
+#85 = VECTOR('NONE', #84, 1);
+#86 = CARTESIAN_POINT('NONE', (0, -0.0254, 0.1016));
+#87 = LINE('NONE', #86, #85);
+#88 = DIRECTION('NONE', (0.8191520442889919, -0.5735764363510459, 0));
+#89 = VECTOR('NONE', #88, 1);
+#90 = CARTESIAN_POINT('NONE', (0.07861346939195568, -0.0254, -0));
+#91 = LINE('NONE', #90, #89);
+#92 = DIRECTION('NONE', (0, 0, 1));
+#93 = VECTOR('NONE', #92, 1);
+#94 = CARTESIAN_POINT('NONE', (0.1511633881344551, -0.07619999999999998, -0));
+#95 = LINE('NONE', #94, #93);
+#96 = DIRECTION('NONE', (0.8191520442889919, -0.5735764363510459, 0));
+#97 = VECTOR('NONE', #96, 1);
+#98 = CARTESIAN_POINT('NONE', (0.07861346939195568, -0.0254, 0.1016));
+#99 = LINE('NONE', #98, #97);
+#100 = DIRECTION('NONE', (1, -0.0000000000000003079278779307945, 0));
+#101 = VECTOR('NONE', #100, 1);
+#102 = CARTESIAN_POINT('NONE', (0.1511633881344551, -0.07619999999999998, -0));
+#103 = LINE('NONE', #102, #101);
+#104 = DIRECTION('NONE', (0, 0, 1));
+#105 = VECTOR('NONE', #104, 1);
+#106 = CARTESIAN_POINT('NONE', (0.2413, -0.0762, -0));
+#107 = LINE('NONE', #106, #105);
+#108 = DIRECTION('NONE', (1, -0.0000000000000003079278779307945, 0));
+#109 = VECTOR('NONE', #108, 1);
+#110 = CARTESIAN_POINT('NONE', (0.1511633881344551, -0.07619999999999998, 0.1016));
+#111 = LINE('NONE', #110, #109);
+#112 = DIRECTION('NONE', (0, 1, 0));
+#113 = VECTOR('NONE', #112, 1);
+#114 = CARTESIAN_POINT('NONE', (0.2413, -0.0762, -0));
+#115 = LINE('NONE', #114, #113);
+#116 = DIRECTION('NONE', (0, 0, 1));
+#117 = VECTOR('NONE', #116, 1);
+#118 = CARTESIAN_POINT('NONE', (0.2413, -0.0635, -0));
+#119 = LINE('NONE', #118, #117);
+#120 = DIRECTION('NONE', (0, 1, 0));
+#121 = VECTOR('NONE', #120, 1);
+#122 = CARTESIAN_POINT('NONE', (0.2413, -0.0762, 0.1016));
+#123 = LINE('NONE', #122, #121);
+#124 = DIRECTION('NONE', (-1, 0, 0));
+#125 = VECTOR('NONE', #124, 1);
+#126 = CARTESIAN_POINT('NONE', (0.2413, -0.0635, -0));
+#127 = LINE('NONE', #126, #125);
+#128 = DIRECTION('NONE', (0, 0, 1));
+#129 = VECTOR('NONE', #128, 1);
+#130 = CARTESIAN_POINT('NONE', (0.1551676827532182, -0.0635, -0));
+#131 = LINE('NONE', #130, #129);
+#132 = DIRECTION('NONE', (-1, 0, 0));
+#133 = VECTOR('NONE', #132, 1);
+#134 = CARTESIAN_POINT('NONE', (0.2413, -0.0635, 0.1016));
+#135 = LINE('NONE', #134, #133);
+#136 = DIRECTION('NONE', (-0.8191520442889919, 0.573576436351046, 0));
+#137 = VECTOR('NONE', #136, 1);
+#138 = CARTESIAN_POINT('NONE', (0.1551676827532182, -0.0635, -0));
+#139 = LINE('NONE', #138, #137);
+#140 = DIRECTION('NONE', (0, 0, 1));
+#141 = VECTOR('NONE', #140, 1);
+#142 = CARTESIAN_POINT('NONE', (0.06448028432509392, 0, -0));
+#143 = LINE('NONE', #142, #141);
+#144 = DIRECTION('NONE', (-0.8191520442889919, 0.573576436351046, 0));
+#145 = VECTOR('NONE', #144, 1);
+#146 = CARTESIAN_POINT('NONE', (0.1551676827532182, -0.0635, 0.1016));
+#147 = LINE('NONE', #146, #145);
+#148 = DIRECTION('NONE', (0.90630778703665, 0.4226182617406993, 0));
+#149 = VECTOR('NONE', #148, 1);
+#150 = CARTESIAN_POINT('NONE', (0.06448028432509392, 0, -0));
+#151 = LINE('NONE', #150, #149);
+#152 = DIRECTION('NONE', (0, 0, 1));
+#153 = VECTOR('NONE', #152, 1);
+#154 = CARTESIAN_POINT('NONE', (0.14618599799650817, 0.03810000000000001, -0));
+#155 = LINE('NONE', #154, #153);
+#156 = DIRECTION('NONE', (0.90630778703665, 0.4226182617406993, 0));
+#157 = VECTOR('NONE', #156, 1);
+#158 = CARTESIAN_POINT('NONE', (0.06448028432509392, 0, 0.1016));
+#159 = LINE('NONE', #158, #157);
+#160 = DIRECTION('NONE', (1, -0.00000000000000007295344279228718, 0));
+#161 = VECTOR('NONE', #160, 1);
+#162 = CARTESIAN_POINT('NONE', (0.14618599799650817, 0.03810000000000001, -0));
+#163 = LINE('NONE', #162, #161);
+#164 = DIRECTION('NONE', (0, 0, 1));
+#165 = VECTOR('NONE', #164, 1);
+#166 = CARTESIAN_POINT('NONE', (0.2413, 0.0381, -0));
+#167 = LINE('NONE', #166, #165);
+#168 = DIRECTION('NONE', (1, -0.00000000000000007295344279228718, 0));
+#169 = VECTOR('NONE', #168, 1);
+#170 = CARTESIAN_POINT('NONE', (0.14618599799650817, 0.03810000000000001, 0.1016));
+#171 = LINE('NONE', #170, #169);
+#172 = DIRECTION('NONE', (0, 1, 0));
+#173 = VECTOR('NONE', #172, 1);
+#174 = CARTESIAN_POINT('NONE', (0.2413, 0.0381, -0));
+#175 = LINE('NONE', #174, #173);
+#176 = DIRECTION('NONE', (0, 0, 1));
+#177 = VECTOR('NONE', #176, 1);
+#178 = CARTESIAN_POINT('NONE', (0.2413, 0.0508, -0));
+#179 = LINE('NONE', #178, #177);
+#180 = DIRECTION('NONE', (0, 1, 0));
+#181 = VECTOR('NONE', #180, 1);
+#182 = CARTESIAN_POINT('NONE', (0.2413, 0.0381, 0.1016));
+#183 = LINE('NONE', #182, #181);
+#184 = DIRECTION('NONE', (-1, 0, 0));
+#185 = VECTOR('NONE', #184, 1);
+#186 = CARTESIAN_POINT('NONE', (0.2413, 0.0508, -0));
+#187 = LINE('NONE', #186, #185);
+#188 = DIRECTION('NONE', (0, 0, 1));
+#189 = VECTOR('NONE', #188, 1);
+#190 = CARTESIAN_POINT('NONE', (0.14337047578094278, 0.0508, -0));
+#191 = LINE('NONE', #190, #189);
+#192 = DIRECTION('NONE', (-1, 0, 0));
+#193 = VECTOR('NONE', #192, 1);
+#194 = CARTESIAN_POINT('NONE', (0.2413, 0.0508, 0.1016));
+#195 = LINE('NONE', #194, #193);
+#196 = DIRECTION('NONE', (-0.90630778703665, -0.42261826174069944, 0));
+#197 = VECTOR('NONE', #196, 1);
+#198 = CARTESIAN_POINT('NONE', (0.14337047578094278, 0.0508, -0));
+#199 = LINE('NONE', #198, #197);
+#200 = DIRECTION('NONE', (0, 0, 1));
+#201 = VECTOR('NONE', #200, 1);
+#202 = CARTESIAN_POINT('NONE', (0.08889999999999999, 0.0254, -0));
+#203 = LINE('NONE', #202, #201);
+#204 = DIRECTION('NONE', (-0.90630778703665, -0.42261826174069944, 0));
+#205 = VECTOR('NONE', #204, 1);
+#206 = CARTESIAN_POINT('NONE', (0.14337047578094278, 0.0508, 0.1016));
+#207 = LINE('NONE', #206, #205);
+#208 = DIRECTION('NONE', (-1, 0, 0));
+#209 = VECTOR('NONE', #208, 1);
+#210 = CARTESIAN_POINT('NONE', (0.08889999999999999, 0.0254, -0));
+#211 = LINE('NONE', #210, #209);
+#212 = DIRECTION('NONE', (0, 0, 1));
+#213 = VECTOR('NONE', #212, 1);
+#214 = CARTESIAN_POINT('NONE', (0, 0.0254, -0));
+#215 = LINE('NONE', #214, #213);
+#216 = DIRECTION('NONE', (-1, 0, 0));
+#217 = VECTOR('NONE', #216, 1);
+#218 = CARTESIAN_POINT('NONE', (0.08889999999999999, 0.0254, 0.1016));
+#219 = LINE('NONE', #218, #217);
+#220 = DIRECTION('NONE', (0, -1, 0));
+#221 = VECTOR('NONE', #220, 1);
+#222 = CARTESIAN_POINT('NONE', (0, 0.0254, -0));
+#223 = LINE('NONE', #222, #221);
+#224 = DIRECTION('NONE', (0, -1, 0));
+#225 = VECTOR('NONE', #224, 1);
+#226 = CARTESIAN_POINT('NONE', (0, 0.0254, 0.1016));
+#227 = LINE('NONE', #226, #225);
+#228 = EDGE_CURVE('NONE', #5, #7, #63, .T.);
+#229 = EDGE_CURVE('NONE', #7, #9, #67, .T.);
+#230 = EDGE_CURVE('NONE', #11, #9, #71, .T.);
+#231 = EDGE_CURVE('NONE', #5, #11, #75, .T.);
+#232 = EDGE_CURVE('NONE', #7, #13, #79, .T.);
+#233 = EDGE_CURVE('NONE', #13, #15, #83, .T.);
+#234 = EDGE_CURVE('NONE', #9, #15, #87, .T.);
+#235 = EDGE_CURVE('NONE', #13, #17, #91, .T.);
+#236 = EDGE_CURVE('NONE', #17, #19, #95, .T.);
+#237 = EDGE_CURVE('NONE', #15, #19, #99, .T.);
+#238 = EDGE_CURVE('NONE', #17, #21, #103, .T.);
+#239 = EDGE_CURVE('NONE', #21, #23, #107, .T.);
+#240 = EDGE_CURVE('NONE', #19, #23, #111, .T.);
+#241 = EDGE_CURVE('NONE', #21, #25, #115, .T.);
+#242 = EDGE_CURVE('NONE', #25, #27, #119, .T.);
+#243 = EDGE_CURVE('NONE', #23, #27, #123, .T.);
+#244 = EDGE_CURVE('NONE', #25, #29, #127, .T.);
+#245 = EDGE_CURVE('NONE', #29, #31, #131, .T.);
+#246 = EDGE_CURVE('NONE', #27, #31, #135, .T.);
+#247 = EDGE_CURVE('NONE', #29, #33, #139, .T.);
+#248 = EDGE_CURVE('NONE', #33, #35, #143, .T.);
+#249 = EDGE_CURVE('NONE', #31, #35, #147, .T.);
+#250 = EDGE_CURVE('NONE', #33, #37, #151, .T.);
+#251 = EDGE_CURVE('NONE', #37, #39, #155, .T.);
+#252 = EDGE_CURVE('NONE', #35, #39, #159, .T.);
+#253 = EDGE_CURVE('NONE', #37, #41, #163, .T.);
+#254 = EDGE_CURVE('NONE', #41, #43, #167, .T.);
+#255 = EDGE_CURVE('NONE', #39, #43, #171, .T.);
+#256 = EDGE_CURVE('NONE', #41, #45, #175, .T.);
+#257 = EDGE_CURVE('NONE', #45, #47, #179, .T.);
+#258 = EDGE_CURVE('NONE', #43, #47, #183, .T.);
+#259 = EDGE_CURVE('NONE', #45, #49, #187, .T.);
+#260 = EDGE_CURVE('NONE', #49, #51, #191, .T.);
+#261 = EDGE_CURVE('NONE', #47, #51, #195, .T.);
+#262 = EDGE_CURVE('NONE', #49, #53, #199, .T.);
+#263 = EDGE_CURVE('NONE', #53, #55, #203, .T.);
+#264 = EDGE_CURVE('NONE', #51, #55, #207, .T.);
+#265 = EDGE_CURVE('NONE', #53, #57, #211, .T.);
+#266 = EDGE_CURVE('NONE', #57, #59, #215, .T.);
+#267 = EDGE_CURVE('NONE', #55, #59, #219, .T.);
+#268 = EDGE_CURVE('NONE', #57, #5, #223, .T.);
+#269 = EDGE_CURVE('NONE', #59, #11, #227, .T.);
+#270 = ORIENTED_EDGE('NONE', *, *, #228, .T.);
+#271 = ORIENTED_EDGE('NONE', *, *, #229, .T.);
+#272 = ORIENTED_EDGE('NONE', *, *, #230, .F.);
+#273 = ORIENTED_EDGE('NONE', *, *, #231, .F.);
+#274 = EDGE_LOOP('NONE', (#270, #271, #272, #273));
+#275 = ORIENTED_EDGE('NONE', *, *, #232, .T.);
+#276 = ORIENTED_EDGE('NONE', *, *, #233, .T.);
+#277 = ORIENTED_EDGE('NONE', *, *, #234, .F.);
+#278 = ORIENTED_EDGE('NONE', *, *, #229, .F.);
+#279 = EDGE_LOOP('NONE', (#275, #276, #277, #278));
+#280 = ORIENTED_EDGE('NONE', *, *, #235, .T.);
+#281 = ORIENTED_EDGE('NONE', *, *, #236, .T.);
+#282 = ORIENTED_EDGE('NONE', *, *, #237, .F.);
+#283 = ORIENTED_EDGE('NONE', *, *, #233, .F.);
+#284 = EDGE_LOOP('NONE', (#280, #281, #282, #283));
+#285 = ORIENTED_EDGE('NONE', *, *, #238, .T.);
+#286 = ORIENTED_EDGE('NONE', *, *, #239, .T.);
+#287 = ORIENTED_EDGE('NONE', *, *, #240, .F.);
+#288 = ORIENTED_EDGE('NONE', *, *, #236, .F.);
+#289 = EDGE_LOOP('NONE', (#285, #286, #287, #288));
+#290 = ORIENTED_EDGE('NONE', *, *, #241, .T.);
+#291 = ORIENTED_EDGE('NONE', *, *, #242, .T.);
+#292 = ORIENTED_EDGE('NONE', *, *, #243, .F.);
+#293 = ORIENTED_EDGE('NONE', *, *, #239, .F.);
+#294 = EDGE_LOOP('NONE', (#290, #291, #292, #293));
+#295 = ORIENTED_EDGE('NONE', *, *, #244, .T.);
+#296 = ORIENTED_EDGE('NONE', *, *, #245, .T.);
+#297 = ORIENTED_EDGE('NONE', *, *, #246, .F.);
+#298 = ORIENTED_EDGE('NONE', *, *, #242, .F.);
+#299 = EDGE_LOOP('NONE', (#295, #296, #297, #298));
+#300 = ORIENTED_EDGE('NONE', *, *, #247, .T.);
+#301 = ORIENTED_EDGE('NONE', *, *, #248, .T.);
+#302 = ORIENTED_EDGE('NONE', *, *, #249, .F.);
+#303 = ORIENTED_EDGE('NONE', *, *, #245, .F.);
+#304 = EDGE_LOOP('NONE', (#300, #301, #302, #303));
+#305 = ORIENTED_EDGE('NONE', *, *, #250, .T.);
+#306 = ORIENTED_EDGE('NONE', *, *, #251, .T.);
+#307 = ORIENTED_EDGE('NONE', *, *, #252, .F.);
+#308 = ORIENTED_EDGE('NONE', *, *, #248, .F.);
+#309 = EDGE_LOOP('NONE', (#305, #306, #307, #308));
+#310 = ORIENTED_EDGE('NONE', *, *, #253, .T.);
+#311 = ORIENTED_EDGE('NONE', *, *, #254, .T.);
+#312 = ORIENTED_EDGE('NONE', *, *, #255, .F.);
+#313 = ORIENTED_EDGE('NONE', *, *, #251, .F.);
+#314 = EDGE_LOOP('NONE', (#310, #311, #312, #313));
+#315 = ORIENTED_EDGE('NONE', *, *, #256, .T.);
+#316 = ORIENTED_EDGE('NONE', *, *, #257, .T.);
+#317 = ORIENTED_EDGE('NONE', *, *, #258, .F.);
+#318 = ORIENTED_EDGE('NONE', *, *, #254, .F.);
+#319 = EDGE_LOOP('NONE', (#315, #316, #317, #318));
+#320 = ORIENTED_EDGE('NONE', *, *, #259, .T.);
+#321 = ORIENTED_EDGE('NONE', *, *, #260, .T.);
+#322 = ORIENTED_EDGE('NONE', *, *, #261, .F.);
+#323 = ORIENTED_EDGE('NONE', *, *, #257, .F.);
+#324 = EDGE_LOOP('NONE', (#320, #321, #322, #323));
+#325 = ORIENTED_EDGE('NONE', *, *, #262, .T.);
+#326 = ORIENTED_EDGE('NONE', *, *, #263, .T.);
+#327 = ORIENTED_EDGE('NONE', *, *, #264, .F.);
+#328 = ORIENTED_EDGE('NONE', *, *, #260, .F.);
+#329 = EDGE_LOOP('NONE', (#325, #326, #327, #328));
+#330 = ORIENTED_EDGE('NONE', *, *, #265, .T.);
+#331 = ORIENTED_EDGE('NONE', *, *, #266, .T.);
+#332 = ORIENTED_EDGE('NONE', *, *, #267, .F.);
+#333 = ORIENTED_EDGE('NONE', *, *, #263, .F.);
+#334 = EDGE_LOOP('NONE', (#330, #331, #332, #333));
+#335 = ORIENTED_EDGE('NONE', *, *, #268, .T.);
+#336 = ORIENTED_EDGE('NONE', *, *, #231, .T.);
+#337 = ORIENTED_EDGE('NONE', *, *, #269, .F.);
+#338 = ORIENTED_EDGE('NONE', *, *, #266, .F.);
+#339 = EDGE_LOOP('NONE', (#335, #336, #337, #338));
+#340 = ORIENTED_EDGE('NONE', *, *, #228, .T.);
+#341 = ORIENTED_EDGE('NONE', *, *, #232, .T.);
+#342 = ORIENTED_EDGE('NONE', *, *, #235, .T.);
+#343 = ORIENTED_EDGE('NONE', *, *, #238, .T.);
+#344 = ORIENTED_EDGE('NONE', *, *, #241, .T.);
+#345 = ORIENTED_EDGE('NONE', *, *, #244, .T.);
+#346 = ORIENTED_EDGE('NONE', *, *, #247, .T.);
+#347 = ORIENTED_EDGE('NONE', *, *, #250, .T.);
+#348 = ORIENTED_EDGE('NONE', *, *, #253, .T.);
+#349 = ORIENTED_EDGE('NONE', *, *, #256, .T.);
+#350 = ORIENTED_EDGE('NONE', *, *, #259, .T.);
+#351 = ORIENTED_EDGE('NONE', *, *, #262, .T.);
+#352 = ORIENTED_EDGE('NONE', *, *, #265, .T.);
+#353 = ORIENTED_EDGE('NONE', *, *, #268, .T.);
+#354 = EDGE_LOOP('NONE', (#340, #341, #342, #343, #344, #345, #346, #347, #348, #349, #350, #351, #352, #353));
+#355 = ORIENTED_EDGE('NONE', *, *, #230, .T.);
+#356 = ORIENTED_EDGE('NONE', *, *, #234, .T.);
+#357 = ORIENTED_EDGE('NONE', *, *, #237, .T.);
+#358 = ORIENTED_EDGE('NONE', *, *, #240, .T.);
+#359 = ORIENTED_EDGE('NONE', *, *, #243, .T.);
+#360 = ORIENTED_EDGE('NONE', *, *, #246, .T.);
+#361 = ORIENTED_EDGE('NONE', *, *, #249, .T.);
+#362 = ORIENTED_EDGE('NONE', *, *, #252, .T.);
+#363 = ORIENTED_EDGE('NONE', *, *, #255, .T.);
+#364 = ORIENTED_EDGE('NONE', *, *, #258, .T.);
+#365 = ORIENTED_EDGE('NONE', *, *, #261, .T.);
+#366 = ORIENTED_EDGE('NONE', *, *, #264, .T.);
+#367 = ORIENTED_EDGE('NONE', *, *, #267, .T.);
+#368 = ORIENTED_EDGE('NONE', *, *, #269, .T.);
+#369 = EDGE_LOOP('NONE', (#355, #356, #357, #358, #359, #360, #361, #362, #363, #364, #365, #366, #367, #368));
+#370 = CARTESIAN_POINT('NONE', (0, -0.0127, 0.0508));
+#371 = DIRECTION('NONE', (-1, 0, -0));
+#372 = AXIS2_PLACEMENT_3D('NONE', #370, #371, $);
+#373 = PLANE('NONE', #372);
+#374 = CARTESIAN_POINT('NONE', (0.039306734695977924, -0.025399999999999995, 0.0508));
+#375 = DIRECTION('NONE', (0, -1, -0));
+#376 = AXIS2_PLACEMENT_3D('NONE', #374, #375, $);
+#377 = PLANE('NONE', #376);
+#378 = CARTESIAN_POINT('NONE', (0.11488842876320533, -0.05079999999999996, 0.05079999999999999));
+#379 = DIRECTION('NONE', (-0.5735764363510459, -0.819152044288992, 0));
+#380 = AXIS2_PLACEMENT_3D('NONE', #378, #379, $);
+#381 = PLANE('NONE', #380);
+#382 = CARTESIAN_POINT('NONE', (0.19623169406722757, -0.07619999999999999, 0.0508));
+#383 = DIRECTION('NONE', (0, -1, -0));
+#384 = AXIS2_PLACEMENT_3D('NONE', #382, #383, $);
+#385 = PLANE('NONE', #384);
+#386 = CARTESIAN_POINT('NONE', (0.2413, -0.06985, 0.0508));
+#387 = DIRECTION('NONE', (1, 0, -0));
+#388 = AXIS2_PLACEMENT_3D('NONE', #386, #387, $);
+#389 = PLANE('NONE', #388);
+#390 = CARTESIAN_POINT('NONE', (0.19823384137660915, -0.0635, 0.0508));
+#391 = DIRECTION('NONE', (0, 1, -0));
+#392 = AXIS2_PLACEMENT_3D('NONE', #390, #391, $);
+#393 = PLANE('NONE', #392);
+#394 = CARTESIAN_POINT('NONE', (0.10982398353915601, -0.03174999999999997, 0.0508));
+#395 = DIRECTION('NONE', (0.573576436351046, 0.8191520442889918, -0));
+#396 = AXIS2_PLACEMENT_3D('NONE', #394, #395, $);
+#397 = PLANE('NONE', #396);
+#398 = CARTESIAN_POINT('NONE', (0.105333141160801, 0.019049999999999987, 0.0508));
+#399 = DIRECTION('NONE', (0.4226182617406993, -0.90630778703665, -0));
+#400 = AXIS2_PLACEMENT_3D('NONE', #398, #399, $);
+#401 = PLANE('NONE', #400);
+#402 = CARTESIAN_POINT('NONE', (0.19374299899825406, 0.0381, 0.0508));
+#403 = DIRECTION('NONE', (0, -1, -0));
+#404 = AXIS2_PLACEMENT_3D('NONE', #402, #403, $);
+#405 = PLANE('NONE', #404);
+#406 = CARTESIAN_POINT('NONE', (0.2413, 0.044449999999999996, 0.0508));
+#407 = DIRECTION('NONE', (1, 0, -0));
+#408 = AXIS2_PLACEMENT_3D('NONE', #406, #407, $);
+#409 = PLANE('NONE', #408);
+#410 = CARTESIAN_POINT('NONE', (0.19233523789047138, 0.0508, 0.0508));
+#411 = DIRECTION('NONE', (0, 1, -0));
+#412 = AXIS2_PLACEMENT_3D('NONE', #410, #411, $);
+#413 = PLANE('NONE', #412);
+#414 = CARTESIAN_POINT('NONE', (0.11613523789047137, 0.0381, 0.05079999999999999));
+#415 = DIRECTION('NONE', (-0.42261826174069966, 0.90630778703665, -0));
+#416 = AXIS2_PLACEMENT_3D('NONE', #414, #415, $);
+#417 = PLANE('NONE', #416);
+#418 = CARTESIAN_POINT('NONE', (0.044449999999999996, 0.0254, 0.0508));
+#419 = DIRECTION('NONE', (0, 1, -0));
+#420 = AXIS2_PLACEMENT_3D('NONE', #418, #419, $);
+#421 = PLANE('NONE', #420);
+#422 = CARTESIAN_POINT('NONE', (0, 0.0127, 0.0508));
+#423 = DIRECTION('NONE', (-1, 0, -0));
+#424 = AXIS2_PLACEMENT_3D('NONE', #422, #423, $);
+#425 = PLANE('NONE', #424);
+#426 = CARTESIAN_POINT('NONE', (0, 0, -0));
+#427 = DIRECTION('NONE', (0, 0, 1));
+#428 = AXIS2_PLACEMENT_3D('NONE', #426, #427, $);
+#429 = PLANE('NONE', #428);
+#430 = CARTESIAN_POINT('NONE', (0, 0, 0.1016));
+#431 = DIRECTION('NONE', (0, 0, 1));
+#432 = AXIS2_PLACEMENT_3D('NONE', #430, #431, $);
+#433 = PLANE('NONE', #432);
+#434 = FACE_OUTER_BOUND('NONE', #274, .T.);
+#435 = ADVANCED_FACE('NONE', (#434), #373, .T.);
+#436 = FACE_OUTER_BOUND('NONE', #279, .T.);
+#437 = ADVANCED_FACE('NONE', (#436), #377, .T.);
+#438 = FACE_OUTER_BOUND('NONE', #284, .T.);
+#439 = ADVANCED_FACE('NONE', (#438), #381, .T.);
+#440 = FACE_OUTER_BOUND('NONE', #289, .T.);
+#441 = ADVANCED_FACE('NONE', (#440), #385, .T.);
+#442 = FACE_OUTER_BOUND('NONE', #294, .T.);
+#443 = ADVANCED_FACE('NONE', (#442), #389, .T.);
+#444 = FACE_OUTER_BOUND('NONE', #299, .T.);
+#445 = ADVANCED_FACE('NONE', (#444), #393, .T.);
+#446 = FACE_OUTER_BOUND('NONE', #304, .T.);
+#447 = ADVANCED_FACE('NONE', (#446), #397, .T.);
+#448 = FACE_OUTER_BOUND('NONE', #309, .T.);
+#449 = ADVANCED_FACE('NONE', (#448), #401, .T.);
+#450 = FACE_OUTER_BOUND('NONE', #314, .T.);
+#451 = ADVANCED_FACE('NONE', (#450), #405, .T.);
+#452 = FACE_OUTER_BOUND('NONE', #319, .T.);
+#453 = ADVANCED_FACE('NONE', (#452), #409, .T.);
+#454 = FACE_OUTER_BOUND('NONE', #324, .T.);
+#455 = ADVANCED_FACE('NONE', (#454), #413, .T.);
+#456 = FACE_OUTER_BOUND('NONE', #329, .T.);
+#457 = ADVANCED_FACE('NONE', (#456), #417, .T.);
+#458 = FACE_OUTER_BOUND('NONE', #334, .T.);
+#459 = ADVANCED_FACE('NONE', (#458), #421, .T.);
+#460 = FACE_OUTER_BOUND('NONE', #339, .T.);
+#461 = ADVANCED_FACE('NONE', (#460), #425, .T.);
+#462 = FACE_OUTER_BOUND('NONE', #354, .T.);
+#463 = ADVANCED_FACE('NONE', (#462), #429, .F.);
+#464 = FACE_OUTER_BOUND('NONE', #369, .T.);
+#465 = ADVANCED_FACE('NONE', (#464), #433, .T.);
+#466 = CLOSED_SHELL('NONE', (#435, #437, #439, #441, #443, #445, #447, #449, #451, #453, #455, #457, #459, #461, #463, #465));
+#467 = ORIENTED_CLOSED_SHELL('NONE', *, #466, .T.);
+#468 = MANIFOLD_SOLID_BREP('NONE', #467);
+#469 = APPLICATION_CONTEXT('configuration controlled 3D design of mechanical parts and assemblies');
+#470 = PRODUCT_DEFINITION_CONTEXT('part definition', #469, 'design');
+#471 = PRODUCT('UNIDENTIFIED_PRODUCT', 'NONE', $, ());
+#472 = PRODUCT_DEFINITION_FORMATION('', $, #471);
+#473 = PRODUCT_DEFINITION('design', $, #472, #470);
+#474 = PRODUCT_DEFINITION_SHAPE('NONE', $, #473);
+#475 = ADVANCED_BREP_SHAPE_REPRESENTATION('NONE', (#468), #3);
+#476 = SHAPE_DEFINITION_REPRESENTATION(#474, #475);
+ENDSEC;
+END-ISO-10303-21;

e2e/playwright/export-snapshots/stl-ascii.stl

@@ -0,0 +1,478 @@
+solid unnamed
+facet normal -1 0 0
+    outer loop
+        vertex 0 -4 0
+        vertex 0 -0 0
+        vertex 0 -4 -1
+    endloop
+endfacet
+facet normal -1 0 0
+    outer loop
+        vertex 0 -4 -1
+        vertex 0 -0 0
+        vertex 0 -0 -1
+    endloop
+endfacet
+facet normal 0 0 -1
+    outer loop
+        vertex 0 -4 -1
+        vertex 0 -0 -1
+        vertex 3.0950184 -4 -1
+    endloop
+endfacet
+facet normal 0 0 -1
+    outer loop
+        vertex 3.0950184 -4 -1
+        vertex 0 -0 -1
+        vertex 3.0950184 -0 -1
+    endloop
+endfacet
+facet normal -0.57357645 0 -0.81915206
+    outer loop
+        vertex 3.0950184 -4 -1
+        vertex 3.0950184 -0 -1
+        vertex 5.9513144 -4 -3
+    endloop
+endfacet
+facet normal -0.57357645 0 -0.81915206
+    outer loop
+        vertex 5.9513144 -4 -3
+        vertex 3.0950184 -0 -1
+        vertex 5.9513144 -0 -3
+    endloop
+endfacet
+facet normal 0 0 -1
+    outer loop
+        vertex 5.9513144 -4 -3
+        vertex 5.9513144 -0 -3
+        vertex 9.5 -4 -3
+    endloop
+endfacet
+facet normal 0 0 -1
+    outer loop
+        vertex 9.5 -4 -3
+        vertex 5.9513144 -0 -3
+        vertex 9.5 -0 -3
+    endloop
+endfacet
+facet normal 1 0 0
+    outer loop
+        vertex 9.5 -4 -3
+        vertex 9.5 -0 -3
+        vertex 9.5 -4 -2.5
+    endloop
+endfacet
+facet normal 1 -0 0
+    outer loop
+        vertex 9.5 -4 -2.5
+        vertex 9.5 -0 -3
+        vertex 9.5 -0 -2.5
+    endloop
+endfacet
+facet normal 0 -0 0.99999994
+    outer loop
+        vertex 9.5 -4 -2.5
+        vertex 9.5 -0 -2.5
+        vertex 6.108964 -4 -2.5
+    endloop
+endfacet
+facet normal 0 0 0.99999994
+    outer loop
+        vertex 6.108964 -4 -2.5
+        vertex 9.5 -0 -2.5
+        vertex 6.108964 -0 -2.5
+    endloop
+endfacet
+facet normal 0.5735763 0 0.8191522
+    outer loop
+        vertex 3.4311862 -4 -0.625
+        vertex 4.323779 -4 -1.25
+        vertex 4.323779 -0 -1.25
+    endloop
+endfacet
+facet normal 0.57357645 0 0.819152
+    outer loop
+        vertex 4.323779 -4 -1.25
+        vertex 6.108964 -4 -2.5
+        vertex 6.108964 -0 -2.5
+    endloop
+endfacet
+facet normal 0.57357645 0 0.819152
+    outer loop
+        vertex 3.4311862 -0 -0.625
+        vertex 2.5385938 -0 0
+        vertex 2.5385938 -4 0
+    endloop
+endfacet
+facet normal 0.57357645 -0 0.819152
+    outer loop
+        vertex 3.4311862 -4 -0.625
+        vertex 3.4311862 -0 -0.625
+        vertex 2.5385938 -4 0
+    endloop
+endfacet
+facet normal 0.57357645 -0 0.819152
+    outer loop
+        vertex 4.323779 -4 -1.25
+        vertex 6.108964 -0 -2.5
+        vertex 4.323779 -0 -1.25
+    endloop
+endfacet
+facet normal 0.5735763 0 0.8191522
+    outer loop
+        vertex 3.4311862 -0 -0.625
+        vertex 3.4311862 -4 -0.625
+        vertex 4.323779 -0 -1.25
+    endloop
+endfacet
+facet normal 0.42261824 0 -0.9063078
+    outer loop
+        vertex 3.342784 -4 0.375
+        vertex 2.5385938 -4 0
+        vertex 2.5385938 -0 0
+    endloop
+endfacet
+facet normal 0.42261824 0 -0.9063078
+    outer loop
+        vertex 4.146974 -4 0.75
+        vertex 3.342784 -4 0.375
+        vertex 3.342784 -0 0.375
+    endloop
+endfacet
+facet normal 0.42261824 0 -0.9063078
+    outer loop
+        vertex 3.342784 -0 0.375
+        vertex 4.146974 -0 0.75
+        vertex 4.146974 -4 0.75
+    endloop
+endfacet
+facet normal 0.42261833 0 -0.90630776
+    outer loop
+        vertex 4.146974 -0 0.75
+        vertex 5.755354 -0 1.5
+        vertex 5.755354 -4 1.5
+    endloop
+endfacet
+facet normal 0.42261824 0 -0.9063078
+    outer loop
+        vertex 3.342784 -4 0.375
+        vertex 2.5385938 -0 0
+        vertex 3.342784 -0 0.375
+    endloop
+endfacet
+facet normal 0.42261833 0 -0.90630776
+    outer loop
+        vertex 5.755354 -4 1.5
+        vertex 4.146974 -4 0.75
+        vertex 4.146974 -0 0.75
+    endloop
+endfacet
+facet normal 0 0 -1
+    outer loop
+        vertex 5.755354 -4 1.5
+        vertex 5.755354 -0 1.5
+        vertex 9.5 -4 1.5
+    endloop
+endfacet
+facet normal 0 0 -1
+    outer loop
+        vertex 9.5 -4 1.5
+        vertex 5.755354 -0 1.5
+        vertex 9.5 -0 1.5
+    endloop
+endfacet
+facet normal 1 0 0
+    outer loop
+        vertex 9.5 -4 1.5
+        vertex 9.5 -0 1.5
+        vertex 9.5 -4 2
+    endloop
+endfacet
+facet normal 1 -0 0
+    outer loop
+        vertex 9.5 -4 2
+        vertex 9.5 -0 1.5
+        vertex 9.5 -0 2
+    endloop
+endfacet
+facet normal 0 -0 1
+    outer loop
+        vertex 9.5 -4 2
+        vertex 9.5 -0 2
+        vertex 5.644507 -4 2
+    endloop
+endfacet
+facet normal 0 0 1
+    outer loop
+        vertex 5.644507 -4 2
+        vertex 9.5 -0 2
+        vertex 5.644507 -0 2
+    endloop
+endfacet
+facet normal -0.42261824 0 0.90630776
+    outer loop
+        vertex 5.644507 -4 2
+        vertex 5.644507 -0 2
+        vertex 3.5 -4 1
+    endloop
+endfacet
+facet normal -0.42261824 0 0.90630776
+    outer loop
+        vertex 3.5 -4 1
+        vertex 5.644507 -0 2
+        vertex 3.5 -0 1
+    endloop
+endfacet
+facet normal 0 -0 1
+    outer loop
+        vertex 3.5 -4 1
+        vertex 3.5 -0 1
+        vertex 0 -4 1
+    endloop
+endfacet
+facet normal 0 0 1
+    outer loop
+        vertex 0 -4 1
+        vertex 3.5 -0 1
+        vertex 0 -0 1
+    endloop
+endfacet
+facet normal -1 0 0
+    outer loop
+        vertex 0 -4 1
+        vertex 0 -0 1
+        vertex 0 -4 0
+    endloop
+endfacet
+facet normal -1 0 0
+    outer loop
+        vertex 0 -4 0
+        vertex 0 -0 1
+        vertex 0 -0 0
+    endloop
+endfacet
+facet normal 0 1 -0
+    outer loop
+        vertex 3.342784 -0 0.375
+        vertex 2.5385938 -0 0
+        vertex 3.5 -0 1
+    endloop
+endfacet
+facet normal 0 1 0
+    outer loop
+        vertex 3.4311862 -0 -0.625
+        vertex 4.323779 -0 -1.25
+        vertex 3.0950184 -0 -1
+    endloop
+endfacet
+facet normal 0 1 0
+    outer loop
+        vertex 3.342784 -0 0.375
+        vertex 3.5 -0 1
+        vertex 4.146974 -0 0.75
+    endloop
+endfacet
+facet normal 0 0.99999994 0
+    outer loop
+        vertex 4.323779 -0 -1.25
+        vertex 5.9513144 -0 -3
+        vertex 3.0950184 -0 -1
+    endloop
+endfacet
+facet normal 0 1 0
+    outer loop
+        vertex 0 -0 -1
+        vertex 2.5385938 -0 0
+        vertex 3.0950184 -0 -1
+    endloop
+endfacet
+facet normal 0 1 0
+    outer loop
+        vertex 0 -0 -1
+        vertex 0 -0 0
+        vertex 2.5385938 -0 0
+    endloop
+endfacet
+facet normal 0 0.99999994 -0
+    outer loop
+        vertex 9.5 -0 -3
+        vertex 6.108964 -0 -2.5
+        vertex 9.5 -0 -2.5
+    endloop
+endfacet
+facet normal 0 1 0
+    outer loop
+        vertex 9.5 -0 -3
+        vertex 5.9513144 -0 -3
+        vertex 6.108964 -0 -2.5
+    endloop
+endfacet
+facet normal 0 1 -0
+    outer loop
+        vertex 5.9513144 -0 -3
+        vertex 4.323779 -0 -1.25
+        vertex 6.108964 -0 -2.5
+    endloop
+endfacet
+facet normal 0 1 0
+    outer loop
+        vertex 5.644507 -0 2
+        vertex 5.755354 -0 1.5
+        vertex 4.146974 -0 0.75
+    endloop
+endfacet
+facet normal 0 0.99999994 -0
+    outer loop
+        vertex 3.0950184 -0 -1
+        vertex 2.5385938 -0 0
+        vertex 3.4311862 -0 -0.625
+    endloop
+endfacet
+facet normal 0 1 -0
+    outer loop
+        vertex 4.146974 -0 0.75
+        vertex 3.5 -0 1
+        vertex 5.644507 -0 2
+    endloop
+endfacet
+facet normal 0 1 -0
+    outer loop
+        vertex 9.5 -0 1.5
+        vertex 5.755354 -0 1.5
+        vertex 9.5 -0 2
+    endloop
+endfacet
+facet normal 0 1 -0
+    outer loop
+        vertex 5.755354 -0 1.5
+        vertex 5.644507 -0 2
+        vertex 9.5 -0 2
+    endloop
+endfacet
+facet normal 0 1 0
+    outer loop
+        vertex 2.5385938 -0 0
+        vertex 0 -0 0
+        vertex 0 -0 1
+    endloop
+endfacet
+facet normal 0 1 0
+    outer loop
+        vertex 3.5 -0 1
+        vertex 2.5385938 -0 0
+        vertex 0 -0 1
+    endloop
+endfacet
+facet normal -0 -1 0
+    outer loop
+        vertex 3.342784 -4 0.375
+        vertex 3.5 -4 1
+        vertex 2.5385938 -4 0
+    endloop
+endfacet
+facet normal -0 -1 0
+    outer loop
+        vertex 4.146974 -4 0.75
+        vertex 3.5 -4 1
+        vertex 3.342784 -4 0.375
+    endloop
+endfacet
+facet normal 0 -1 -0
+    outer loop
+        vertex 3.4311862 -4 -0.625
+        vertex 3.0950184 -4 -1
+        vertex 4.323779 -4 -1.25
+    endloop
+endfacet
+facet normal 0 -0.99999994 0
+    outer loop
+        vertex 4.146974 -4 0.75
+        vertex 5.755354 -4 1.5
+        vertex 5.644507 -4 2
+    endloop
+endfacet
+facet normal 0 -1 0
+    outer loop
+        vertex 0 -4 1
+        vertex 2.5385938 -4 0
+        vertex 3.5 -4 1
+    endloop
+endfacet
+facet normal 0 -1 0
+    outer loop
+        vertex 0 -4 1
+        vertex 0 -4 0
+        vertex 2.5385938 -4 0
+    endloop
+endfacet
+facet normal 0 -1 0
+    outer loop
+        vertex 5.644507 -4 2
+        vertex 5.755354 -4 1.5
+        vertex 9.5 -4 2
+    endloop
+endfacet
+facet normal 0 -1 -0
+    outer loop
+        vertex 9.5 -4 2
+        vertex 5.755354 -4 1.5
+        vertex 9.5 -4 1.5
+    endloop
+endfacet
+facet normal 0 -1 0
+    outer loop
+        vertex 4.146974 -4 0.75
+        vertex 5.644507 -4 2
+        vertex 3.5 -4 1
+    endloop
+endfacet
+facet normal 0 -0.99999994 0
+    outer loop
+        vertex 2.5385938 -4 0
+        vertex 3.0950184 -4 -1
+        vertex 3.4311862 -4 -0.625
+    endloop
+endfacet
+facet normal -0 -0.99999994 -0
+    outer loop
+        vertex 4.323779 -4 -1.25
+        vertex 3.0950184 -4 -1
+        vertex 5.9513144 -4 -3
+    endloop
+endfacet
+facet normal -0 -1 0
+    outer loop
+        vertex 6.108964 -4 -2.5
+        vertex 4.323779 -4 -1.25
+        vertex 5.9513144 -4 -3
+    endloop
+endfacet
+facet normal -0 -0.99999994 -0
+    outer loop
+        vertex 9.5 -4 -2.5
+        vertex 6.108964 -4 -2.5
+        vertex 9.5 -4 -3
+    endloop
+endfacet
+facet normal 0 -1 -0
+    outer loop
+        vertex 6.108964 -4 -2.5
+        vertex 5.9513144 -4 -3
+        vertex 9.5 -4 -3
+    endloop
+endfacet
+facet normal 0 -1 -0
+    outer loop
+        vertex 2.5385938 -4 0
+        vertex 0 -4 -1
+        vertex 3.0950184 -4 -1
+    endloop
+endfacet
+facet normal 0 -1 0
+    outer loop
+        vertex 0 -4 -1
+        vertex 2.5385938 -4 0
+        vertex 0 -4 0
+    endloop
+endfacet
+endsolid unnamed

e2e/playwright/flow-tests.spec.ts

@@ -0,0 +1,737 @@
+import { test, expect } from '@playwright/test'
+import { secrets } from './secrets'
+import { EngineCommand } from '../../src/lang/std/engineConnection'
+import { v4 as uuidv4 } from 'uuid'
+import { getUtils } from './test-utils'
+import waitOn from 'wait-on'
+import { Themes } from '../../src/lib/theme'
+
+/*
+debug helper: unfortunately we do rely on exact coord mouse clicks in a few places
+just from the nature of the stream, running the test with debugger and pasting the below
+into the console can be useful to get coords
+
+document.addEventListener('mousemove', (e) =>
+  console.log(`await page.mouse.click(${e.clientX}, ${e.clientY})`)
+)
+*/
+
+test.beforeEach(async ({ context, page }) => {
+  // wait for Vite preview server to be up
+  await waitOn({
+    resources: ['tcp:3000'],
+    timeout: 5000,
+  })
+  await context.addInitScript(async (token) => {
+    localStorage.setItem('TOKEN_PERSIST_KEY', token)
+    localStorage.setItem('persistCode', ``)
+    localStorage.setItem(
+      'SETTINGS_PERSIST_KEY',
+      JSON.stringify({
+        baseUnit: 'in',
+        cameraControls: 'KittyCAD',
+        defaultDirectory: '',
+        defaultProjectName: 'project-$nnn',
+        onboardingStatus: 'dismissed',
+        showDebugPanel: true,
+        textWrapping: 'On',
+        theme: 'system',
+        unitSystem: 'imperial',
+      })
+    )
+  }, secrets.token)
+  // kill animations, speeds up tests and reduced flakiness
+  await page.emulateMedia({ reducedMotion: 'reduce' })
+})
+
+test.setTimeout(60000)
+
+test('Basic sketch', async ({ page }) => {
+  const u = getUtils(page)
+  await page.setViewportSize({ width: 1200, height: 500 })
+  const PUR = 400 / 37.5 //pixeltoUnitRatio
+  await page.goto('/')
+  await u.waitForAuthSkipAppStart()
+  await u.openDebugPanel()
+  await u.waitForDefaultPlanesVisibilityChange()
+
+  await expect(page.getByRole('button', { name: 'Start Sketch' })).toBeVisible()
+
+  // click on "Start Sketch" button
+  await u.clearCommandLogs()
+  await Promise.all([
+    u.doAndWaitForImageDiff(
+      () => page.getByRole('button', { name: 'Start Sketch' }).click(),
+      200
+    ),
+    u.waitForDefaultPlanesVisibilityChange(),
+  ])
+
+  // select a plane
+  await u.doAndWaitForCmd(() => page.mouse.click(700, 200), 'edit_mode_enter')
+  await u.waitForCmdReceive('set_tool')
+
+  await u.doAndWaitForCmd(
+    () => page.getByRole('button', { name: 'Line' }).click(),
+    'set_tool'
+  )
+
+  const startXPx = 600
+  await u.doAndWaitForCmd(
+    () => page.mouse.click(startXPx + PUR * 10, 500 - PUR * 10),
+    'mouse_click',
+    false
+  )
+
+  await page.mouse.click(startXPx + PUR * 20, 500 - PUR * 10)
+
+  const startAt = '[18.26, -24.63]'
+  const num = '18.43'
+  await expect(page.locator('.cm-content'))
+    .toHaveText(`const part001 = startSketchOn('-XZ')
+  |> startProfileAt(${startAt}, %)
+  |> line([${num}, 0], %)`)
+
+  await page.mouse.click(startXPx + PUR * 20, 500 - PUR * 20)
+  await expect(page.locator('.cm-content'))
+    .toHaveText(`const part001 = startSketchOn('-XZ')
+  |> startProfileAt(${startAt}, %)
+  |> line([${num}, 0], %)
+  |> line([0, ${num}], %)`)
+  await page.mouse.click(startXPx, 500 - PUR * 20)
+  await expect(page.locator('.cm-content'))
+    .toHaveText(`const part001 = startSketchOn('-XZ')
+  |> startProfileAt(${startAt}, %)
+  |> line([${num}, 0], %)
+  |> line([0, ${num}], %)
+  |> line([-36.69, 0], %)`)
+
+  // deselect line tool
+  await u.doAndWaitForCmd(
+    () => page.getByRole('button', { name: 'Line' }).click(),
+    'set_tool'
+  )
+
+  // click between first two clicks to get center of the line
+  await u.doAndWaitForCmd(
+    () => page.mouse.click(startXPx + PUR * 15, 500 - PUR * 10),
+    'select_with_point'
+  )
+  await u.closeDebugPanel()
+
+  // hold down shift
+  await page.keyboard.down('Shift')
+  // click between the latest two clicks to get center of the line
+  await page.mouse.click(startXPx + PUR * 10, 500 - PUR * 20)
+
+  // selected two lines therefore there should be two cursors
+  await expect(page.locator('.cm-cursor')).toHaveCount(2)
+
+  await page.getByRole('button', { name: 'Equal Length' }).click()
+
+  await expect(page.locator('.cm-content'))
+    .toHaveText(`const part001 = startSketchOn('-XZ')
+  |> startProfileAt(${startAt}, %)
+  |> line({ to: [${num}, 0], tag: 'seg01' }, %)
+  |> line([0, ${num}], %)
+  |> angledLine([180, segLen('seg01', %)], %)`)
+})
+
+test('if you write invalid kcl you get inlined errors', async ({ page }) => {
+  const u = getUtils(page)
+  await page.setViewportSize({ width: 1000, height: 500 })
+  await page.goto('/')
+
+  await u.waitForAuthSkipAppStart()
+
+  // check no error to begin with
+  await expect(page.locator('.cm-lint-marker-error')).not.toBeVisible()
+
+  /* add the following code to the editor (# error is not a valid line)
+    # error
+    const topAng = 30
+    const bottomAng = 25
+   */
+  await page.click('.cm-content')
+  await page.keyboard.type('# error')
+
+  // press arrows to clear autocomplete
+  await page.keyboard.press('ArrowLeft')
+  await page.keyboard.press('ArrowRight')
+
+  await page.keyboard.press('Enter')
+  await page.keyboard.type('const topAng = 30')
+  await page.keyboard.press('Enter')
+  await page.keyboard.type('const bottomAng = 25')
+  await page.keyboard.press('Enter')
+
+  // error in guter
+  await expect(page.locator('.cm-lint-marker-error')).toBeVisible()
+
+  // error text on hover
+  await page.hover('.cm-lint-marker-error')
+  await expect(page.getByText("found unknown token '#'")).toBeVisible()
+
+  // select the line that's causing the error and delete it
+  await page.getByText('# error').click()
+  await page.keyboard.press('End')
+  await page.keyboard.down('Shift')
+  await page.keyboard.press('Home')
+  await page.keyboard.up('Shift')
+  await page.keyboard.press('Backspace')
+
+  // wait for .cm-lint-marker-error not to be visible
+  await expect(page.locator('.cm-lint-marker-error')).not.toBeVisible()
+
+  // let's check we get an error when defining the same variable twice
+  await page.getByText('const bottomAng = 25').click()
+  await page.keyboard.press('Enter')
+  await page.keyboard.type("// Let's define the same thing twice")
+  await page.keyboard.press('Enter')
+  await page.keyboard.type('const topAng = 42')
+
+  await expect(page.locator('.cm-lint-marker-error')).toBeVisible()
+  await expect(page.locator('.cm-lintRange.cm-lintRange-error')).toBeVisible()
+
+  await page.locator('.cm-lintRange.cm-lintRange-error').hover()
+  await expect(page.locator('.cm-diagnosticText')).toBeVisible()
+  await expect(page.getByText('Cannot redefine topAng')).toBeVisible()
+
+  const secondTopAng = await page.getByText('topAng').first()
+  await secondTopAng?.dblclick()
+  await page.keyboard.type('otherAng')
+
+  await expect(page.locator('.cm-lint-marker-error')).not.toBeVisible()
+})
+
+test('executes on load', async ({ page, context }) => {
+  const u = getUtils(page)
+  await context.addInitScript(async (token) => {
+    localStorage.setItem(
+      'persistCode',
+      `const part001 = startSketchOn('-XZ')
+  |> startProfileAt([-6.95, 4.98], %)
+  |> line([25.1, 0.41], %)
+  |> line([0.73, -14.93], %)
+  |> line([-23.44, 0.52], %)`
+    )
+  })
+  await page.setViewportSize({ width: 1000, height: 500 })
+  await page.goto('/')
+  await u.waitForAuthSkipAppStart()
+
+  // expand variables section
+  await page.getByText('Variables').click()
+
+  // can find part001 in the variables summary (pretty-json-container, makes sure we're not looking in the code editor)
+  // part001 only shows up in the variables summary if it's been executed
+  await page.waitForFunction(() => {
+    const variablesElement = document.querySelector(
+      '.pretty-json-container'
+    ) as HTMLDivElement
+    return variablesElement.innerHTML.includes('part001')
+  })
+  await expect(
+    page.locator('.pretty-json-container >> text=part001')
+  ).toBeVisible()
+})
+
+test('re-executes', async ({ page, context }) => {
+  const u = getUtils(page)
+  await context.addInitScript(async (token) => {
+    localStorage.setItem('persistCode', `const myVar = 5`)
+  })
+  await page.setViewportSize({ width: 1000, height: 500 })
+  await page.goto('/')
+  await u.waitForAuthSkipAppStart()
+
+  await page.getByText('Variables').click()
+  // expect to see "myVar:5"
+  await expect(
+    page.locator('.pretty-json-container >> text=myVar:5')
+  ).toBeVisible()
+
+  // change 5 to 67
+  await page.getByText('const myVar').click()
+  await page.keyboard.press('End')
+  await page.keyboard.press('Backspace')
+  await page.keyboard.type('67')
+
+  await expect(
+    page.locator('.pretty-json-container >> text=myVar:67')
+  ).toBeVisible()
+})
+
+test('Can create sketches on all planes and their back sides', async ({
+  page,
+}) => {
+  const u = getUtils(page)
+  const PUR = 400 / 37.5 //pixeltoUnitRatio
+  await page.setViewportSize({ width: 1200, height: 500 })
+  await page.goto('/')
+  await u.waitForAuthSkipAppStart()
+  await u.openDebugPanel()
+  await u.waitForDefaultPlanesVisibilityChange()
+
+  const camCmd: EngineCommand = {
+    type: 'modeling_cmd_req',
+    cmd_id: uuidv4(),
+    cmd: {
+      type: 'default_camera_look_at',
+      center: { x: 15, y: 0, z: 0 },
+      up: { x: 0, y: 0, z: 1 },
+      vantage: { x: 30, y: 30, z: 30 },
+    },
+  }
+
+  const TestSinglePlane = async ({
+    viewCmd,
+    expectedCode,
+    clickCoords,
+  }: {
+    viewCmd: EngineCommand
+    expectedCode: string
+    clickCoords: { x: number; y: number }
+  }) => {
+    await u.openDebugPanel()
+    await u.sendCustomCmd(viewCmd)
+    await u.clearCommandLogs()
+    // await page.waitForTimeout(200)
+    await page.getByRole('button', { name: 'Start Sketch' }).click()
+    await u.waitForDefaultPlanesVisibilityChange()
+
+    await u.closeDebugPanel()
+    await page.mouse.click(clickCoords.x, clickCoords.y)
+    await u.openDebugPanel()
+
+    await expect(page.getByRole('button', { name: 'Line' })).toBeVisible()
+
+    // draw a line
+    const startXPx = 600
+    await u.clearCommandLogs()
+    await page.getByRole('button', { name: 'Line' }).click()
+    await u.waitForCmdReceive('set_tool')
+    await u.clearCommandLogs()
+    await u.closeDebugPanel()
+    await page.mouse.click(startXPx + PUR * 10, 500 - PUR * 10)
+    await u.openDebugPanel()
+    await u.waitForCmdReceive('mouse_click')
+    await u.closeDebugPanel()
+    await page.mouse.click(startXPx + PUR * 20, 500 - PUR * 10)
+    await u.openDebugPanel()
+
+    await expect(page.locator('.cm-content')).toHaveText(expectedCode)
+
+    await page.getByRole('button', { name: 'Line' }).click()
+    await u.clearCommandLogs()
+    await page.getByRole('button', { name: 'Exit Sketch' }).click()
+    await u.expectCmdLog('[data-message-type="execution-done"]')
+
+    await u.clearCommandLogs()
+    await u.removeCurrentCode()
+  }
+
+  const codeTemplate = (
+    plane = 'XY',
+    sign = ''
+  ) => `const part001 = startSketchOn('${plane}')
+  |> startProfileAt([${sign}6.88, -9.29], %)
+  |> line([${sign}6.95, 0], %)`
+  await TestSinglePlane({
+    viewCmd: camCmd,
+    expectedCode: codeTemplate('XY'),
+    clickCoords: { x: 700, y: 350 }, // red plane
+  })
+  await TestSinglePlane({
+    viewCmd: camCmd,
+    expectedCode: codeTemplate('YZ'),
+    clickCoords: { x: 1000, y: 200 }, // green plane
+  })
+  await TestSinglePlane({
+    viewCmd: camCmd,
+    expectedCode: codeTemplate('XZ', '-'),
+    clickCoords: { x: 630, y: 130 }, // blue plane
+  })
+
+  // new camera angle to click the back side of all three planes
+  const camCmdBackSide: EngineCommand = {
+    type: 'modeling_cmd_req',
+    cmd_id: uuidv4(),
+    cmd: {
+      type: 'default_camera_look_at',
+      center: { x: -15, y: 0, z: 0 },
+      up: { x: 0, y: 0, z: 1 },
+      vantage: { x: -30, y: -30, z: -30 },
+    },
+  }
+  await TestSinglePlane({
+    viewCmd: camCmdBackSide,
+    expectedCode: codeTemplate('-XY', '-'),
+    clickCoords: { x: 705, y: 136 }, // back of red plane
+  })
+  await TestSinglePlane({
+    viewCmd: camCmdBackSide,
+    expectedCode: codeTemplate('-YZ', '-'),
+    clickCoords: { x: 1000, y: 350 }, // back of green plane
+  })
+  await TestSinglePlane({
+    viewCmd: camCmdBackSide,
+    expectedCode: codeTemplate('-XZ'),
+    clickCoords: { x: 600, y: 400 }, // back of blue plane
+  })
+})
+
+test('Auto complete works', async ({ page }) => {
+  const u = getUtils(page)
+  // const PUR = 400 / 37.5 //pixeltoUnitRatio
+  await page.setViewportSize({ width: 1200, height: 500 })
+  await page.goto('/')
+  await u.waitForAuthSkipAppStart()
+  await u.waitForDefaultPlanesVisibilityChange()
+
+  // this test might be brittle as we add and remove functions
+  // but should also be easy to update.
+  // tests clicking on an option, selection the first option
+  // and arrowing down to an option
+
+  await page.click('.cm-content')
+  await page.keyboard.type('const part001 = start')
+
+  // expect there to be three auto complete options
+  await expect(page.locator('.cm-completionLabel')).toHaveCount(3)
+  await page.getByText('startSketchOn').click()
+  await page.keyboard.type("('XY')")
+  await page.keyboard.press('Enter')
+  await page.keyboard.type('  |> startProfi')
+  // expect there be a single auto complete option that we can just hit enter on
+  await expect(page.locator('.cm-completionLabel')).toBeVisible()
+  await page.keyboard.press('Enter') // accepting the auto complete, not a new line
+
+  await page.keyboard.type('([0,0], %)')
+  await page.keyboard.press('Enter')
+  await page.keyboard.type('  |> lin')
+
+  await expect(page.locator('.cm-tooltip-autocomplete')).toBeVisible()
+  // press arrow down twice then enter to accept xLine
+  await page.keyboard.press('ArrowDown')
+  await page.keyboard.press('ArrowDown')
+  await page.keyboard.press('Enter')
+  await page.keyboard.type('(5, %)')
+
+  await expect(page.locator('.cm-content'))
+    .toHaveText(`const part001 = startSketchOn('XY')
+  |> startProfileAt([0,0], %)
+  |> xLine(5, %)`)
+})
+
+// Onboarding tests
+test('Onboarding redirects and code updating', async ({ page, context }) => {
+  const u = getUtils(page)
+
+  // Override beforeEach test setup
+  await context.addInitScript(async () => {
+    // Give some initial code, so we can test that it's cleared
+    localStorage.setItem('persistCode', 'const sigmaAllow = 15000')
+
+    const storedSettings = JSON.parse(
+      localStorage.getItem('SETTINGS_PERSIST_KEY') || '{}'
+    )
+    storedSettings.onboardingStatus = '/export'
+    localStorage.setItem('SETTINGS_PERSIST_KEY', JSON.stringify(storedSettings))
+  })
+
+  await page.setViewportSize({ width: 1200, height: 500 })
+  await page.goto('/')
+  await u.waitForAuthSkipAppStart()
+
+  // Test that the redirect happened
+  await expect(page.url().split(':3000').slice(-1)[0]).toBe(
+    `/file/new/onboarding/export`
+  )
+
+  // Test that you come back to this page when you refresh
+  await page.reload()
+  await expect(page.url().split(':3000').slice(-1)[0]).toBe(
+    `/file/new/onboarding/export`
+  )
+
+  // Test that the onboarding pane loaded
+  const title = page.locator('[data-testid="onboarding-content"]')
+  await expect(title).toBeAttached()
+
+  // Test that the code changes when you advance to the next step
+  await page.locator('[data-testid="onboarding-next"]').click()
+  await expect(page.locator('.cm-content')).toHaveText('')
+
+  // Test that the code is not empty when you click on the next step
+  await page.locator('[data-testid="onboarding-next"]').click()
+  await expect(page.locator('.cm-content')).toHaveText(/.+/)
+})
+
+test('Selections work on fresh and edited sketch', async ({ page }) => {
+  // tests mapping works on fresh sketch and edited sketch
+  // tests using hovers which is the same as selections, because if
+  // source ranges are wrong, hovers won't work
+  const u = getUtils(page)
+  const PUR = 400 / 37.5 //pixeltoUnitRatio
+  await page.setViewportSize({ width: 1200, height: 500 })
+  await page.goto('/')
+  await u.waitForAuthSkipAppStart()
+  await u.openDebugPanel()
+  await u.waitForDefaultPlanesVisibilityChange()
+
+  const xAxisClick = () => page.mouse.click(700, 250)
+  const emptySpaceClick = () => page.mouse.click(700, 300)
+  const topHorzSegmentClick = () => page.mouse.click(700, 285)
+  const bottomHorzSegmentClick = () => page.mouse.click(750, 393)
+
+  await u.clearCommandLogs()
+  await page.getByRole('button', { name: 'Start Sketch' }).click()
+  await u.waitForDefaultPlanesVisibilityChange()
+
+  // select a plane
+  await u.doAndWaitForCmd(() => page.mouse.click(700, 200), 'edit_mode_enter')
+  await u.waitForCmdReceive('set_tool')
+
+  await u.doAndWaitForCmd(
+    () => page.getByRole('button', { name: 'Line' }).click(),
+    'set_tool'
+  )
+
+  const startXPx = 600
+  await u.doAndWaitForCmd(
+    () => page.mouse.click(startXPx + PUR * 10, 500 - PUR * 10),
+    'mouse_click',
+    false
+  )
+
+  await page.mouse.click(startXPx + PUR * 20, 500 - PUR * 10)
+
+  const startAt = '[18.26, -24.63]'
+  const num = '18.43'
+  const num2 = '36.69'
+  await expect(page.locator('.cm-content'))
+    .toHaveText(`const part001 = startSketchOn('-XZ')
+  |> startProfileAt(${startAt}, %)
+  |> line([${num}, 0], %)`)
+
+  await page.mouse.click(startXPx + PUR * 20, 500 - PUR * 20)
+  await expect(page.locator('.cm-content'))
+    .toHaveText(`const part001 = startSketchOn('-XZ')
+  |> startProfileAt(${startAt}, %)
+  |> line([${num}, 0], %)
+  |> line([0, ${num}], %)`)
+  await page.mouse.click(startXPx, 500 - PUR * 20)
+  await expect(page.locator('.cm-content'))
+    .toHaveText(`const part001 = startSketchOn('-XZ')
+  |> startProfileAt(${startAt}, %)
+  |> line([${num}, 0], %)
+  |> line([0, ${num}], %)
+  |> line([-${num2}, 0], %)`)
+
+  // deselect line tool
+  await u.doAndWaitForCmd(
+    () => page.getByRole('button', { name: 'Line' }).click(),
+    'set_tool'
+  )
+
+  await u.closeDebugPanel()
+  const selectionSequence = async () => {
+    await expect(page.getByTestId('hover-highlight')).not.toBeVisible()
+
+    await page.mouse.move(startXPx + PUR * 15, 500 - PUR * 10)
+
+    await expect(page.getByTestId('hover-highlight')).toBeVisible()
+    // bg-yellow-200 is more brittle than hover-highlight, but is closer to the user experience
+    // and will be an easy fix if it breaks because we change the colour
+    await expect(page.locator('.bg-yellow-200')).toBeVisible()
+
+    // check mousing off, than mousing onto another line
+    await page.mouse.move(startXPx + PUR * 10, 500 - PUR * 15) // mouse off
+    await expect(page.getByTestId('hover-highlight')).not.toBeVisible()
+    await page.mouse.move(startXPx + PUR * 10, 500 - PUR * 20) // mouse onto another line
+    await expect(page.getByTestId('hover-highlight')).toBeVisible()
+
+    // now check clicking works including axis
+
+    // click a segment hold shift and click an axis, see that a relevant constraint is enabled
+    await u.doAndWaitForCmd(topHorzSegmentClick, 'select_with_point', false)
+    await page.keyboard.down('Shift')
+    const absYButton = page.getByRole('button', { name: 'ABS Y' })
+    await expect(absYButton).toBeDisabled()
+    await u.doAndWaitForCmd(xAxisClick, 'select_with_point', false)
+    await page.keyboard.up('Shift')
+    await absYButton.and(page.locator(':not([disabled])')).waitFor()
+    await expect(absYButton).not.toBeDisabled()
+
+    // clear selection by clicking on nothing
+    await u.doAndWaitForCmd(emptySpaceClick, 'select_clear', false)
+
+    // same selection but click the axis first
+    await u.doAndWaitForCmd(xAxisClick, 'select_with_point', false)
+    await expect(absYButton).toBeDisabled()
+    await page.keyboard.down('Shift')
+    await u.doAndWaitForCmd(topHorzSegmentClick, 'select_with_point', false)
+    await page.keyboard.up('Shift')
+    await expect(absYButton).not.toBeDisabled()
+
+    // clear selection by clicking on nothing
+    await u.doAndWaitForCmd(emptySpaceClick, 'select_clear', false)
+
+    // check the same selection again by putting cursor in code first then selecting axis
+    await u.doAndWaitForCmd(
+      () => page.getByText(`  |> line([-${num2}, 0], %)`).click(),
+      'select_clear',
+      false
+    )
+    await page.keyboard.down('Shift')
+    await expect(absYButton).toBeDisabled()
+    await u.doAndWaitForCmd(xAxisClick, 'select_with_point', false)
+    await page.keyboard.up('Shift')
+    await expect(absYButton).not.toBeDisabled()
+
+    // clear selection by clicking on nothing
+    await u.doAndWaitForCmd(emptySpaceClick, 'select_clear', false)
+
+    // select segment in editor than another segment in scene and check there are two cursors
+    await u.doAndWaitForCmd(
+      () => page.getByText(`  |> line([-${num2}, 0], %)`).click(),
+      'select_clear',
+      false
+    )
+    await page.keyboard.down('Shift')
+    await expect(page.locator('.cm-cursor')).toHaveCount(1)
+    await u.doAndWaitForCmd(bottomHorzSegmentClick, 'select_with_point', false) // another segment, bottom one
+    await page.keyboard.up('Shift')
+    await expect(page.locator('.cm-cursor')).toHaveCount(2)
+
+    // clear selection by clicking on nothing
+    await u.doAndWaitForCmd(emptySpaceClick, 'select_clear', false)
+  }
+
+  await selectionSequence()
+
+  // hovering in fresh sketch worked, lets try exiting and re-entering
+  await u.doAndWaitForCmd(
+    () => page.getByRole('button', { name: 'Exit Sketch' }).click(),
+    'edit_mode_exit'
+  )
+  // wait for execution done
+  await u.expectCmdLog('[data-message-type="execution-done"]')
+
+  // select a line
+  await u.doAndWaitForCmd(topHorzSegmentClick, 'select_clear', false)
+
+  // enter sketch again
+  await u.doAndWaitForCmd(
+    () => page.getByRole('button', { name: 'Start Sketch' }).click(),
+    'edit_mode_enter',
+    false
+  )
+
+  // hover again and check it works
+  await selectionSequence()
+})
+
+test('Command bar works and can change a setting', async ({ page }) => {
+  // Brief boilerplate
+  const u = getUtils(page)
+  await page.setViewportSize({ width: 1200, height: 500 })
+  await page.goto('/')
+  await u.waitForAuthSkipAppStart()
+
+  let cmdSearchBar = page.getByPlaceholder('Search commands')
+
+  // First try opening the command bar and closing it
+  // It has a different label on mac and windows/linux, "Meta+K" and "Ctrl+/" respectively
+  await page
+    .getByRole('button', { name: 'Ctrl+/' })
+    .or(page.getByRole('button', { name: '⌘K' }))
+    .click()
+  await expect(cmdSearchBar).toBeVisible()
+  await page.keyboard.press('Escape')
+  await expect(cmdSearchBar).not.toBeVisible()
+
+  // Now try the same, but with the keyboard shortcut, check focus
+  await page.keyboard.press('Meta+K')
+  await expect(cmdSearchBar).toBeVisible()
+  await expect(cmdSearchBar).toBeFocused()
+
+  // Try typing in the command bar
+  await page.keyboard.type('theme')
+  const themeOption = page.getByRole('option', { name: 'Set Theme' })
+  await expect(themeOption).toBeVisible()
+  await themeOption.click()
+  const themeInput = page.getByPlaceholder('Select an option')
+  await expect(themeInput).toBeVisible()
+  await expect(themeInput).toBeFocused()
+  // Select dark theme
+  await page.keyboard.press('ArrowDown')
+  await page.keyboard.press('ArrowDown')
+  await expect(page.getByRole('option', { name: Themes.Dark })).toHaveAttribute(
+    'data-headlessui-state',
+    'active'
+  )
+  await page.keyboard.press('Enter')
+
+  // Check the toast appeared
+  await expect(page.getByText(`Set Theme to "${Themes.Dark}"`)).toBeVisible()
+  // Check that the theme changed
+  await expect(page.locator('body')).toHaveClass(`body-bg ${Themes.Dark}`)
+})
+
+test('Can extrude from the command bar', async ({ page, context }) => {
+  await context.addInitScript(async (token) => {
+    localStorage.setItem(
+      'persistCode',
+      `const part001 = startSketchOn('-XZ')
+    |> startProfileAt([-6.95, 4.98], %)
+    |> line([25.1, 0.41], %)
+    |> line([0.73, -14.93], %)
+    |> line([-23.44, 0.52], %)
+    |> close(%)`
+    )
+  })
+
+  const u = getUtils(page)
+  await page.setViewportSize({ width: 1200, height: 500 })
+  await page.goto('/')
+  await u.waitForAuthSkipAppStart()
+
+  let cmdSearchBar = page.getByPlaceholder('Search commands')
+  await page.keyboard.press('Meta+K')
+  await expect(cmdSearchBar).toBeVisible()
+
+  // Search for extrude command and choose it
+  await page.getByRole('option', { name: 'Extrude' }).click()
+  await expect(page.locator('#arg-form > label')).toContainText(
+    'Please select one face'
+  )
+  await expect(page.getByRole('button', { name: 'selection' })).toBeDisabled()
+
+  // Click to select face and set distance
+  await u.openAndClearDebugPanel()
+  await page.getByText('|> startProfileAt([-6.95, 4.98], %)').click()
+  await u.waitForCmdReceive('select_add')
+  await u.closeDebugPanel()
+  await page.getByRole('button', { name: 'Continue' }).click()
+  await expect(page.getByRole('button', { name: 'distance' })).toBeDisabled()
+  await page.keyboard.press('Enter')
+
+  // Review step and argument hotkeys
+  await page.keyboard.press('2')
+  await expect(page.getByRole('button', { name: '5' })).toBeDisabled()
+  await page.keyboard.press('Enter')
+
+  // Check that the code was updated
+  await page.keyboard.press('Enter')
+  await expect(page.locator('.cm-content')).toHaveText(
+    `const part001 = startSketchOn('-XZ')
+    |> startProfileAt([-6.95, 4.98], %)
+    |> line([25.1, 0.41], %)
+    |> line([0.73, -14.93], %)
+    |> line([-23.44, 0.52], %)
+    |> close(%)
+    |> extrude(5, %)`
+  )
+})

e2e/playwright/secrets.ts

@@ -0,0 +1,21 @@
+import { readFileSync } from 'fs'
+
+const secrets: Record<string, string> = {}
+try {
+  const file = readFileSync('./e2e/playwright/playwright-secrets.env', 'utf8')
+  file
+    .split('\n')
+    .filter((line) => line && line.length > 1)
+    .forEach((line) => {
+      const [key, value] = line.split('=')
+      // prefer env vars over secrets file
+      secrets[key] = process.env[key] || (value as any).replaceAll('"', '')
+    })
+} catch (err) {
+  // probably running in CI
+  secrets.token = process.env.token || ''
+  secrets.snapshottoken = process.env.snapshottoken || ''
+  // add more env vars here to make them available in CI
+}
+
+export { secrets }

e2e/playwright/snapshot-tests.spec.ts

@@ -0,0 +1,388 @@
+import { test, expect } from '@playwright/test'
+import { secrets } from './secrets'
+import { EngineCommand } from '../../src/lang/std/engineConnection'
+import { v4 as uuidv4 } from 'uuid'
+import { getUtils } from './test-utils'
+import { Models } from '@kittycad/lib'
+import fsp from 'fs/promises'
+import { spawn } from 'child_process'
+import { APP_NAME } from 'lib/constants'
+
+test.beforeEach(async ({ context, page }) => {
+  await context.addInitScript(async (token) => {
+    localStorage.setItem('TOKEN_PERSIST_KEY', token)
+    localStorage.setItem('persistCode', ``)
+    localStorage.setItem(
+      'SETTINGS_PERSIST_KEY',
+      JSON.stringify({
+        baseUnit: 'in',
+        cameraControls: 'KittyCAD',
+        defaultDirectory: '',
+        defaultProjectName: 'project-$nnn',
+        onboardingStatus: 'dismissed',
+        showDebugPanel: true,
+        textWrapping: 'On',
+        theme: 'system',
+        unitSystem: 'imperial',
+      })
+    )
+  }, secrets.token)
+  // reducedMotion kills animations, which speeds up tests and reduces flakiness
+  await page.emulateMedia({ reducedMotion: 'reduce' })
+})
+
+test.setTimeout(60000)
+
+test('change camera, show planes', async ({ page, context }) => {
+  const u = getUtils(page)
+  await page.setViewportSize({ width: 1200, height: 500 })
+  await page.goto('/')
+  await u.waitForAuthSkipAppStart()
+  await u.openAndClearDebugPanel()
+
+  const camCmd: EngineCommand = {
+    type: 'modeling_cmd_req',
+    cmd_id: uuidv4(),
+    cmd: {
+      type: 'default_camera_look_at',
+      center: { x: 0, y: 0, z: 0 },
+      up: { x: 0, y: 0, z: 1 },
+      vantage: { x: 0, y: 85, z: 85 },
+    },
+  }
+
+  await u.sendCustomCmd(camCmd)
+  await u.waitForCmdReceive('default_camera_look_at')
+
+  // rotate
+  await u.closeDebugPanel()
+  await page.mouse.move(700, 200)
+  await page.mouse.down({ button: 'right' })
+  await page.mouse.move(600, 300)
+  await page.mouse.up({ button: 'right' })
+
+  await u.openDebugPanel()
+  await u.waitForCmdReceive('camera_drag_end')
+  await page.waitForTimeout(500)
+  await u.clearCommandLogs()
+
+  await page.getByRole('button', { name: 'Start Sketch' }).click()
+
+  await u.waitForDefaultPlanesVisibilityChange()
+  await u.closeDebugPanel()
+
+  await expect(page).toHaveScreenshot({
+    maxDiffPixels: 100,
+  })
+
+  await u.openAndClearDebugPanel()
+  await page.getByRole('button', { name: 'Exit Sketch' }).click()
+  await u.waitForDefaultPlanesVisibilityChange()
+
+  await u.sendCustomCmd(camCmd)
+  await u.waitForCmdReceive('default_camera_look_at')
+
+  await u.clearCommandLogs()
+  await u.closeDebugPanel()
+  // pan
+  await page.keyboard.down('Shift')
+  await page.mouse.move(600, 200)
+  await page.mouse.down({ button: 'right' })
+  await page.mouse.move(700, 200)
+  await page.mouse.up({ button: 'right' })
+  await page.keyboard.up('Shift')
+
+  await u.openDebugPanel()
+  await u.waitForCmdReceive('camera_drag_end')
+  await page.waitForTimeout(300)
+  await u.clearCommandLogs()
+
+  await page.getByRole('button', { name: 'Start Sketch' }).click()
+  await u.waitForDefaultPlanesVisibilityChange()
+  await u.closeDebugPanel()
+
+  await expect(page).toHaveScreenshot({
+    maxDiffPixels: 100,
+  })
+
+  await u.openAndClearDebugPanel()
+  await page.getByRole('button', { name: 'Exit Sketch' }).click()
+  await u.waitForDefaultPlanesVisibilityChange()
+
+  await u.sendCustomCmd(camCmd)
+  await u.waitForCmdReceive('default_camera_look_at')
+
+  await u.clearCommandLogs()
+  await u.closeDebugPanel()
+
+  // zoom
+  await page.keyboard.down('Control')
+  await page.mouse.move(700, 400)
+  await page.mouse.down({ button: 'right' })
+  await page.mouse.move(700, 350)
+  await page.mouse.up({ button: 'right' })
+  await page.keyboard.up('Control')
+
+  await u.openDebugPanel()
+  await u.waitForCmdReceive('camera_drag_end')
+  await page.waitForTimeout(300)
+  await u.clearCommandLogs()
+
+  await page.getByRole('button', { name: 'Start Sketch' }).click()
+  await u.waitForDefaultPlanesVisibilityChange()
+  await u.closeDebugPanel()
+
+  await expect(page).toHaveScreenshot({
+    maxDiffPixels: 100,
+  })
+})
+
+test('exports of each format should work', async ({ page, context }) => {
+  // FYI this test doesn't work with only engine running locally
+  // And you will need to have the KittyCAD CLI installed
+  const u = getUtils(page)
+  await context.addInitScript(async () => {
+    ;(window as any).playwrightSkipFilePicker = true
+    localStorage.setItem(
+      'persistCode',
+      `const topAng = 25
+const bottomAng = 35
+const baseLen = 3.5
+const baseHeight = 1
+const totalHeightHalf = 2
+const armThick = 0.5
+const totalLen = 9.5
+const part001 = startSketchOn('-XZ')
+  |> startProfileAt([0, 0], %)
+  |> yLine(baseHeight, %)
+  |> xLine(baseLen, %)
+  |> angledLineToY({
+        angle: topAng,
+        to: totalHeightHalf,
+        tag: 'seg04'
+      }, %)
+  |> xLineTo({ to: totalLen, tag: 'seg03' }, %)
+  |> yLine({ length: -armThick, tag: 'seg01' }, %)
+  |> angledLineThatIntersects({
+        angle: _180,
+        offset: -armThick,
+        intersectTag: 'seg04'
+      }, %)
+  |> angledLineToY([segAng('seg04', %) + 180, _0], %)
+  |> angledLineToY({
+        angle: -bottomAng,
+        to: -totalHeightHalf - armThick,
+        tag: 'seg02'
+      }, %)
+  |> xLineTo(segEndX('seg03', %) + 0, %)
+  |> yLine(-segLen('seg01', %), %)
+  |> angledLineThatIntersects({
+        angle: _180,
+        offset: -armThick,
+        intersectTag: 'seg02'
+      }, %)
+  |> angledLineToY([segAng('seg02', %) + 180, -baseHeight], %)
+  |> xLineTo(_0, %)
+  |> close(%) 
+  |> extrude(4, %)`
+    )
+  })
+  await page.setViewportSize({ width: 1200, height: 500 })
+  await page.goto('/')
+  await u.waitForAuthSkipAppStart()
+  await u.openDebugPanel()
+  await u.waitForDefaultPlanesVisibilityChange()
+  await u.expectCmdLog('[data-message-type="execution-done"]')
+  await u.waitForCmdReceive('extrude')
+  await page.waitForTimeout(1000)
+  await u.clearAndCloseDebugPanel()
+
+  await page.getByRole('button', { name: APP_NAME }).click()
+
+  interface Paths {
+    modelPath: string
+    imagePath: string
+    outputType: string
+  }
+  const doExport = async (
+    output: Models['OutputFormat_type']
+  ): Promise<Paths> => {
+    await page.getByRole('button', { name: 'Export Model' }).click()
+
+    const exportSelect = page.getByTestId('export-type')
+    await exportSelect.selectOption({ label: output.type })
+
+    if ('storage' in output) {
+      const storageSelect = page.getByTestId('export-storage')
+      await storageSelect.selectOption({ label: output.storage })
+    }
+
+    const downloadPromise = page.waitForEvent('download')
+    await page.getByRole('button', { name: 'Export', exact: true }).click()
+    const download = await downloadPromise
+    const downloadLocationer = (extra = '', isImage = false) =>
+      `./e2e/playwright/export-snapshots/${output.type}-${
+        'storage' in output ? output.storage : ''
+      }${extra}.${isImage ? 'png' : output.type}`
+    const downloadLocation = downloadLocationer()
+    const downloadLocation2 = downloadLocationer('-2')
+
+    if (output.type === 'gltf' && output.storage === 'standard') {
+      // wait for second download
+      const download2 = await page.waitForEvent('download')
+      await download.saveAs(downloadLocation)
+      await download2.saveAs(downloadLocation2)
+
+      // rewrite uri to reference our file name
+      const fileContents = await fsp.readFile(downloadLocation, 'utf-8')
+      const isJson = fileContents.includes('buffers')
+      let contents = fileContents
+      let reWriteLocation = downloadLocation
+      let uri = downloadLocation2.split('/').pop()
+      if (!isJson) {
+        contents = await fsp.readFile(downloadLocation2, 'utf-8')
+        reWriteLocation = downloadLocation2
+        uri = downloadLocation.split('/').pop()
+      }
+      contents = contents.replace(/"uri": ".*"/g, `"uri": "${uri}"`)
+      await fsp.writeFile(reWriteLocation, contents)
+    } else {
+      await download.saveAs(downloadLocation)
+    }
+
+    if (output.type === 'step') {
+      // stable timestamps for step files
+      const fileContents = await fsp.readFile(downloadLocation, 'utf-8')
+      const newFileContents = fileContents.replace(
+        /[0-9]{4}-[0-9]{2}-[0-9]{2}T[0-9]{2}:[0-9]{2}:[0-9]{2}\.[0-9]+[0-9]+[0-9]\+[0-9]{2}:[0-9]{2}/g,
+        '1970-01-01T00:00:00.0+00:00'
+      )
+      await fsp.writeFile(downloadLocation, newFileContents)
+    }
+    return {
+      modelPath: downloadLocation,
+      imagePath: downloadLocationer('', true),
+      outputType: output.type,
+    }
+  }
+  const axisDirectionPair: Models['AxisDirectionPair_type'] = {
+    axis: 'z',
+    direction: 'positive',
+  }
+  const sysType: Models['System_type'] = {
+    forward: axisDirectionPair,
+    up: axisDirectionPair,
+  }
+
+  const exportLocations: Paths[] = []
+
+  // NOTE it was easiest to leverage existing types and have doExport take Models['OutputFormat_type'] as in input
+  // just note that only `type` and `storage` are used for selecting the drop downs is the app
+  // the rest are only there to make typescript happy
+  exportLocations.push(
+    await doExport({
+      type: 'step',
+      coords: sysType,
+    })
+  )
+  exportLocations.push(
+    await doExport({
+      type: 'ply',
+      coords: sysType,
+      selection: { type: 'default_scene' },
+      storage: 'ascii',
+      units: 'in',
+    })
+  )
+  exportLocations.push(
+    await doExport({
+      type: 'ply',
+      storage: 'binary_little_endian',
+      coords: sysType,
+      selection: { type: 'default_scene' },
+      units: 'in',
+    })
+  )
+  exportLocations.push(
+    await doExport({
+      type: 'ply',
+      storage: 'binary_big_endian',
+      coords: sysType,
+      selection: { type: 'default_scene' },
+      units: 'in',
+    })
+  )
+  exportLocations.push(
+    await doExport({
+      type: 'stl',
+      storage: 'ascii',
+      coords: sysType,
+      units: 'in',
+      selection: { type: 'default_scene' },
+    })
+  )
+  exportLocations.push(
+    await doExport({
+      type: 'stl',
+      storage: 'binary',
+      coords: sysType,
+      units: 'in',
+      selection: { type: 'default_scene' },
+    })
+  )
+  exportLocations.push(
+    await doExport({
+      // obj seems to be a little flaky, times out tests sometimes
+      type: 'obj',
+      coords: sysType,
+      units: 'in',
+    })
+  )
+  exportLocations.push(
+    await doExport({
+      type: 'gltf',
+      storage: 'embedded',
+      presentation: 'pretty',
+    })
+  )
+  exportLocations.push(
+    await doExport({
+      type: 'gltf',
+      storage: 'binary',
+      presentation: 'pretty',
+    })
+  )
+
+  // TODO: gltfs don't seem to work with snap shots. push onto exportLocations once it's figured out
+  await doExport({
+    type: 'gltf',
+    storage: 'standard',
+    presentation: 'pretty',
+  })
+
+  // close page to disconnect websocket since we can only have one open atm
+  await page.close()
+
+  // snapshot exports, good compromise to capture that exports are healthy without getting bogged down in "did the formatting change" changes
+  // context: https://github.com/KittyCAD/modeling-app/issues/1222
+  for (const { modelPath, imagePath, outputType } of exportLocations) {
+    const cliCommand = `export KITTYCAD_TOKEN=${secrets.snapshottoken} && kittycad file snapshot --output-format=png --src-format=${outputType} ${modelPath} ${imagePath}`
+    const child = spawn(cliCommand, { shell: true })
+    await new Promise((resolve, reject) => {
+      child.on('error', (code: any, msg: any) => {
+        console.log('error', code, msg)
+        reject()
+      })
+      child.on('exit', (code, msg) => {
+        console.log('exit', code, msg)
+        if (code !== 0) {
+          reject(`exit code ${code} for model ${modelPath}`)
+        } else {
+          resolve(true)
+        }
+      })
+      child.stderr.on('data', (data) => console.log(`stderr: ${data}`))
+      child.stdout.on('data', (data) => console.log(`stdout: ${data}`))
+    })
+  }
+})

e2e/playwright/test-utils.ts

@@ -0,0 +1,156 @@
+import { expect, Page } from '@playwright/test'
+import { EngineCommand } from '../../src/lang/std/engineConnection'
+import fsp from 'fs/promises'
+import pixelMatch from 'pixelmatch'
+import { PNG } from 'pngjs'
+
+async function waitForPageLoad(page: Page) {
+  // wait for 'Loading stream...' spinner
+  await page.getByTestId('loading-stream').waitFor()
+  // wait for all spinners to be gone
+  await page.getByTestId('loading').waitFor({ state: 'detached' })
+
+  await page.getByTestId('start-sketch').waitFor()
+}
+
+async function removeCurrentCode(page: Page) {
+  const hotkey = process.platform === 'darwin' ? 'Meta' : 'Control'
+  await page.click('.cm-content')
+  await page.keyboard.down(hotkey)
+  await page.keyboard.press('a')
+  await page.keyboard.up(hotkey)
+  await page.keyboard.press('Backspace')
+  await expect(page.locator('.cm-content')).toHaveText('')
+}
+
+async function sendCustomCmd(page: Page, cmd: EngineCommand) {
+  await page.fill('[data-testid="custom-cmd-input"]', JSON.stringify(cmd))
+  await page.click('[data-testid="custom-cmd-send-button"]')
+}
+
+async function clearCommandLogs(page: Page) {
+  await page.click('[data-testid="clear-commands"]')
+}
+
+async function expectCmdLog(page: Page, locatorStr: string) {
+  await expect(page.locator(locatorStr)).toBeVisible()
+}
+
+async function waitForDefaultPlanesToBeVisible(page: Page) {
+  await page.waitForFunction(
+    () =>
+      document.querySelectorAll('[data-receive-command-type="object_visible"]')
+        .length >= 3
+  )
+}
+
+async function openDebugPanel(page: Page) {
+  const isOpen =
+    (await page
+      .locator('[data-testid="debug-panel"]')
+      ?.getAttribute('open')) === ''
+
+  if (!isOpen) {
+    await page.getByText('Debug').click()
+    await page.getByTestId('debug-panel').and(page.locator('[open]')).waitFor()
+  }
+}
+
+async function closeDebugPanel(page: Page) {
+  const isOpen =
+    (await page.getByTestId('debug-panel')?.getAttribute('open')) === ''
+  if (isOpen) {
+    await page.getByText('Debug').click()
+    await page
+      .getByTestId('debug-panel')
+      .and(page.locator(':not([open])'))
+      .waitFor()
+  }
+}
+
+async function waitForCmdReceive(page: Page, commandType: string) {
+  return page
+    .locator(`[data-receive-command-type="${commandType}"]`)
+    .first()
+    .waitFor()
+}
+
+export function getUtils(page: Page) {
+  return {
+    waitForAuthSkipAppStart: () => waitForPageLoad(page),
+    removeCurrentCode: () => removeCurrentCode(page),
+    sendCustomCmd: (cmd: EngineCommand) => sendCustomCmd(page, cmd),
+    clearCommandLogs: () => clearCommandLogs(page),
+    expectCmdLog: (locatorStr: string) => expectCmdLog(page, locatorStr),
+    waitForDefaultPlanesVisibilityChange: () =>
+      waitForDefaultPlanesToBeVisible(page),
+    openDebugPanel: () => openDebugPanel(page),
+    closeDebugPanel: () => closeDebugPanel(page),
+    openAndClearDebugPanel: async () => {
+      await openDebugPanel(page)
+      return clearCommandLogs(page)
+    },
+    clearAndCloseDebugPanel: async () => {
+      await clearCommandLogs(page)
+      return closeDebugPanel(page)
+    },
+    waitForCmdReceive: (commandType: string) =>
+      waitForCmdReceive(page, commandType),
+    doAndWaitForCmd: async (
+      fn: () => Promise<void>,
+      commandType: string,
+      endWithDebugPanelOpen = true
+    ) => {
+      await openDebugPanel(page)
+      await clearCommandLogs(page)
+      await closeDebugPanel(page)
+      await fn()
+      await openDebugPanel(page)
+      await waitForCmdReceive(page, commandType)
+      if (!endWithDebugPanelOpen) {
+        await closeDebugPanel(page)
+      }
+    },
+    doAndWaitForImageDiff: (fn: () => Promise<any>, diffCount = 200) =>
+      new Promise(async (resolve) => {
+        await page.screenshot({
+          path: './e2e/playwright/temp1.png',
+          fullPage: true,
+        })
+        await fn()
+        const isImageDiff = async () => {
+          await page.screenshot({
+            path: './e2e/playwright/temp2.png',
+            fullPage: true,
+          })
+          const screenshot1 = PNG.sync.read(
+            await fsp.readFile('./e2e/playwright/temp1.png')
+          )
+          const screenshot2 = PNG.sync.read(
+            await fsp.readFile('./e2e/playwright/temp2.png')
+          )
+          const actualDiffCount = pixelMatch(
+            screenshot1.data,
+            screenshot2.data,
+            null,
+            screenshot1.width,
+            screenshot2.height
+          )
+          return actualDiffCount > diffCount
+        }
+
+        // run isImageDiff every 50ms until it returns true or 5 seconds have passed (100 times)
+        let count = 0
+        const interval = setInterval(async () => {
+          count++
+          if (await isImageDiff()) {
+            clearInterval(interval)
+            resolve(true)
+          } else if (count > 100) {
+            clearInterval(interval)
+            resolve(false)
+          }
+        }, 50)
+      }),
+  }
+}

e2e/tauri/specs/auth.e2e.ts

@@ -0,0 +1,107 @@
+import { browser, $, expect } from '@wdio/globals'
+import fs from 'fs/promises'
+
+const defaultDir = `${process.env.HOME}/Documents/zoo-modeling-app-projects`
+const userCodeDir = '/tmp/kittycad_user_code'
+
+async function click(element: WebdriverIO.Element): Promise<void> {
+  // Workaround for .click(), see https://github.com/tauri-apps/tauri/issues/6541
+  await element.waitForClickable()
+  await browser.execute('arguments[0].click();', element)
+}
+
+describe('ZMA (Tauri, Linux)', () => {
+  it('opens the auth page and signs in', async () => {
+    // Clean up filesystem from previous tests
+    await new Promise((resolve) => setTimeout(resolve, 100))
+    await fs.rm(defaultDir, { force: true, recursive: true })
+    await fs.rm(userCodeDir, { force: true })
+
+    const signInButton = await $('[data-testid="sign-in-button"]')
+    expect(await signInButton.getText()).toEqual('Sign in')
+
+    await click(signInButton)
+    await new Promise((resolve) => setTimeout(resolve, 2000))
+
+    // Get from main.rs
+    const userCode = await (
+      await fs.readFile('/tmp/kittycad_user_code')
+    ).toString()
+    console.log(`Found user code ${userCode}`)
+
+    // Device flow: verify
+    const token = process.env.KITTYCAD_API_TOKEN
+    const headers = {
+      Authorization: `Bearer ${token}`,
+      Accept: 'application/json',
+      'Content-Type': 'application/json',
+    }
+    const apiBaseUrl = process.env.VITE_KC_API_BASE_URL
+    const verifyUrl = `${apiBaseUrl}/oauth2/device/verify?user_code=${userCode}`
+    console.log(`GET ${verifyUrl}`)
+    const vr = await fetch(verifyUrl, { headers })
+    console.log(vr.status)
+
+    // Device flow: confirm
+    const confirmUrl = `${apiBaseUrl}/oauth2/device/confirm`
+    const data = JSON.stringify({ user_code: userCode })
+    console.log(`POST ${confirmUrl} ${data}`)
+    const cr = await fetch(confirmUrl, {
+      headers,
+      method: 'POST',
+      body: data,
+    })
+    console.log(cr.status)
+
+    // Now should be signed in
+    const newFileButton = await $('[data-testid="home-new-file"]')
+    expect(await newFileButton.getText()).toEqual('New file')
+  })
+
+  it('opens the settings page, checks filesystem settings, and closes the settings page', async () => {
+    const menuButton = await $('[data-testid="user-sidebar-toggle"]')
+    await click(menuButton)
+
+    const settingsButton = await $('[data-testid="settings-button"]')
+    await click(settingsButton)
+
+    const defaultDirInput = await $('[data-testid="default-directory-input"]')
+    expect(await defaultDirInput.getValue()).toEqual(defaultDir)
+
+    const nameInput = await $('[data-testid="name-input"]')
+    expect(await nameInput.getValue()).toEqual('project-$nnn')
+
+    const closeButton = await $('[data-testid="close-button"]')
+    await click(closeButton)
+  })
+
+  it('checks that no file exists, creates a new file', async () => {
+    const homeSection = await $('[data-testid="home-section"]')
+    expect(await homeSection.getText()).toContain('No Projects found')
+
+    const newFileButton = await $('[data-testid="home-new-file"]')
+    await click(newFileButton)
+    await new Promise((resolve) => setTimeout(resolve, 1000))
+
+    expect(await homeSection.getText()).toContain('project-000')
+  })
+
+  it('opens the new file and expects an error on Linux', async () => {
+    const projectLink = await $('[data-testid="project-link"]')
+    await click(projectLink)
+    const error = await $('h3')
+    expect(await error.getText()).toContain(
+      "Can't find variable: RTCPeerConnection"
+    )
+    await browser.execute('window.location.href = "tauri://localhost/home"')
+  })
+
+  it('signs out', async () => {
+    const menuButton = await $('[data-testid="user-sidebar-toggle"]')
+    await click(menuButton)
+    const signoutButton = await $('[data-testid="user-sidebar-sign-out"]')
+    await click(signoutButton)
+    const newSignInButton = await $('[data-testid="sign-in-button"]')
+    expect(await newSignInButton.getText()).toEqual('Sign in')
+  })
+})

index.html

@@ -0,0 +1,27 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <link rel="icon" href="/favicon.ico" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <meta name="theme-color" content="#000000" />
+    <meta
+      name="description"
+      content="An open-source CAD modeling tool from the future by Zoo."
+    />
+    <link rel="apple-touch-icon" href="/logo192.png" />
+    <link rel="manifest" href="/manifest.json" />
+    <link rel="stylesheet" href="https://use.typekit.net/zzv8rvm.css" />
+    <script
+      defer
+      data-domain="app.zoo.dev"
+      src="https://plausible.corp.zoo.dev/js/script.js"
+    ></script>
+    <title>Zoo Modeling App</title>
+  </head>
+  <body class="body-bg">
+    <noscript>You need to enable JavaScript to run this app.</noscript>
+    <div id="root" class="h-screen overflow-y-auto"></div>
+    <script type="module" src="/src/index.tsx"></script>
+  </body>
+</html>

package.json

@@ -1,61 +1,88 @@
 {
   "name": "untitled-app",
-  "version": "0.1.0",
+  "version": "0.14.0",
   "private": true,
   "dependencies": {
-    "@codemirror/lang-javascript": "^6.1.1",
-    "@headlessui/react": "^1.7.13",
-    "@react-three/drei": "^9.42.0",
-    "@react-three/fiber": "^8.9.1",
+    "@codemirror/autocomplete": "^6.10.2",
+    "@fortawesome/fontawesome-svg-core": "^6.4.2",
+    "@fortawesome/free-brands-svg-icons": "^6.4.2",
+    "@fortawesome/free-solid-svg-icons": "^6.4.2",
+    "@fortawesome/react-fontawesome": "^0.2.0",
+    "@headlessui/react": "^1.7.17",
+    "@headlessui/tailwindcss": "^0.2.0",
+    "@kittycad/lib": "^0.0.46",
+    "@lezer/javascript": "^1.4.9",
+    "@open-rpc/client-js": "^1.8.1",
+    "@react-hook/resize-observer": "^1.2.6",
+    "@replit/codemirror-interact": "^6.3.0",
+    "@sentry/react": "^7.77.0",
+    "@tauri-apps/api": "^1.5.1",
     "@testing-library/jest-dom": "^5.14.1",
-    "@testing-library/react": "^13.0.0",
-    "@testing-library/user-event": "^13.2.1",
-    "@types/jest": "^27.0.1",
+    "@testing-library/react": "^14.0.0",
+    "@testing-library/user-event": "^14.5.1",
+    "@ts-stack/markdown": "^1.5.0",
     "@types/node": "^16.7.13",
-    "@types/react": "^18.0.0",
+    "@types/react": "^18.2.41",
     "@types/react-dom": "^18.0.0",
-    "@uiw/react-codemirror": "^4.15.1",
-    "allotment": "^1.17.0",
+    "@uiw/react-codemirror": "^4.21.20",
+    "@xstate/inspect": "^0.8.0",
+    "@xstate/react": "^3.2.2",
+    "crypto-js": "^4.2.0",
+    "debounce-promise": "^3.1.2",
+    "formik": "^2.4.3",
+    "fuse.js": "^7.0.0",
     "http-server": "^14.1.1",
+    "json-rpc-2.0": "^1.6.0",
+    "re-resizable": "^6.9.11",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
+    "react-hot-toast": "^2.4.1",
+    "react-hotkeys-hook": "^4.4.1",
     "react-json-view": "^1.21.3",
+    "react-modal": "^3.16.1",
     "react-modal-promise": "^1.0.2",
-    "react-scripts": "5.0.1",
-    "sketch-helpers": "^0.0.2",
-    "swr": "^2.0.4",
-    "three": "^0.146.0",
-    "typescript": "^4.4.2",
-    "util": "^0.12.5",
-    "uuid": "^9.0.0",
-    "wasm-pack": "^0.11.1",
-    "web-vitals": "^2.1.0",
-    "zustand": "^4.1.4"
+    "react-router-dom": "^6.14.2",
+    "sketch-helpers": "^0.0.4",
+    "swr": "^2.2.2",
+    "tauri-plugin-fs-extra-api": "https://github.com/tauri-apps/tauri-plugin-fs-extra#v1",
+    "toml": "^3.0.0",
+    "ts-node": "^10.9.1",
+    "typescript": "^5.2.2",
+    "uuid": "^9.0.1",
+    "vitest": "^0.34.6",
+    "vscode-jsonrpc": "^8.1.0",
+    "vscode-languageserver-protocol": "^3.17.5",
+    "wasm-pack": "^0.12.1",
+    "web-vitals": "^3.5.0",
+    "ws": "^8.13.0",
+    "xstate": "^4.38.2",
+    "zustand": "^4.4.5"
   },
   "scripts": {
-    "start": "react-scripts start",
-    "build": "curl --proto '=https' --tlsv1.2 -sSf https://sh.rustup.rs | sh -s -- -y && source \"$HOME/.cargo/env\" && curl https://rustwasm.github.io/wasm-pack/installer/init.sh -sSf | sh -s -- -y && yarn build:wasm:ci && react-scripts build",
-    "build:local": "react-scripts build",
-    "build:both": "react-scripts build",
-    "build:both:local": "yarn build:wasm && react-scripts build",
-    "test": "react-scripts test",
-    "test:nowatch": "react-scripts test --watchAll=false",
-    "test:rust": "(cd src/wasm-lib && cargo test && cargo clippy)",
-    "test:cov": "react-scripts test --watchAll=false --coverage=true",
-    "simpleserver:ci": "http-server ./public --cors -p 3000 &",
-    "simpleserver": "http-server ./public --cors -p 3000",
-    "eject": "react-scripts eject",
-    "fmt": "prettier --write ./src/**/*.{ts,tsx,js}",
-    "remove-importmeta": "sed -i '' 's/import.meta.url//g' \"./src/wasm-lib/pkg/wasm_lib.js\"",
-    "remove-importmeta:ci": "sed -i 's/import.meta.url//g' \"./src/wasm-lib/pkg/wasm_lib.js\"",
-    "add-missing-import": "echo \"import util from 'util'; if (typeof window !== 'undefined' && !window.TextEncoder) { window.TextEncoder = util.TextEncoder; window.TextDecoder = util.TextDecoder}\" | cat - ./src/wasm-lib/pkg/wasm_lib.js > temp && mv temp ./src/wasm-lib/pkg/wasm_lib.js",
-    "build:wasm:ci": "mkdir src/wasm-lib/pkg; cd src/wasm-lib && wasm-pack build --target web --out-dir pkg && cd ../../ && cp src/wasm-lib/pkg/wasm_lib_bg.wasm public && yarn remove-importmeta:ci && yarn add-missing-import && yarn fmt",
-    "build:wasm": "mkdir src/wasm-lib/pkg; cd src/wasm-lib && wasm-pack build --target web --out-dir pkg && cd ../../ && cp src/wasm-lib/pkg/wasm_lib_bg.wasm public && yarn remove-importmeta && yarn add-missing-import && yarn fmt"
-  },
-  "jest": {
-    "transformIgnorePatterns": [
-      "node_modules/(?!(three|allotment)/)"
-    ]
+    "start": "vite",
+    "start:prod": "vite preview --port=3000",
+    "serve": "vite serve --port=3000",
+    "build": "curl --proto '=https' --tlsv1.2 -sSf https://sh.rustup.rs | sh -s -- -y && source \"$HOME/.cargo/env\" && curl https://rustwasm.github.io/wasm-pack/installer/init.sh -sSf | sh -s -- -y && yarn build:wasm && vite build",
+    "build:local": "vite build",
+    "build:both": "vite build",
+    "build:both:local": "yarn build:wasm && vite build",
+    "pretest": "yarn remove-importmeta",
+    "test": "vitest --mode development",
+    "test:nowatch": "vitest run --mode development",
+    "test:rust": "(cd src/wasm-lib && cargo test --all && cargo clippy --all --tests --benches)",
+    "test:cov": "vitest run --coverage --mode development",
+    "test:e2e:tauri": "E2E_TAURI_ENABLED=true TS_NODE_COMPILER_OPTIONS='{\"module\": \"commonjs\"}' wdio run wdio.conf.ts",
+    "simpleserver:ci": "yarn pretest && http-server ./public --cors -p 3000 &",
+    "simpleserver": "yarn pretest && http-server ./public --cors -p 3000",
+    "fmt": "prettier --write ./src && prettier --write ./e2e",
+    "fmt-check": "prettier --check ./src && prettier --check ./e2e",
+    "build:wasm-dev": "(cd src/wasm-lib && wasm-pack build --dev --target web --out-dir pkg && cargo test -p kcl-lib export_bindings) && cp src/wasm-lib/pkg/wasm_lib_bg.wasm public && yarn fmt",
+    "build:wasm": "(cd src/wasm-lib && wasm-pack build --target web --out-dir pkg && cargo test -p kcl-lib export_bindings) && cp src/wasm-lib/pkg/wasm_lib_bg.wasm public && yarn fmt",
+    "build:wasm-clean": "yarn wasm-prep && yarn build:wasm",
+    "remove-importmeta": "sed -i 's/import.meta.url/window.location.origin/g' \"./src/wasm-lib/pkg/wasm_lib.js\"; sed -i '' 's/import.meta.url/window.location.origin/g' \"./src/wasm-lib/pkg/wasm_lib.js\" || echo \"sed for both mac and linux\"",
+    "wasm-prep": "rm -rf src/wasm-lib/pkg && mkdir src/wasm-lib/pkg && rm -rf src/wasm-lib/kcl/bindings",
+    "lint": "eslint --fix src",
+    "bump-jsons": "echo \"$(jq --arg v \"$VERSION\" '.version=$v' package.json --indent 2)\" > package.json && echo \"$(jq --arg v \"$VERSION\" '.package.version=$v' src-tauri/tauri.conf.json --indent 2)\" > src-tauri/tauri.conf.json"
   },
   "prettier": {
     "trailingComma": "es5",
@@ -63,18 +90,6 @@
     "semi": false,
     "singleQuote": true
   },
-  "eslintConfig": {
-    "extends": [
-      "react-app",
-      "react-app/jest"
-    ],
-    "rules": {
-      "semi": [
-        "error",
-        "never"
-      ]
-    }
-  },
   "browserslist": {
     "production": [
       ">0.2%",
@@ -88,14 +103,43 @@
     ]
   },
   "devDependencies": {
-    "@tauri-apps/cli": "^1.3.1",
+    "@babel/plugin-proposal-private-property-in-object": "^7.21.11",
+    "@babel/preset-env": "^7.23.3",
+    "@playwright/test": "^1.39.0",
+    "@tauri-apps/cli": "^1.5.6",
     "@types/crypto-js": "^4.1.1",
-    "@types/three": "^0.146.0",
+    "@types/debounce-promise": "^3.1.8",
+    "@types/isomorphic-fetch": "^0.0.36",
+    "@types/pixelmatch": "^5.2.6",
+    "@types/pngjs": "^6.0.4",
+    "@types/react-modal": "^3.16.3",
+    "@types/uuid": "^9.0.4",
+    "@types/wait-on": "^5.3.4",
+    "@types/wicg-file-system-access": "^2020.9.6",
+    "@types/ws": "^8.5.5",
+    "@vitejs/plugin-react": "^4.1.1",
+    "@vitest/coverage-istanbul": "^0.34.6",
+    "@wdio/cli": "^8.24.3",
+    "@wdio/globals": "^8.24.3",
+    "@wdio/local-runner": "^8.24.3",
+    "@wdio/mocha-framework": "^8.24.3",
+    "@wdio/spec-reporter": "^8.24.2",
     "autoprefixer": "^10.4.13",
-    "postcss": "^8.4.19",
+    "eslint": "^8.53.0",
+    "eslint-config-react-app": "^7.0.1",
+    "eslint-plugin-css-modules": "^2.12.0",
+    "happy-dom": "^10.8.0",
+    "husky": "^8.0.3",
+    "pixelmatch": "^5.3.0",
+    "pngjs": "^7.0.0",
+    "postcss": "^8.4.31",
     "prettier": "^2.8.0",
     "setimmediate": "^1.0.5",
-    "tailwindcss": "^3.2.4",
+    "tailwindcss": "^3.3.6",
+    "vite": "^4.5.2",
+    "vite-plugin-eslint": "^1.8.1",
+    "vite-tsconfig-paths": "^4.2.1",
+    "wait-on": "^7.2.0",
     "yarn": "^1.22.19"
   }
 }

playwright.config.ts

@@ -0,0 +1,82 @@
+import { defineConfig, devices } from '@playwright/test';
+
+/**
+ * Read environment variables from file.
+ * https://github.com/motdotla/dotenv
+ */
+// require('dotenv').config();
+
+/**
+ * See https://playwright.dev/docs/test-configuration.
+ */
+export default defineConfig({
+  testDir: './e2e/playwright',
+  /* Run tests in files in parallel */
+  fullyParallel: true,
+  /* 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. */
+  workers: process.env.CI ? 1 : 1,
+  /* Reporter to use. See https://playwright.dev/docs/test-reporters */
+  reporter: 'html',
+  /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
+  use: {
+    /* Base URL to use in actions like `await page.goto('/')`. */
+    baseURL: 'http://localhost:3000',
+
+    /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
+    trace: 'on-first-retry',
+  },
+
+  /* Configure projects for major browsers */
+  projects: [
+    {
+      name: 'Google Chrome',
+      use: { ...devices['Desktop Chrome'], channel: 'chrome' }, // or 'chrome-beta'
+    },
+    {
+      name: 'webkit',
+      use: { ...devices['Desktop Safari'] },
+    },
+    // {
+    //   name: 'firefox',
+    //   use: { ...devices['Desktop Firefox'] },
+    // },
+    // {
+    //   name: 'chromium', // compat issue with encoding atm, so we're using the branded 'Google Chrome' instead
+    //   use: { ...devices['Desktop Chrome'] },
+    // },
+
+
+
+    /* Test against mobile viewports. */
+    // {
+    //   name: 'Mobile Chrome',
+    //   use: { ...devices['Pixel 5'] },
+    // },
+    // {
+    //   name: 'Mobile Safari',
+    //   use: { ...devices['iPhone 12'] },
+    // },
+
+    /* Test against branded browsers. */
+    // {
+    //   name: 'Microsoft Edge',
+    //   use: { ...devices['Desktop Edge'], channel: 'msedge' },
+    // },
+    // {
+    //   name: 'Google Chrome',
+    //   use: { ...devices['Desktop Chrome'], channel: 'chrome' },
+    // },
+  ],
+
+  /* Run your local dev server before starting the tests */
+  webServer: {
+    command: 'yarn serve',
+    // url: 'http://127.0.0.1:3000',
+    reuseExistingServer: !process.env.CI,
+  },
+});
+

public/expectations.md

@@ -0,0 +1,42 @@
+## Alpha Users Expectations
+
+### Welcome
+
+First off, thank you so much for your interest in being a part of the closed Alpha program! We are thrilled to have others use our product and see what you build with it (and truthfully, how you break it too).
+
+### Zoo Modeling App (ZMA)
+
+What we are introducing to you is our Zoo Modeling App (ZMA). ZMA is a CAD application that expresses a hybrid style of traditional CAD interface along with a code-CAD interface. ZMA is a great way for us to test our own APIs as well as inspire others to develop their own applications.
+
+### Why Code?
+
+Plenty of you have professional CAD experience, and may not understand why coding your model would be helpful. The "code-CAD" paradigm isn’t as popular as traditional CAD programs (SolidWorks, NX, CREO, OnShape, etc.), but it certainly has its benefits. Some benefits include:
+
+- Automation and parametric design
+- Customization and flexibility
+- Algorithmic and generative design
+- Reproducibility
+- Easier integration with other tools
+
+### Before You Use ZMA
+
+Before you dive straight into the app, we wanted to lay some expectations out for you. 
+
+- ZMA is in early development. Kurt pitched the idea back in January, and the team has been working hard on it since then. ZMA has really basic CAD features for now, but we have plenty of features on our roadmap. Most of the features that you may be currently used to in your CAD workflow today will be available down the road.
+- For a list of all scripting functions, please reference our [documentation](https://github.com/KittyCAD/modeling-app/blob/main/docs/kcl/std.md). For a basic rundown of our types, please reference [this document](https://github.com/KittyCAD/modeling-app/blob/main/docs/kcl/types.md).
+- With that being said, we have created an external new features list in [GH Discussions](https://github.com/KittyCAD/modeling-app/discussions). For our current priority list, please click [here](https://github.com/KittyCAD/modeling-app/blob/main/public/roadmap.md). Please upvote any features in the GH Discussions page that you would like to see implemented first. We will prioritize the highest upvoted items or items that are foundational for other features on the list. You can also add your own, but we will review it to make sure it’s not a duplicate or it’s feasible for the current state of the app.
+- Please report any and all bugs/issues you find. Even the smallest bugs are important! You can report them in a GH Issue [here](https://github.com/KittyCAD/modeling-app/issues/new). You are more than welcome to link your GH Issue in the **bugs** section of our Discord, but if you want to discuss the bug further, please keep that in the GH Issue thread. Please include the severity of the bug in your GH Issue ticket (High, Medium, or Low). If you are having trouble deciding what severity the bug is, use this guideline:
+    - **High:** The bug is blocking you from continuing.
+        - Example: Every time I click the extrude button with two faces selected, the app crashes.
+    - **Medium:** You can find a workaround to the problem, but it increases your time spent working or makes it unenjoyable.
+        - Example: When the app is full screen on Mac, the settings are not showing properly. It works if I have the app windowed.
+    - **Low:** The bug is annoying but doesn’t affect workflow or block you from continuing (usually you can say “It would be nice if ___, but it’s not needed”)
+        - Example:  It would be nice if the camera would orient normal to the sketching surface when I select a face/plane and click “sketch”.
+- We want you all to be aware that we may reach out to you in regard to issues, bugs, problems, and satisfaction. This will typically be for further clarification so we can really nail things down.
+
+### Discord
+We will be using Discord a lot more now that the Alpha has been released to people outside of the company. Please feel free to discuss and talk with us in the **alpha users** section of the server. We highly encourage you to engage with us on Discord!
+
+### Thank You!
+
+Once again, from all of us to you, thank you for being a part of the closed Alpha. We are happy to chat with you all, hear your feedback, and see some of your projects!

public/index.html

@@ -1,43 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-  <head>
-    <meta charset="utf-8" />
-    <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
-    <meta name="viewport" content="width=device-width, initial-scale=1" />
-    <meta name="theme-color" content="#000000" />
-    <meta
-      name="description"
-      content="Web site created using create-react-app"
-    />
-    <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
-    <!--
-      manifest.json provides metadata used when your web app is installed on a
-      user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
-    -->
-    <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
-    <!--
-      Notice the use of %PUBLIC_URL% in the tags above.
-      It will be replaced with the URL of the `public` folder during the build.
-      Only files inside the `public` folder can be referenced from the HTML.
-
-      Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
-      work correctly both with client-side routing and a non-root public URL.
-      Learn how to configure a non-root public URL by running `npm run build`.
-    -->
-    <title>React App</title>
-  </head>
-  <body>
-    <noscript>You need to enable JavaScript to run this app.</noscript>
-    <div id="root"></div>
-    <!--
-      This HTML file is a template.
-      If you open it directly in the browser, you will see an empty page.
-
-      You can add webfonts, meta tags, or analytics to this file.
-      The build step will place the bundled scripts into the <body> tag.
-
-      To begin the development, run `npm start` or `yarn start`.
-      To create a production bundle, use `npm run build` or `yarn build`.
-    -->
-  </body>
-</html>

public/kcl-icon.svg

@@ -0,0 +1,3 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M40 0H0V40H40V0ZM7.34715 27.2143V15.6577L2.976 15.987V36.7949H7.34715V32.0645L8.00582 31.5256C8.24533 31.326 8.47487 31.1264 8.69442 30.9268L12.1075 36.7949H17.0475C16.1893 35.3978 15.311 33.9906 14.4128 32.5735C13.5346 31.1563 12.6664 29.7392 11.8081 28.3221L15.8499 24.9389C15.4308 24.4399 15.0017 23.931 14.5625 23.412L13.3051 21.8552L7.34715 27.2143ZM22.2581 26.6754C22.8769 25.9169 23.6753 25.5377 24.6533 25.5377C25.272 25.5377 25.8309 25.6175 26.3299 25.7772C26.8289 25.9169 27.4177 26.1465 28.0963 26.4658L29.3238 23.3521C28.5853 22.7933 27.7371 22.4041 26.779 22.1845C25.8409 21.9649 25.0625 21.8552 24.4437 21.8552C22.0885 21.8552 20.2223 22.5537 18.845 23.9509C17.4878 25.3281 16.8092 27.1944 16.8092 29.5496C16.8092 31.9048 17.4878 33.7611 18.845 35.1183C20.2223 36.4756 22.0885 37.1542 24.4437 37.1542C25.0625 37.1542 25.8509 37.0444 26.8089 36.8249C27.767 36.6053 28.6053 36.2161 29.3238 35.6572L28.0963 32.5435C27.4177 32.8629 26.8289 33.0924 26.3299 33.2321C25.8309 33.3718 25.272 33.4417 24.6533 33.4417C23.6753 33.4417 22.8769 33.0924 22.2581 32.3938C21.6594 31.6753 21.36 30.7272 21.36 29.5496C21.36 28.372 21.6594 27.4139 22.2581 26.6754ZM36.2796 36.7949V15.6577L31.9085 15.987V36.7949H36.2796Z" fill="#D0FF00"/>
+</svg>

public/kitt-8bit-winking.svg

@@ -0,0 +1,37 @@
+<svg width="25" height="34" viewBox="0 0 25 34" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M3 31V30H1V29H0V8H1V7H2V6H3V5H4V4H21V5H22V6H23V7H24V8H25V29H24V30H22V31H19V32H20V34H14V32H15V31H10V32H11V34H5V32H6V31H3Z" fill="#101412"/>
+<path d="M6 31V29.5H10V31H9V32H10V33H6V32H7V31H6Z" fill="#4B4862"/>
+<path d="M15 31V29.5H19V31H18V32H19V33H15V32H16V31H15Z" fill="#4B4862"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M1 24.5V29H3V30H22V29H24V24.5H1ZM9 29V27H16V29H9Z" fill="#9BADB7"/>
+<path d="M1 25V23H24V25H1Z" fill="#BECAD0"/>
+<path d="M2 27V26H7V27H2Z" fill="#2B3E48"/>
+<path d="M4 29V28H7V29H4Z" fill="#2B3E48"/>
+<path d="M18 27V26H19V27H18Z" fill="#2B3E48"/>
+<path d="M20 27V26H21V27H20Z" fill="#2B3E48"/>
+<path d="M22 27V26H23V27H22Z" fill="#2B3E48"/>
+<path d="M18 29V28H21V29H18Z" fill="#2B3E48"/>
+<path d="M22 7V6H21V5H4V6H3V7H2V8H1V10H24V8H23V7H22Z" fill="#FBF580"/>
+<path d="M1 24V22H24V24H1Z" fill="#AEAA4C"/>
+<path d="M24 9H1V23H24V9Z" fill="#E5E3A1"/>
+<path d="M4 12V11H21V12H22V20H21V21H4V20H3V12H4Z" fill="#1F2320"/>
+<rect x="10" y="5" width="5" height="2" fill="#AEAA4C"/>
+<path d="M16 13V12H18V16H17L16 13Z" fill="#DBFF3C"/>
+<path d="M11 16H14V17H13V19H16V18H17V19H16V20H9V19H8V18H9V19H12V17H11V16Z" fill="#DBFF3C"/>
+<path d="M9 15V14H6V15H5V14H6V13H9V14H10V15H9Z" fill="#DBFF3C"/>
+<path d="M4 7V6H5V4H6V2H7V1H8V2H9V4H10V6H11V7H4Z" fill="#DBFF3C"/>
+<path d="M21 6V7H14V6H15V4H16V2H17V1H18V2H19V4H20V6H21Z" fill="#DBFF3C"/>
+<path d="M16 2V0H19V2H20V4H21V5.5H20V4H19V2H18V1H17V2H16V4H15V5.5H14V4H15V2H16Z" fill="#92C51B"/>
+<path d="M6 2V0H9V2H10V4H11V5.5H10V4H9V2H8V1H7V2H6V4H5V5.5H4V4H5V2H6Z" fill="#92C51B"/>
+<rect x="11" y="6" width="3" height="1" fill="#D0CC6A"/>
+<path d="M16 7V6H17V5H18V6H19V7H16Z" fill="#76AA1D"/>
+<path d="M7 6V5H8V6H9V7H6V6H7Z" fill="#76AA1D"/>
+<path d="M21 7V6H20V5H21V6H22V7H21Z" fill="#76AA1D"/>
+<path d="M4 6V7H3V6H4V5H5V6H4Z" fill="#76AA1D"/>
+<path d="M10 5H11V6H12V7H11V6H10V5Z" fill="#76AA1D"/>
+<path d="M14 5H15V6H14V7H13V6H14V5Z" fill="#76AA1D"/>
+<path d="M17 13H16V16H17V13Z" fill="#92C51B"/>
+<path d="M2 25V23H1V25H2Z" fill="#D0CC6A"/>
+<path d="M23 25V23H24V25H23Z" fill="#D0CC6A"/>
+<path d="M4 24V23H7V24H4Z" fill="#D56161"/>
+<path d="M4 25V24H7V25H4Z" fill="#AC3232"/>
+</svg>

public/kitt-arcade-winking.svg

@@ -0,0 +1,18 @@
+<svg width="25" height="34" viewBox="0 0 25 34" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M3 31V30H1V29H0V8H1V7H2V6H3V5H4V3H5V2H6V1H7V0H8V1H9V2H10V3H11V4H14V3H15V2H16V1H17V0H18V1H19V2H20V3H21V5H22V6H23V7H24V8H25V29H24V30H22V31H19V32H20V34H14V32H15V31H10V32H11V34H5V32H6V31H3Z" fill="#101412"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M11 5H14V4H15V3H16V2H17V1H18V2H19V3H20V5H21V6H22V7H23V8H24V9V10V23V24V25V29H22V30H18V31V32H19V33H15V32H16V31V30H9V31V32H10V33H6V32H7V31V30H3V29H1V25V24V23V10V9V8H2V7H3V6H4V5H5V3H6V2H7V1H8V2H9V3H10V4H11V5ZM2 26V27H7V26H2ZM4 28V29H7V28H4ZM18 27V26H19V27H18ZM20 26V27H21V26H20ZM22 27V26H23V27H22ZM18 28V29H21V28H18ZM9 27H16V29H9V27Z" fill="#D0FF00"/>
+<path d="M1 24V23H24V24H1Z" fill="#B1E515"/>
+<path d="M4 12V11H21V12H22V20H21V21H4V20H3V12H4Z" fill="#1F2320"/>
+<path d="M16 16V12H18V16H16Z" fill="#D0FF00"/>
+<path d="M11 16H14V17H13V19H16V18H17V19H16V20H9V19H8V18H9V19H12V17H11V16Z" fill="#D0FF00"/>
+<path d="M9 15V14H6V15H5V14H6V13H9V14H10V15H9Z" fill="#D0FF00"/>
+<path d="M22 8V7H23V8H22Z" fill="#B1E515"/>
+<path d="M3 8V7H2V8H3Z" fill="#B1E515"/>
+<path d="M21 7V6H22V7H21Z" fill="#92C51B"/>
+<path d="M4 7V6H3V7H4Z" fill="#92C51B"/>
+<rect x="12" y="5" width="1" height="2" fill="#B1E515"/>
+<path d="M16 7V6H17V5H18V6H19V7H16Z" fill="#101412"/>
+<path d="M7 6V5H8V6H9V7H6V6H7Z" fill="#101412"/>
+<path d="M4 24V23H7V24H4Z" fill="#92C51B"/>
+<rect x="11" y="5" width="3" height="1" fill="#92C51B"/>
+</svg>

public/kittycad-logomark-light.svg

@@ -0,0 +1,45 @@
+<svg width="123" height="29" viewBox="0 0 123 29" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M2.52 26.04V25.2H0.84V24.36H0V6.72H0.84V5.88H1.68V5.04H2.52V4.2H3.36V3.36H17.64V4.2H18.48V5.04H19.32V5.88H20.16V6.72H21V24.36H20.16V25.2H18.48V26.04H15.96V26.88H16.8V28.56H11.76V26.88H12.6V26.04H8.4V26.88H9.24V28.56H4.2V26.88H5.04V26.04H2.52Z" fill="#101412"/>
+<path d="M5.04 26.04V24.78H8.4V26.04H7.56V26.88H8.4V27.72H5.04V26.88H5.88V26.04H5.04Z" fill="#4B4862"/>
+<path d="M12.6 26.04V24.78H15.96V26.04H15.12V26.88H15.96V27.72H12.6V26.88H13.44V26.04H12.6Z" fill="#4B4862"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M0.839996 20.58V24.36H2.52V25.2H18.48V24.36H20.16V20.58H0.839996ZM7.56 24.36V22.68H13.44V24.36H7.56Z" fill="#9BADB7"/>
+<path d="M0.839996 21V19.32H20.16V21H0.839996Z" fill="#BECAD0"/>
+<path d="M1.68 22.68V21.84H5.88V22.68H1.68Z" fill="#2B3E48"/>
+<path d="M3.36 24.36V23.52H5.88V24.36H3.36Z" fill="#2B3E48"/>
+<path d="M15.12 22.68V21.84H15.96V22.68H15.12Z" fill="#2B3E48"/>
+<path d="M16.8 22.68V21.84H17.64V22.68H16.8Z" fill="#2B3E48"/>
+<path d="M18.48 22.68V21.84H19.32V22.68H18.48Z" fill="#2B3E48"/>
+<path d="M15.12 24.36V23.52H17.64V24.36H15.12Z" fill="#2B3E48"/>
+<path d="M18.48 5.88V5.04H17.64V4.2H3.36V5.04H2.52V5.88H1.68V6.72H0.839996V8.4H20.16V6.72H19.32V5.88H18.48Z" fill="#FBF580"/>
+<path d="M0.839996 20.16V18.48H20.16V20.16H0.839996Z" fill="#AEAA4C"/>
+<path d="M20.16 7.56H0.839996V19.32H20.16V7.56Z" fill="#E5E3A1"/>
+<path d="M3.36 10.08V9.24001H17.64V10.08H18.48V16.8H17.64V17.64H3.36V16.8H2.52V10.08H3.36Z" fill="#1F2320"/>
+<rect x="8.4" y="4.2" width="4.2" height="1.68" fill="#AEAA4C"/>
+<path d="M13.44 10.92V10.08H15.12V13.44H14.28L13.44 10.92Z" fill="#DBFF3C"/>
+<path d="M9.24 13.44H11.76V14.28H10.92V15.96H13.44V15.12H14.28V15.96H13.44V16.8H7.56V15.96H6.72V15.12H7.56V15.96H10.08V14.28H9.24V13.44Z" fill="#DBFF3C"/>
+<path d="M7.56 12.6V11.76H5.04V12.6H4.2V11.76H5.04V10.92H7.56V11.76H8.4V12.6H7.56Z" fill="#DBFF3C"/>
+<path d="M3.36 5.88V5.04H4.2V3.36H5.04V1.68H5.88V0.839996H6.72V1.68H7.56V3.36H8.4V5.04H9.24V5.88H3.36Z" fill="#DBFF3C"/>
+<path d="M17.64 5.04V5.88H11.76V5.04H12.6V3.36H13.44V1.68H14.28V0.839996H15.12V1.68H15.96V3.36H16.8V5.04H17.64Z" fill="#DBFF3C"/>
+<path d="M13.44 1.68V0H15.96V1.68H16.8V3.36H17.64V4.62H16.8V3.36H15.96V1.68H15.12V0.84H14.28V1.68H13.44V3.36H12.6V4.62H11.76V3.36H12.6V1.68H13.44Z" fill="#92C51B"/>
+<path d="M5.04 1.68V0H7.56V1.68H8.4V3.36H9.24V4.62H8.4V3.36H7.56V1.68H6.72V0.84H5.88V1.68H5.04V3.36H4.2V4.62H3.36V3.36H4.2V1.68H5.04Z" fill="#92C51B"/>
+<rect x="9.24" y="5.03999" width="2.52" height="0.84" fill="#D0CC6A"/>
+<path d="M13.44 5.88V5.04H14.28V4.2H15.12V5.04H15.96V5.88H13.44Z" fill="#76AA1D"/>
+<path d="M5.88 5.04V4.2H6.72V5.04H7.56V5.88H5.04V5.04H5.88Z" fill="#76AA1D"/>
+<path d="M17.64 5.88V5.04H16.8V4.2H17.64V5.04H18.48V5.88H17.64Z" fill="#76AA1D"/>
+<path d="M3.36 5.04V5.88H2.52V5.04H3.36V4.2H4.2V5.04H3.36Z" fill="#76AA1D"/>
+<path d="M8.4 4.2H9.24V5.04H10.08V5.88H9.24V5.04H8.4V4.2Z" fill="#76AA1D"/>
+<path d="M11.76 4.2H12.6V5.04H11.76V5.88H10.92V5.04H11.76V4.2Z" fill="#76AA1D"/>
+<path d="M14.28 10.92H13.44V13.44H14.28V10.92Z" fill="#92C51B"/>
+<path d="M1.68 21V19.32H0.839996V21H1.68Z" fill="#D0CC6A"/>
+<path d="M19.32 21V19.32H20.16V21H19.32Z" fill="#D0CC6A"/>
+<path d="M3.36 20.16V19.32H5.88V20.16H3.36Z" fill="#D56161"/>
+<path d="M3.36 21V20.16H5.88V21H3.36Z" fill="#AC3232"/>
+<path d="M29.991 6.64V12.827L35.994 6.295L38.547 8.227L33.694 13.471L40.157 22.28H35.902L31.394 15.932L29.991 17.45V22.28H26.61V6.64H29.991Z" fill="#FFFFFA"/>
+<path d="M44.6921 7.698C44.6921 8.21933 44.5005 8.664 44.1171 9.032C43.7491 9.38466 43.3045 9.561 42.7831 9.561C42.2618 9.561 41.8248 9.38466 41.4721 9.032C41.1195 8.664 40.9431 8.21933 40.9431 7.698C40.9431 7.17666 41.1195 6.732 41.4721 6.364C41.8248 5.996 42.2618 5.812 42.7831 5.812C43.3045 5.812 43.7491 5.996 44.1171 6.364C44.5005 6.732 44.6921 7.17666 44.6921 7.698ZM44.4851 11.125V22.28H41.1041V11.125H44.4851Z" fill="#FFFFFA"/>
+<path d="M51.9943 22.671C50.6143 22.671 49.4719 22.3183 48.5673 21.613C47.6779 20.9077 47.2333 19.8727 47.2333 18.508V13.908H45.6463V11.286H47.2333V8.526L50.5913 7.974V11.286H52.8453L53.5813 13.908H50.5913V18.002C50.5913 18.5387 50.7293 18.9833 51.0053 19.336C51.2813 19.6733 51.6799 19.842 52.2013 19.842C52.4006 19.842 52.6153 19.8113 52.8453 19.75C53.0753 19.6887 53.3053 19.6043 53.5353 19.497L54.5243 21.889C54.2636 22.1037 53.8803 22.2877 53.3743 22.441C52.8683 22.5943 52.4083 22.671 51.9943 22.671Z" fill="#FFFFFA"/>
+<path d="M60.8106 22.671C59.4306 22.671 58.2883 22.3183 57.3836 21.613C56.4943 20.9077 56.0496 19.8727 56.0496 18.508V13.908H54.4626V11.286H56.0496V8.526L59.4076 7.974V11.286H61.6616L62.3976 13.908H59.4076V18.002C59.4076 18.5387 59.5456 18.9833 59.8216 19.336C60.0976 19.6733 60.4963 19.842 61.0176 19.842C61.217 19.842 61.4316 19.8113 61.6616 19.75C61.8916 19.6887 62.1216 19.6043 62.3516 19.497L63.3406 21.889C63.08 22.1037 62.6966 22.2877 62.1906 22.441C61.6846 22.5943 61.2246 22.671 60.8106 22.671Z" fill="#FFFFFA"/>
+<path d="M66.936 22.648L67.327 21.705L63.279 11.539L66.683 11.125C67.097 12.229 67.511 13.333 67.925 14.437C68.339 15.541 68.7453 16.645 69.144 17.749L71.49 11.125H74.986L70.018 23.683C69.65 24.5877 69.0137 25.362 68.109 26.006C67.2043 26.6653 66.2383 27.1177 65.211 27.363L64.038 24.626C64.59 24.4113 65.165 24.143 65.763 23.821C66.361 23.499 66.752 23.108 66.936 22.648Z" fill="#FFFFFA"/>
+<path d="M79.3491 22.28L76.8771 19.808V7.952L79.3491 5.48H86.8011L89.2851 7.952V11.816H85.8891V9.608L85.1571 8.876H81.0051L80.2731 9.608V18.152L81.0051 18.884H85.1571L85.8891 18.152V15.944H89.2851V19.808L86.8011 22.28H79.3491Z" fill="#FFFFFA"/>
+<path d="M91.9268 22.28V7.952L94.3988 5.48H102.151L104.623 7.952V22.28H101.239V17.336H95.3108V22.28H91.9268ZM95.3108 13.952H101.239V9.608L100.507 8.876H96.0428L95.3108 9.608V13.952Z" fill="#FFFFFA"/>
+<path d="M107.492 22.28V5.48H117.488L119.96 7.952V19.808L117.488 22.28H107.492ZM110.888 18.884H115.844L116.576 18.152V9.608L115.844 8.876H110.888V18.884Z" fill="#FFFFFA"/>
+</svg>

public/kittycad-logomark.svg

@@ -0,0 +1,45 @@
+<svg width="123" height="29" viewBox="0 0 123 29" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M2.52 26.04V25.2H0.84V24.36H0V6.72H0.84V5.88H1.68V5.04H2.52V4.2H3.36V3.36H17.64V4.2H18.48V5.04H19.32V5.88H20.16V6.72H21V24.36H20.16V25.2H18.48V26.04H15.96V26.88H16.8V28.56H11.76V26.88H12.6V26.04H8.4V26.88H9.24V28.56H4.2V26.88H5.04V26.04H2.52Z" fill="#101412"/>
+<path d="M5.04 26.04V24.78H8.4V26.04H7.56V26.88H8.4V27.72H5.04V26.88H5.88V26.04H5.04Z" fill="#4B4862"/>
+<path d="M12.6 26.04V24.78H15.96V26.04H15.12V26.88H15.96V27.72H12.6V26.88H13.44V26.04H12.6Z" fill="#4B4862"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M0.839996 20.58V24.36H2.52V25.2H18.48V24.36H20.16V20.58H0.839996ZM7.56 24.36V22.68H13.44V24.36H7.56Z" fill="#9BADB7"/>
+<path d="M0.839996 21V19.32H20.16V21H0.839996Z" fill="#BECAD0"/>
+<path d="M1.68 22.68V21.84H5.88V22.68H1.68Z" fill="#2B3E48"/>
+<path d="M3.36 24.36V23.52H5.88V24.36H3.36Z" fill="#2B3E48"/>
+<path d="M15.12 22.68V21.84H15.96V22.68H15.12Z" fill="#2B3E48"/>
+<path d="M16.8 22.68V21.84H17.64V22.68H16.8Z" fill="#2B3E48"/>
+<path d="M18.48 22.68V21.84H19.32V22.68H18.48Z" fill="#2B3E48"/>
+<path d="M15.12 24.36V23.52H17.64V24.36H15.12Z" fill="#2B3E48"/>
+<path d="M18.48 5.88V5.04H17.64V4.2H3.36V5.04H2.52V5.88H1.68V6.72H0.839996V8.4H20.16V6.72H19.32V5.88H18.48Z" fill="#FBF580"/>
+<path d="M0.839996 20.16V18.48H20.16V20.16H0.839996Z" fill="#AEAA4C"/>
+<path d="M20.16 7.56H0.839996V19.32H20.16V7.56Z" fill="#E5E3A1"/>
+<path d="M3.36 10.08V9.24001H17.64V10.08H18.48V16.8H17.64V17.64H3.36V16.8H2.52V10.08H3.36Z" fill="#1F2320"/>
+<rect x="8.4" y="4.2" width="4.2" height="1.68" fill="#AEAA4C"/>
+<path d="M13.44 10.92V10.08H15.12V13.44H14.28L13.44 10.92Z" fill="#DBFF3C"/>
+<path d="M9.24 13.44H11.76V14.28H10.92V15.96H13.44V15.12H14.28V15.96H13.44V16.8H7.56V15.96H6.72V15.12H7.56V15.96H10.08V14.28H9.24V13.44Z" fill="#DBFF3C"/>
+<path d="M7.56 12.6V11.76H5.04V12.6H4.2V11.76H5.04V10.92H7.56V11.76H8.4V12.6H7.56Z" fill="#DBFF3C"/>
+<path d="M3.36 5.88V5.04H4.2V3.36H5.04V1.68H5.88V0.839996H6.72V1.68H7.56V3.36H8.4V5.04H9.24V5.88H3.36Z" fill="#DBFF3C"/>
+<path d="M17.64 5.04V5.88H11.76V5.04H12.6V3.36H13.44V1.68H14.28V0.839996H15.12V1.68H15.96V3.36H16.8V5.04H17.64Z" fill="#DBFF3C"/>
+<path d="M13.44 1.68V0H15.96V1.68H16.8V3.36H17.64V4.62H16.8V3.36H15.96V1.68H15.12V0.84H14.28V1.68H13.44V3.36H12.6V4.62H11.76V3.36H12.6V1.68H13.44Z" fill="#92C51B"/>
+<path d="M5.04 1.68V0H7.56V1.68H8.4V3.36H9.24V4.62H8.4V3.36H7.56V1.68H6.72V0.84H5.88V1.68H5.04V3.36H4.2V4.62H3.36V3.36H4.2V1.68H5.04Z" fill="#92C51B"/>
+<rect x="9.24" y="5.03999" width="2.52" height="0.84" fill="#D0CC6A"/>
+<path d="M13.44 5.88V5.04H14.28V4.2H15.12V5.04H15.96V5.88H13.44Z" fill="#76AA1D"/>
+<path d="M5.88 5.04V4.2H6.72V5.04H7.56V5.88H5.04V5.04H5.88Z" fill="#76AA1D"/>
+<path d="M17.64 5.88V5.04H16.8V4.2H17.64V5.04H18.48V5.88H17.64Z" fill="#76AA1D"/>
+<path d="M3.36 5.04V5.88H2.52V5.04H3.36V4.2H4.2V5.04H3.36Z" fill="#76AA1D"/>
+<path d="M8.4 4.2H9.24V5.04H10.08V5.88H9.24V5.04H8.4V4.2Z" fill="#76AA1D"/>
+<path d="M11.76 4.2H12.6V5.04H11.76V5.88H10.92V5.04H11.76V4.2Z" fill="#76AA1D"/>
+<path d="M14.28 10.92H13.44V13.44H14.28V10.92Z" fill="#92C51B"/>
+<path d="M1.68 21V19.32H0.839996V21H1.68Z" fill="#D0CC6A"/>
+<path d="M19.32 21V19.32H20.16V21H19.32Z" fill="#D0CC6A"/>
+<path d="M3.36 20.16V19.32H5.88V20.16H3.36Z" fill="#D56161"/>
+<path d="M3.36 21V20.16H5.88V21H3.36Z" fill="#AC3232"/>
+<path d="M29.991 6.64V12.827L35.994 6.295L38.547 8.227L33.694 13.471L40.157 22.28H35.902L31.394 15.932L29.991 17.45V22.28H26.61V6.64H29.991Z" fill="#08110D"/>
+<path d="M44.6921 7.698C44.6921 8.21933 44.5005 8.664 44.1171 9.032C43.7491 9.38466 43.3045 9.561 42.7831 9.561C42.2618 9.561 41.8248 9.38466 41.4721 9.032C41.1195 8.664 40.9431 8.21933 40.9431 7.698C40.9431 7.17666 41.1195 6.732 41.4721 6.364C41.8248 5.996 42.2618 5.812 42.7831 5.812C43.3045 5.812 43.7491 5.996 44.1171 6.364C44.5005 6.732 44.6921 7.17666 44.6921 7.698ZM44.4851 11.125V22.28H41.1041V11.125H44.4851Z" fill="#08110D"/>
+<path d="M51.9943 22.671C50.6143 22.671 49.4719 22.3183 48.5673 21.613C47.6779 20.9077 47.2333 19.8727 47.2333 18.508V13.908H45.6463V11.286H47.2333V8.526L50.5913 7.974V11.286H52.8453L53.5813 13.908H50.5913V18.002C50.5913 18.5387 50.7293 18.9833 51.0053 19.336C51.2813 19.6733 51.6799 19.842 52.2013 19.842C52.4006 19.842 52.6153 19.8113 52.8453 19.75C53.0753 19.6887 53.3053 19.6043 53.5353 19.497L54.5243 21.889C54.2636 22.1037 53.8803 22.2877 53.3743 22.441C52.8683 22.5943 52.4083 22.671 51.9943 22.671Z" fill="#08110D"/>
+<path d="M60.8106 22.671C59.4306 22.671 58.2883 22.3183 57.3836 21.613C56.4943 20.9077 56.0496 19.8727 56.0496 18.508V13.908H54.4626V11.286H56.0496V8.526L59.4076 7.974V11.286H61.6616L62.3976 13.908H59.4076V18.002C59.4076 18.5387 59.5456 18.9833 59.8216 19.336C60.0976 19.6733 60.4963 19.842 61.0176 19.842C61.217 19.842 61.4316 19.8113 61.6616 19.75C61.8916 19.6887 62.1216 19.6043 62.3516 19.497L63.3406 21.889C63.08 22.1037 62.6966 22.2877 62.1906 22.441C61.6846 22.5943 61.2246 22.671 60.8106 22.671Z" fill="#08110D"/>
+<path d="M66.936 22.648L67.327 21.705L63.279 11.539L66.683 11.125C67.097 12.229 67.511 13.333 67.925 14.437C68.339 15.541 68.7453 16.645 69.144 17.749L71.49 11.125H74.986L70.018 23.683C69.65 24.5877 69.0137 25.362 68.109 26.006C67.2043 26.6653 66.2383 27.1177 65.211 27.363L64.038 24.626C64.59 24.4113 65.165 24.143 65.763 23.821C66.361 23.499 66.752 23.108 66.936 22.648Z" fill="#08110D"/>
+<path d="M79.3491 22.28L76.8771 19.808V7.952L79.3491 5.48H86.8011L89.2851 7.952V11.816H85.8891V9.608L85.1571 8.876H81.0051L80.2731 9.608V18.152L81.0051 18.884H85.1571L85.8891 18.152V15.944H89.2851V19.808L86.8011 22.28H79.3491Z" fill="#08110D"/>
+<path d="M91.9268 22.28V7.952L94.3988 5.48H102.151L104.623 7.952V22.28H101.239V17.336H95.3108V22.28H91.9268ZM95.3108 13.952H101.239V9.608L100.507 8.876H96.0428L95.3108 9.608V13.952Z" fill="#08110D"/>
+<path d="M107.492 22.28V5.48H117.488L119.96 7.952V19.808L117.488 22.28H107.492ZM110.888 18.884H115.844L116.576 18.152V9.608L115.844 8.876H110.888V18.884Z" fill="#08110D"/>
+</svg>

public/manifest.json

@@ -1,6 +1,6 @@
 {
-  "short_name": "React App",
-  "name": "Create React App Sample",
+  "short_name": "ZMA",
+  "name": "Zoo Modeling App",
   "icons": [
     {
       "src": "favicon.ico",

public/roadmap.md

@@ -0,0 +1,26 @@
+## Zoo Modeling App Roadmap
+
+This document ties into our [GH Discussions Feature List](https://github.com/KittyCAD/modeling-app/discussions). Please upvote any features that you want to see next, or add ones that are not listed and we will review. 
+
+### Current Priority List
+
+1. [Sketch on Face](https://github.com/KittyCAD/modeling-app/discussions/477)
+2. [Revolve](https://github.com/KittyCAD/modeling-app/discussions/496)
+3. [Fillet](https://github.com/KittyCAD/modeling-app/discussions/501)
+4. [Linear Pattern](https://github.com/KittyCAD/modeling-app/discussions/256)
+5. [Circular Pattern](https://github.com/KittyCAD/modeling-app/discussions/257)
+6. [Mirror-Sketch](https://github.com/KittyCAD/modeling-app/discussions/507)
+7. [Chamfer](https://github.com/KittyCAD/modeling-app/discussions/502)
+8. [Sweep](https://github.com/KittyCAD/modeling-app/discussions/498)
+9.  [Draft](https://github.com/KittyCAD/modeling-app/discussions/495)
+10. [Shell](https://github.com/KittyCAD/modeling-app/discussions/503)
+11. [Union](https://github.com/KittyCAD/modeling-app/discussions/509)
+12. [Mirror-Model](https://github.com/KittyCAD/modeling-app/discussions/508)
+13. [Subtract](https://github.com/KittyCAD/modeling-app/discussions/510)
+14. [Intersect](https://github.com/KittyCAD/modeling-app/discussions/511)
+15. [Offset](https://github.com/KittyCAD/modeling-app/discussions/512)
+16. [Thicken](https://github.com/KittyCAD/modeling-app/discussions/499)
+17. [Import](https://github.com/KittyCAD/modeling-app/discussions/478)
+18. [Assemblies](https://github.com/KittyCAD/modeling-app/discussions/494)
+19. [External Thread](https://github.com/KittyCAD/modeling-app/discussions/505)
+

public/zoo-logo.svg

@@ -0,0 +1,7 @@
+<svg width="438" height="145" viewBox="0 0 438 145" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M88.2136 25.3021V3.12744H0.595269V34.3994H79.827L0.609484 120.312H0.595269V120.326L0.581055 120.34L0.595269 120.355V141.364H20.8936L41.3341 119.189V141.364H128.952V110.092H49.7349L128.952 24.1649V3.12744L108.64 3.15587L88.2136 25.3021Z" fill="white"/>
+<path d="M167.36 72.4372C167.36 49.7366 185.824 31.2719 208.525 31.2719C216.514 31.2719 223.976 33.5605 230.288 37.5121L251.78 14.3709C239.698 5.34466 224.73 0 208.525 0C168.582 0 136.088 32.4944 136.088 72.4372C136.088 90.5465 142.769 107.135 153.828 119.857L175.32 96.7156C170.316 89.9069 167.36 81.5061 167.36 72.4372Z" fill="white"/>
+<path d="M241.745 48.1442C246.734 54.9671 249.691 63.3679 249.691 72.4368C249.691 95.1232 231.226 113.588 208.525 113.588C200.537 113.588 193.088 111.299 186.777 107.348L165.271 130.503C177.353 139.515 192.321 144.86 208.525 144.86C248.468 144.86 280.963 112.365 280.963 72.4368C280.963 54.3133 274.282 37.7249 263.223 25.0029L241.745 48.1442Z" fill="white"/>
+<path d="M419.312 25.0029L397.834 48.1442C402.823 54.9671 405.779 63.3679 405.779 72.4368C405.779 95.1232 387.315 113.588 364.614 113.588C356.626 113.588 349.177 111.299 342.866 107.348L321.359 130.503C333.442 139.515 348.41 144.86 364.614 144.86C404.557 144.86 437.051 112.365 437.051 72.4368C437.051 54.3133 430.371 37.7249 419.312 25.0029Z" fill="white"/>
+<path d="M323.449 72.4372C323.449 49.7366 341.913 31.2719 364.614 31.2719C372.603 31.2719 380.065 33.5605 386.376 37.5121L407.869 14.3709C395.786 5.34466 380.819 0 364.614 0C324.671 0 292.177 32.4944 292.177 72.4372C292.177 90.5465 298.858 107.135 309.916 119.857L331.409 96.7156C326.405 89.9069 323.449 81.5061 323.449 72.4372Z" fill="white"/>
+</svg>

src-tauri/Cargo.toml

@@ -4,7 +4,7 @@ version = "0.1.0"
 description = "A Tauri App"
 authors = ["you"]
 license = ""
-repository = ""
+repository = "https://github.com/KittyCAD/modeling-app"
 default-run = "app"
 edition = "2021"
 rust-version = "1.60"
@@ -12,12 +12,18 @@ rust-version = "1.60"
 # See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html
 
 [build-dependencies]
-tauri-build = { version = "1.3.0", features = [] }
+tauri-build = { version = "1.5.0", features = [] }
 
 [dependencies]
-serde_json = "1.0"
+anyhow = "1"
+kittycad = "0.2.42"
+oauth2 = "4.4.2"
 serde = { version = "1.0", features = ["derive"] }
-tauri = { version = "1.3.0", features = [] }
+serde_json = "1.0"
+tauri = { version = "1.5.3", features = [ "os-all", "dialog-all", "fs-all", "http-request", "path-all", "shell-open", "shell-open-api", "devtools"] }
+tauri-plugin-fs-extra = { git = "https://github.com/tauri-apps/plugins-workspace", branch = "v1" }
+tokio = { version = "1.34.0", features = ["time"] }
+toml = "0.8.2"
 
 [features]
 # this feature is used for production builds or when `devPath` points to the filesystem and the built-in dev server is disabled.

src-tauri/src/main.rs

@@ -1,8 +1,166 @@
 // Prevents additional console window on Windows in release, DO NOT REMOVE!!
 #![cfg_attr(not(debug_assertions), windows_subsystem = "windows")]
 
+use std::env;
+use std::fs;
+use std::io::Read;
+
+use anyhow::Result;
+use oauth2::TokenResponse;
+use tauri::{InvokeError, Manager};
+const DEFAULT_HOST: &str = "https://api.kittycad.io";
+
+/// This command returns the a json string parse from a toml file at the path.
+#[tauri::command]
+fn read_toml(path: &str) -> Result<String, InvokeError> {
+    let mut file = std::fs::File::open(path).map_err(|e| InvokeError::from_anyhow(e.into()))?;
+    let mut contents = String::new();
+    file.read_to_string(&mut contents)
+        .map_err(|e| InvokeError::from_anyhow(e.into()))?;
+    let value =
+        toml::from_str::<toml::Value>(&contents).map_err(|e| InvokeError::from_anyhow(e.into()))?;
+    let value = serde_json::to_string(&value).map_err(|e| InvokeError::from_anyhow(e.into()))?;
+    Ok(value)
+}
+
+/// This command returns a string that is the contents of a file at the path.
+#[tauri::command]
+fn read_txt_file(path: &str) -> Result<String, InvokeError> {
+    let mut file = std::fs::File::open(path).map_err(|e| InvokeError::from_anyhow(e.into()))?;
+    let mut contents = String::new();
+    file.read_to_string(&mut contents)
+        .map_err(|e| InvokeError::from_anyhow(e.into()))?;
+    Ok(contents)
+}
+
+/// This command instantiates a new window with auth.
+/// The string returned from this method is the access token.
+#[tauri::command]
+async fn login(app: tauri::AppHandle, host: &str) -> Result<String, InvokeError> {
+    println!("Logging in...");
+    // Do an OAuth 2.0 Device Authorization Grant dance to get a token.
+    let device_auth_url = oauth2::DeviceAuthorizationUrl::new(format!("{host}/oauth2/device/auth"))
+        .map_err(|e| InvokeError::from_anyhow(e.into()))?;
+    // We can hardcode the client ID.
+    // This value is safe to be embedded in version control.
+    // This is the client ID of the KittyCAD app.
+    let client_id = "2af127fb-e14e-400a-9c57-a9ed08d1a5b7".to_string();
+    let auth_client = oauth2::basic::BasicClient::new(
+        oauth2::ClientId::new(client_id),
+        None,
+        oauth2::AuthUrl::new(format!("{host}/authorize"))
+            .map_err(|e| InvokeError::from_anyhow(e.into()))?,
+        Some(
+            oauth2::TokenUrl::new(format!("{host}/oauth2/device/token"))
+                .map_err(|e| InvokeError::from_anyhow(e.into()))?,
+        ),
+    )
+    .set_auth_type(oauth2::AuthType::RequestBody)
+    .set_device_authorization_url(device_auth_url);
+
+    let details: oauth2::devicecode::StandardDeviceAuthorizationResponse = auth_client
+        .exchange_device_code()
+        .map_err(|e| InvokeError::from_anyhow(e.into()))?
+        .request_async(oauth2::reqwest::async_http_client)
+        .await
+        .map_err(|e| InvokeError::from_anyhow(e.into()))?;
+
+    let Some(auth_uri) = details.verification_uri_complete() else {
+        return Err(InvokeError::from("getting the verification uri failed"));
+    };
+
+    // Open the system browser with the auth_uri.
+    // We do this in the browser and not a separate window because we want 1password and
+    // other crap to work well.
+    // TODO: find a better way to share this value with tauri e2e tests
+    // Here we're using an env var to enable the /tmp file (windows not supported for now)
+    // and bypass the shell::open call as it fails on GitHub Actions.
+    let e2e_tauri_enabled = env::var("E2E_TAURI_ENABLED").is_ok();
+    if e2e_tauri_enabled {
+        println!(
+            "E2E_TAURI_ENABLED is set, won't open {} externally",
+            auth_uri.secret()
+        );
+        fs::write("/tmp/kittycad_user_code", details.user_code().secret())
+            .expect("Unable to write /tmp/kittycad_user_code file");
+    } else {
+        tauri::api::shell::open(&app.shell_scope(), auth_uri.secret(), None)
+            .map_err(|e| InvokeError::from_anyhow(e.into()))?;
+    }
+
+    // Wait for the user to login.
+    let token = auth_client
+        .exchange_device_access_token(&details)
+        .request_async(oauth2::reqwest::async_http_client, tokio::time::sleep, None)
+        .await
+        .map_err(|e| InvokeError::from_anyhow(e.into()))?
+        .access_token()
+        .secret()
+        .to_string();
+
+    Ok(token)
+}
+
+///This command returns the KittyCAD user info given a token.
+/// The string returned from this method is the user info as a json string.
+#[tauri::command]
+async fn get_user(
+    token: Option<String>,
+    hostname: &str,
+) -> Result<kittycad::types::User, InvokeError> {
+    // Use the host passed in if it's set.
+    // Otherwise, use the default host.
+    let host = if hostname.is_empty() {
+        DEFAULT_HOST.to_string()
+    } else {
+        hostname.to_string()
+    };
+
+    // Change the baseURL to the one we want.
+    let mut baseurl = host.to_string();
+    if !host.starts_with("http://") && !host.starts_with("https://") {
+        baseurl = format!("https://{host}");
+        if host.starts_with("localhost") {
+            baseurl = format!("http://{host}")
+        }
+    }
+    println!("Getting user info...");
+
+    // use kittycad library to fetch the user info from /user/me
+    let mut client = kittycad::Client::new(token.unwrap());
+
+    if baseurl != DEFAULT_HOST {
+        client.set_base_url(&baseurl);
+    }
+
+    let user_info: kittycad::types::User = client
+        .users()
+        .get_self()
+        .await
+        .map_err(|e| InvokeError::from_anyhow(e.into()))?;
+
+    Ok(user_info)
+}
+
 fn main() {
     tauri::Builder::default()
+        .setup(|_app| {
+            #[cfg(debug_assertions)] // only include this code on debug builds
+            {
+                let window = _app.get_window("main").unwrap();
+                // comment out the below if you don't devtools to open everytime.
+                // it's useful because otherwise devtools shuts everytime rust code changes.
+                window.open_devtools();
+            }
+            Ok(())
+        })
+        .invoke_handler(tauri::generate_handler![
+            get_user,
+            login,
+            read_toml,
+            read_txt_file
+        ])
+        .plugin(tauri_plugin_fs_extra::init())
         .run(tauri::generate_context!())
         .expect("error while running tauri application");
 }

src-tauri/tauri.conf.json

@@ -1,18 +1,49 @@
 {
   "$schema": "../node_modules/@tauri-apps/cli/schema.json",
   "build": {
-    "beforeBuildCommand": "yarn build:both",
     "beforeDevCommand": "yarn start",
     "devPath": "http://localhost:3000",
     "distDir": "../build"
   },
   "package": {
-    "productName": "untitled-app",
-    "version": "0.1.0"
+    "productName": "zoo-modeling-app",
+    "version": "0.14.0"
   },
   "tauri": {
     "allowlist": {
-      "all": false
+      "all": false,
+      "dialog": {
+        "all": true,
+        "ask": true,
+        "confirm": true,
+        "message": true,
+        "open": true,
+        "save": true
+      },
+      "fs": {
+        "scope": [
+          "$HOME/**/*",
+          "$APPDATA/**/*"
+        ],
+        "all": true
+      },
+      "http": {
+        "request": true,
+        "scope": [
+          "https://dev.kittycad.io/*",
+          "https://kittycad.io/*",
+          "https://api.dev.kittycad.io/*"
+        ]
+      },
+      "os": {
+        "all": true
+      },
+      "shell": {
+        "open": true
+      },
+      "path": {
+        "all": true
+      }
     },
     "bundle": {
       "active": true,
@@ -29,7 +60,7 @@
         "icons/icon.icns",
         "icons/icon.ico"
       ],
-      "identifier": "untitled-app",
+      "identifier": "io.kittycad.modeling-app",
       "longDescription": "",
       "macOS": {
         "entitlements": null,
@@ -40,12 +71,7 @@
       },
       "resources": [],
       "shortDescription": "",
-      "targets": "all",
-      "windows": {
-        "certificateThumbprint": null,
-        "digestAlgorithm": "sha256",
-        "timestampUrl": ""
-      }
+      "targets": "all"
     },
     "security": {
       "csp": null
@@ -56,10 +82,10 @@
     "windows": [
       {
         "fullscreen": false,
-        "height": 600,
+        "height": 1200,
         "resizable": true,
-        "title": "untitled-app",
-        "width": 800
+        "title": "Zoo Modeling App",
+        "width": 1800
       }
     ]
   }

src-tauri/tauri.macos.conf.json

@@ -0,0 +1,6 @@
+{
+  "$schema": "../node_modules/@tauri-apps/cli/schema.json",
+  "package": {
+    "productName": "Zoo Modeling App"
+  }
+}

src-tauri/tauri.release.conf.json

@@ -0,0 +1,21 @@
+{
+  "$schema": "../node_modules/@tauri-apps/cli/schema.json",
+  "tauri": {
+    "updater": {
+      "active": true,
+      "endpoints": [
+        "https://dl.zoo.dev/releases/modeling-app/last_update.json"
+      ],
+      "dialog": true,
+      "pubkey": "dW50cnVzdGVkIGNvbW1lbnQ6IG1pbmlzaWduIHB1YmxpYyBrZXk6IEUzNzA4MjBEQjFBRTY4NzYKUldSMmFLNnhEWUp3NCtsT21Jd05wQktOaGVkOVp6MUFma0hNTDRDSnI2RkJJTEZOWG1ncFhqcU8K"
+    },
+    "bundle": {
+      "identifier": "io.kittycad.modeling-app",
+      "windows": {
+        "certificateThumbprint": "F4C9A52FF7BC26EE5E054946F6B11DEEA94C748D",
+        "digestAlgorithm": "sha256",
+        "timestampUrl": "http://timestamp.digicert.com"
+      }
+    }
+  }
+}

src-tauri/tauri.windows.conf.json

@@ -0,0 +1,6 @@
+{
+  "$schema": "../node_modules/@tauri-apps/cli/schema.json",
+  "package": {
+    "productName": "Zoo Modeling App"
+  }
+}

src/App.test.tsx

@@ -1,6 +1,16 @@
-import React from 'react'
 import { render, screen } from '@testing-library/react'
-import App from './App'
+import { App } from './App'
+import { describe, test, vi } from 'vitest'
+import {
+  Route,
+  RouterProvider,
+  createMemoryRouter,
+  createRoutesFromElements,
+} from 'react-router-dom'
+import { GlobalStateProvider } from './components/GlobalStateProvider'
+import CommandBarProvider from 'components/CommandBar/CommandBar'
+import ModelingMachineProvider from 'components/ModelingMachineProvider'
+import { BROWSER_FILE_NAME } from 'Router'
 
 let listener: ((rect: any) => void) | undefined = undefined
 ;(global as any).ResizeObserver = class ResizeObserver {
@@ -12,8 +22,52 @@ let listener: ((rect: any) => void) | undefined = undefined
   disconnect() {}
 }
 
-test('renders learn react link', () => {
-  render(<App />)
+describe('App tests', () => {
+  test('Renders the modeling app screen, including "Variables" pane.', () => {
+    vi.mock('react-router-dom', async () => {
+      const actual = (await vi.importActual('react-router-dom')) as Record<
+        string,
+        any
+      >
+      return {
+        ...actual,
+        useParams: () => ({ id: BROWSER_FILE_NAME }),
+        useLoaderData: () => ({ code: null }),
+      }
+    })
+    render(
+      <TestWrap>
+        <App />
+      </TestWrap>
+    )
     const linkElement = screen.getByText(/Variables/i)
     expect(linkElement).toBeInTheDocument()
+
+    vi.restoreAllMocks()
   })
+})
+
+function TestWrap({ children }: { children: React.ReactNode }) {
+  // We have to use a memory router in the testing environment,
+  // and we have to use the createMemoryRouter function instead of <MemoryRouter /> as of react-router v6.4:
+  // https://reactrouter.com/en/6.16.0/routers/picking-a-router#using-v64-data-apis
+  const router = createMemoryRouter(
+    createRoutesFromElements(
+      <Route
+        path="/file/:id"
+        element={
+          <CommandBarProvider>
+            <GlobalStateProvider>
+              <ModelingMachineProvider>{children}</ModelingMachineProvider>
+            </GlobalStateProvider>
+          </CommandBarProvider>
+        }
+      />
+    ),
+    {
+      initialEntries: ['/file/new'],
+      initialIndex: 0,
+    }
+  )
+  return <RouterProvider router={router} />
+}

src/App.tsx

@@ -1,266 +1,243 @@
-import { useRef, useState, useEffect } from 'react'
-import { Canvas } from '@react-three/fiber'
-import { Allotment } from 'allotment'
-import { OrbitControls, OrthographicCamera } from '@react-three/drei'
-import { asyncLexer } from './lang/tokeniser'
-import { abstractSyntaxTree } from './lang/abstractSyntaxTree'
-import { executor, ExtrudeGroup, SketchGroup } from './lang/executor'
-import CodeMirror from '@uiw/react-codemirror'
-import { javascript } from '@codemirror/lang-javascript'
-import { ViewUpdate } from '@codemirror/view'
-import {
-  lineHighlightField,
-  addLineHighlight,
-} from './editor/highlightextension'
-import { useStore } from './useStore'
-import { Toolbar } from './Toolbar'
-import { BasePlanes } from './components/BasePlanes'
-import { SketchPlane } from './components/SketchPlane'
-import { Logs } from './components/Logs'
-import { AxisIndicator } from './components/AxisIndicator'
-import { RenderViewerArtifacts } from './components/RenderViewerArtifacts'
-import { PanelHeader } from './components/PanelHeader'
+import { useCallback, MouseEventHandler } from 'react'
+import { DebugPanel } from './components/DebugPanel'
+import { v4 as uuidv4 } from 'uuid'
+import { PaneType, useStore } from './useStore'
+import { Logs, KCLErrors } from './components/Logs'
+import { CollapsiblePanel } from './components/CollapsiblePanel'
 import { MemoryPanel } from './components/MemoryPanel'
 import { useHotKeyListener } from './hooks/useHotKeyListener'
 import { Stream } from './components/Stream'
 import ModalContainer from 'react-modal-promise'
+import { EngineCommand } from './lang/std/engineConnection'
+import { throttle } from './lib/utils'
+import { AppHeader } from './components/AppHeader'
+import { Resizable } from 're-resizable'
+import {
+  faCode,
+  faCodeCommit,
+  faSquareRootVariable,
+} from '@fortawesome/free-solid-svg-icons'
+import { useHotkeys } from 'react-hotkeys-hook'
+import { getNormalisedCoordinates } from './lib/utils'
+import { useLoaderData } from 'react-router-dom'
+import { IndexLoaderData } from './Router'
+import { useGlobalStateContext } from 'hooks/useGlobalStateContext'
+import { onboardingPaths } from 'routes/Onboarding'
+import { cameraMouseDragGuards } from 'lib/cameraControls'
+import { CameraDragInteractionType_type } from '@kittycad/lib/dist/types/src/models'
+import { CodeMenu } from 'components/CodeMenu'
+import { TextEditor } from 'components/TextEditor'
+import { Themes, getSystemTheme } from 'lib/theme'
+import { useEngineConnectionSubscriptions } from 'hooks/useEngineConnectionSubscriptions'
+import { engineCommandManager } from './lang/std/engineConnection'
+import { useModelingContext } from 'hooks/useModelingContext'
 
-const OrrthographicCamera = OrthographicCamera as any
+export function App() {
+  const { project, file } = useLoaderData() as IndexLoaderData
 
-function App() {
-  const cam = useRef()
   useHotKeyListener()
   const {
-    editorView,
-    setEditorView,
-    setSelectionRanges,
-    selectionRanges: selectionRange,
-    guiMode,
-    lastGuiMode,
-    addLog,
-    code,
-    setCode,
-    setAst,
-    setError,
-    errorState,
-    setProgramMemory,
-    resetLogs,
-    selectionRangeTypeMap,
+    buttonDownInStream,
+    openPanes,
+    setOpenPanes,
+    didDragInStream,
+    streamDimensions,
   } = useStore((s) => ({
-    editorView: s.editorView,
-    setEditorView: s.setEditorView,
-    setSelectionRanges: s.setSelectionRanges,
-    selectionRanges: s.selectionRanges,
-    guiMode: s.guiMode,
-    setGuiMode: s.setGuiMode,
-    addLog: s.addLog,
-    code: s.code,
-    setCode: s.setCode,
-    setAst: s.setAst,
-    lastGuiMode: s.lastGuiMode,
-    setError: s.setError,
-    errorState: s.errorState,
-    setProgramMemory: s.setProgramMemory,
-    resetLogs: s.resetLogs,
-    selectionRangeTypeMap: s.selectionRangeTypeMap,
+    buttonDownInStream: s.buttonDownInStream,
+    openPanes: s.openPanes,
+    setOpenPanes: s.setOpenPanes,
+    didDragInStream: s.didDragInStream,
+    streamDimensions: s.streamDimensions,
   }))
-  // const onChange = React.useCallback((value: string, viewUpdate: ViewUpdate) => {
-  const onChange = (value: string, viewUpdate: ViewUpdate) => {
-    setCode(value)
-    if (editorView) {
-      editorView?.dispatch({ effects: addLineHighlight.of([0, 0]) })
-    }
-  } //, []);
-  const onUpdate = (viewUpdate: ViewUpdate) => {
-    if (!editorView) {
-      setEditorView(viewUpdate.view)
-    }
-    const ranges = viewUpdate.state.selection.ranges
 
-    const isChange =
-      ranges.length !== selectionRange.codeBasedSelections.length ||
-      ranges.some(({ from, to }, i) => {
-        return (
-          from !== selectionRange.codeBasedSelections[i].range[0] ||
-          to !== selectionRange.codeBasedSelections[i].range[1]
+  const { settings } = useGlobalStateContext()
+  const { showDebugPanel, onboardingStatus, cameraControls, theme } =
+    settings?.context || {}
+  const { state, send } = useModelingContext()
+
+  const editorTheme = theme === Themes.System ? getSystemTheme() : theme
+
+  // Pane toggling keyboard shortcuts
+  const togglePane = useCallback(
+    (newPane: PaneType) =>
+      openPanes.includes(newPane)
+        ? setOpenPanes(openPanes.filter((p) => p !== newPane))
+        : setOpenPanes([...openPanes, newPane]),
+    [openPanes, setOpenPanes]
   )
+  useHotkeys('shift + c', () => togglePane('code'))
+  useHotkeys('shift + v', () => togglePane('variables'))
+  useHotkeys('shift + l', () => togglePane('logs'))
+  useHotkeys('shift + e', () => togglePane('kclErrors'))
+  useHotkeys('shift + d', () => togglePane('debug'))
+  useHotkeys('esc', () => send('Cancel'))
+
+  const paneOpacity = [onboardingPaths.CAMERA, onboardingPaths.STREAMING].some(
+    (p) => p === onboardingStatus
+  )
+    ? 'opacity-20'
+    : didDragInStream
+    ? 'opacity-40'
+    : ''
+
+  useEngineConnectionSubscriptions()
+
+  const debounceSocketSend = throttle<EngineCommand>((message) => {
+    engineCommandManager.sendSceneCommand(message)
+  }, 16)
+  const handleMouseMove: MouseEventHandler<HTMLDivElement> = (e) => {
+    e.nativeEvent.preventDefault()
+
+    const { x, y } = getNormalisedCoordinates({
+      clientX: e.clientX,
+      clientY: e.clientY,
+      el: e.currentTarget,
+      ...streamDimensions,
     })
 
-    if (!isChange) return
-    setSelectionRanges({
-      otherSelections: [],
-      codeBasedSelections: ranges.map(({ from, to }, i) => {
-        if (selectionRangeTypeMap[to]) {
-          return {
-            type: selectionRangeTypeMap[to],
-            range: [from, to],
-          }
-        }
-        return {
-          type: 'default',
-          range: [from, to],
-        }
-      }),
+    const newCmdId = uuidv4()
+    if (buttonDownInStream === undefined) {
+      if (state.matches('Sketch.Line Tool')) {
+        debounceSocketSend({
+          type: 'modeling_cmd_req',
+          cmd_id: newCmdId,
+          cmd: {
+            type: 'mouse_move',
+            window: { x, y },
+          },
+        })
+      } else {
+        debounceSocketSend({
+          type: 'modeling_cmd_req',
+          cmd: {
+            type: 'highlight_set_entity',
+            selected_at_window: { x, y },
+          },
+          cmd_id: newCmdId,
         })
       }
-  const [geoArray, setGeoArray] = useState<(ExtrudeGroup | SketchGroup)[]>([])
-  useEffect(() => {
-    const asyncWrap = async () => {
-      try {
-        if (!code) {
-          setGeoArray([])
-          setAst(null)
+    } else {
+      if (state.matches('Sketch.Move Tool')) {
+        debounceSocketSend({
+          type: 'modeling_cmd_req',
+          cmd_id: newCmdId,
+          cmd: {
+            type: 'handle_mouse_drag_move',
+            window: { x, y },
+          },
+        })
         return
       }
-        const tokens = await asyncLexer(code)
-        const _ast = abstractSyntaxTree(tokens)
-        setAst(_ast)
-        resetLogs()
-        const programMemory = executor(_ast, {
-          root: {
-            log: {
-              type: 'userVal',
-              value: (a: any) => {
-                addLog(a)
-              },
-              __meta: [
-                {
-                  pathToNode: [],
-                  sourceRange: [0, 0],
-                },
-              ],
-            },
-            _0: {
-              type: 'userVal',
-              value: 0,
-              __meta: [],
-            },
-            _90: {
-              type: 'userVal',
-              value: 90,
-              __meta: [],
-            },
-            _180: {
-              type: 'userVal',
-              value: 180,
-              __meta: [],
-            },
-            _270: {
-              type: 'userVal',
-              value: 270,
-              __meta: [],
-            },
-          },
-          _sketch: [],
-        })
-        setProgramMemory(programMemory)
-        const geos = programMemory?.return
-          ?.map(({ name }: { name: string }) => {
-            const artifact = programMemory?.root?.[name]
-            if (
-              artifact.type === 'extrudeGroup' ||
-              artifact.type === 'sketchGroup'
-            ) {
-              return artifact
-            }
-            return null
-          })
-          .filter((a) => a) as (ExtrudeGroup | SketchGroup)[]
+      const interactionGuards = cameraMouseDragGuards[cameraControls]
+      let interaction: CameraDragInteractionType_type
 
-        setGeoArray(geos)
-        console.log(programMemory)
-        setError()
-      } catch (e: any) {
-        setError('problem')
-        console.log(e)
-        addLog(e)
+      const eWithButton = { ...e, button: buttonDownInStream }
+
+      if (interactionGuards.pan.callback(eWithButton)) {
+        interaction = 'pan'
+      } else if (interactionGuards.rotate.callback(eWithButton)) {
+        interaction = 'rotate'
+      } else if (interactionGuards.zoom.dragCallback(eWithButton)) {
+        interaction = 'zoom'
+      } else {
+        return
+      }
+
+      debounceSocketSend({
+        type: 'modeling_cmd_req',
+        cmd: {
+          type: 'camera_drag_move',
+          interaction,
+          window: { x, y },
+        },
+        cmd_id: newCmdId,
+      })
     }
   }
-    asyncWrap()
-  }, [code])
+
   return (
-    <div className="h-screen">
-      <ModalContainer />
-      <Allotment snap={true}>
-        <Allotment vertical defaultSizes={[400, 1, 1]} minSize={20}>
-          <div className="h-full flex flex-col items-start">
-            <PanelHeader title="Editor" />
-            {/* <button
-              disabled={!shouldFormat}
-              onClick={formatCode}
-              className={`${!shouldFormat && 'text-gray-300'}`}
-            >
-              format
-            </button> */}
     <div
-              className="bg-red h-full w-full overflow-auto"
-              id="code-mirror-override"
+      className="relative h-full flex flex-col"
+      onMouseMove={handleMouseMove}
     >
-              <CodeMirror
-                className="h-full"
-                value={code}
-                extensions={[javascript({ jsx: true }), lineHighlightField]}
-                onChange={onChange}
-                onUpdate={onUpdate}
-                onCreateEditor={(_editorView) => setEditorView(_editorView)}
-              />
-            </div>
-          </div>
-          <MemoryPanel />
-          <Logs />
-        </Allotment>
-        <Allotment vertical defaultSizes={[400, 1]} minSize={20}>
-          <div className="h-full">
-            <PanelHeader title="Drafting Board" />
-            <Toolbar />
-            <div className="border h-full border-gray-300 relative">
-              <div className="absolute inset-0">
-                <Canvas>
-                  <OrbitControls
-                    enableDamping={false}
-                    enablePan
-                    enableRotate={
-                      !(
-                        guiMode.mode === 'canEditSketch' ||
-                        guiMode.mode === 'sketch'
-                      )
+      <AppHeader
+        className={
+          'transition-opacity transition-duration-75 ' +
+          paneOpacity +
+          (buttonDownInStream ? ' pointer-events-none' : '')
         }
-                    enableZoom
-                    reverseOrbit={false}
+        project={{ project, file }}
+        enableMenu={true}
       />
-                  <OrrthographicCamera
-                    ref={cam}
-                    makeDefault
-                    position={[0, 0, 1000]}
-                    zoom={100}
-                    rotation={[0, 0, 0]}
-                    far={2000}
+      <ModalContainer />
+      <Resizable
+        className={
+          'pointer-events-none h-full flex flex-col flex-1 z-10 my-5 ml-5 pr-1 transition-opacity transition-duration-75 ' +
+          +paneOpacity
+        }
+        defaultSize={{
+          width: '550px',
+          height: 'auto',
+        }}
+        minWidth={200}
+        maxWidth={800}
+        minHeight={'auto'}
+        maxHeight={'auto'}
+        handleClasses={{
+          right:
+            'hover:bg-chalkboard-10/50 bg-transparent transition-colors duration-75 transition-ease-out delay-100 ' +
+            (buttonDownInStream || onboardingStatus === 'camera'
+              ? 'pointer-events-none '
+              : 'pointer-events-auto'),
+        }}
+      >
+        <div
+          id="code-pane"
+          className="h-full flex flex-col justify-between pointer-events-none"
+        >
+          <CollapsiblePanel
+            title="Code"
+            icon={faCode}
+            className="open:!mb-2"
+            open={openPanes.includes('code')}
+            menu={<CodeMenu />}
+          >
+            <TextEditor theme={editorTheme} />
+          </CollapsiblePanel>
+          <section className="flex flex-col">
+            <MemoryPanel
+              theme={editorTheme}
+              open={openPanes.includes('variables')}
+              title="Variables"
+              icon={faSquareRootVariable}
             />
-                  <ambientLight />
-                  <pointLight position={[10, 10, 10]} />
-                  <RenderViewerArtifacts artifacts={geoArray} />
-                  <BasePlanes />
-                  <SketchPlane />
-                  <AxisIndicator />
-                </Canvas>
-              </div>
-              {errorState.isError && (
-                <div className="absolute inset-0 bg-gray-700/20">
-                  <pre>
-                    {'last first: \n\n' +
-                      JSON.stringify(lastGuiMode, null, 2) +
-                      '\n\n' +
-                      JSON.stringify(guiMode)}
-                  </pre>
+            <Logs
+              theme={editorTheme}
+              open={openPanes.includes('logs')}
+              title="Logs"
+              icon={faCodeCommit}
+            />
+            <KCLErrors
+              theme={editorTheme}
+              open={openPanes.includes('kclErrors')}
+              title="KCL Errors"
+              iconClassNames={{ icon: 'group-open:text-destroy-30' }}
+            />
+          </section>
         </div>
+      </Resizable>
+      <Stream className="absolute inset-0 z-0" />
+      {showDebugPanel && (
+        <DebugPanel
+          title="Debug"
+          className={
+            'transition-opacity transition-duration-75 ' +
+            paneOpacity +
+            (buttonDownInStream ? ' pointer-events-none' : '')
+          }
+          open={openPanes.includes('debug')}
+        />
       )}
     </div>
-          </div>
-          <Stream />
-        </Allotment>
-      </Allotment>
-    </div>
   )
 }
-
-export default App