Updated names for uniformity

src/pages/settings/components/Shared/DeleteItemModal.tsx

@@ -1,15 +1,17 @@
-import { Card, Modal } from '@mantine/core';
+import { Button, Card, Group, Modal } from '@mantine/core';
 import { useCommonHooks } from 'hooks';
 import { cardClasses, modalClasses } from 'styles';
 
 function DeleteItemModal({
 	modalOpened,
 	handleClose,
+	handleDelete,
 	body,
 	title,
 }: {
 	modalOpened: boolean;
 	handleClose: () => void;
+	handleDelete: () => void;
 	body: React.ReactNode;
 	title: string;
 }) {
@@ -36,6 +38,25 @@ function DeleteItemModal({
 				<Modal.Body pb={'2rem'}>
 					<Card className={cardClasses.settingsItem} classNames={cardClasses}>
 						{body}
+						<Group w={'100%'} justify='center' bottom={8}>
+							<Button
+								color={'red'}
+								styles={{ label: { color: 'black' } }}
+								onClick={() => {
+									handleDelete();
+									handleClose();
+								}}
+							>
+								Delete
+							</Button>
+							<Button
+								color={'grey'}
+								styles={{ label: { color: 'white' } }}
+								onClick={handleClose}
+							>
+								Cancel
+							</Button>
+						</Group>
 					</Card>
 				</Modal.Body>
 			</Modal.Content>