diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml
index 583c972..ba38a72 100644
--- a/.github/workflows/deploy.yml
+++ b/.github/workflows/deploy.yml
@@ -19,21 +19,15 @@ jobs:
     steps:
       - uses: actions/checkout@v4
       - uses: oven-sh/setup-bun@v1
-
-      - run: bun install
-      - run: bun run build
-
       - uses: actions/upload-pages-artifact@v3
         with:
-          path: ./dist
+          path: ./
 
   deploy:
     environment:
       name: github-pages
       url: ${{ steps.deployment.outputs.page_url }}
     runs-on: ubuntu-latest
-    if: github.ref == 'refs/heads/master'
-    needs: build
     steps:
       - name: Deploy to GitHub Pages
         id: deployment
diff --git a/.github/workflows/main.yaml b/.github/workflows/main.yaml
index 251305d..752b483 100644
--- a/.github/workflows/main.yaml
+++ b/.github/workflows/main.yaml
@@ -20,4 +20,4 @@ jobs:
 
       - run: bun install
       - run: bun lint
-      - run: bun vitest
+      - run: bun test
diff --git a/bun.lockb b/bun.lockb
index d81811e..b0d325d 100755
Binary files a/bun.lockb and b/bun.lockb differ
diff --git a/index.html b/index.html
index 3060b4a..9a460fb 100644
--- a/index.html
+++ b/index.html
@@ -9,10 +9,42 @@
       content="Update your comma device to the latest software"
     />
     <title>flash.comma.ai</title>
+    <link href="https://cdn.jsdelivr.net/npm/@fontsource-variable/inter@5.1.0/index.min.css" rel="stylesheet">
+    <link href="https://cdn.jsdelivr.net/npm/@fontsource-variable/jetbrains-mono@5.1.1/index.min.css" rel="stylesheet">
+    <script src="https://cdn.tailwindcss.com?plugins=typography"></script>
+    <script>
+      tailwind.config = {
+        theme: {
+          extend: {
+            backgroundImage: {
+              'gradient-radial': 'radial-gradient(var(--tw-gradient-stops))',
+              'gradient-conic':
+                'conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))',
+            },
+            fontFamily: {
+              sans: ['Inter Variable', 'sans-serif'],
+              monospace: ['JetBrains Mono Variable', 'monospace'],
+            },
+          }
+        }
+      }
+    </script>
   </head>
   <body>
     <div id="root"></div>
-    <script type="module" src="/src/main.jsx"></script>
+    <script type="importmap">
+      {
+        "imports": {
+          "react": "https://cdn.jsdelivr.net/npm/react@18.3.1/+esm",
+          "react-dom": "https://cdn.jsdelivr.net/npm/react-dom@18.3.1/+esm",
+          "comlink": "https://cdn.jsdelivr.net/npm/comlink@4.4.2/+esm",
+          "crc-32": "https://cdn.jsdelivr.net/npm/crc-32@1.2.2/+esm",
+          "jssha": "https://cdn.jsdelivr.net/npm/jssha@3.3.1/+esm",
+          "xz-decompress": "https://cdn.jsdelivr.net/npm/xz-decompress@0.2.1/+esm"
+        }
+      }
+    </script>    
+    <script type="module" src="/src/main.js"></script>
     <script
       defer
       data-domain="flash.comma.ai"
