From 907dda300ebd4c4a26715265c2c603d22e417e35 Mon Sep 17 00:00:00 2001
From: Sonny <sonnyasdev@gmail.com>
Date: Fri, 1 Nov 2024 20:07:41 +0100
Subject: [PATCH] feat: use new form layout for link/delete

---
 app/controllers/links_controller.ts           |  2 +-
 .../components/form/mantine_form_link.tsx     |  3 +-
 inertia/pages/mantine/links/delete.tsx        | 37 +++++++++++++++++++
 inertia/pages/mantine/links/edit.tsx          |  4 +-
 4 files changed, 42 insertions(+), 4 deletions(-)
 create mode 100644 inertia/pages/mantine/links/delete.tsx

diff --git a/app/controllers/links_controller.ts b/app/controllers/links_controller.ts
index 7dca271..29f636f 100644
--- a/app/controllers/links_controller.ts
+++ b/app/controllers/links_controller.ts
@@ -98,7 +98,7 @@ export default class LinksController {
 
 		const link = await this.getLinkById(linkId, auth.user!.id);
 		await link.load('collection');
-		return inertia.render('links/delete', { link });
+		return inertia.render('mantine/links/delete', { link });
 	}
 
 	async delete({ request, auth, response }: HttpContext) {
diff --git a/inertia/mantine/components/form/mantine_form_link.tsx b/inertia/mantine/components/form/mantine_form_link.tsx
index c5ac7d7..5f551f3 100644
--- a/inertia/mantine/components/form/mantine_form_link.tsx
+++ b/inertia/mantine/components/form/mantine_form_link.tsx
@@ -91,6 +91,7 @@ export default function MantineFormLink({
 					}))}
 					onChange={(value) => setData('collectionId', value)}
 					value={data.collectionId.toString()}
+					readOnly={disableInputs}
 					mt="md"
 					searchable
 					required
@@ -100,7 +101,7 @@ export default function MantineFormLink({
 					onChange={({ target }) => setData('favorite', target.checked)}
 					checked={data.favorite}
 					error={errors?.favorite}
-					disabled={disableInputs}
+					disabled={disableInputs} // readonly not working
 					mt="md"
 				/>
 			</BackToDashboard>
diff --git a/inertia/pages/mantine/links/delete.tsx b/inertia/pages/mantine/links/delete.tsx
new file mode 100644
index 0000000..e7669f6
--- /dev/null
+++ b/inertia/pages/mantine/links/delete.tsx
@@ -0,0 +1,37 @@
+import { useForm } from '@inertiajs/react';
+import { route } from '@izzyjs/route/client';
+import { useTranslation } from 'react-i18next';
+import MantineFormLink from '~/mantine/components/form/mantine_form_link';
+import { LinkWithCollection } from '~/types/app';
+
+export default function DeleteLinkPage({ link }: { link: LinkWithCollection }) {
+	const { t } = useTranslation('common');
+	const { data, setData, submit, processing } = useForm({
+		name: link.name,
+		description: link.description,
+		url: link.url,
+		favorite: link.favorite,
+		collectionId: link.collectionId,
+	});
+
+	const handleSubmit = () => {
+		const { method, url } = route('link.delete', {
+			params: { id: link.id.toString() },
+		});
+		submit(method, url);
+	};
+
+	return (
+		<MantineFormLink
+			title={t('link.delete')}
+			textSubmitButton={t('form.delete')}
+			canSubmit={!processing}
+			data={data}
+			setData={setData}
+			handleSubmit={handleSubmit}
+			collections={[link.collection]}
+			disableInputs
+			submitBtnDanger
+		/>
+	);
+}
diff --git a/inertia/pages/mantine/links/edit.tsx b/inertia/pages/mantine/links/edit.tsx
index 3598117..07d32ab 100644
--- a/inertia/pages/mantine/links/edit.tsx
+++ b/inertia/pages/mantine/links/edit.tsx
@@ -47,8 +47,8 @@ export default function EditLinkPage({
 
 	return (
 		<MantineFormLink
-			title={t('link.create')}
-			textSubmitButton={t('form.create')}
+			title={t('link.edit')}
+			textSubmitButton={t('form.update')}
 			canSubmit={canSubmit}
 			data={data}
 			setData={setData}