formatter.nix: Add prettier

2024-08-02 18:56:53 +02:00 · 2024-08-02 18:56:53 +02:00 · 58a36a5c12
commit 58a36a5c12
parent f1d124dabd
23 changed files with 272 additions and 252 deletions
--- a/.gitea/workflows/deploy.yaml
+++ b/.gitea/workflows/deploy.yaml
@ -1,6 +1,6 @@
 name: deploy
 on:
- push:
+  push:
    branches:
      - main
 jobs:
@ -10,4 +10,4 @@ jobs:
      - uses: actions/checkout@v3
      - run: nix run .#deploy-docs
    env:
-      SSH_HOMEPAGE_KEY: ${{ secrets.SSH_HOMEPAGE_KEY }}
+      SSH_HOMEPAGE_KEY: ${{ secrets.SSH_HOMEPAGE_KEY }}
--- a/checks/secrets/sops/machines/machine/key.json
+++ b/checks/secrets/sops/machines/machine/key.json
@ -1,4 +1,4 @@
 {
  "publickey": "age15x8u838dwqflr3t6csf4tlghxm4tx77y379ncqxav7y2n8qp7yzqgrwt00",
  "type": "age"
-}
+}
--- a/checks/secrets/sops/users/admin/key.json
+++ b/checks/secrets/sops/users/admin/key.json
@ -1,4 +1,4 @@
 {
  "publickey": "age15x8u838dwqflr3t6csf4tlghxm4tx77y379ncqxav7y2n8qp7yzqgrwt00",
  "type": "age"
-}
+}
--- a/docs/overrides/main.html
+++ b/docs/overrides/main.html
@ -1,12 +1,19 @@
-{% extends "base.html" %}
-
-{% block extrahead %}
-<meta property="og:title" content="Clan - Documentation, Blog & Getting Started Guide" />
-<meta property="og:description" content="Documentation for Clan. The peer-to-peer machine deployment framework." />
-<meta property="og:image" content="https://clan.lol/static/dark-favicon/128x128.png" />
+{% extends "base.html" %} {% block extrahead %}
+<meta
+  property="og:title"
+  content="Clan - Documentation, Blog & Getting Started Guide"
+/>
+<meta
+  property="og:description"
+  content="Documentation for Clan. The peer-to-peer machine deployment framework."
+/>
+<meta
+  property="og:image"
+  content="https://clan.lol/static/dark-favicon/128x128.png"
+/>
 <meta property="og:url" content="https://docs.clan.lol" />
 <meta property="og:type" content="website" />
 <meta property="og:site_name" content="Clan" />
 <meta property="og:locale" content="en_US" />

-{% endblock %}
+{% endblock %}
--- a/docs/site/static/extra.css
+++ b/docs/site/static/extra.css
@ -1,13 +1,13 @@
@font-face {
-    font-family: "Roboto";
-    src: url(./Roboto-Regular.ttf) format('truetype');
+  font-family: "Roboto";
+  src: url(./Roboto-Regular.ttf) format("truetype");
 }
@font-face {
-    font-family: "Fira Code";
-    src: url(./FiraCode-VF.ttf) format('truetype');
+  font-family: "Fira Code";
+  src: url(./FiraCode-VF.ttf) format("truetype");
 }

 :root {
-    --md-text-font: "Roboto"; 
-    --md-code-font: "Fira Code";
-}
+  --md-text-font: "Roboto";
+  --md-code-font: "Fira Code";
+}
--- a/formatter.nix
+++ b/formatter.nix
@ -11,6 +11,39 @@
      treefmt.programs.nixfmt.enable = true;
      treefmt.programs.nixfmt.package = pkgs.nixfmt-rfc-style;
      treefmt.programs.deadnix.enable = true;
