feat(dashboard): ⚡️ Delete workspace button

apps/builder/components/dashboard/WorkspaceSettingsModal/WorkspaceSettingsForm.tsx

@@ -1,11 +1,21 @@
-import { Stack, FormControl, FormLabel, Flex } from '@chakra-ui/react'
+import {
+  Stack,
+  FormControl,
+  FormLabel,
+  Flex,
+  Button,
+  useDisclosure,
+  Text,
+} from '@chakra-ui/react'
+import { ConfirmModal } from 'components/modals/ConfirmModal'
 import { EditableEmojiOrImageIcon } from 'components/shared/EditableEmojiOrImageIcon'
 import { Input } from 'components/shared/Textbox'
 import { useWorkspace } from 'contexts/WorkspaceContext'
 import React from 'react'
 
-export const WorkspaceSettingsForm = () => {
-  const { workspace, updateWorkspace } = useWorkspace()
+export const WorkspaceSettingsForm = ({ onClose }: { onClose: () => void }) => {
+  const { workspace, workspaces, updateWorkspace, deleteCurrentWorkspace } =
+    useWorkspace()
 
   const handleNameChange = (name: string) => {
     if (!workspace?.id) return
@@ -17,6 +27,11 @@ export const WorkspaceSettingsForm = () => {
     updateWorkspace(workspace?.id, { icon })
   }
 
+  const handleDeleteClick = async () => {
+    await deleteCurrentWorkspace()
+    onClose()
+  }
+
   return (
     <Stack spacing="6" w="full">
       <FormControl>
@@ -40,6 +55,41 @@ export const WorkspaceSettingsForm = () => {
           />
         )}
       </FormControl>
+      {workspace && workspaces && workspaces.length > 1 && (
+        <DeleteWorkspaceButton
+          onConfirm={handleDeleteClick}
+          workspaceName={workspace?.name}
+        />
+      )}
     </Stack>
   )
 }
+
+const DeleteWorkspaceButton = ({
+  workspaceName,
+  onConfirm,
+}: {
+  workspaceName: string
+  onConfirm: () => Promise<void>
+}) => {
+  const { isOpen, onOpen, onClose } = useDisclosure()
+  return (
+    <>
+      <Button colorScheme="red" variant="outline" onClick={onOpen}>
+        Delete workspace
+      </Button>
+      <ConfirmModal
+        isOpen={isOpen}
+        onConfirm={onConfirm}
+        onClose={onClose}
+        message={
+          <Text>
+            Are you sure you want to delete {workspaceName} workspace? All its
+            folders, typebots and results will be deleted forever.'
+          </Text>
+        }
+        confirmButtonLabel="Delete"
+      />
+    </>
+  )
+}