modal.tsx 1.1 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152
  1. import {Fragment} from 'react';
  2. import type {ModalRenderProps} from 'sentry/actionCreators/modal';
  3. import {Button} from 'sentry/components/button';
  4. import ButtonBar from 'sentry/components/buttonBar';
  5. import {t} from 'sentry/locale';
  6. type Props = {
  7. content: React.ReactElement;
  8. disabled: boolean;
  9. onSave: () => void;
  10. title: string;
  11. btnSaveLabel?: string;
  12. } & ModalRenderProps;
  13. function Modal({
  14. title,
  15. onSave,
  16. content,
  17. disabled,
  18. Header,
  19. Body,
  20. Footer,
  21. closeModal,
  22. btnSaveLabel = t('Save'),
  23. }: Props) {
  24. return (
  25. <Fragment>
  26. <Header closeButton>{title}</Header>
  27. <Body>{content}</Body>
  28. <Footer>
  29. <ButtonBar gap={1.5}>
  30. <Button onClick={closeModal}>{t('Cancel')}</Button>
  31. <Button
  32. onClick={event => {
  33. event.preventDefault();
  34. onSave();
  35. }}
  36. disabled={disabled}
  37. type="submit"
  38. priority="primary"
  39. form="relay-form"
  40. >
  41. {btnSaveLabel}
  42. </Button>
  43. </ButtonBar>
  44. </Footer>
  45. </Fragment>
  46. );
  47. }
  48. export default Modal;