+      treefmt.settings.global.excludes = [
+        "*.png"
+        "*.jpeg"
+        "*.gitignore"
+        ".vscode/*"
+        "*.toml"
+        "*.clan-flake"
+        "*.code-workspace"
+        "*.pub"
+        "*.typed"
+        "*.age"
+        "*.list"
+        "*.desktop"
+      ];
+      treefmt.programs.prettier = {
+        enable = true;
+        includes = [
+          "*.cjs"
+          "*.css"
+          "*.html"
+          "*.js"
+          "*.json5"
+          "*.jsx"
+          "*.mdx"
+          "*.mjs"
+          "*.scss"
+          "*.ts"
+          "*.tsx"
+          "*.vue"
+          "*.yaml"
+          "*.yml"
+        ];
+      };

      treefmt.programs.mypy.directories =
        {
--- a/pkgs/clan-app/clan_app/assets/style.css
+++ b/pkgs/clan-app/clan_app/assets/style.css
@ -1,66 +1,63 @@
 /* Insert custom styles here */

 navigation-view {
-    padding: 5px;
-    /* padding-left: 5px;
+  padding: 5px;
+  /* padding-left: 5px;
    padding-right: 5px;
    padding-bottom: 5px; */
 }

 avatar {
-    margin: 2px;
+  margin: 2px;
 }

 .trust {
-    padding-top: 25px;
-    padding-bottom: 25px;
+  padding-top: 25px;
+  padding-bottom: 25px;
 }

 .join-list {
-    margin-top: 1px;
-    margin-left: 2px;
-    margin-right: 2px;
-
+  margin-top: 1px;
+  margin-left: 2px;
+  margin-right: 2px;
 }

 .progress-bar {
-    margin-right: 25px;
-    min-width: 200px;
+  margin-right: 25px;
+  min-width: 200px;
 }

 .group-list {
-	background-color: inherit;
+  background-color: inherit;
 }
 .group-list > .activatable:hover {
-	background-color: unset;
+  background-color: unset;
 }

 .group-list > row {
-    margin-top: 12px;
-    border-bottom: unset;
+  margin-top: 12px;
+  border-bottom: unset;
 }

-
 .vm-list {
-    margin-top: 25px; 
-    margin-bottom: 25px; 
+  margin-top: 25px;
+  margin-bottom: 25px;
 }

 .no-shadow {
-    box-shadow: none;	
+  box-shadow: none;
 }

 .search-entry {
-    margin-bottom: 12px; 
+  margin-bottom: 12px;
 }

 searchbar {
-    margin-bottom: 25px; 
+  margin-bottom: 25px;
 }

-
 .log-view {
-    margin-top: 12px;
-    font-family: monospace;
-    padding: 8px;
+  margin-top: 12px;
+  font-family: monospace;
+  padding: 8px;
 }
--- a/pkgs/clan-cli/.vscode/launch.json
+++ b/pkgs/clan-cli/.vscode/launch.json
@ -1,26 +1,24 @@
 {
-    // Use IntelliSense to learn about possible attributes.
-    // Hover to view descriptions of existing attributes.
-    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
-    "version": "0.2.0",
-    "configurations": [
-        {
-            "name": "Clan Webui",
-            "type": "python",
-            "request": "launch",
-            "module": "clan_cli.webui",
-            "justMyCode": false,
-            "args": [ "--reload", "--no-open", "--log-level", "debug" ],
-
-        },
-        {
-            "name": "Clan Cli VMs",
-            "type": "python",
-            "request": "launch",
-            "module": "clan_cli",
-            "justMyCode": false,
-            "args": [ "vms" ],
-
-        }
-    ]
-}
+  // Use IntelliSense to learn about possible attributes.
+  // Hover to view descriptions of existing attributes.
+  // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
+  "version": "0.2.0",
+  "configurations": [
+    {
+      "name": "Clan Webui",
+      "type": "python",
+      "request": "launch",
+      "module": "clan_cli.webui",
+      "justMyCode": false,
+      "args": ["--reload", "--no-open", "--log-level", "debug"]
+    },
+    {
+      "name": "Clan Cli VMs",
+      "type": "python",
+      "request": "launch",
+      "module": "clan_cli",
+      "justMyCode": false,
+      "args": ["vms"]
+    }
+  ]
+}
--- a/pkgs/clan-cli/.vscode/settings.json
+++ b/pkgs/clan-cli/.vscode/settings.json
@ -1,22 +1,22 @@
 {
-    "python.testing.pytestArgs": [
-        // Coverage is not supported by vscode:
-        // https://github.com/Microsoft/vscode-python/issues/693
-        // Note that this will make pytest fail if pytest-cov is not installed,
-        // if that's the case, then this option needs to be be removed (overrides
-        // can be set at a workspace level, it's up to you to decide what's the
-        // best approach). You might also prefer to only set this option
-        // per-workspace (wherever coverage is used).
-        "--no-cov",
-        "tests"
-    ],
-    "python.testing.unittestEnabled": false,
-    "python.testing.pytestEnabled": true,
-    "search.exclude": {
-        "**/.direnv": true
-    },
-    "python.linting.mypyPath": "mypy",
-    "python.linting.mypyEnabled": true,
-    "python.linting.enabled": true,
-    "python.defaultInterpreterPath": "python"
-}
+  "python.testing.pytestArgs": [
+    // Coverage is not supported by vscode:
+    // https://github.com/Microsoft/vscode-python/issues/693
+    // Note that this will make pytest fail if pytest-cov is not installed,
+    // if that's the case, then this option needs to be be removed (overrides
+    // can be set at a workspace level, it's up to you to decide what's the
+    // best approach). You might also prefer to only set this option
+    // per-workspace (wherever coverage is used).
+    "--no-cov",
+    "tests"
+  ],
+  "python.testing.unittestEnabled": false,
+  "python.testing.pytestEnabled": true,
+  "search.exclude": {
+    "**/.direnv": true
+  },
+  "python.linting.mypyPath": "mypy",
+  "python.linting.mypyEnabled": true,
+  "python.linting.enabled": true,
+  "python.defaultInterpreterPath": "python"
+}
--- a/pkgs/clan-cli/tests/data/secrets.yaml
+++ b/pkgs/clan-cli/tests/data/secrets.yaml
@ -1,23 +1,23 @@
 secret-key: ENC[AES256_GCM,data:gjX4OmCUdd3TlA4p,iv:3yZVpyd6FqkITQY0nU2M1iubmzvkR6PfkK2m/s6nQh8=,tag:Abgp9xkiFFylZIyAlap6Ew==,type:str]
 nested:
