MMT-3411: As a metadata user, I want to publish a UMM record

static.config.json

@@ -7,8 +7,8 @@
  },
  "ummVersions": {
  "ummC": "1.17.3",
- "ummS": "1.4",
- "ummT": "1.1",
+ "ummS": "1.5.2",
+ "ummT": "1.2.0",
  "ummV": "1.9.0"
  }
 }

static/src/js/App.jsx

@@ -22,6 +22,7 @@ import REDIRECTS from './constants/redirectsMap/redirectsMap'
 import { getApplicationConfig } from './utils/getConfig'
 
 import '../css/index.scss'
+import PublishPreview from './components/PublishPreview/PublishPreview'
 
 const redirectKeys = Object.keys(REDIRECTS)
 
@@ -101,6 +102,7 @@ const App = () => {
  <Route path="drafts/:draftType/*" element={<DraftsPage />} />
  <Route path="/404" element={<Page title="404 Not Found" pageType="secondary">Not Found :(</Page>} />
  <Route path="*" element={<Navigate to="/404" replace />} />
+ <Route path="/:type/:conceptId/:revisionId" element={<PublishPreview />} />
  </Route>
  </Routes>
  </BrowserRouter>

static/src/js/components/CustomModal/CustomModal.jsx

@@ -0,0 +1,72 @@
+import React from 'react'
+import PropTypes from 'prop-types'
+
+import Button from 'react-bootstrap/Button'
+import Modal from 'react-bootstrap/Modal'
+
+/**
+ * @typedef {Object} CustomModalProps
+ * @property {Boolean} show Should the modal be open.
+ * @property {String} message A message to describe the modal
+ * @property {Object} actions A list of actions for the modal
+ */
+
+/**
+ * Renders a DeleteModal component
+ *
+ * @component
+ * @example <caption>Render a Modal</caption>
+ * return (
+ * <CustomModal
+ * show={showDeleteModal}
+ * message='message'
+ * actions={[
+ * label: 'label',
+ * variant: 'primary'
+ * onClick: () => func
+ * ]}
+ * />
+ * )
+ */
+const CustomModal = ({
+ openModal,
+ message,
+ actions
+
+}) => (
+ <Modal
+ show={openModal}
+ >
+ <Modal.Body>{message}</Modal.Body>
+
+ <Modal.Footer>
+ {
+ actions.map((item) => {
+ const { label, variant, onClick } = item
+
+ return (
+ <Button
+ key={label}
+ variant={variant}
+ onClick={onClick}
+ >
+ {label}
+ </Button>
+ )
+ })
+ }
+ </Modal.Footer>
+ </Modal>
+)
+
+CustomModal.propTypes = {
+ actions: PropTypes.arrayOf(PropTypes.shape({
+ label: PropTypes.string.isRequired,
+ variant: PropTypes.string.isRequired,
+ onClick: PropTypes.func.isRequired
+ })).isRequired,
+ openModal: PropTypes.bool.isRequired,
+ message: PropTypes.string.isRequired
+}
+
+export default CustomModal

static/src/js/components/CustomModal/__tests__/CustomModal.test.js

@@ -0,0 +1,46 @@
+import { render, screen } from '@testing-library/react'
+import { userEvent } from '@testing-library/user-event'
+import React from 'react'
+import CustomModal from '../CustomModal'
+
+const setup = () => {
+ const onClick = jest.fn()
+ const props = {
+ openModal: true,
+ message: 'Mock message',
+ actions:
+ [
+ {
+ label: 'Yes',
+ variant: 'primary',
+ onClick
+ }
+ ]
+ }
+
+ render(<CustomModal {...props} />)
+
+ return {
+ props
+ }
+}
+
+describe('CustomModal', () => {
+ test('render a Modal', () => {
+ setup()
+
+ expect(screen.getByText('Mock message')).toBeInTheDocument()
+ })
+
+ describe('when selecting `Yes`', () => {
+ test('calls onClick', async () => {
+ const { props } = setup()
+
+ const button = screen.getByText('Yes')
+ await userEvent.click(button)
+
+ const onClickProp = props.actions.at(0).onClick
+ expect(onClickProp).toHaveBeenCalledTimes(1)
+ })
+ })
+})