regen-web/web-marketplace/src/components/organisms/PostFlow/PostFlow.EditedDraftModal.tsx at 2ea4f12064d09a5893a18a57f58f4eeeae0468b4 · regen-network/regen-web · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
import { msg } from '@lingui/core/macro';
import { useLingui } from '@lingui/react';
import { Trans } from '@lingui/react/macro';

import { RegenModalProps } from 'web-components/src/components/modal';
import { SadBeeModal } from 'web-components/src/components/modal/SadBeeModal/SadBeeModal';
import { CancelButtonFooter } from 'web-components/src/components/organisms/CancelButtonFooter/CancelButtonFooter';
import { Body, Title } from 'web-components/src/components/typography';

type EditedDraftModalProps = {
  onCancel: () => void;
  onSubmit: () => void;
  shouldSaveDraft: boolean;
} & RegenModalProps;

export const EditedDraftModal = ({
  onCancel,
  onSubmit,
  open,
  onClose,
  shouldSaveDraft,
}: EditedDraftModalProps) => {
  const { _ } = useLingui();
  return (
    <SadBeeModal open={open} onClose={onClose}>
      <Title variant="h4" className="text-center my-20">
        <Trans>
          Someone made changes to this draft while you were editing.
        </Trans>
      </Title>
      <Body size="lg" className="text-center mb-50">
        <Trans>You will overwrite their changes if you continue.</Trans>
      </Body>
      <CancelButtonFooter
        label={
          shouldSaveDraft
            ? _(msg`overwrite & save`)
            : _(msg`overwrite & publish`)
        }
        onCancel={onCancel}
        onClick={onSubmit}
      />
    </SadBeeModal>
  );
};