packages/components/containers/organization/groups/GroupItemActionPrompt.tsx

   1 import { c } from 'ttag';
   2
   3 import { Button } from '@proton/atoms';
   4 import type { ModalStateProps } from '@proton/components/components/modalTwo/useModalState';
   5 import Prompt from '@proton/components/components/prompt/Prompt';
   6 import useLoading from '@proton/hooks/useLoading';
   7
   8 interface Props {
   9     title: string;
  10     buttonTitle: string;
  11     children: React.ReactNode;
  12     onConfirm: () => Promise<void>;
  13 }
  14
  15 const GroupItemActionPrompt = ({
  16     title,
  17     buttonTitle,
  18     children,
  19     onClose,
  20     onConfirm,
  21     open,
  22     ...modalProps
  23 }: Props & ModalStateProps) => {
  24     const [loading, withLoading] = useLoading();
  25
  26     return (
  27         <Prompt
  28             open={open}
  29             onClose={onClose}
  30             title={title}
  31             buttons={[
  32                 <Button
  33                     color="danger"
  34                     onClick={() => {
  35                         withLoading(onConfirm().then(() => onClose()));
  36                     }}
  37                     loading={loading}
  38                 >
  39                     {buttonTitle}
  40                 </Button>,
  41                 <Button onClick={onClose}>{c('Action').t`Cancel`}</Button>,
  42             ]}
  43             {...modalProps}
  44         >
  45             <p className="m-0">{children}</p>
  46         </Prompt>
  47     );
  48 };
  49
  50 export default GroupItemActionPrompt;