feat: use new form layout for collection/delete

inertia/mantine/components/form/mantine_form_collection.tsx

@@ -3,7 +3,10 @@ import { Box, Group, SegmentedControl, Text, TextInput } from '@mantine/core';
 import { FormEvent } from 'react';
 import { useTranslation } from 'react-i18next';
 import BackToDashboard from '~/components/common/navigation/back_to_dashboard';
-import { MantineFormLayout } from '~/mantine/layouts/mantine_form_layout';
+import {
+	FormLayoutProps,
+	MantineFormLayout,
+} from '~/mantine/layouts/mantine_form_layout';
 import { Collection } from '~/types/app';
 
 export type FormCollectionData = {
@@ -13,30 +16,22 @@ export type FormCollectionData = {
 	nextId?: Collection['id'];
 };
 
-interface FormCollectionProps {
-	title: string;
-	canSubmit: boolean;
-	disableHomeLink?: boolean;
+interface FormCollectionProps extends FormLayoutProps {
 	data: FormCollectionData;
 	errors?: Record<string, Array<string>>;
 	disableInputs?: boolean;
-	submitBtnDanger?: boolean;
 
 	setData: (name: string, value: any) => void;
 	handleSubmit: () => void;
 }
 
 export default function MantineFormCollection({
-	title,
-	canSubmit,
-	disableHomeLink,
 	data,
 	errors,
 	disableInputs = false,
-	submitBtnDanger = false,
-
 	setData,
 	handleSubmit,
+	...props
 }: FormCollectionProps) {
 	const { t } = useTranslation('common');
 
@@ -46,20 +41,14 @@ export default function MantineFormCollection({
 	};
 
 	return (
-		<MantineFormLayout
-			title={title}
-			handleSubmit={onSubmit}
-			canSubmit={canSubmit}
-			disableHomeLink={disableHomeLink}
-			submitBtnDanger={submitBtnDanger}
-		>
+		<MantineFormLayout handleSubmit={onSubmit} {...props}>
 			<BackToDashboard>
 				<TextInput
 					label={t('form.name')}
 					placeholder={t('form.name')}
 					onChange={({ target }) => setData('name', target.value)}
 					value={data.name}
-					disabled={disableInputs}
+					readOnly={disableInputs}
 					error={errors?.name}
 					mt="md"
 					autoFocus
@@ -70,7 +59,7 @@ export default function MantineFormCollection({
 					placeholder={t('form.description')}
 					onChange={({ target }) => setData('description', target.value)}
 					value={data.description ?? undefined}
-					disabled={disableInputs}
+					readOnly={disableInputs}
 					error={errors?.description}
 					mt="md"
 				/>
@@ -87,6 +76,7 @@ export default function MantineFormCollection({
 							onChange={(value) => setData('visibility', value as Visibility)}
 							value={data.visibility}
 							style={{ minWidth: 'fit-content' }}
+							readOnly={disableInputs}
 						/>
 						{data.visibility === Visibility.PUBLIC && (
 							<Text c="dimmed" size="sm">