-    secret-key: ENC[AES256_GCM,data:iUMgDhhIjwvd7wL4,iv:jiJIrh12dSu/sXX+z9ITVoEMNDMjwIlFBnyv40oN4LE=,tag:G9VmAa66Km1sc7JEhW5AvA==,type:str]
+  secret-key: ENC[AES256_GCM,data:iUMgDhhIjwvd7wL4,iv:jiJIrh12dSu/sXX+z9ITVoEMNDMjwIlFBnyv40oN4LE=,tag:G9VmAa66Km1sc7JEhW5AvA==,type:str]
 sops:
-    kms: []
-    gcp_kms: []
-    azure_kv: []
-    hc_vault: []
-    age:
-        - recipient: age14tva0txcrl0zes05x7gkx56qd6wd9q3nwecjac74xxzz4l47r44sv3fz62
-          enc: |
-            -----BEGIN AGE ENCRYPTED FILE-----
-            YWdlLWVuY3J5cHRpb24ub3JnL3YxCi0+IFgyNTUxOSA0eWdRVjlydXlXOVZFQ3lO
-            bzU1eG9Iam5Ka29Sdlo0cHJ4b1R6bjdNSzBjCkgwRndCbWZQWHlDU0x1cWRmaGVt
-            N29lbjR6UjN0L2RhaXEzSG9zQmRsZGsKLS0tIEdsdWgxSmZwU3BWUDVxVWRSSC9M
-            eVZ6bjgwZnR2TTM5MkRYZWNFSFplQWsKmSzv12/dftL9jx2y35UZUGVK6xWdatE8
-            BGJiCvMlp0BQNrh2s/+YaEaBa48w8LL79U/XJnEZ+ZUwxmlbSTn6Hg==
-            -----END AGE ENCRYPTED FILE-----
-    lastmodified: "2023-08-08T14:27:20Z"
-    mac: ENC[AES256_GCM,data:iRWWX+L5Q5nKn3fBCLaWoz/mvqGnNnRd93gJmYXDZbRjFoHa9IFJZst5QDIDa1ZRYUe6G0/+lV5SBi+vwRm1pHysJ3c0ZWYjBP+e1jw3jLXxLV5gACsDC8by+6rFUCho0Xgu+Nqu2ehhNenjQQnCvDH5ivWbW70KFT5ynNgR9Tw=,iv:RYnnbLMC/hNfMwWPreMq9uvY0khajwQTZENO/P34ckY=,tag:Xi1PS5vM1c+sRkroHkPn1Q==,type:str]
-    pgp: []
-    unencrypted_suffix: _unencrypted
-    version: 3.7.3
+  kms: []
+  gcp_kms: []
+  azure_kv: []
+  hc_vault: []
+  age:
+    - recipient: age14tva0txcrl0zes05x7gkx56qd6wd9q3nwecjac74xxzz4l47r44sv3fz62
+      enc: |
+        -----BEGIN AGE ENCRYPTED FILE-----
+        YWdlLWVuY3J5cHRpb24ub3JnL3YxCi0+IFgyNTUxOSA0eWdRVjlydXlXOVZFQ3lO
+        bzU1eG9Iam5Ka29Sdlo0cHJ4b1R6bjdNSzBjCkgwRndCbWZQWHlDU0x1cWRmaGVt
+        N29lbjR6UjN0L2RhaXEzSG9zQmRsZGsKLS0tIEdsdWgxSmZwU3BWUDVxVWRSSC9M
+        eVZ6bjgwZnR2TTM5MkRYZWNFSFplQWsKmSzv12/dftL9jx2y35UZUGVK6xWdatE8
+        BGJiCvMlp0BQNrh2s/+YaEaBa48w8LL79U/XJnEZ+ZUwxmlbSTn6Hg==
+        -----END AGE ENCRYPTED FILE-----
+  lastmodified: "2023-08-08T14:27:20Z"
+  mac: ENC[AES256_GCM,data:iRWWX+L5Q5nKn3fBCLaWoz/mvqGnNnRd93gJmYXDZbRjFoHa9IFJZst5QDIDa1ZRYUe6G0/+lV5SBi+vwRm1pHysJ3c0ZWYjBP+e1jw3jLXxLV5gACsDC8by+6rFUCho0Xgu+Nqu2ehhNenjQQnCvDH5ivWbW70KFT5ynNgR9Tw=,iv:RYnnbLMC/hNfMwWPreMq9uvY0khajwQTZENO/P34ckY=,tag:Xi1PS5vM1c+sRkroHkPn1Q==,type:str]
+  pgp: []
+  unencrypted_suffix: _unencrypted
+  version: 3.7.3
--- a/pkgs/clan-vm-manager/clan_vm_manager/assets/style.css
+++ b/pkgs/clan-vm-manager/clan_vm_manager/assets/style.css
@ -1,66 +1,63 @@
 /* Insert custom styles here */

 navigation-view {
-    padding: 5px;
-    /* padding-left: 5px;
+  padding: 5px;
+  /* padding-left: 5px;
    padding-right: 5px;
    padding-bottom: 5px; */
 }

 avatar {
-    margin: 2px;
+  margin: 2px;
 }

 .trust {
-    padding-top: 25px;
-    padding-bottom: 25px;
+  padding-top: 25px;
+  padding-bottom: 25px;
 }

 .join-list {
-    margin-top: 1px;
-    margin-left: 2px;
-    margin-right: 2px;
-
+  margin-top: 1px;
+  margin-left: 2px;
+  margin-right: 2px;
 }

 .progress-bar {
-    margin-right: 25px;
-    min-width: 200px;
+  margin-right: 25px;
+  min-width: 200px;
 }

 .group-list {
-	background-color: inherit;
+  background-color: inherit;
 }
 .group-list > .activatable:hover {
-	background-color: unset;
+  background-color: unset;
 }

 .group-list > row {
-    margin-top: 12px;
-    border-bottom: unset;
+  margin-top: 12px;
+  border-bottom: unset;
 }

