diff --git a/src/account-settings/DOBForm.jsx b/src/account-settings/DOBForm.jsx
index d503187..2be346c 100644
--- a/src/account-settings/DOBForm.jsx
+++ b/src/account-settings/DOBForm.jsx
@@ -1,9 +1,9 @@
import PropTypes from 'prop-types';
-import { injectIntl, intlShape } from '@edx/frontend-platform/i18n';
+import { useIntl } from '@edx/frontend-platform/i18n';
import {
Form, StatefulButton, ModalDialog, ActionRow, useToggle, Button,
} from '@openedx/paragon';
-import React, { useCallback, useEffect, useState } from 'react';
+import { useCallback, useEffect, useState } from 'react';
import { connect, useDispatch } from 'react-redux';
import messages from './AccountSettingsPage.messages';
import { YEAR_OF_BIRTH_OPTIONS } from './data/constants';
@@ -11,11 +11,11 @@ import { editableFieldSelector } from './data/selectors';
import { saveSettingsReset } from './data/actions';
const DOBModal = (props) => {
+ const intl = useIntl();
const {
saveState,
error,
onSubmit,
- intl,
} = props;
const dispatch = useDispatch();
@@ -151,7 +151,6 @@ DOBModal.propTypes = {
saveState: PropTypes.oneOf(['default', 'pending', 'complete', 'error']),
error: PropTypes.string,
onSubmit: PropTypes.func.isRequired,
- intl: intlShape.isRequired,
};
DOBModal.defaultProps = {
@@ -159,4 +158,4 @@ DOBModal.defaultProps = {
error: undefined,
};
-export default connect(editableFieldSelector)(injectIntl(DOBModal));
+export default connect(editableFieldSelector)(DOBModal);
diff --git a/src/account-settings/EditableSelectField.jsx b/src/account-settings/EditableSelectField.jsx
index bc1757e..1044c27 100644
--- a/src/account-settings/EditableSelectField.jsx
+++ b/src/account-settings/EditableSelectField.jsx
@@ -1,7 +1,6 @@
-import React from 'react';
import PropTypes from 'prop-types';
import { connect } from 'react-redux';
-import { injectIntl, intlShape } from '@edx/frontend-platform/i18n';
+import { useIntl } from '@edx/frontend-platform/i18n';
import {
Button, Form, StatefulButton,
} from '@openedx/paragon';
@@ -19,6 +18,7 @@ import { editableFieldSelector } from './data/selectors';
import CertificatePreference from './certificate-preference/CertificatePreference';
const EditableSelectField = (props) => {
+ const intl = useIntl();
const {
name,
label,
@@ -39,7 +39,6 @@ const EditableSelectField = (props) => {
isEditing,
isEditable,
isGrayedOut,
- intl,
...others
} = props;
const id = `field-${name}`;
@@ -227,7 +226,6 @@ EditableSelectField.propTypes = {
isEditing: PropTypes.bool,
isEditable: PropTypes.bool,
isGrayedOut: PropTypes.bool,
- intl: intlShape.isRequired,
};
EditableSelectField.defaultProps = {
@@ -249,4 +247,4 @@ EditableSelectField.defaultProps = {
export default connect(editableFieldSelector, {
onEdit: openForm,
onCancel: closeForm,
-})(injectIntl(EditableSelectField));
+})(EditableSelectField);
diff --git a/src/account-settings/JumpNav.jsx b/src/account-settings/JumpNav.jsx
index 5aa76be..20d36d4 100644
--- a/src/account-settings/JumpNav.jsx
+++ b/src/account-settings/JumpNav.jsx
@@ -1,15 +1,13 @@
import { getConfig } from '@edx/frontend-platform';
-import { injectIntl, intlShape } from '@edx/frontend-platform/i18n';
+import { useIntl } from '@edx/frontend-platform/i18n';
import { breakpoints, useWindowSize } from '@openedx/paragon';
import classNames from 'classnames';
-import React from 'react';
import { NavHashLink } from 'react-router-hash-link';
import Scrollspy from 'react-scrollspy';
import messages from './AccountSettingsPage.messages';
-const JumpNav = ({
- intl,
-}) => {
+const JumpNav = () => {
+ const intl = useIntl();
const stickToTop = useWindowSize().width > breakpoints.small.minWidth;
return (
@@ -71,8 +69,4 @@ const JumpNav = ({
);
};
-JumpNav.propTypes = {
- intl: intlShape.isRequired,
-};
-
-export default injectIntl(JumpNav);
+export default JumpNav;
diff --git a/src/account-settings/test/EditableSelectField.test.jsx b/src/account-settings/test/EditableSelectField.test.jsx
index 911749b..d930656 100644
--- a/src/account-settings/test/EditableSelectField.test.jsx
+++ b/src/account-settings/test/EditableSelectField.test.jsx
@@ -1,10 +1,9 @@
-import React from 'react';
import { BrowserRouter as Router } from 'react-router-dom';
import { Provider } from 'react-redux';
import renderer from 'react-test-renderer';
import configureStore from 'redux-mock-store';
-import { IntlProvider, injectIntl } from '@edx/frontend-platform/i18n';
+import { IntlProvider } from '@edx/frontend-platform/i18n';
import EditableSelectField from '../EditableSelectField';
@@ -17,8 +16,6 @@ jest.mock('react-redux', () => ({
jest.mock('@edx/frontend-platform/auth');
jest.mock('../data/selectors', () => jest.fn().mockImplementation(() => ({ certPreferenceSelector: () => ({}) })));
-const IntlEditableSelectField = injectIntl(EditableSelectField);
-
const mockStore = configureStore();
describe('EditableSelectField', () => {
@@ -88,7 +85,7 @@ describe('EditableSelectField', () => {
afterEach(() => jest.clearAllMocks());
it('renders EditableSelectField correctly with editing disabled', () => {
- const tree = renderer.create(reduxWrapper()).toJSON();
+ const tree = renderer.create(reduxWrapper()).toJSON();
expect(tree).toMatchSnapshot();
});
@@ -98,7 +95,7 @@ describe('EditableSelectField', () => {
isEditing: true,
};
- const tree = renderer.create(reduxWrapper()).toJSON();
+ const tree = renderer.create(reduxWrapper()).toJSON();
expect(tree).toMatchSnapshot();
});
@@ -107,7 +104,7 @@ describe('EditableSelectField', () => {
...props,
error: 'This is an error message',
};
- const tree = renderer.create(reduxWrapper()).toJSON();
+ const tree = renderer.create(reduxWrapper()).toJSON();
expect(tree).toMatchSnapshot();
});
@@ -126,7 +123,7 @@ describe('EditableSelectField', () => {
},
],
};
- const tree = renderer.create(reduxWrapper()).toJSON();
+ const tree = renderer.create(reduxWrapper()).toJSON();
expect(tree).toMatchSnapshot();
});
@@ -140,7 +137,7 @@ describe('EditableSelectField', () => {
},
],
};
- const tree = renderer.create(reduxWrapper()).toJSON();
+ const tree = renderer.create(reduxWrapper()).toJSON();
expect(tree).toMatchSnapshot();
});
@@ -163,7 +160,7 @@ describe('EditableSelectField', () => {
},
],
};
- const tree = renderer.create(reduxWrapper()).toJSON();
+ const tree = renderer.create(reduxWrapper()).toJSON();
expect(tree).toMatchSnapshot();
});
});
diff --git a/src/account-settings/test/JumpNav.test.jsx b/src/account-settings/test/JumpNav.test.jsx
index 901689b..8f73e30 100644
--- a/src/account-settings/test/JumpNav.test.jsx
+++ b/src/account-settings/test/JumpNav.test.jsx
@@ -1,20 +1,16 @@
-import React from 'react';
import { render, screen } from '@testing-library/react';
-import { IntlProvider, injectIntl } from '@edx/frontend-platform/i18n';
+import { IntlProvider } from '@edx/frontend-platform/i18n';
import { AppProvider } from '@edx/frontend-platform/react';
import { initializeMockApp, mergeConfig, setConfig } from '@edx/frontend-platform';
import JumpNav from '../JumpNav';
import configureStore from '../../data/configureStore';
-const IntlJumpNav = injectIntl(JumpNav);
-
describe('JumpNav', () => {
mergeConfig({
ENABLE_ACCOUNT_DELETION: true,
});
- let props = {};
let store;
beforeEach(() => {
@@ -27,9 +23,6 @@ describe('JumpNav', () => {
},
});
- props = {
- intl: {},
- };
store = configureStore({
notificationPreferences: {
showPreferences: false,
@@ -45,7 +38,7 @@ describe('JumpNav', () => {
render(
-
+
,
);
@@ -58,14 +51,10 @@ describe('JumpNav', () => {
ENABLE_ACCOUNT_DELETION: true,
});
- props = {
- ...props,
- };
-
render(
-
+
,
);