gitscope
/
← marzneshin / app/dashboard/src/components/delete-modal/index.tsx / blame
Files Commits 446 Branches 1 Tags 43 Markers 4 README License
https://dev.kronoz.win/r/marzneshin.git
app/dashboard/src/components/delete-modal/index.tsx · v0.1.2
Source
1 bedeeff Mardin 2y ago
2 bedeeff Mardin 2y ago
3 a47eb4c Dawsh 2y ago import {
4 a47eb4c Dawsh 2y ago Button,
5 a47eb4c Dawsh 2y ago Modal,
6 a47eb4c Dawsh 2y ago ModalBody,
7 a47eb4c Dawsh 2y ago ModalCloseButton,
8 a47eb4c Dawsh 2y ago ModalContent,
9 a47eb4c Dawsh 2y ago ModalFooter,
10 a47eb4c Dawsh 2y ago ModalHeader,
11 a47eb4c Dawsh 2y ago ModalOverlay,
12 a47eb4c Dawsh 2y ago Spinner,
13 a47eb4c Dawsh 2y ago Text,
14 bf7c131 Mardin 2y ago } from '@chakra-ui/react';
15 bedeeff Mardin 2y ago import { FC } from 'react';
16 bf7c131 Mardin 2y ago import { Trans, useTranslation } from 'react-i18next';
17 5825ea4 Mardin 2y ago import { DeleteIcon } from 'components/dialog';
18 bedeeff Mardin 2y ago import { Icon } from 'components/icon';
19 a47eb4c Dawsh 2y ago
20 bedeeff Mardin 2y ago type DeleteModalProps = {
21 bedeeff Mardin 2y ago onDelete: () => void,
22 bedeeff Mardin 2y ago deleteObjectPromptT: string,
23 bedeeff Mardin 2y ago deleteObjectTitleT: string,
24 bedeeff Mardin 2y ago deletingObjectName?: string,
25 bedeeff Mardin 2y ago isOpen: boolean,
26 bedeeff Mardin 2y ago onClose: () => void,
27 bedeeff Mardin 2y ago loading: boolean,
28 bedeeff Mardin 2y ago }
29 a47eb4c Dawsh 2y ago
30 bedeeff Mardin 2y ago export const DeleteModal: FC<DeleteModalProps> = ({
31 bedeeff Mardin 2y ago onDelete,
32 bedeeff Mardin 2y ago isOpen,
33 bedeeff Mardin 2y ago onClose,
34 bedeeff Mardin 2y ago deletingObjectName,
35 bedeeff Mardin 2y ago loading,
36 bedeeff Mardin 2y ago deleteObjectTitleT,
37 bedeeff Mardin 2y ago deleteObjectPromptT
38 bedeeff Mardin 2y ago }) => {
39 bedeeff Mardin 2y ago const { t } = useTranslation();
40 a47eb4c Dawsh 2y ago
41 a47eb4c Dawsh 2y ago return (
42 bedeeff Mardin 2y ago <Modal isCentered isOpen={isOpen} onClose={onClose} size="sm">
43 a47eb4c Dawsh 2y ago <ModalOverlay bg="blackAlpha.300" backdropFilter="blur(10px)" />
44 a47eb4c Dawsh 2y ago <ModalContent mx="3">
45 a47eb4c Dawsh 2y ago <ModalHeader pt={6}>
46 a47eb4c Dawsh 2y ago <Icon color="red">
47 a47eb4c Dawsh 2y ago <DeleteIcon />
48 a47eb4c Dawsh 2y ago </Icon>
49 a47eb4c Dawsh 2y ago </ModalHeader>
50 a47eb4c Dawsh 2y ago <ModalCloseButton mt={3} />
51 a47eb4c Dawsh 2y ago <ModalBody>
52 a47eb4c Dawsh 2y ago <Text fontWeight="semibold" fontSize="lg">
53 bedeeff Mardin 2y ago {t(deleteObjectTitleT)}
54 a47eb4c Dawsh 2y ago </Text>
55 bedeeff Mardin 2y ago {deletingObjectName && (
56 a47eb4c Dawsh 2y ago <Text
57 a47eb4c Dawsh 2y ago mt={1}
58 a47eb4c Dawsh 2y ago fontSize="sm"
59 bf7c131 Mardin 2y ago _dark={{ color: 'gray.400' }}
60 a47eb4c Dawsh 2y ago color="gray.600"
61 a47eb4c Dawsh 2y ago >
62 a47eb4c Dawsh 2y ago <Trans components={{ b: <b /> }}>
63 bedeeff Mardin 2y ago {t(deleteObjectPromptT, { name: deletingObjectName })}
64 a47eb4c Dawsh 2y ago </Trans>
65 a47eb4c Dawsh 2y ago </Text>
66 a47eb4c Dawsh 2y ago )}
67 a47eb4c Dawsh 2y ago </ModalBody>
68 a47eb4c Dawsh 2y ago <ModalFooter display="flex">
69 a47eb4c Dawsh 2y ago <Button size="sm" onClick={onClose} mr={3} w="full" variant="outline">
70 bf7c131 Mardin 2y ago {t('cancel')}
71 a47eb4c Dawsh 2y ago </Button>
72 a47eb4c Dawsh 2y ago <Button
73 a47eb4c Dawsh 2y ago size="sm"
74 a47eb4c Dawsh 2y ago w="full"
75 a47eb4c Dawsh 2y ago colorScheme="red"
76 a47eb4c Dawsh 2y ago onClick={() => onDelete()}
77 5bb2712 Mardin 2y ago leftIcon={loading ? <Spinner size="xs" /> : undefined}
78 a47eb4c Dawsh 2y ago >
79 bf7c131 Mardin 2y ago {t('delete')}
80 a47eb4c Dawsh 2y ago </Button>
81 a47eb4c Dawsh 2y ago </ModalFooter>
82 a47eb4c Dawsh 2y ago </ModalContent>
83 a47eb4c Dawsh 2y ago </Modal>
84 a47eb4c Dawsh 2y ago );
85 a47eb4c Dawsh 2y ago };