From 2a85623da6656c4b6ba58a053ece68aad781f45e Mon Sep 17 00:00:00 2001
From: LynithDev <61880709+LynithDev@users.noreply.github.com>
Date: Fri, 27 Dec 2024 13:02:20 +0100
Subject: [PATCH] LAUNCHER-4 chore: Changed DeleteModal text for various delete
 actions

---
 .../src/ui/components/overlay/Modal.tsx       | 26 +++++++++----------
 .../overlay/account/AddAccountModal.tsx       | 10 ++++++-
 .../src/ui/pages/cluster/ClusterOverview.tsx  |  2 ++
 .../src/ui/pages/cluster/ClusterWorlds.tsx    |  1 +
 4 files changed, 25 insertions(+), 14 deletions(-)

diff --git a/apps/frontend/src/ui/components/overlay/Modal.tsx b/apps/frontend/src/ui/components/overlay/Modal.tsx
index 49353acf..3e6e4af0 100644
--- a/apps/frontend/src/ui/components/overlay/Modal.tsx
+++ b/apps/frontend/src/ui/components/overlay/Modal.tsx
@@ -207,6 +207,8 @@ type ModalDeleteProps = MakeOptional<ModalSimpleProps, 'title'> & {
 	onDelete?: () => void;
 	timeLeft?: number;
 	deleteBtnText?: string;
+	name?: string;
+	description?: string;
 };
 
 Modal.Delete = function (props: ModalDeleteProps) {
@@ -232,7 +234,10 @@ Modal.Delete = function (props: ModalDeleteProps) {
 			return;
 
 		clearIntervalId();
-		setTimeLeft(split.timeLeft || 3);
+		setTimeLeft(split.timeLeft ?? 3);
+
+		if (split.timeLeft === 0)
+			return;
 
 		const intervalId = setInterval(() => {
 			setTimeLeft((prev) => {
@@ -283,19 +288,14 @@ Modal.Delete = function (props: ModalDeleteProps) {
 			{split.children || (
 				<>
 					<div class="flex flex-col items-center justify-center gap-y-3">
-						<p>Are you sure you want to delete this item?</p>
+						<p>
+							Are you sure you want to delete
+							{' '}
+							{props.name || 'this item'}
+							?
+						</p>
 						<p class="w-82 text-danger line-height-normal uppercase">
-							Doing this will
-							{' '}
-							<span class="font-bold underline">delete</span>
-							{' '}
-							your entire
-							{' '}
-							<br />
-							data
-							{' '}
-							<span class="font-bold underline">FOREVER</span>
-							.
+							{props.description || `${props.name || 'It'} will not be recoverable if you proceed!`}
 						</p>
 					</div>
 				</>
diff --git a/apps/frontend/src/ui/components/overlay/account/AddAccountModal.tsx b/apps/frontend/src/ui/components/overlay/account/AddAccountModal.tsx
index f4334662..2f04ea4b 100644
--- a/apps/frontend/src/ui/components/overlay/account/AddAccountModal.tsx
+++ b/apps/frontend/src/ui/components/overlay/account/AddAccountModal.tsx
@@ -28,7 +28,15 @@ export function AccountControllerProvider(props: ParentProps) {
 	));
 
 	const deleteAccountModal = createModal(props => (
-		<Modal.Delete {...props} onDelete={() => _forceRemoveAccount(deleteModalUuid())} />
+		<Modal.Delete
+			{...props}
+			children="Are you sure you want to remove this account?"
+			deleteBtnText="Remove $1"
+			name="Account"
+			onDelete={() => _forceRemoveAccount(deleteModalUuid())}
+			timeLeft={0}
+			title="Remove Account"
+		/>
 	));
 
 	function refetch() {
diff --git a/apps/frontend/src/ui/pages/cluster/ClusterOverview.tsx b/apps/frontend/src/ui/pages/cluster/ClusterOverview.tsx
index 42af28a9..82a0a42e 100644
--- a/apps/frontend/src/ui/pages/cluster/ClusterOverview.tsx
+++ b/apps/frontend/src/ui/pages/cluster/ClusterOverview.tsx
@@ -40,7 +40,9 @@ function ClusterOverview() {
 	const deleteModal = createModal(props => (
 		<Modal.Delete
 			{...props}
+			name={cluster() ? `'${cluster()?.meta.name}'` : 'The Cluster'}
 			onDelete={deleteCluster}
+			title="Confirm Cluster Deletion"
 		/>
 	));
 
diff --git a/apps/frontend/src/ui/pages/cluster/ClusterWorlds.tsx b/apps/frontend/src/ui/pages/cluster/ClusterWorlds.tsx
index 20a1fd7d..cfea2691 100644
--- a/apps/frontend/src/ui/pages/cluster/ClusterWorlds.tsx
+++ b/apps/frontend/src/ui/pages/cluster/ClusterWorlds.tsx
@@ -61,6 +61,7 @@ function WorldEntry(props: { name: string; cluster_path: string }) {
 	const deleteModal = createModal(self => (
 		<Modal.Delete
 			{...self}
+			name={`world '${props.name}'`}
 			onDelete={() => {
 				// bridge.commands.deleteWorld(props.name);
 				self.hide();