diff --git a/pkgs/webview-ui/app/src/routes/flash/view.tsx b/pkgs/webview-ui/app/src/routes/flash/view.tsx index 65748cbc5..dcdff3d97 100644 --- a/pkgs/webview-ui/app/src/routes/flash/view.tsx +++ b/pkgs/webview-ui/app/src/routes/flash/view.tsx @@ -2,10 +2,12 @@ import { callApi } from "@/src/api"; import { Button } from "@/src/components/button"; import { FileInput } from "@/src/components/FileInput"; import Icon from "@/src/components/icon"; -import { SelectInput } from "@/src/components/SelectInput"; -import { TextInput } from "@/src/Form/fields/TextInput"; + import { Typography } from "@/src/components/Typography"; import { Header } from "@/src/layout/header"; + +import { SelectInput } from "@/src/Form/fields/Select"; +import { TextInput } from "@/src/Form/fields/TextInput"; import { createForm, required, @@ -16,6 +18,8 @@ import { import { createQuery } from "@tanstack/solid-query"; import { createEffect, createSignal, For, Show } from "solid-js"; import toast from "solid-toast"; +import { FieldLayout } from "@/src/Form/fields/layout"; +import { InputLabel } from "@/src/components/inputBase"; interface Wifi extends FieldValues { ssid: string; @@ -89,9 +93,7 @@ export const Flash = () => { const deviceQuery = createQuery(() => ({ queryKey: ["block_devices"], queryFn: async () => { - const result = await callApi("show_block_devices", { - options: {}, - }); + const result = await callApi("show_block_devices", {}); if (result.status === "error") throw new Error("Failed to fetch data"); return result.data; }, @@ -145,41 +147,43 @@ export const Flash = () => { const handleSubmit = async (values: FlashFormValues) => { console.log("Submit:", values); - try { - await callApi("flash_machine", { - machine: { - name: values.machine.devicePath, - flake: { - loc: values.machine.flake, - }, - }, - mode: "format", - disks: [{ name: "main", device: values.disk }], - system_config: { - language: values.language, - keymap: values.keymap, - ssh_keys_path: values.sshKeys.map((file) => file.name), - }, - dry_run: false, - write_efi_boot_entries: false, - debug: false, - }); - } catch (error) { - toast.error(`Error could not flash disk: ${error}`); - console.error("Error submitting form:", error); - } + toast.error("Not fully implemented yet"); + // Disabled for now. To prevent accidental flashing of local disks + // try { + // await callApi("flash_machine", { + // machine: { + // name: values.machine.devicePath, + // flake: { + // loc: values.machine.flake, + // }, + // }, + // mode: "format", + // disks: [{ name: "main", device: values.disk }], + // system_config: { + // language: values.language, + // keymap: values.keymap, + // ssh_keys_path: values.sshKeys.map((file) => file.name), + // }, + // dry_run: false, + // write_efi_boot_entries: false, + // debug: false, + // }); + // } catch (error) { + // toast.error(`Error could not flash disk: ${error}`); + // console.error("Error submitting form:", error); + // } }; return ( <>
- + USB Utility image. - This will make bootstrapping a new machine easier by providing secure - remote connection to any machine when plugged in. + Will make bootstrapping new machines easier by providing secure remote + connection to any machine when plugged in.
@@ -220,37 +224,30 @@ export const Flash = () => { {(field, props) => ( { - e.preventDefault(); - deviceQuery.refetch(); - }} - startIcon={} - > - } - formStore={formStore} + loading={deviceQuery.isFetching} selectProps={props} label="Flash Disk" - value={String(field.value)} + labelProps={{ + labelAction: ( + + + } + /> {(network, index) => ( -
- - {(field, props) => ( - - )} - - - {(field, props) => ( -
+
+
+ + {(field, props) => ( - togglePasswordVisibility(index()) - } - startIcon={ - passwordVisibility()[index()] ? ( - - ) : ( - - ) - } - > - ), - }} + class="col-span-3" required /> -
- )} - -
- + )} + + + {(field, props) => ( +
+ + // togglePasswordVisibility(index()) + // } + // startIcon={ + // passwordVisibility()[index()] ? ( + // + // ) : ( + // + // ) + // } + // > + // ), + // }} + required + /> +
+ )} +
+
)} -
- -
-
- Advanced Settings +
+ Advanced
{ inputProps={props} label="Source (flake URL)" value={String(field.value)} - inlineLabel={ - file_download - } error={field.error} required /> @@ -377,21 +377,26 @@ export const Flash = () => { inputProps={props} label="Image Name (attribute name)" value={String(field.value)} - inlineLabel={devices} error={field.error} required /> )} -
- Source URL: - - {getValue(formStore, "machine.flake") + - "#" + - getValue(formStore, "machine.devicePath")} - -
+ Source Url + } + field={ + + {getValue(formStore, "machine.flake") + + "#" + + getValue(formStore, "machine.devicePath")} + + } + /> +
+ { {(field, props) => ( <> - - - {(language) => ( - - )} - - - } + loading={langQuery.isLoading} + options={[ + { + label: "en_US.UTF-8", + value: "en_US.UTF-8", + }, + ...(langQuery.data?.map((lang) => ({ + label: lang, + value: lang, + })) || []), + ]} /> )} @@ -427,22 +432,22 @@ export const Flash = () => { {(field, props) => ( <> - - - {(keymap) => ( - - )} - - - } + loading={keymapQuery.isLoading} + options={[ + { + label: "en", + value: "en", + }, + ...(keymapQuery.data?.map((keymap) => ({ + label: keymap, + value: keymap, + })) || []), + ]} /> )}