Run UI CI on pull requests that change the desktop app

.github/workflows/ui-ci.yaml

@@ -7,7 +7,8 @@ on:
       - main
       - release-*
     paths:
-      - desktop/
+      - desktop/**
+      - .github/workflows/ui-ci.yaml
 
 jobs:
   check:

AGENTS.md

@@ -98,7 +98,6 @@ cd src-tauri && cargo +stable check
   - There are no Windows e2e tests: GitHub's Windows runners can't run Linux containers. `windows-tests.yaml`
     only builds the CLI and runs the unit tests on Windows.
 - **Desktop quirks:**
-  - `yarn lint:ci` has 5 errors that already existed at the fork point.
   - The default `cargo` may be too old for the v4 `Cargo.lock`; use `cargo +stable`.
   - `cargo check` needs `desktop/dist/` and the sidecar `desktop/src-tauri/bin/devpod-cli-<target-triple>` to
     exist; empty placeholders are enough (both are gitignored).

desktop/eslint.config.js

@@ -20,7 +20,9 @@ const compat = new FlatCompat({
 
 export default [
   {
-    ignores: ["dist/**/*", "src-tauri/**/*", "public/**/*", "src/gen/**/*"],
+    // eslint.config.js is JavaScript, which the TypeScript project (parserOptions.project) doesn't
+    // include, so the TypeScript parser can't lint it.
+    ignores: ["dist/**/*", "src-tauri/**/*", "public/**/*", "src/gen/**/*", "eslint.config.js"],
   },
   ...fixupConfigRules(
     compat.extends(
@@ -111,4 +113,12 @@ export default [
       ],
     },
   },
+  {
+    // The entry points and the router module export no components, so when they change Vite reloads
+    // the page instead of refreshing components in place, which is fine for them.
+    files: ["src/main.tsx", "src/routes.tsx", "update-window/src/main.tsx"],
+    rules: {
+      "react-refresh/only-export-components": "off",
+    },
+  },
 ]

desktop/src/App/OSSApp.tsx

