99 lines
2.5 KiB
TypeScript
99 lines
2.5 KiB
TypeScript
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 = ({ onClose }: { onClose: () => void }) => {
|
|
const { workspace, workspaces, updateWorkspace, deleteCurrentWorkspace } =
|
|
useWorkspace()
|
|
|
|
const handleNameChange = (name: string) => {
|
|
if (!workspace?.id) return
|
|
updateWorkspace(workspace?.id, { name })
|
|
}
|
|
|
|
const handleChangeIcon = (icon: string) => {
|
|
if (!workspace?.id) return
|
|
updateWorkspace(workspace?.id, { icon })
|
|
}
|
|
|
|
const handleDeleteClick = async () => {
|
|
await deleteCurrentWorkspace()
|
|
onClose()
|
|
}
|
|
|
|
return (
|
|
<Stack spacing="6" w="full">
|
|
<FormControl>
|
|
<FormLabel>Icon</FormLabel>
|
|
<Flex>
|
|
{workspace && (
|
|
<EditableEmojiOrImageIcon
|
|
uploadFilePath={`workspaces/${workspace.id}/icon`}
|
|
icon={workspace.icon}
|
|
onChangeIcon={handleChangeIcon}
|
|
boxSize="40px"
|
|
/>
|
|
)}
|
|
</Flex>
|
|
</FormControl>
|
|
<FormControl>
|
|
<FormLabel htmlFor="name">Name</FormLabel>
|
|
{workspace && (
|
|
<Input
|
|
id="name"
|
|
withVariableButton={false}
|
|
defaultValue={workspace?.name}
|
|
onChange={handleNameChange}
|
|
/>
|
|
)}
|
|
</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"
|
|
/>
|
|
</>
|
|
)
|
|
}
|