-
 .vm-list {
-    margin-top: 25px; 
-    margin-bottom: 25px; 
+  margin-top: 25px;
+  margin-bottom: 25px;
 }

 .no-shadow {
-    box-shadow: none;	
+  box-shadow: none;
 }

 .search-entry {
-    margin-bottom: 12px; 
+  margin-bottom: 12px;
 }

 searchbar {
-    margin-bottom: 25px; 
+  margin-bottom: 25px;
 }

-
 .log-view {
-    margin-top: 12px;
-    font-family: monospace;
-    padding: 8px;
+  margin-top: 12px;
+  font-family: monospace;
+  padding: 8px;
 }
--- a/pkgs/webview-ui/app/eslint.config.mjs
+++ b/pkgs/webview-ui/app/eslint.config.mjs
@ -28,5 +28,5 @@ export default tseslint.config(
      "no-unused-vars": "off",
      "@typescript-eslint/no-unused-vars": "off",
    },
-  }
+  },
 );
--- a/pkgs/webview-ui/app/index.html
+++ b/pkgs/webview-ui/app/index.html
@ -1,4 +1,4 @@
-<!DOCTYPE html>
+<!doctype html>
 <html>
  <head>
    <title>Solid App</title>
--- a/pkgs/webview-ui/app/src/api.ts
+++ b/pkgs/webview-ui/app/src/api.ts
@ -134,19 +134,21 @@ export const callApi = <K extends OperationNames>(
  });
 };