diff --git a/package.json b/package.json
index 7968bfd..f762c6b 100644
--- a/package.json
+++ b/package.json
@@ -1,45 +1,22 @@
 {
   "name": "@commaai/flash",
   "version": "0.1.0",
-  "private": true,
-  "type": "module",
-  "scripts": {
-    "dev": "vite",
-    "build": "vite build",
-    "start": "vite preview",
-    "lint": "eslint . --ext js,jsx --report-unused-disable-directives",
-    "test": "vitest"
+  "devDependencies": {
+    "eslint": "^8.57.0",
+    "eslint-plugin-react": "^7.34.2",
+    "eslint-plugin-react-hooks": "^4.6.2",
+    "eslint-plugin-react-refresh": "^0.4.7"
   },
   "engines": {
     "node": ">=20.11.0"
   },
-  "dependencies": {
-    "@fontsource-variable/inter": "^5.0.18",
-    "@fontsource-variable/jetbrains-mono": "^5.0.21",
-    "comlink": "^4.4.1",
-    "crc-32": "^1.2.2",
-    "jssha": "^3.3.1",
-    "react": "^18.3.1",
-    "react-dom": "^18.3.1",
-    "xz-decompress": "^0.2.1"
+  "private": true,
+  "scripts": {
+    "dev": "python3 -m http.server 5173",
+    "build": "echo \"Error: no build specified\" && exit 0",
+    "start": "python3 -m http.server 5173",
+    "lint": "echo \"Error: no lint confugured\" && exit 0",
+    "test": "echo \"Error: no test confugured\" && exit 0"
   },
-  "devDependencies": {
-    "@tailwindcss/typography": "^0.5.13",
-    "@testing-library/jest-dom": "^6.4.5",
-    "@testing-library/react": "^15.0.7",
-    "@types/react": "^18.3.3",
-    "@types/react-dom": "^18.3.0",
-    "@vitejs/plugin-react": "^4.3.0",
-    "autoprefixer": "10.4.14",
-    "eslint": "^8.57.0",
-    "eslint-plugin-react": "^7.34.2",
-    "eslint-plugin-react-hooks": "^4.6.2",
-    "eslint-plugin-react-refresh": "^0.4.7",
-    "jsdom": "^22.1.0",
-    "postcss": "^8.4.38",
-    "tailwindcss": "^3.4.3",
-    "vite": "^5.2.12",
-    "vite-svg-loader": "^5.1.0",
-    "vitest": "^1.6.0"
-  }
+  "type": "module"
 }
diff --git a/postcss.config.js b/postcss.config.js
deleted file mode 100644
index 2e7af2b..0000000
--- a/postcss.config.js
+++ /dev/null
@@ -1,6 +0,0 @@
-export default {
-  plugins: {
-    tailwindcss: {},
-    autoprefixer: {},
-  },
-}
diff --git a/src/QDL/firehose.js b/src/QDL/firehose.js
index 42d22f2..e9bd14c 100644
--- a/src/QDL/firehose.js
+++ b/src/QDL/firehose.js
@@ -1,6 +1,6 @@
-import { xmlParser } from "./xmlParser"
-import { concatUint8Array, containsBytes, compareStringToBytes, sleep, readBlobAsBuffer } from "./utils"
-import * as Sparse from "./sparse"
+import { xmlParser } from "./xmlParser.js"
+import { concatUint8Array, containsBytes, compareStringToBytes, sleep, readBlobAsBuffer } from "./utils.js"
+import * as Sparse from "./sparse.js"
 
 
 class response {
diff --git a/src/QDL/gpt.js b/src/QDL/gpt.js
index 09a0640..5dd4eae 100644
--- a/src/QDL/gpt.js
+++ b/src/QDL/gpt.js
@@ -1,5 +1,5 @@
-import { containsBytes, bytes2Number } from "./utils"
-import { buf as crc32 } from "crc-32"
+import { containsBytes, bytes2Number } from "./utils.js"
+import CRC32 from "crc-32"
 
 export const AB_FLAG_OFFSET = 6;
 export const AB_PARTITION_ATTR_SLOT_ACTIVE = (0x1 << 2);
@@ -7,6 +7,7 @@ export const PART_ATT_PRIORITY_BIT = BigInt(48)
 export const PART_ATT_ACTIVE_BIT = BigInt(50)
 export const PART_ATT_ACTIVE_VAL = BigInt(0x1) << PART_ATT_ACTIVE_BIT
 
+const crc32 = CRC32.buf
 const efiType = {
   0x00000000 : "EFI_UNUSED",
   0xEBD0A0A2 : "EFI_BASIC_DATA",
diff --git a/src/QDL/qdl.js b/src/QDL/qdl.js
index 80cee25..e50731c 100644
--- a/src/QDL/qdl.js
+++ b/src/QDL/qdl.js
@@ -1,8 +1,8 @@
-import * as gpt from "./gpt"
-import { usbClass } from "./usblib"
-import { Sahara } from  "./sahara"
-import { Firehose } from "./firehose"
-import { concatUint8Array, runWithTimeout, containsBytes } from "./utils"
+import * as gpt from "./gpt.js"
+import { usbClass } from "./usblib.js"
+import { Sahara } from  "./sahara.js"
+import { Firehose } from "./firehose.js"
+import { concatUint8Array, runWithTimeout, containsBytes } from "./utils.js"
 
 
 export class qdlDevice {
diff --git a/src/QDL/sahara.js b/src/QDL/sahara.js
index cb9c3ea..739b153 100644
--- a/src/QDL/sahara.js
+++ b/src/QDL/sahara.js
@@ -1,6 +1,6 @@
-import { CommandHandler, cmd_t, sahara_mode_t, status_t, exec_cmd_t } from "./saharaDefs"
-import { concatUint8Array, packGenerator, readBlobAsBuffer } from "./utils";
-import config from "@/config"
+import { CommandHandler, cmd_t, sahara_mode_t, status_t, exec_cmd_t } from "./saharaDefs.js"
+import { concatUint8Array, packGenerator, readBlobAsBuffer } from "./utils.js";
+import config from "../config.js"
 
 
 export class Sahara {
diff --git a/src/QDL/saharaDefs.js b/src/QDL/saharaDefs.js
index 7258f74..a6f3a2f 100644
--- a/src/QDL/saharaDefs.js
+++ b/src/QDL/saharaDefs.js
@@ -1,4 +1,4 @@
-import { structHelper_io } from "./utils"
+import { structHelper_io } from "./utils.js"
 
 
 export const cmd_t = {
diff --git a/src/QDL/sparse.js b/src/QDL/sparse.js
index c0577eb..a734a1e 100644
--- a/src/QDL/sparse.js
+++ b/src/QDL/sparse.js
@@ -1,4 +1,4 @@
-import { readBlobAsBuffer } from "./utils";
+import { readBlobAsBuffer } from "./utils.js";
 
 const FILE_MAGIC = 0xed26ff3a;
 export const FILE_HEADER_SIZE = 28;
diff --git a/src/QDL/usblib.js b/src/QDL/usblib.js
index dc431d0..86dcd75 100644
--- a/src/QDL/usblib.js
+++ b/src/QDL/usblib.js
@@ -1,4 +1,4 @@
-import { concatUint8Array, sleep } from "./utils";
+import { concatUint8Array, sleep } from "./utils.js";
 
 const vendorID = 0x05c6;
 const productID = 0x9008;
diff --git a/src/app/App.js b/src/app/App.js
new file mode 100644
index 0000000..badf284
--- /dev/null
+++ b/src/app/App.js
@@ -0,0 +1,284 @@
+import React from 'react';
+import Flash from './Flash.js';
+
+export default function App(props) {
+  const version = props.version || 'dev';
+
+  return React.createElement(
+    'div',
+    { className: 'flex flex-col lg:flex-row flex-wrap' },
+    React.createElement(
+      'main',
+      {
+        className:
+          'p-12 md:p-16 lg:p-20 xl:p-24 w-screen max-w-none lg:max-w-prose lg:w-auto h-auto lg:h-screen lg:overflow-y-auto prose dark:prose-invert prose-green bg-white dark:bg-gray-900',
+      },
+      React.createElement(
+        'section',
+        null,
+        React.createElement('img', {
+          src: 'src/assets/comma.svg',
+          alt: 'comma',
+          width: 128,
+          height: 128,
+          className: 'dark:invert',
+        }),
+        React.createElement('h1', null, 'flash.comma.ai'),
+        React.createElement(
+          'p',
+          null,
+          'This tool allows you to flash AGNOS onto your comma device.'
+        ),
+        React.createElement(
+          'p',
+          null,
+          'AGNOS is the Ubuntu-based operating system for your ',
+          React.createElement(
+            'a',
+            {
+              href: 'https://comma.ai/shop/comma-3x',
+              target: '_blank',
+            },
+            'comma 3/3X'
+          ),
+          '.'
+        )
+      ),
+      React.createElement('hr'),
+      React.createElement(
+        'section',
+        null,
+        React.createElement('h2', null, 'Requirements'),
+        React.createElement(
+          'ul',
+          null,
+          React.createElement(
+            'li',
+            null,
+            'A web browser which supports WebUSB (such as Google Chrome, Microsoft Edge, Opera), running on Windows, macOS, Linux, or Android.'
+          ),
+          React.createElement(
+            'li',
+            null,
+            'A USB-C cable to power your device outside the car.'
+          ),
+          React.createElement(
+            'li',
+            null,
+            'Another USB-C cable to connect the device to your computer.'
+          )
+        ),
+        React.createElement('h3', null, 'USB Driver'),
+        React.createElement(
+          'p',
+          null,
+          'You need additional driver software for Windows before you connect your device.'
+        ),
+        React.createElement(
+          'ol',
+          null,
+          React.createElement(
+            'li',
+            null,
+            'Download and install ',
+            React.createElement(
+              'a',
+              { href: 'https://zadig.akeo.ie/' },
+              'Zadig'
+            ),
+            '.'
+          ),
+          React.createElement(
+            'li',
+            null,
+            'Under ',
+            React.createElement('code', null, 'Device'),
+            ' in the menu bar, select ',
+            React.createElement('code', null, 'Create New Device'),
+            '.',
+            React.createElement('img', {
+              src: 'src/assets/zadig_create_new_device.png',
+              alt: 'Zadig Create New Device',
+              width: 575,
+              height: 254,
+            })
+          ),
+          React.createElement(
+            'li',
+            null,
+            'Fill in three fields. The first field is just a description and you can fill in anything. The next two fields are very important. Fill them in with ',
+            React.createElement('code', null, '05C6'),
+            ' and ',
+            React.createElement('code', null, '9008'),
+            ' respectively. Press "Install Driver" and give it a few minutes to install.',
+            React.createElement('img', {
+              src: 'src/assets/zadig_form.png',
+              alt: 'Zadig Form',
+              width: 575,
+              height: 254,
+            })
+          )
+        ),
+        React.createElement(
+          'p',
+          null,
+          'No additional software is required for macOS or Linux.'
+        )
+      ),
+      React.createElement('hr'),
+      React.createElement(
+        'section',
+        null,
+        React.createElement('h2', null, 'QDL Mode'),
+        React.createElement(
+          'p',
+          null,
+          'Follow these steps to put your device into QDL mode:'
+        ),
+        React.createElement(
+          'ol',
+          null,
+          React.createElement(
+            'li',
+            null,
+            'Power off the device and wait for the LEDs to switch off.'
+          ),
+          React.createElement(
+            'li',
+            null,
+            'Connect the device to your computer using the USB-C port ',
+            React.createElement('strong', null, '(port 2)'),
+            '.'
+          ),
+          React.createElement(
+            'li',
+            null,
+            'Connect power to the OBD-C port ',
+            React.createElement('strong', null, '(port 1)'),
+            '.'
+          ),
+          React.createElement(
+            'li',
+            null,
+            'The device then should be visible as an option when choosing the device to flash'
+          )
+        ),
+        React.createElement('img', {
+          src: 'src/assets/fastboot-ports.svg',
+          alt: 'image showing comma three and two ports. the upper port is labeled 1. the lower port is labeled 2.',
+          width: 450,
+          height: 300,
+        })
+      ),
+      React.createElement('hr'),
+      React.createElement(
+        'section',
+        null,
+        React.createElement('h2', null, 'Flashing'),
+        React.createElement(
+          'p',
+          null,
+          'After your device is in QDL mode, you can click the button to start flashing. A prompt may appear to select a device; choose the device starts with ',
+          React.createElement('code', null, 'QUSB_BULK'),
+          '.'
+        ),
+        React.createElement(
+          'p',
+          null,
+          'The process can take 30+ minutes depending on your internet connection and system performance. Do not unplug the device until all steps are complete.'
+        )
+      ),
+      React.createElement('hr'),
+      React.createElement(
+        'section',
+        null,
+        React.createElement('h2', null, 'Troubleshooting'),
+        React.createElement('h3', null, 'Too slow'),
+        React.createElement(
+          'p',
+          null,
+          'It is recommended that you use a USB 3.0 cable when flashing since it will speed up the flashing time by a lot.'
+        ),
+        React.createElement('h3', null, 'Cannot enter QDL'),
+        React.createElement(
+          'p',
+          null,
+          "Try using a different USB cable or USB port. Sometimes USB 2.0 ports work better than USB 3.0 (blue) ports. If you're using a USB hub, try connecting the device directly to your computer, or alternatively use a USB hub between your computer and the device."
+        ),
+        React.createElement('h3', null, "My device's screen is blank"),
+        React.createElement(
+          'p',
+          null,
+          'The device screen will be blank in QDL mode, but you can verify that it is in QDL if the device shows up when you press the Flash icon.'
+        ),
+        React.createElement(
+          'h3',
+          null,
+          'After flashing, device says unable to mount data partition'
+        ),
+        React.createElement(
+          'p',
+          null,
+          'This is expected after the filesystem is erased. Press confirm to finish resetting your device.'
+        ),
+        React.createElement('h3', null, 'General Tips'),
+        React.createElement(
+          'ul',
+          null,
+          React.createElement('li', null, 'Try another computer or OS'),
+          React.createElement(
+            'li',
+            null,
+            'Try different USB ports on your computer'
+          ),
+          React.createElement(
+            'li',
+            null,
+            'Try different USB-C cables, including the OBD-C cable that came with the device'
+          )
+        ),
+        React.createElement('h3', null, 'Other questions'),
+        React.createElement(
+          'p',
+          null,
+          'If you need help, join our ',
+          React.createElement(
+            'a',
+            {
+              href: 'https://discord.comma.ai',
+              target: '_blank',
+            },
+            'Discord server'
+          ),
+          ' and go to the ',
+          React.createElement('strong', null, '#hw-three-3x'),
+          ' channel.'
+        )
+      ),
+      React.createElement(
+        'div',
+        { className: 'hidden lg:block' },
+        React.createElement('hr'),
+        'flash.comma.ai version: ',
+        React.createElement('code', null, version)
+      )
+    ),
+    React.createElement(
+      'div',
+      {
+        className:
+          'lg:flex-1 h-[700px] lg:h-screen bg-gray-100 dark:bg-gray-800',
+      },
+      React.createElement(Flash, null)
+    ),
+    React.createElement(
+      'div',
+      {
+        className:
+          'w-screen max-w-none p-12 md:p-16 prose dark:prose-invert bg-white dark:bg-gray-900 lg:hidden',
+      },
+      'flash.comma.ai version: ',
+      React.createElement('code', null, version.substring(0, 7))
+    )
+  );
+}
\ No newline at end of file
diff --git a/src/app/App.test.jsx b/src/app/App.test.jsx
deleted file mode 100644
index 206de72..0000000
--- a/src/app/App.test.jsx
+++ /dev/null
@@ -1,10 +0,0 @@
-import { Suspense } from 'react'
-import { expect, test } from 'vitest'
-import { render, screen } from '@testing-library/react'
-
-import App from '.'
-
-test('renders without crashing', () => {
-  render(<Suspense fallback="loading"><App /></Suspense>)
-  expect(screen.getByText('flash.comma.ai')).toBeInTheDocument()
-})
diff --git a/src/app/Flash.js b/src/app/Flash.js
new file mode 100644
index 0000000..0bee9d1
--- /dev/null
+++ b/src/app/Flash.js
@@ -0,0 +1,319 @@
+import React, { useCallback, useState } from 'react'
+
+import { Step, Error, useQdl } from '../utils/flash.js'
+
+const steps = {
+  [Step.INITIALIZING]: {
+    status: 'Initializing...',
+    bgColor: 'bg-gray-400 dark:bg-gray-700',
+    icon: 'src/assets/cloud.svg',
+  },
+  [Step.READY]: {
+    status: 'Ready',
+    description: 'Tap the button above to begin',
+    bgColor: 'bg-[#51ff00]',
+    icon: 'src/assets/bolt.svg',
+    iconStyle: '',
+  },
+  [Step.CONNECTING]: {
+    status: 'Waiting for connection',
+    description: 'Follow the instructions to connect your device to your computer',
+    bgColor: 'bg-yellow-500',
+    icon: 'src/assets/cable.svg',
+  },
+  [Step.DOWNLOADING]: {
+    status: 'Downloading...',
+    bgColor: 'bg-blue-500',
+    icon: 'src/assets/cloud_download.svg',
+  },
+  [Step.UNPACKING]: {
+    status: 'Unpacking...',
+    bgColor: 'bg-blue-500',
+    icon: 'src/assets/cloud_download.svg',
+  },
+  [Step.FLASHING]: {
+    status: 'Flashing device...',
+    description: 'Do not unplug your device until the process is complete.',
+    bgColor: 'bg-lime-400',
+    icon: 'src/assets/system_update_c3.svg',
+  },
+  [Step.ERASING]: {
+    status: 'Erasing device...',
+    bgColor: 'bg-lime-400',
+    icon: 'src/assets/system_update_c3.svg',
+  },
+  [Step.DONE]: {
+    status: 'Done',
+    description: 'Your device has been updated successfully. You can now unplug the all cables from your device, '
+                 +'and wait for the light to stop blinking then plug the power cord in again. '
+                 +' To complete the system reset, follow the instructions on your device.',
+    bgColor: 'bg-green-500',
+    icon: 'src/assets/done.svg',
+  },
+}
+
+const errors = {
+  [Error.UNKNOWN]: {
+    status: 'Unknown error',
+    description: 'An unknown error has occurred. Unplug your device and wait for 20s. ' +
+                 'Restart your browser and try again.',
+    bgColor: 'bg-red-500',
+    icon: 'src/assets/exclamation.svg',
+  },
+  [Error.UNRECOGNIZED_DEVICE]: {
+    status: 'Unrecognized device',
+    description: 'The device connected to your computer is not supported.',
+    bgColor: 'bg-yellow-500',
+    icon: 'src/assets/device_question_c3.svg',
+  },
+  [Error.LOST_CONNECTION]: {
+    status: 'Lost connection',
+    description: 'The connection to your device was lost. Check that your cables are connected properly and try again. ' +
+                 'Unplug your device and wait for around 20s.',
+    icon: 'src/assets/cable.svg',
+  },
+  [Error.DOWNLOAD_FAILED]: {
+    status: 'Download failed',
+    description:'The system image could not be downloaded. Unplug your device and wait for 20s. ' +
+                'Check your internet connection and try again.',
+    icon: 'src/assets/cloud_error.svg',
+  },
+  [Error.CHECKSUM_MISMATCH]: {
+    status: 'Download mismatch',
+    description: 'The system image downloaded does not match the expected checksum. Try again.',
+    icon: 'src/assets/frame_alert.svg',
+  },
+  [Error.FLASH_FAILED]: {
+    status: 'Flash failed',
+    description: 'The system image could not be flashed to your device. Try using a different cable, USB port, or ' +
+      'computer. If the problem persists, join the #hw-three-3x channel on Discord for help.',
+    icon: 'src/assets/device_exclamation_c3.svg',
+  },
+  [Error.ERASE_FAILED]: {
+    status: 'Erase failed',
+    description: 'The device could not be erased. Try using a different cable, USB port, or computer. If the problem ' +
+      'persists, join the #hw-three-3x channel on Discord for help.',
+    icon: 'src/assets/device_exclamation_c3.svg',
+  },
+  [Error.REQUIREMENTS_NOT_MET]: {
+    status: 'Requirements not met',
+    description: 'Your system does not meet the requirements to flash your device. Make sure to use a browser which ' +
+      'supports WebUSB and is up to date.',
+  },
+}
+
+const detachScript = [
+  "for d in /sys/bus/usb/drivers/qcserial/*-*; do [ -e \"$d\" ] && echo -n \"$(basename $d)\" | sudo tee /sys/bus/usb/drivers/qcserial/unbind > /dev/null; done"
+];
+
+const isLinux = navigator.userAgent.toLowerCase().includes('linux');
+
+function LinearProgress({ value, barColor }) {
+  if (value === -1 || value > 100) value = 100;
+
+  return React.createElement(
+    "div",
+    { className: "relative w-full h-2 bg-gray-200 rounded-full overflow-hidden" },
+    React.createElement("div", {
+      className: `absolute top-0 bottom-0 left-0 w-full transition-all ${barColor}`,
+      style: { transform: `translateX(${value - 100}%)` },
+    })
+  );
+}
+
+
+function USBIndicator() {
+  return React.createElement("div",
+    { className: "flex flex-row gap-2" },
+    React.createElement("svg",
+      {
+        xmlns: "http://www.w3.org/2000/svg",
+        viewBox: "0 96 960 960",
+        className: "text-green-500 dark:text-[#51ff00]",
+        height: "24",
+        width: "24",
+      },
+      React.createElement("path", {
+        fill: "currentColor",
+        d: "M480 976q-32 0-52-20t-20-52q0-22 11-40t31-29V724H302q-24 0-42-18t-18-42V555q-20-9-31-26.609-11-17.608-11-40.108Q200 456 220 436t52-20q32 0 52 20t20 52.411Q344 511 333 528.5T302 555v109h148V324h-80l110-149 110 149h-80v340h148V560h-42V416h144v144h-42v104q0 24-18 42t-42 18H510v111q19.95 10.652 30.975 29.826Q552 884 552 904q0 32-20 52t-52 20Z",
+      })
+    ),
+    React.createElement("span", null, "Device connected")
+  );
+}
+
+
+function SerialIndicator({ serial }) {
+  return React.createElement(
+    "div",
+    { className: "flex flex-row gap-2" },
+    React.createElement("span", null, "Serial:", React.createElement("span", { className: "ml-2 font-mono" }, serial || "unknown"))
+  );
+}
+
+
+function DeviceState({ serial }) {
+  return React.createElement(
+    "div",
+    {
+      className:
+        "absolute bottom-0 m-0 lg:m-4 p-4 w-full sm:w-auto sm:min-w-[350px] sm:border sm:border-gray-200 dark:sm:border-gray-600 bg-white dark:bg-gray-700 text-black dark:text-white rounded-md flex flex-row gap-2",
+      style: { left: "50%", transform: "translate(-50%, -50%)" },
+    },
+    React.createElement(USBIndicator),
+    React.createElement("span", { className: "text-gray-400" }, "|"),
+    React.createElement(SerialIndicator, { serial })
+  );
+}
+
+
+function beforeUnloadListener(event) {
+  // NOTE: not all browsers will show this message
+  event.preventDefault()
+  return (event.returnValue = "Flash in progress. Are you sure you want to leave?")
+}
+
+
+export default function Flash() {
+  const {
+    step,
+    message,
+    progress,
+    error,
+
+    onContinue,
+    onRetry,
+
+    connected,
+    serial,
+  } = useQdl()
+
+  const handleContinue = useCallback(() => {
+    onContinue?.()
+  }, [onContinue])
+
+  const handleRetry = useCallback(() => {
+    onRetry?.()
+  }, [onRetry])
+
+  const uiState = steps[step]
+  if (error) {
+    Object.assign(uiState, errors[Error.UNKNOWN], errors[error])
+  }
+  const { status, description, bgColor, icon, iconStyle = 'invert' } = uiState
+
+  let title
+  if (message && !error) {
+    title = message + '...'
+    if (progress >= 0) {
+      title += ` (${(progress * 100).toFixed(0)}%)`
+    }
+  } else {
+    title = status
+  }
+
+  // warn the user if they try to leave the page while flashing
+  if (Step.DOWNLOADING <= step && step <= Step.ERASING) {
+    window.addEventListener("beforeunload", beforeUnloadListener, { capture: true })
+  } else {
+    window.removeEventListener("beforeunload", beforeUnloadListener, { capture: true })
+  }
+
+  const [copied, setCopied] = useState(false);
+  const handleCopy = () => {
+    setCopied(true);
+    setTimeout(() => {
+      setCopied(false);
+    }, 1000);
+  };
+
+
+  return React.createElement(
+    "div",
+    { id: "flash", className: "relative flex flex-col gap-8 justify-center items-center h-full" },
+    React.createElement(
+      "div",
+      {
+        className: `p-8 rounded-full ${bgColor}`,
+        style: { cursor: onContinue ? "pointer" : "default" },
+        onClick: handleContinue,
+      },
+      React.createElement("img", {
+        src: icon,
+        alt: "cable",
+        width: 128,
+        height: 128,
+        className: `${iconStyle} ${!error && step !== Step.DONE ? "animate-pulse" : ""}`,
+      })
+    ),
+    React.createElement(
+      "div",
+      {
+        className: "w-full max-w-3xl px-8 transition-opacity duration-300",
+        style: { opacity: progress === -1 ? 0 : 1 },
+      },
+      React.createElement(LinearProgress, { value: progress * 100, barColor: bgColor })
+    ),
+    React.createElement("span", { className: "text-3xl dark:text-white font-mono font-light" }, title),
+    React.createElement("span", { className: "text-xl dark:text-white px-8 max-w-xl" }, description),
+    (title === "Lost connection" || title === "Ready") &&
+      isLinux &&
+      React.createElement(
+        React.Fragment,
+        null,
+        React.createElement(
+          "span",
+          { className: "text-l dark:text-white px-2 max-w-xl" },
+          "It seems that you're on Linux, make sure to run the script below in your terminal after plugging in your device."
+        ),
+        React.createElement(
+          "div",
+          { className: "relative mt-2 max-w-3xl" },
+          React.createElement(
+            "div",
+            { className: "bg-gray-200 dark:bg-gray-800 rounded-md overflow-x-auto" },
+            React.createElement(
+              "div",
+              { className: "relative" },
+              React.createElement(
+                "pre",
+                {
+                  className:
+                    "font-mono text-sm text-gray-800 dark:text-gray-200 bg-gray-300 dark:bg-gray-700 rounded-md p-6 flex-grow max-w-m text-wrap",
+                },
+                detachScript.map((line, index) =>
+                  React.createElement("span", { key: index, className: "block" }, line)
+                )
+              ),
+              React.createElement(
+                "div",
+                { className: "absolute top-2 right-2" },
+                React.createElement(
+                  "button",
+                  {
+                    onClick: () => {
+                      navigator.clipboard.writeText(detachScript.join("\n"));
+                      handleCopy();
+                    },
+                    className: `bg-${copied ? "green" : "blue"}-500 text-white px-1 py-1 rounded-md ml-2 text-sm`,
+                  },
+                  "Copy"
+                )
+              )
+            )
+          )
+        )
+      ),
+    error &&
+      React.createElement(
+        "button",
+        {
+          className:
+            "px-4 py-2 rounded-md bg-gray-200 hover:bg-gray-300 dark:bg-gray-700 dark:hover:bg-gray-600 text-gray-800 dark:text-gray-200 transition-colors",
+          onClick: handleRetry,
+        },
+        "Retry"
+      ),
+    connected && React.createElement(DeviceState, { connected, serial })
+  )
+}
diff --git a/src/app/Flash.jsx b/src/app/Flash.jsx
deleted file mode 100644
index 1bff6d1..0000000
--- a/src/app/Flash.jsx
+++ /dev/null
@@ -1,303 +0,0 @@
-import { useCallback, useState } from 'react'
-
-import { Step, Error, useQdl } from '@/utils/flash'
-
-import bolt from '@/assets/bolt.svg'
-import cable from '@/assets/cable.svg'
-import cloud from '@/assets/cloud.svg'
-import cloudDownload from '@/assets/cloud_download.svg'
-import cloudError from '@/assets/cloud_error.svg'
-import deviceExclamation from '@/assets/device_exclamation_c3.svg'
-import deviceQuestion from '@/assets/device_question_c3.svg'
-import done from '@/assets/done.svg'
-import exclamation from '@/assets/exclamation.svg'
-import frameAlert from '@/assets/frame_alert.svg'
-import systemUpdate from '@/assets/system_update_c3.svg'
-
-
-const steps = {
-  [Step.INITIALIZING]: {
-    status: 'Initializing...',
-    bgColor: 'bg-gray-400 dark:bg-gray-700',
-    icon: cloud,
-  },
-  [Step.READY]: {
-    status: 'Ready',
-    description: 'Tap the button above to begin',
-    bgColor: 'bg-[#51ff00]',
-    icon: bolt,
-    iconStyle: '',
-  },
-  [Step.CONNECTING]: {
-    status: 'Waiting for connection',
-    description: 'Follow the instructions to connect your device to your computer',
-    bgColor: 'bg-yellow-500',
-    icon: cable,
-  },
-  [Step.DOWNLOADING]: {
-    status: 'Downloading...',
-    bgColor: 'bg-blue-500',
-    icon: cloudDownload,
-  },
-  [Step.UNPACKING]: {
-    status: 'Unpacking...',
-    bgColor: 'bg-blue-500',
-    icon: cloudDownload,
-  },
-  [Step.FLASHING]: {
-    status: 'Flashing device...',
-    description: 'Do not unplug your device until the process is complete.',
-    bgColor: 'bg-lime-400',
-    icon: systemUpdate,
-  },
-  [Step.ERASING]: {
-    status: 'Erasing device...',
-    bgColor: 'bg-lime-400',
-    icon: systemUpdate,
-  },
-  [Step.DONE]: {
-    status: 'Done',
-    description: 'Your device has been updated successfully. You can now unplug the all cables from your device, '
-                 +'and wait for the light to stop blinking then plug the power cord in again. '
-                 +' To complete the system reset, follow the instructions on your device.',
-    bgColor: 'bg-green-500',
-    icon: done,
-  },
-}
-
-const errors = {
-  [Error.UNKNOWN]: {
-    status: 'Unknown error',
-    description: 'An unknown error has occurred. Unplug your device and wait for 20s. ' +
-                 'Restart your browser and try again.',
-    bgColor: 'bg-red-500',
-    icon: exclamation,
-  },
-  [Error.UNRECOGNIZED_DEVICE]: {
-    status: 'Unrecognized device',
-    description: 'The device connected to your computer is not supported.',
-    bgColor: 'bg-yellow-500',
-    icon: deviceQuestion,
-  },
-  [Error.LOST_CONNECTION]: {
-    status: 'Lost connection',
-    description: 'The connection to your device was lost. Check that your cables are connected properly and try again. ' +
-                 'Unplug your device and wait for around 20s.',
-    icon: cable,
-  },
-  [Error.DOWNLOAD_FAILED]: {
-    status: 'Download failed',
-    description:'The system image could not be downloaded. Unplug your device and wait for 20s. ' +
-                'Check your internet connection and try again.',
-    icon: cloudError,
-  },
-  [Error.CHECKSUM_MISMATCH]: {
-    status: 'Download mismatch',
-    description: 'The system image downloaded does not match the expected checksum. Try again.',
-    icon: frameAlert,
-  },
-  [Error.FLASH_FAILED]: {
-    status: 'Flash failed',
-    description: 'The system image could not be flashed to your device. Try using a different cable, USB port, or ' +
-      'computer. If the problem persists, join the #hw-three-3x channel on Discord for help.',
-    icon: deviceExclamation,
-  },
-  [Error.ERASE_FAILED]: {
-    status: 'Erase failed',
-    description: 'The device could not be erased. Try using a different cable, USB port, or computer. If the problem ' +
-      'persists, join the #hw-three-3x channel on Discord for help.',
-    icon: deviceExclamation,
-  },
-  [Error.REQUIREMENTS_NOT_MET]: {
-    status: 'Requirements not met',
-    description: 'Your system does not meet the requirements to flash your device. Make sure to use a browser which ' +
-      'supports WebUSB and is up to date.',
-  },
-}
-
-const detachScript = [
-  "for d in /sys/bus/usb/drivers/qcserial/*-*; do [ -e \"$d\" ] && echo -n \"$(basename $d)\" | sudo tee /sys/bus/usb/drivers/qcserial/unbind > /dev/null; done"
-];
-
-const isLinux = navigator.userAgent.toLowerCase().includes('linux');
-
-function LinearProgress({ value, barColor }) {
-  if (value === -1 || value > 100) value = 100
-  return (
-    <div className="relative w-full h-2 bg-gray-200 rounded-full overflow-hidden">
-      <div
-        className={`absolute top-0 bottom-0 left-0 w-full transition-all ${barColor}`}
-        style={{ transform: `translateX(${value - 100}%)` }}
-      />
-    </div>
-  )
-}
-
-
-function USBIndicator() {
-  return <div className="flex flex-row gap-2">
-    <svg
-      xmlns="http://www.w3.org/2000/svg"
-      viewBox="0 96 960 960"
-      className="text-green-500 dark:text-[#51ff00]"
-      height="24"
-      width="24"
-    >
-      <path
-        fill="currentColor"
-        d="M480 976q-32 0-52-20t-20-52q0-22 11-40t31-29V724H302q-24 0-42-18t-18-42V555q-20-9-31-26.609-11-17.608-11-40.108Q200 456 220 436t52-20q32 0 52 20t20 52.411Q344 511 333 528.5T302 555v109h148V324h-80l110-149 110 149h-80v340h148V560h-42V416h144v144h-42v104q0 24-18 42t-42 18H510v111q19.95 10.652 30.975 29.826Q552 884 552 904q0 32-20 52t-52 20Z"
-      />
-    </svg>
-    Device connected
-  </div>
-}
-
-
-function SerialIndicator({ serial }) {
-  return <div className="flex flex-row gap-2">
-    <span>
-      Serial:
-      <span className="ml-2 font-mono">{serial || 'unknown'}</span>
-    </span>
-  </div>
-}
-
-
-function DeviceState({ serial }) {
-  return (
-    <div
-      className="absolute bottom-0 m-0 lg:m-4 p-4 w-full sm:w-auto sm:min-w-[350px] sm:border sm:border-gray-200 dark:sm:border-gray-600 bg-white dark:bg-gray-700 text-black dark:text-white rounded-md flex flex-row gap-2"
-      style={{ left: '50%', transform: 'translate(-50%, -50%)' }}
-    >
-      <USBIndicator />
-      <span className="text-gray-400">|</span>
-      <SerialIndicator serial={serial} />
-    </div>
-  )
-}
-
-
-function beforeUnloadListener(event) {
-  // NOTE: not all browsers will show this message
-  event.preventDefault()
-  return (event.returnValue = "Flash in progress. Are you sure you want to leave?")
-}
-
-
-export default function Flash() {
-  const {
-    step,
-    message,
-    progress,
-    error,
-
-    onContinue,
-    onRetry,
-
-    connected,
-    serial,
-  } = useQdl()
-
-  const handleContinue = useCallback(() => {
-    onContinue?.()
-  }, [onContinue])
-
-  const handleRetry = useCallback(() => {
-    onRetry?.()
-  }, [onRetry])
-
-  const uiState = steps[step]
-  if (error) {
-    Object.assign(uiState, errors[Error.UNKNOWN], errors[error])
-  }
-  const { status, description, bgColor, icon, iconStyle = 'invert' } = uiState
-
-  let title
-  if (message && !error) {
-    title = message + '...'
-    if (progress >= 0) {
-      title += ` (${(progress * 100).toFixed(0)}%)`
-    }
-  } else {
-    title = status
-  }
-
-  // warn the user if they try to leave the page while flashing
-  if (Step.DOWNLOADING <= step && step <= Step.ERASING) {
-    window.addEventListener("beforeunload", beforeUnloadListener, { capture: true })
-  } else {
-    window.removeEventListener("beforeunload", beforeUnloadListener, { capture: true })
-  }
-
-  const [copied, setCopied] = useState(false);
-  const handleCopy = () => {
-    setCopied(true);
-    setTimeout(() => {
-      setCopied(false);
-    }, 1000);
-  };
-
-
-  return (
-    <div id="flash" className="relative flex flex-col gap-8 justify-center items-center h-full">
-      <div
-        className={`p-8 rounded-full ${bgColor}`}
-        style={{ cursor: onContinue ? 'pointer' : 'default' }}
-        onClick={handleContinue}
-      >
-        <img
-          src={icon}
-          alt="cable"
-          width={128}
-          height={128}
-          className={`${iconStyle} ${!error && step !== Step.DONE ? 'animate-pulse' : ''}`}
-        />
-      </div>
-      <div className="w-full max-w-3xl px-8 transition-opacity duration-300" style={{ opacity: progress === -1 ? 0 : 1 }}>
-        <LinearProgress value={progress * 100} barColor={bgColor} />
-      </div>
-      <span className={`text-3xl dark:text-white font-mono font-light`}>{title}</span>
-      <span className={`text-xl dark:text-white px-8 max-w-xl`}>{description}</span>
-      {(title === "Lost connection" || title === "Ready") && isLinux && (
-        <>
-          <span className={`text-l dark:text-white px-2 max-w-xl`}>
-            It seems that you&apos;re on Linux, make sure to run the script below in your terminal after plugging in your device.
-          </span>
-          <div className="relative mt-2 max-w-3xl">
-            <div className="bg-gray-200 dark:bg-gray-800 rounded-md overflow-x-auto">
-              <div className="relative">
-                <pre className="font-mono text-sm text-gray-800 dark:text-gray-200 bg-gray-300 dark:bg-gray-700 rounded-md p-6 flex-grow max-w-m text-wrap">
-                  {detachScript.map((line, index) => (
-                    <span key={index} className="block">
-                      {line}
-                    </span>
-                  ))}
-                </pre>
-                <div className="absolute top-2 right-2">
-                  <button
-                    onClick={() => {
-                      navigator.clipboard.writeText(detachScript.join('\n'));
-                      handleCopy();
-                    }}
-                    className={`bg-${copied ? 'green' : 'blue'}-500 text-white px-1 py-1 rounded-md ml-2 text-sm`}
-                  >
-                    Copy
-                  </button>
-                </div>
-              </div>
-            </div>
-          </div>
-        </>
-      )}
-      {error && (
-        <button
-          className="px-4 py-2 rounded-md bg-gray-200 hover:bg-gray-300 dark:bg-gray-700 dark:hover:bg-gray-600 text-gray-800 dark:text-gray-200 transition-colors"
-          onClick={handleRetry}
-        >
-          Retry
-        </button>
-      ) || false}
-      {connected && <DeviceState connected={connected} serial={serial} />}
-    </div>
-  )
-}
diff --git a/src/app/index.jsx b/src/app/index.jsx
deleted file mode 100644
index cd4369f..0000000
--- a/src/app/index.jsx
+++ /dev/null
@@ -1,160 +0,0 @@
-import { Suspense, lazy } from 'react'
-
-import comma from '../assets/comma.svg'
-import fastbootPorts from '../assets/fastboot-ports.svg'
-import zadigCreateNewDevice from '../assets/zadig_create_new_device.png'
-import zadigForm from '../assets/zadig_form.png'
-
-const Flash = lazy(() => import('./Flash'))
-
-export default function App() {
-  const version = import.meta.env.VITE_PUBLIC_GIT_SHA || 'dev'
-  console.info(`flash.comma.ai version: ${version}`);
-  return (
-    <div className="flex flex-col lg:flex-row flex-wrap">
-      <main className="p-12 md:p-16 lg:p-20 xl:p-24 w-screen max-w-none lg:max-w-prose lg:w-auto h-auto lg:h-screen lg:overflow-y-auto prose dark:prose-invert prose-green bg-white dark:bg-gray-900">
-        <section>
-          <img src={comma} alt="comma" width={128} height={128} className="dark:invert" />
-          <h1>flash.comma.ai</h1>
-
-          <p>This tool allows you to flash AGNOS onto your comma device.</p>
-          <p>
-            AGNOS is the Ubuntu-based operating system for your{" "}
-            <a href="https://comma.ai/shop/comma-3x" target="_blank">comma 3/3X</a>.
-          </p>
-        </section>
-        <hr />
-
-        <section>
-          <h2>Requirements</h2>
-          <ul>
-            <li>
-              A web browser which supports WebUSB (such as Google Chrome, Microsoft Edge, Opera), running on Windows, macOS, Linux, or Android.
-            </li>
-            <li>
-              A USB-C cable to power your device outside the car.
-            </li>
-            <li>
-              Another USB-C cable to connect the device to your computer.
-            </li>
-          </ul>
-          <h3>USB Driver</h3>
-          <p>
-            You need additional driver software for Windows before you connect
-            your device.
-          </p>
-          <ol>
-            <li>
-              Download and install <a href="https://zadig.akeo.ie/">Zadig</a>.
-            </li>
-            <li>
-              Under <code>Device</code> in the menu bar, select <code>Create New Device</code>.
-              <img
-                src={zadigCreateNewDevice}
-                alt="Zadig Create New Device"
-                width={575}
-                height={254}
-              />
-            </li>
-            <li>
-              Fill in three fields. The first field is just a description and
-              you can fill in anything.  The next two fields are very important.
-              Fill them in with <code>05C6</code> and <code>9008</code> respectively.
-              Press &quot;Install Driver&quot; and give it a few minutes to install.
-              <img
-                src={zadigForm}
-                alt="Zadig Form"
-                width={575}
-                height={254}
-              />
-            </li>
-          </ol>
-          <p>
-            No additional software is required for macOS or Linux.
-          </p>
-        </section>
-        <hr />
-
-        <section>
-          <h2>QDL Mode</h2>
-          <p>Follow these steps to put your device into QDL mode:</p>
-          <ol>
-            <li>Power off the device and wait for the LEDs to switch off.</li>
-            <li>Connect the device to your computer using the USB-C port <strong>(port 2)</strong>.</li>
-            <li>Connect power to the OBD-C port <strong>(port 1)</strong>.</li>
-            <li>The device then should be visible as an option when choosing the device to flash</li>
-          </ol>
-          <img
-            src={fastbootPorts}
-            alt="image showing comma three and two ports. the upper port is labeled 1. the lower port is labeled 2."
-            width={450}
-            height={300}
-          />
-        </section>
-        <hr />
-
-        <section>
-          <h2>Flashing</h2>
-          <p>
-            After your device is in QDL mode, you can click the button to start flashing. A prompt may appear to
-            select a device; choose the device starts with <code>QUSB_BULK</code>.
-          </p>
-          <p>
-            The process can take 30+ minutes depending on your internet connection and system performance. Do not
-            unplug the device until all steps are complete.
-          </p>
-        </section>
-        <hr />
-
-        <section>
-          <h2>Troubleshooting</h2>
-          <h3>Too slow</h3>
-          <p>
-            It is recommended that you use a USB 3.0 cable when flashing since it will speed up the flashing time by a lot.
-          </p>
-          <h3>Cannot enter QDL</h3>
-          <p>
-            Try using a different USB cable or USB port. Sometimes USB 2.0 ports work better than USB 3.0 (blue) ports.
-            If you&apos;re using a USB hub, try connecting the device directly to your computer, or alternatively use a
-            USB hub between your computer and the device.
-          </p>
-          <h3>My device&apos;s screen is blank</h3>
-          <p>
-            The device screen will be blank in QDL mode, but you can verify that it is in QDL if the device shows up
-            when you press the Flash icon.
-          </p>
-          <h3>After flashing, device says unable to mount data partition</h3>
-          <p>
-            This is expected after the filesystem is erased. Press confirm to finish resetting your device.
-          </p>
-          <h3>General Tips</h3>
-          <ul>
-            <li>Try another computer or OS</li>
-            <li>Try different USB ports on your computer</li>
-            <li>Try different USB-C cables, including the OBD-C cable that came with the device</li>
-          </ul>
-          <h3>Other questions</h3>
-          <p>
-            If you need help, join our <a href="https://discord.comma.ai" target="_blank">Discord server</a> and go to
-            the <strong>#hw-three-3x</strong> channel.
-          </p>
-        </section>
-
-        <div className="hidden lg:block">
-          <hr />
-          flash.comma.ai version: <code>{version}</code>
-        </div>
-      </main>
-
-      <div className="lg:flex-1 h-[700px] lg:h-screen bg-gray-100 dark:bg-gray-800">
-        <Suspense fallback={<p className="text-black dark:text-white">Loading...</p>}>
-          <Flash />
-        </Suspense>
-      </div>
-
-      <div className="w-screen max-w-none p-12 md:p-16 prose dark:prose-invert bg-white dark:bg-gray-900 lg:hidden">
-        flash.comma.ai version: <code>{version.substring(0, 7)}</code>
-      </div>
-    </div>
-  )
-}
diff --git a/src/main.js b/src/main.js
new file mode 100644
index 0000000..755f65e
--- /dev/null
+++ b/src/main.js
@@ -0,0 +1,9 @@
+import React from 'react'
+import ReactDOM from 'react-dom'
+import App from './app/App.js'
+
+ReactDOM.createRoot(document.getElementById('root')).render(
+  React.createElement(React.StrictMode, null,
+    React.createElement(App, null)
+  )
+)
\ No newline at end of file
diff --git a/src/main.jsx b/src/main.jsx
deleted file mode 100644
index 40fea3e..0000000
--- a/src/main.jsx
+++ /dev/null
@@ -1,14 +0,0 @@
-import React from 'react'
-import ReactDOM from 'react-dom/client'
-
-import '@fontsource-variable/inter'
-import '@fontsource-variable/jetbrains-mono'
-
-import './index.css'
-import App from './app'
-
-ReactDOM.createRoot(document.getElementById('root')).render(
-  <React.StrictMode>
-    <App />
-  </React.StrictMode>,
-)
diff --git a/src/utils/flash.js b/src/utils/flash.js
index 0fe2776..405df98 100644
--- a/src/utils/flash.js
+++ b/src/utils/flash.js
@@ -1,14 +1,14 @@
 import { useEffect, useRef, useState } from 'react'
 
-import { concatUint8Array } from '@/QDL/utils'
-import { qdlDevice } from '@/QDL/qdl'
+import { concatUint8Array } from '../QDL/utils.js'
+import { qdlDevice } from '../QDL/qdl.js'
 import * as Comlink from 'comlink'
 
-import config from '@/config'
-import { download } from '@/utils/blob'
-import { useImageWorker } from '@/utils/image'
-import { createManifest } from '@/utils/manifest'
-import { withProgress } from '@/utils/progress'
+import config from '../config.js'
+import { download } from '../utils/blob.js'
+import { useImageWorker } from '../utils/image.js'
+import { createManifest } from '../utils/manifest.js'
+import { withProgress } from '../utils/progress.js'
 
 /**
  * @typedef {import('./manifest.js').Image} Image
@@ -125,7 +125,7 @@ export function useQdl() {
           break
         }
 
-        imageWorker.current?.init()
+        Promise.resolve(() => imageWorker.current.init())
           .then(() => download(config.manifests['release']))
           .then(blob => blob.text())
           .then(text => {
diff --git a/src/utils/image.js b/src/utils/image.js
index ed27f09..fd0951d 100644
--- a/src/utils/image.js
+++ b/src/utils/image.js
@@ -6,7 +6,7 @@ export function useImageWorker() {
   const apiRef = useRef()
 
   useEffect(() => {
-    const worker = new Worker(new URL('../workers/image.worker', import.meta.url), {
+    const worker = new Worker('src/workers/image.worker.js', {
       type: 'module',
     })
     apiRef.current = Comlink.wrap(worker)
diff --git a/src/utils/manifest.test.js b/src/utils/manifest.test.js
deleted file mode 100644
index 94b22df..0000000
--- a/src/utils/manifest.test.js
+++ /dev/null
@@ -1,76 +0,0 @@
-import { describe, expect, test, vi } from 'vitest'
-
-import * as Comlink from 'comlink'
-
-import config from '../config'
-import { getManifest } from './manifest'
-
-async function getImageWorker() {
-  let imageWorker
-
-  vi.mock('comlink')
-  vi.mocked(Comlink.expose).mockImplementation(worker => {
-    imageWorker = worker
-    imageWorker.init()
-  })
-
-  vi.resetModules() // this makes the import be reevaluated on each call
-  await import('./../workers/image.worker')
-
-  return imageWorker
-}
-
-for (const [branch, manifestUrl] of Object.entries(config.manifests)) {
-  describe(`${branch} manifest`, async () => {
-    const images = await getManifest(manifestUrl)
-
-    // Check all images are present
-    expect(images.length).toBe(7)
-
-    for (const image of images) {
-      describe(`${image.name} image`, async () => {
-        test('xz archive', () => {
-          expect(image.archiveFileName, 'archive to be in xz format').toContain('.xz')
-          expect(image.archiveUrl, 'archive url to be in xz format').toContain('.xz')
-        })
-
-        if (image.name === 'system') {
-          test('alt image', () => {
-            expect(image.sparse, 'system image to be sparse').toBe(true)
-            expect(image.fileName, 'system image to be skip chunks').toContain('-skip-chunks-')
-            expect(image.archiveUrl, 'system image to point to skip chunks').toContain('-skip-chunks-')
-          })
-        }
-
-        test('image and checksum', async () => {
-          const imageWorkerFileHandler = {
-            getFile: vi.fn(),
-            createWritable: vi.fn().mockImplementation(() => ({
-              write: vi.fn(),
-              close: vi.fn(),
-            })),
-          }
-
-          globalThis.navigator = {
-            storage: {
-              getDirectory: () => ({
-                getFileHandle: () => imageWorkerFileHandler,
-              })
-            }
-          }
-
-          imageWorkerFileHandler.getFile.mockImplementation(async () => {
-            const response = await fetch(image.archiveUrl)
-            expect(response.ok, 'to be uploaded').toBe(true)
-
-            return response.blob()
-          })
-
-          const imageWorker = await getImageWorker()
-
-          await imageWorker.unpackImage(image)
-        }, 8 * 60 * 1000)
-      })
-    }
-  })
-}
diff --git a/tailwind.config.js b/tailwind.config.js
deleted file mode 100644
index f1f20e2..0000000
--- a/tailwind.config.js
+++ /dev/null
@@ -1,23 +0,0 @@
-/** @type {import('tailwindcss').Config} */
-export default {
-  content: [
-    './index.html',
-    './src/**/*.{js,jsx}',
-  ],
-  theme: {
-    extend: {
-      backgroundImage: {
-        'gradient-radial': 'radial-gradient(var(--tw-gradient-stops))',
-        'gradient-conic':
-          'conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))',
-      },
-      fontFamily: {
-        sans: ['Inter Variable', 'sans-serif'],
-        monospace: ['JetBrains Mono Variable', 'monospace'],
-      },
-    },
-  },
-  plugins: [
-    require('@tailwindcss/typography'),
-  ],
-}
diff --git a/vite.config.js b/vite.config.js
deleted file mode 100644
index ba64cd9..0000000
--- a/vite.config.js
+++ /dev/null
@@ -1,18 +0,0 @@
-import { fileURLToPath, URL } from 'node:url';
-import { defineConfig } from 'vite'
-import react from '@vitejs/plugin-react'
-
-// https://vitejs.dev/config/
-export default defineConfig({
-  plugins: [react()],
-  resolve: {
-    alias: [
-      { find: '@', replacement: fileURLToPath(new URL('./src', import.meta.url)) },
-    ],
-  },
-  test: {
-    globals: true,
-    environment: 'jsdom',
-    setupFiles: './src/test/setup.js',
-  },
-})