@@ -63,7 +63,7 @@ export function OSSApp() {
       <Flex width="100vw" maxWidth="100vw" overflow="hidden">
         {showTitleBar && <TitleBar showTitle={showTitle} />}
 
-        <Box width="full" height="full" >
+        <Box width="full" height="full">
           <Grid height="full" {...mainGridProps}>
             <GridItem area="sidebar">
               <Sidebar paddingTop={titleBarSafeArea}>

desktop/src/App/constants.ts

@@ -2,4 +2,4 @@ import { BoxProps } from "@chakra-ui/react"
 import { isLinux, isMacOS, isWindows } from "../lib"
 
 export const showTitleBar = isMacOS || isLinux || isWindows
-export const titleBarSafeArea: BoxProps["height"] = showTitleBar ? isWindows ? "6" : "12" : 0
+export const titleBarSafeArea: BoxProps["height"] = showTitleBar ? (isWindows ? "6" : "12") : 0

desktop/src/client/client.ts

@@ -284,7 +284,7 @@ class Client {
       // we're in a flatpak, we need to check in other paths.
       const isFlatpak = await this.getEnv("FLATPAK_ID")
       if (isFlatpak) {
-        this.log("debug", "Running in flatpak, checking ~/.local/bin on the host");
+        this.log("debug", "Running in flatpak, checking ~/.local/bin on the host")
         const home_dir = await this.getEnv("HOME")
         // this will throw if doesn't exist
         const exists = await invoke<boolean>("file_exists", {

desktop/src/client/command.ts

@@ -5,10 +5,14 @@ import {
   Command as ShellCommand,
 } from "@tauri-apps/plugin-shell"
 import { debug, ErrorTypeCancelled, isError, Result, ResultError, Return, sleep } from "../lib"
-import { DEVPOD_BINARY, DEVPOD_FLAG_OPTION, DEVPOD_UI_ENV_VAR, DEVPOD_ADDITIONAL_ENV_VARS } from "./constants"
+import {
+  DEVPOD_BINARY,
+  DEVPOD_FLAG_OPTION,
+  DEVPOD_UI_ENV_VAR,
+  DEVPOD_ADDITIONAL_ENV_VARS,
+} from "./constants"
 import { TStreamEvent } from "./types"
 import { TAURI_SERVER_URL } from "./tauriClient"
-import * as log from "@tauri-apps/plugin-log"
 import { invoke } from "@tauri-apps/api/core"
 
 export type TStreamEventListenerFn = (event: TStreamEvent) => void
@@ -89,7 +93,9 @@ export class Command implements TCommand<ChildProcess<string>> {
         if (this.isFlatpak) {
           this.extraEnvVars["FLATPAK_ID"] = "sh.loft.devpod"
           this.extraEnvVars[DEVPOD_ADDITIONAL_ENV_VARS] = recordToCSV(this.extraEnvVars)
-          this.sidecarCommand = ShellCommand.sidecar(DEVPOD_BINARY, this.args, { env: this.extraEnvVars })
+          this.sidecarCommand = ShellCommand.sidecar(DEVPOD_BINARY, this.args, {
+            env: this.extraEnvVars,
+          })
         }
       }
       const rawResult = await this.sidecarCommand.execute()
@@ -247,5 +253,5 @@ export function serializeRawOptions(
 function recordToCSV(record: Record<string, string>): string {
   return Object.entries(record)
     .map(([key, value]) => `${key}=${value}`)
-    .join(',');
-}
+    .join(",")
+}

desktop/src/components/IDEGroup/IDEGroup.tsx

@@ -74,7 +74,6 @@ function IDEItem({
 }) {
   const menuHoverColor = useColorModeValue("gray.100", "gray.700")
 
-
   const onClick = useCallback(() => {
     onItemClick(ide.name)
   }, [onItemClick, ide])

desktop/src/components/Terminal/Terminal.tsx

@@ -73,9 +73,9 @@ export const Terminal = forwardRef<TTerminalRef, TTerminalProps>(function T(
       })
       terminalRef.current = terminal
 
-      terminal.attachCustomKeyEventHandler(event => {
-        return !(event.type === "keydown" && event.key === "c" && event.ctrlKey);
-      });
+      terminal.attachCustomKeyEventHandler((event) => {
+        return !(event.type === "keydown" && event.key === "c" && event.ctrlKey)
+      })
 
       const loadAddon = <T extends ITerminalAddon>(
         AddonClass: new () => T,

desktop/src/icons/Curity.tsx

@@ -11,10 +11,7 @@ export const Curity = createIcon({
       d="m53.06 26.79-.56.57a15.93 15.93 0 0 1-10.93 5 10 10 0 0 1-10.34-10.4c0-6 4.24-10.39 10.09-10.39a16.67 16.67 0 0 1 10.22 4l.56.49 5.61-5.86-.63-.54a25.78 25.78 0 0 0-16.36-5.91 18.44 18.44 0 0 0-15.37 7.68H15l-.6 5.09h8.5a17.9 17.9 0 0 0-.59 2.86H9.61L9 24.46h13.31a18.56 18.56 0 0 0 .57 2.86H3.77l-.61 5.09H25.3c3.29 4.74 8.9 7.68 15.67 7.68a25.41 25.41 0 0 0 17.19-6.93l.59-.56Z"
       transform="translate(-3.16 -3.75)"
     />,
-    <path
-      key="2"
-      d="M5.01 15.62H1.26l-.6 5.09H4.4l.61-5.09z"
-    />,
+    <path key="2" d="M5.01 15.62H1.26l-.6 5.09H4.4l.61-5.09z" />,
     <path
       key="3"
       d="M88 26.14a13.31 13.31 0 0 1-9.06 3.66c-5.92 0-9.82-4.23-9.82-9.47a9.36 9.36 0 0 1 9.68-9.44A13.66 13.66 0 0 1 87.41 14L85 16.56a9.55 9.55 0 0 0-5.84-2.29 5.82 5.82 0 0 0-5.92 6.09 5.87 5.87 0 0 0 6.06 6.08 9.19 9.19 0 0 0 6.25-2.83ZM107.44 11.43v11.41c0 4.45-3.44 7-8.16 7s-8.11-2.51-8.11-7V11.43h3.93v11.41c0 2.35 1.88 3.6 4.18 3.6s4.23-1.25 4.23-3.6V11.43ZM112.73 29.25V11.43h9.88a7 7 0 0 1 5.39 1.94 5.36 5.36 0 0 1 1.47 3.69 5.47 5.47 0 0 1-3.6 5l4.13 7.19h-4.47l-3.6-6.55h-5.3v6.55Zm3.9-14.51v4.66H123a2.38 2.38 0 0 0 2.48-2.34 2.17 2.17 0 0 0-.63-1.56 2.66 2.66 0 0 0-2.13-.76ZM134 29.25V11.43h3.91v17.82ZM141.44 11.43h16.81v3.39h-6.44v14.43h-3.91V14.82h-6.46ZM177.13 11.43l-7.07 9.69v8.13h-3.93v-8.13L159 11.43h4.85l4.34 6.2 4.32-6.2ZM178.07 11.08a4 4 0 0 1 1.12-2.86 3.74 3.74 0 0 1 5.43 0 4 4 0 0 1 1.11 2.86 4 4 0 0 1-1.12 2.92 3.72 3.72 0 0 1-5.42 0 4 4 0 0 1-1.12-2.92Zm.65 0a3.39 3.39 0 0 0 .93 2.42 3 3 0 0 0 2.26 1 3 3 0 0 0 2.24-1 3.37 3.37 0 0 0 .93-2.41 3.34 3.34 0 0 0-.93-2.4 3 3 0 0 0-2.24-1 3 3 0 0 0-2.26 1 3.34 3.34 0 0 0-.93 2.39Zm2.4.41v1.82h-.8V8.72h1.51a2.06 2.06 0 0 1 1.29.36 1.21 1.21 0 0 1 .46 1 1 1 0 0 1-.17.59 1.38 1.38 0 0 1-.52.42 1 1 0 0 1 .51.43 1.35 1.35 0 0 1 .16.69v.7a.77.77 0 0 0 .08.29v.08h-.83a1.08 1.08 0 0 1-.06-.33v-.74a.8.8 0 0 0-.18-.57.83.83 0 0 0-.6-.18Zm0-.7h.82a1.12 1.12 0 0 0 .6-.18.55.55 0 0 0 .25-.47.68.68 0 0 0-.22-.56 1.34 1.34 0 0 0-.74-.15h-.71Z"

desktop/src/icons/Stop.tsx

@@ -5,7 +5,5 @@ export const Stop = createIcon({
   displayName: "Stop",
   viewBox: "0 0 20 20",
   defaultProps,
-  path: (
-    <path d="M5 5h10v10H5z" />
-  ),
+  path: <path d="M5 5h10v10H5z" />,
 })

desktop/src/lib/modals/useResetWorkspaceModal.tsx

@@ -28,8 +28,9 @@ export function useResetWorkspaceModal(
           <ModalBody>
             Resetting the workspace will erase all state saved in the docker container overlay and
             DELETE ALL UNCOMMITTED CODE. This means you might need to reinstall or reconfigure
-            certain applications. You can also just recreate the pod with rebuild without wiping all state. With reset, you will start with a fresh clone of the repository. Are you sure
-            you want to reset {workspaceName}?
+            certain applications. You can also just recreate the pod with rebuild without wiping all
+            state. With reset, you will start with a fresh clone of the repository. Are you sure you
+            want to reset {workspaceName}?
           </ModalBody>
           <ModalFooter>
             <HStack spacing={"2"}>