-const deserialize = <T>(fn: (response: T) => void) => (str: string) => {
-  try {
-    const r = JSON.parse(str) as T;
-    console.log("Received: ", r);
-    fn(r);
-  } catch (e) {
-    console.log("Error parsing JSON: ", e);
-    window.localStorage.setItem("error", str);
-    console.error(str);
-    console.error("See localStorage 'error'");
-    alert(`Error parsing JSON: ${e}`);
-  }
-};
+const deserialize =
+  <T>(fn: (response: T) => void) =>
+  (str: string) => {
+    try {
+      const r = JSON.parse(str) as T;
+      console.log("Received: ", r);
+      fn(r);
+    } catch (e) {
+      console.log("Error parsing JSON: ", e);
+      window.localStorage.setItem("error", str);
+      console.error(str);
+      console.error("See localStorage 'error'");
+      alert(`Error parsing JSON: ${e}`);
+    }
+  };

 // Create the API object

--- a/pkgs/webview-ui/app/src/components/MachineListItem.tsx
+++ b/pkgs/webview-ui/app/src/components/MachineListItem.tsx
@ -94,18 +94,21 @@ export const MachineListItem = (props: MachineListItemProps) => {
            <div class="flex flex-row flex-wrap gap-4 py-2">
              <div class="badge badge-primary flex flex-row gap-1 py-4 align-middle">
                <span>System:</span>
-                {hwInfo()[name]?.system
-                  ? <span class="text-primary">{hwInfo()[name]?.system}</span>
-                  : <span class="text-warning">Not set</span>}
+                {hwInfo()[name]?.system ? (
+                  <span class="text-primary">{hwInfo()[name]?.system}</span>
+                ) : (
+                  <span class="text-warning">Not set</span>
+                )}
              </div>

              <div class="badge badge-ghost flex flex-row gap-1 py-4 align-middle">
                <span>Target Host:</span>
-                {deploymentInfo()[name]
-                  ? <span class="text-primary">{deploymentInfo()[name]}</span>
-                  : <span class="text-warning">Not set</span>}
-                {
-                  /* <Show
+                {deploymentInfo()[name] ? (
+                  <span class="text-primary">{deploymentInfo()[name]}</span>
+                ) : (
+                  <span class="text-warning">Not set</span>
+                )}
+                {/* <Show
                  when={deploymentInfo()[name]}
                  fallback={
                    <Switch fallback={<div class="skeleton h-8 w-full"></div>}>
@ -116,8 +119,7 @@ export const MachineListItem = (props: MachineListItemProps) => {
                  }
                >
                  {(i) => + i()}
-                </Show> */
-                }
+                </Show> */}
              </div>
            </div>
            {/* Show only the first error at the bottom */}
