share-project-modal-content.js 2.5 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091
  1. import React from 'react'
  2. import { Button, Modal, Grid } from 'react-bootstrap'
  3. import { Trans } from 'react-i18next'
  4. import ShareModalBody from './share-modal-body'
  5. import Icon from '../../../shared/components/icon'
  6. import AccessibleModal from '../../../shared/components/accessible-modal'
  7. import PropTypes from 'prop-types'
  8. import { ReadOnlyTokenLink } from './link-sharing'
  9. import { useEditorContext } from '../../../shared/context/editor-context'
  10. export default function ShareProjectModalContent({
  11. show,
  12. cancel,
  13. animation,
  14. inFlight,
  15. error,
  16. }) {
  17. const { isRestrictedTokenMember } = useEditorContext({
  18. isRestrictedTokenMember: PropTypes.bool,
  19. })
  20. return (
  21. <AccessibleModal show={show} onHide={cancel} animation={animation}>
  22. <Modal.Header closeButton>
  23. <Modal.Title>
  24. <Trans i18nKey="share_project" />
  25. </Modal.Title>
  26. </Modal.Header>
  27. <Modal.Body className="modal-body-share">
  28. <Grid fluid>
  29. {isRestrictedTokenMember ? <ReadOnlyTokenLink /> : <ShareModalBody />}
  30. </Grid>
  31. </Modal.Body>
  32. <Modal.Footer className="modal-footer-share">
  33. <div className="modal-footer-left">
  34. {inFlight && <Icon type="refresh" spin />}
  35. {error && (
  36. <span className="text-danger error">
  37. <ErrorMessage error={error} />
  38. </span>
  39. )}
  40. </div>
  41. <div className="modal-footer-right">
  42. <Button
  43. type="button"
  44. onClick={cancel}
  45. bsStyle="default"
  46. disabled={inFlight}
  47. >
  48. <Trans i18nKey="close" />
  49. </Button>
  50. </div>
  51. </Modal.Footer>
  52. </AccessibleModal>
  53. )
  54. }
  55. ShareProjectModalContent.propTypes = {
  56. cancel: PropTypes.func.isRequired,
  57. show: PropTypes.bool,
  58. animation: PropTypes.bool,
  59. inFlight: PropTypes.bool,
  60. error: PropTypes.string,
  61. }
  62. function ErrorMessage({ error }) {
  63. switch (error) {
  64. case 'cannot_invite_non_user':
  65. return <Trans i18nKey="cannot_invite_non_user" />
  66. case 'cannot_verify_user_not_robot':
  67. return <Trans i18nKey="cannot_verify_user_not_robot" />
  68. case 'cannot_invite_self':
  69. return <Trans i18nKey="cannot_invite_self" />
  70. case 'invalid_email':
  71. return <Trans i18nKey="invalid_email" />
  72. case 'too_many_requests':
  73. return <Trans i18nKey="too_many_requests" />
  74. default:
  75. return <Trans i18nKey="generic_something_went_wrong" />
  76. }
  77. }
  78. ErrorMessage.propTypes = {
  79. error: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]).isRequired,
  80. }