diff --git a/package-lock.json b/package-lock.json index 5b6de38..6d993aa 100644 --- a/package-lock.json +++ b/package-lock.json @@ -18,7 +18,7 @@ "@fortawesome/free-regular-svg-icons": "5.15.4", "@fortawesome/free-solid-svg-icons": "5.15.4", "@fortawesome/react-fontawesome": "0.2.0", - "@openedx/paragon": "^21.13.0", + "@openedx/paragon": "^22.7.0", "@reduxjs/toolkit": "1.5.0", "core-js": "3.27.2", "prop-types": "15.8.1", @@ -4529,9 +4529,9 @@ } }, "node_modules/@openedx/paragon": { - "version": "21.13.1", - "resolved": "https://registry.npmjs.org/@openedx/paragon/-/paragon-21.13.1.tgz", - "integrity": "sha512-sLL+Z3ZWIRM6x+OrKZV0S7/SQpEcSeRcDm7E3FzhsnAWudsJCTELvSW+84uy/8dwV7mJhttsBPqQEtNafbCyYA==", + "version": "22.7.0", + "resolved": "https://registry.npmjs.org/@openedx/paragon/-/paragon-22.7.0.tgz", + "integrity": "sha512-BWj4vYXUmLS0BinJckxbhNp0o1UPfwURinaSgTxxBkF0L2VUtAO+SldVWvKDqlltzoR062yjcBA5QSGq8Jxgeg==", "dependencies": { "@fortawesome/fontawesome-svg-core": "^6.1.1", "@fortawesome/react-fontawesome": "^0.1.18", diff --git a/package.json b/package.json index a395fcd..6c1367c 100644 --- a/package.json +++ b/package.json @@ -42,7 +42,7 @@ "@fortawesome/free-regular-svg-icons": "5.15.4", "@fortawesome/free-solid-svg-icons": "5.15.4", "@fortawesome/react-fontawesome": "0.2.0", - "@openedx/paragon": "^21.13.0", + "@openedx/paragon": "^22.7.0", "@reduxjs/toolkit": "1.5.0", "core-js": "3.27.2", "prop-types": "15.8.1", diff --git a/src/pages/ExamsPage/__snapshots__/index.test.jsx.snap b/src/pages/ExamsPage/__snapshots__/index.test.jsx.snap index 9b4cf6a..4550aaf 100644 --- a/src/pages/ExamsPage/__snapshots__/index.test.jsx.snap +++ b/src/pages/ExamsPage/__snapshots__/index.test.jsx.snap @@ -92,6 +92,15 @@ exports[`ExamsPage snapshots exams and attempts loaded 1`] = ` > Review Dashboard + + Allowances + + +
+ { allowances.length === 0 + ? ( + <> +

{formatMessage(messages.noAllowancesHeader)}

+

{formatMessage(messages.noAllowancesBody)}

+ + + ) + : null } +
+ + ); +}; + +AllowanceList.propTypes = { + allowances: PropTypes.arrayOf(PropTypes.object).isRequired, // eslint-disable-line react/forbid-prop-types +}; + +export default AllowanceList; diff --git a/src/pages/ExamsPage/components/AllowanceList.scss b/src/pages/ExamsPage/components/AllowanceList.scss new file mode 100644 index 0000000..8fd55d3 --- /dev/null +++ b/src/pages/ExamsPage/components/AllowanceList.scss @@ -0,0 +1,18 @@ +.allowances-body { + display: inline-block; + text-align: center; + width: 100%; + padding-bottom: 50px; +} + +.allowances-header { + width: 100%; + padding: 10px; + position: relative; + + .header-allowance-button { + position: absolute; + top: 10px; + right: 10px; + } +} diff --git a/src/pages/ExamsPage/components/AllowanceList.test.jsx b/src/pages/ExamsPage/components/AllowanceList.test.jsx new file mode 100644 index 0000000..4e77d19 --- /dev/null +++ b/src/pages/ExamsPage/components/AllowanceList.test.jsx @@ -0,0 +1,12 @@ +import { render } from '@testing-library/react'; + +import AllowanceList from './AllowanceList'; + +// normally mocked for unit tests but required for rendering/snapshots +// jest.unmock('react'); + +describe('AllowanceList', () => { + it('Test that the AllowanceList matches snapshot', () => { + expect(render()).toMatchSnapshot(); + }); +}); diff --git a/src/pages/ExamsPage/components/ExamSelection.jsx b/src/pages/ExamsPage/components/ExamSelection.jsx index eddf15f..52c2e7f 100644 --- a/src/pages/ExamsPage/components/ExamSelection.jsx +++ b/src/pages/ExamsPage/components/ExamSelection.jsx @@ -8,7 +8,7 @@ import PropTypes from 'prop-types'; import messages from '../messages'; -const ExamSelection = ({ exams, onSelect }) => { +const ExamSelection = ({ exams, onSelect, isDisabled }) => { const { formatMessage } = useIntl(); const [searchText, setSearchText] = useState(''); const getMenuItems = () => { @@ -38,6 +38,7 @@ const ExamSelection = ({ exams, onSelect }) => {
{ getMenuItems() } @@ -51,6 +52,11 @@ ExamSelection.propTypes = { name: PropTypes.string, })).isRequired, onSelect: PropTypes.func.isRequired, + isDisabled: PropTypes.bool, +}; + +ExamSelection.defaultProps = { + isDisabled: false, }; export default ExamSelection; diff --git a/src/pages/ExamsPage/components/ExamSelection.test.jsx b/src/pages/ExamsPage/components/ExamSelection.test.jsx index 9d35e7b..69a225d 100644 --- a/src/pages/ExamsPage/components/ExamSelection.test.jsx +++ b/src/pages/ExamsPage/components/ExamSelection.test.jsx @@ -57,4 +57,8 @@ describe('ExamSelection', () => { expect(mockHandleSelectExam).toHaveBeenCalledTimes(1); expect(mockHandleSelectExam).toHaveBeenCalledWith(27); }); + it('button disabled when isDisabled is true', () => { + renderWithoutError(); + expect(screen.getByText('Select an exam')).toBeDisabled(); + }); }); diff --git a/src/pages/ExamsPage/components/__snapshots__/AllowanceList.test.jsx.snap b/src/pages/ExamsPage/components/__snapshots__/AllowanceList.test.jsx.snap new file mode 100644 index 0000000..5e868a1 --- /dev/null +++ b/src/pages/ExamsPage/components/__snapshots__/AllowanceList.test.jsx.snap @@ -0,0 +1,214 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`AllowanceList Test that the AllowanceList matches snapshot 1`] = ` +{ + "asFragment": [Function], + "baseElement": +
+
+

+ + Allowances + +

+ +
+
+

+ + No Allowances + +

+

+ + Need to grant an allowance? Get started here. + +

+ +
+
+ , + "container":
+
+

+ + Allowances + +

+ +
+
+

+ + No Allowances + +

+

+ + Need to grant an allowance? Get started here. + +

+ +
+
, + "debug": [Function], + "findAllByAltText": [Function], + "findAllByDisplayValue": [Function], + "findAllByLabelText": [Function], + "findAllByPlaceholderText": [Function], + "findAllByRole": [Function], + "findAllByTestId": [Function], + "findAllByText": [Function], + "findAllByTitle": [Function], + "findByAltText": [Function], + "findByDisplayValue": [Function], + "findByLabelText": [Function], + "findByPlaceholderText": [Function], + "findByRole": [Function], + "findByTestId": [Function], + "findByText": [Function], + "findByTitle": [Function], + "getAllByAltText": [Function], + "getAllByDisplayValue": [Function], + "getAllByLabelText": [Function], + "getAllByPlaceholderText": [Function], + "getAllByRole": [Function], + "getAllByTestId": [Function], + "getAllByText": [Function], + "getAllByTitle": [Function], + "getByAltText": [Function], + "getByDisplayValue": [Function], + "getByLabelText": [Function], + "getByPlaceholderText": [Function], + "getByRole": [Function], + "getByTestId": [Function], + "getByText": [Function], + "getByTitle": [Function], + "queryAllByAltText": [Function], + "queryAllByDisplayValue": [Function], + "queryAllByLabelText": [Function], + "queryAllByPlaceholderText": [Function], + "queryAllByRole": [Function], + "queryAllByTestId": [Function], + "queryAllByText": [Function], + "queryAllByTitle": [Function], + "queryByAltText": [Function], + "queryByDisplayValue": [Function], + "queryByLabelText": [Function], + "queryByPlaceholderText": [Function], + "queryByRole": [Function], + "queryByTestId": [Function], + "queryByText": [Function], + "queryByTitle": [Function], + "rerender": [Function], + "unmount": [Function], +} +`; diff --git a/src/pages/ExamsPage/components/__snapshots__/AttemptList.test.jsx.snap b/src/pages/ExamsPage/components/__snapshots__/AttemptList.test.jsx.snap index 3228ef4..4dea8f4 100644 --- a/src/pages/ExamsPage/components/__snapshots__/AttemptList.test.jsx.snap +++ b/src/pages/ExamsPage/components/__snapshots__/AttemptList.test.jsx.snap @@ -490,7 +490,7 @@ exports[`AttemptList Test that the AttemptList matches snapshot 1`] = ` >