--- a/pkgs/webview-ui/app/src/index.css
+++ b/pkgs/webview-ui/app/src/index.css
@ -1,10 +1,10 @@
-@import 'material-icons/iconfont/filled.css';
+@import "material-icons/iconfont/filled.css";
 /* List of icons: https://marella.me/material-icons/demo/ */
@tailwind base;
@tailwind components;
@tailwind utilities;

 html {
-    overflow-x: hidden;
-    overflow-y: scroll;
-}
+  overflow-x: hidden;
+  overflow-y: scroll;
+}
--- a/pkgs/webview-ui/app/src/layout/layout.tsx
+++ b/pkgs/webview-ui/app/src/layout/layout.tsx
@ -32,8 +32,7 @@ export const Layout: Component<LayoutProps> = (props) => {
            for="toplevel-drawer"
            aria-label="close sidebar"
            class="drawer-overlay"
-          >
-          </label>
+          ></label>
          <Sidebar route={route} setRoute={setRoute} />
        </div>
      </div>
--- a/pkgs/webview-ui/app/src/routes/blockdevices/view.tsx
+++ b/pkgs/webview-ui/app/src/routes/blockdevices/view.tsx
@ -27,35 +27,35 @@ export const BlockDevicesView: Component = () => {
        </button>
      </div>
      <div class="flex max-w-screen-lg flex-col gap-4">
-        {isFetching
-          ? <span class="loading loading-bars"></span>
-          : (
-            <Show when={devices}>
-              {(devices) => (
-                <For each={devices().blockdevices}>
-                  {(device) => (
-                    <div class="stats shadow">
-                      <div class="stat w-28 py-8">
-                        <div class="stat-title">Name</div>
-                        <div class="stat-value">
-                          {" "}
-                          <span class="material-icons">storage</span>{" "}
-                          {device.name}
-                        </div>
-                        <div class="stat-desc"></div>
-                      </div>
-
-                      <div class="stat w-28">
-                        <div class="stat-title">Size</div>
-                        <div class="stat-value">{device.size}</div>
-                        <div class="stat-desc"></div>
+        {isFetching ? (
+          <span class="loading loading-bars"></span>
+        ) : (
+          <Show when={devices}>
+            {(devices) => (
+              <For each={devices().blockdevices}>
+                {(device) => (
+                  <div class="stats shadow">
+                    <div class="stat w-28 py-8">
+                      <div class="stat-title">Name</div>
+                      <div class="stat-value">
+                        {" "}
+                        <span class="material-icons">storage</span>{" "}
+                        {device.name}
                      </div>
+                      <div class="stat-desc"></div>
                    </div>
-                  )}
-                </For>
-              )}
-            </Show>
-          )}
+
+                    <div class="stat w-28">
+                      <div class="stat-title">Size</div>
+                      <div class="stat-value">{device.size}</div>
+                      <div class="stat-desc"></div>
+                    </div>
+                  </div>
+                )}
+              </For>
+            )}
+          </Show>
+        )}
      </div>
    </div>
  );
--- a/pkgs/webview-ui/app/src/routes/flash/view.tsx
+++ b/pkgs/webview-ui/app/src/routes/flash/view.tsx
@ -1,16 +1,14 @@
-import { route } from "@/src/App";
-import { callApi, OperationArgs, OperationResponse, pyApi } from "@/src/api";
+import { callApi, OperationResponse } from "@/src/api";
 import {
  createForm,
  required,
+  FieldValues,
  setValue,
-  SubmitHandler,
 } from "@modular-forms/solid";
 import { createQuery } from "@tanstack/solid-query";
 import { createEffect, createSignal, For } from "solid-js";
-import { effect } from "solid-js/web";

-type FlashFormValues = {
+interface FlashFormValues extends FieldValues {
  machine: {
    devicePath: string;
    flake: string;
@ -19,7 +17,7 @@ type FlashFormValues = {
  language: string;
  keymap: string;
  sshKeys: string[];
-};
+}

 type BlockDevices = Extract<
  OperationResponse<"show_block_devices">,
@ -59,10 +57,7 @@ export const Flash = () => {
    }
  });

-  const {
-    data: devices,
-    isFetching,
-  } = createQuery(() => ({
+  const { data: devices, isFetching } = createQuery(() => ({
    queryKey: ["block_devices"],
    queryFn: async () => {
      const result = await callApi("show_block_devices", {});
@ -72,10 +67,7 @@ export const Flash = () => {
    staleTime: 1000 * 60 * 2, // 1 minutes
  }));

-  const {
-    data: keymaps,
-    isFetching: isFetchingKeymaps,
-  } = createQuery(() => ({
+  const { data: keymaps, isFetching: isFetchingKeymaps } = createQuery(() => ({
    queryKey: ["list_keymaps"],
    queryFn: async () => {
      const result = await callApi("list_possible_keymaps", {});
@ -85,18 +77,17 @@ export const Flash = () => {
    staleTime: 1000 * 60 * 15, // 15 minutes
  }));

-  const {
-    data: languages,
-    isFetching: isFetchingLanguages,
-  } = createQuery(() => ({
-    queryKey: ["list_languages"],
-    queryFn: async () => {
-      const result = await callApi("list_possible_languages", {});
-      if (result.status === "error") throw new Error("Failed to fetch data");
-      return result.data;
-    },
-    staleTime: 1000 * 60 * 15, // 15 minutes
-  }));
+  const { data: languages, isFetching: isFetchingLanguages } = createQuery(
+    () => ({
+      queryKey: ["list_languages"],
+      queryFn: async () => {
+        const result = await callApi("list_possible_languages", {});
+        if (result.status === "error") throw new Error("Failed to fetch data");
+        return result.data;
+      },
+      staleTime: 1000 * 60 * 15, // 15 minutes
+    }),
+  );

  const handleSubmit = async (values: FlashFormValues) => {
    setIsFlashing(true);
@ -109,7 +100,7 @@ export const Flash = () => {
          },
        },
        mode: "format",
-        disks: { "main": values.disk },
+        disks: { main: values.disk },
        system_config: {
          language: values.language,
          keymap: values.keymap,
@ -191,7 +182,9 @@ export const Flash = () => {
                  class="select select-bordered w-full"
                  {...props}
                >
-                  <option value="" disabled>Select a disk</option>
+                  <option value="" disabled>
+                    Select a disk
+                  </option>
                  <For each={devices?.blockdevices}>
                    {(device) => (
                      <option value={device.path}>
@ -227,11 +220,7 @@ export const Flash = () => {
                >
                  <option>en_US.UTF-8</option>
                  <For each={languages}>
-                    {(language) => (
-                      <option value={language}>
-                        {language}
-                      </option>
-                    )}
+                    {(language) => <option value={language}>{language}</option>}
                  </For>
                </select>
                <div class="label">
@ -261,17 +250,12 @@ export const Flash = () => {
                >
                  <option>en</option>
                  <For each={keymaps}>
-                    {(keymap) => (
-                      <option value={keymap}>
-                        {keymap}
-                      </option>
-                    )}
+                    {(keymap) => <option value={keymap}>{keymap}</option>}
                  </For>
                </select>
                <div class="label">
                  {isFetchingKeymaps && (
-                    <span class="label-text
-                    -alt">
+                    <span class="label-text-alt">
                      <span class="loading loading-bars"></span>
                    </span>
                  )}
@ -312,9 +296,11 @@ export const Flash = () => {
          )}
        </Field>
        <button class="btn btn-error" type="submit" disabled={isFlashing()}>
-          {isFlashing()
-            ? <span class="loading loading-spinner"></span>
-            : <span class="material-icons">bolt</span>}
+          {isFlashing() ? (
+            <span class="loading loading-spinner"></span>
+          ) : (
+            <span class="material-icons">bolt</span>
+          )}
          {isFlashing() ? "Flashing..." : "Flash Installer"}
        </button>
      </Form>
--- a/pkgs/webview-ui/app/src/routes/machines/view.tsx
+++ b/pkgs/webview-ui/app/src/routes/machines/view.tsx
@ -91,8 +91,7 @@ export const MachineListView: Component = () => {
          <span class="material-icons ">add</span>
        </button>
      </div>
-      {
-        /* <Show when={services()}>
+      {/* <Show when={services()}>
        {(services) => (
          <For each={Object.values(services())}>
            {(service) => (
@ -138,8 +137,7 @@ export const MachineListView: Component = () => {
            )}
          </For>
        )}
-      </Show> */
-      }
+      </Show> */}
      <Switch>
        <Match when={loading()}>
          {/* Loading skeleton */}
--- a/pkgs/webview-ui/app/src/routes/settings/index.tsx
+++ b/pkgs/webview-ui/app/src/routes/settings/index.tsx
@ -33,17 +33,17 @@ export const registerClan = async () => {
    });
    console.log({ loc }, loc.status);
    if (loc.status === "success" && loc.data) {
-      // @ts-expect-error: data is a string
+      const data = loc.data[0];
      setClanList((s) => {
-        const res = new Set([...s, loc.data]);
+        const res = new Set([...s, data]);
        return Array.from(res);
      });
-      setActiveURI(loc.data);
+      setActiveURI(data);
      setRoute((r) => {
        if (r === "welcome") return "machines";
        return r;
      });
-      return loc.data;
+      return data;
    }
  } catch (e) {
    //
@ -145,7 +145,7 @@ const ClanDetails = (props: ClanDetailsProps) => {
                      return false;
                    }
                    return true;
-                  })
+                  }),
                );
              }}
            >
--- a/pkgs/webview-ui/app/tests/types.test.ts
+++ b/pkgs/webview-ui/app/tests/types.test.ts
@ -44,13 +44,13 @@ describe.concurrent("API types work properly", () => {
      .parameter(0)
      .toMatchTypeOf<
        | {
-          status: "success";
-          data: {
-            machine_name: string;
-            machine_icon?: string | null;
-            machine_description?: string | null;
-          };
-        }
+            status: "success";
+            data: {
+              machine_name: string;
+              machine_icon?: string | null;
+              machine_description?: string | null;
+            };
+          }
        | { status: "error"; errors: any }
      >();
  });
--- a/pkgs/webview-ui/app/util.ts
+++ b/pkgs/webview-ui/app/util.ts
@ -20,7 +20,8 @@ export function isValidHostname(value: string | null | undefined) {
  const isValid = labels.every(function (label) {
    const validLabelChars = /^([a-zA-Z0-9-]+)$/g;

-    const validLabel = validLabelChars.test(label) &&
+    const validLabel =
+      validLabelChars.test(label) &&
      label.length < 64 &&
      !label.startsWith("-") &&
      !label.endsWith("-");