From 8b796cfec215689c917cfa494089651bef12e373 Mon Sep 17 00:00:00 2001
From: Nicolas Meienberger <github@thisprops.com>
Date: Thu, 2 Apr 2026 21:26:39 +0200
Subject: [PATCH] refactor: remove read-only mode from volume form

---
 .../volumes/components/create-volume-form.tsx | 25 ++++++-------------
 .../components/volume-forms/nfs-form.tsx      |  5 ++--
 .../components/volume-forms/rclone-form.tsx   |  7 +++---
 .../components/volume-forms/sftp-form.tsx     |  5 ++--
 .../components/volume-forms/smb-form.tsx      |  5 ++--
 5 files changed, 17 insertions(+), 30 deletions(-)

diff --git a/app/client/modules/volumes/components/create-volume-form.tsx b/app/client/modules/volumes/components/create-volume-form.tsx
index 42fea7d9..7f61f146 100644
--- a/app/client/modules/volumes/components/create-volume-form.tsx
+++ b/app/client/modules/volumes/components/create-volume-form.tsx
@@ -72,15 +72,7 @@ const defaultValuesForType = {
 	sftp: { backend: "sftp" as const, port: 22, path: "/", skipHostKeyCheck: false },
 };
 
-export const CreateVolumeForm = ({
-	onSubmit,
-	mode = "create",
-	initialValues,
-	formId,
-	loading,
-	className,
-	readOnly = false,
-}: Props) => {
+export const CreateVolumeForm = ({ onSubmit, mode = "create", initialValues, formId, loading, className }: Props) => {
 	const form = useForm<FormValues>({
 		resolver: zodResolver(formSchema, undefined, { raw: true }),
 		defaultValues: initialValues || {
@@ -146,7 +138,7 @@ export const CreateVolumeForm = ({
 				onSubmit={form.handleSubmit(onSubmit, scrollToFirstError)}
 				className={cn("space-y-4", className)}
 			>
-				<fieldset disabled={readOnly} className="space-y-4">
+				<fieldset className="space-y-4">
 					<FormField
 						control={form.control}
 						name="name"
@@ -169,7 +161,6 @@ export const CreateVolumeForm = ({
 							<FormItem>
 								<FormLabel>Backend</FormLabel>
 								<Select
-									disabled={readOnly}
 									onValueChange={(value) => {
 										field.onChange(value);
 										if (mode === "create") {
@@ -259,13 +250,13 @@ export const CreateVolumeForm = ({
 						)}
 					/>
 					{watchedBackend === "directory" && <DirectoryForm form={form} />}
-					{watchedBackend === "nfs" && <NFSForm form={form} readOnly={readOnly} />}
+					{watchedBackend === "nfs" && <NFSForm form={form} />}
 					{watchedBackend === "webdav" && <WebDAVForm form={form} />}
-					{watchedBackend === "smb" && <SMBForm form={form} readOnly={readOnly} />}
-					{watchedBackend === "rclone" && <RcloneForm form={form} readOnly={readOnly} />}
-					{watchedBackend === "sftp" && <SFTPForm form={form} readOnly={readOnly} />}
+					{watchedBackend === "smb" && <SMBForm form={form} />}
+					{watchedBackend === "rclone" && <RcloneForm form={form} />}
+					{watchedBackend === "sftp" && <SFTPForm form={form} />}
 				</fieldset>
-				{!readOnly && watchedBackend && watchedBackend !== "directory" && watchedBackend !== "rclone" && (
+				{watchedBackend && watchedBackend !== "directory" && watchedBackend !== "rclone" && (
 					<div className="space-y-3">
 						<div className="flex items-center gap-2">
 							<Button
@@ -304,7 +295,7 @@ export const CreateVolumeForm = ({
 						)}
 					</div>
 				)}
-				{!readOnly && mode === "update" && !formId && (
+				{mode === "update" && !formId && (
 					<Button type="submit" className="w-full" loading={loading}>
 						<Save className="h-4 w-4 mr-2" />
 						Save changes
diff --git a/app/client/modules/volumes/components/volume-forms/nfs-form.tsx b/app/client/modules/volumes/components/volume-forms/nfs-form.tsx
index 23606dc8..b70e619a 100644
--- a/app/client/modules/volumes/components/volume-forms/nfs-form.tsx
+++ b/app/client/modules/volumes/components/volume-forms/nfs-form.tsx
@@ -13,10 +13,9 @@ import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from ".
 
 type Props = {
 	form: UseFormReturn<FormValues>;
-	readOnly?: boolean;
 };
 
-export const NFSForm = ({ form, readOnly = false }: Props) => {
+export const NFSForm = ({ form }: Props) => {
 	return (
 		<>
 			<FormField
@@ -74,7 +73,7 @@ export const NFSForm = ({ form, readOnly = false }: Props) => {
 				render={({ field }) => (
 					<FormItem>
 						<FormLabel>Version</FormLabel>
-						<Select disabled={readOnly} onValueChange={field.onChange} value={field.value}>
+						<Select onValueChange={field.onChange} value={field.value}>
 							<FormControl>
 								<SelectTrigger>
 									<SelectValue placeholder="Select NFS version" />
diff --git a/app/client/modules/volumes/components/volume-forms/rclone-form.tsx b/app/client/modules/volumes/components/volume-forms/rclone-form.tsx
index 7107c7be..5f6aed13 100644
--- a/app/client/modules/volumes/components/volume-forms/rclone-form.tsx
+++ b/app/client/modules/volumes/components/volume-forms/rclone-form.tsx
@@ -18,10 +18,9 @@ import { useQuery } from "@tanstack/react-query";
 
 type Props = {
 	form: UseFormReturn<FormValues>;
-	readOnly?: boolean;
 };
 
-export const RcloneForm = ({ form, readOnly = false }: Props) => {
+export const RcloneForm = ({ form }: Props) => {
 	const { capabilities } = useSystemInfo();
 
 	const { data: rcloneRemotes, isPending } = useQuery({
@@ -29,7 +28,7 @@ export const RcloneForm = ({ form, readOnly = false }: Props) => {
 		enabled: capabilities.rclone,
 	});
 
-	if (!readOnly && !isPending && !rcloneRemotes?.length) {
+	if (!isPending && !rcloneRemotes?.length) {
 		return (
 			<Alert>
 				<AlertDescription className="space-y-2">
@@ -59,7 +58,7 @@ export const RcloneForm = ({ form, readOnly = false }: Props) => {
 				render={({ field }) => (
 					<FormItem>
 						<FormLabel>Remote</FormLabel>
-						<Select disabled={readOnly} onValueChange={(v) => field.onChange(v)} value={field.value ?? ""}>
+						<Select onValueChange={(v) => field.onChange(v)} value={field.value ?? ""}>
 							<FormControl>
 								<SelectTrigger>
 									<SelectValue placeholder="Select an rclone remote" />
diff --git a/app/client/modules/volumes/components/volume-forms/sftp-form.tsx b/app/client/modules/volumes/components/volume-forms/sftp-form.tsx
index cfb1bc25..869d9ead 100644
--- a/app/client/modules/volumes/components/volume-forms/sftp-form.tsx
+++ b/app/client/modules/volumes/components/volume-forms/sftp-form.tsx
@@ -15,10 +15,9 @@ import { Switch } from "../../../../components/ui/switch";
 
 type Props = {
 	form: UseFormReturn<FormValues>;
-	readOnly?: boolean;
 };
 
-export const SFTPForm = ({ form, readOnly = false }: Props) => {
+export const SFTPForm = ({ form }: Props) => {
 	const skipHostKeyCheck = useWatch({ control: form.control, name: "skipHostKeyCheck" });
 
 	return (
@@ -130,7 +129,7 @@ export const SFTPForm = ({ form, readOnly = false }: Props) => {
 							</FormDescription>
 						</div>
 						<FormControl>
-							<Switch checked={field.value} disabled={readOnly} onCheckedChange={field.onChange} />
+							<Switch checked={field.value} onCheckedChange={field.onChange} />
 						</FormControl>
 					</FormItem>
 				)}
diff --git a/app/client/modules/volumes/components/volume-forms/smb-form.tsx b/app/client/modules/volumes/components/volume-forms/smb-form.tsx
index ad49f1ac..89e64b52 100644
--- a/app/client/modules/volumes/components/volume-forms/smb-form.tsx
+++ b/app/client/modules/volumes/components/volume-forms/smb-form.tsx
@@ -14,10 +14,9 @@ import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from ".
 
 type Props = {
 	form: UseFormReturn<FormValues>;
-	readOnly?: boolean;
 };
 
-export const SMBForm = ({ form, readOnly = false }: Props) => {
+export const SMBForm = ({ form }: Props) => {
 	const guest = useWatch({ control: form.control, name: "guest" });
 
 	return (
@@ -117,7 +116,7 @@ export const SMBForm = ({ form, readOnly = false }: Props) => {
 				render={({ field }) => (
 					<FormItem>
 						<FormLabel>SMB Version</FormLabel>
-						<Select disabled={readOnly} onValueChange={field.onChange} value={field.value}>
+						<Select onValueChange={field.onChange} value={field.value}>
 							<FormControl>
 								<SelectTrigger>
 									<SelectValue placeholder="Select SMB version" />