diff --git a/plugins/course-apps/live/BBBSettings.jsx b/plugins/course-apps/live/BBBSettings.jsx index 02b09a82b..0f19c17aa 100644 --- a/plugins/course-apps/live/BBBSettings.jsx +++ b/plugins/course-apps/live/BBBSettings.jsx @@ -1,6 +1,6 @@ import React, { useEffect, useState } from 'react'; import { getConfig } from '@edx/frontend-platform'; -import { FormattedMessage, injectIntl, intlShape } from '@edx/frontend-platform/i18n'; +import { FormattedMessage, useIntl } from '@edx/frontend-platform/i18n'; import { Form, Hyperlink } from '@openedx/paragon'; import PropTypes from 'prop-types'; import AppConfigFormDivider from 'CourseAuthoring/pages-and-resources/discussions/app-config-form/apps/shared/AppConfigFormDivider'; @@ -11,10 +11,10 @@ import LiveCommonFields from './LiveCommonFields'; import messages from './messages'; const BbbSettings = ({ - intl, values, setFieldValue, }) => { + const intl = useIntl(); const [bbbPlan, setBbbPlan] = useState(values.tierType); useEffect(() => { @@ -107,12 +107,10 @@ const BbbSettings = ({ )} - ); }; BbbSettings.propTypes = { - intl: intlShape.isRequired, values: PropTypes.shape({ consumerKey: PropTypes.string, consumerSecret: PropTypes.string, @@ -127,4 +125,4 @@ BbbSettings.propTypes = { setFieldValue: PropTypes.func.isRequired, }; -export default injectIntl(BbbSettings); +export default BbbSettings; diff --git a/plugins/course-apps/live/LiveCommonFields.jsx b/plugins/course-apps/live/LiveCommonFields.jsx index 6e49e62df..c7e9d4aa8 100644 --- a/plugins/course-apps/live/LiveCommonFields.jsx +++ b/plugins/course-apps/live/LiveCommonFields.jsx @@ -1,42 +1,43 @@ import React from 'react'; -import { injectIntl, intlShape } from '@edx/frontend-platform/i18n'; +import { useIntl } from '@edx/frontend-platform/i18n'; import PropTypes from 'prop-types'; import FormikControl from 'CourseAuthoring/generic/FormikControl'; import messages from './messages'; const LiveCommonFields = ({ - intl, values, -}) => ( - <> -

{intl.formatMessage(messages.formInstructions)}

- - - - -); +}) => { + const intl = useIntl(); + return ( + <> +

{intl.formatMessage(messages.formInstructions)}

+ + + + + ); +}; LiveCommonFields.propTypes = { - intl: intlShape.isRequired, values: PropTypes.shape({ consumerKey: PropTypes.string, consumerSecret: PropTypes.string, @@ -45,4 +46,4 @@ LiveCommonFields.propTypes = { }).isRequired, }; -export default injectIntl(LiveCommonFields); +export default LiveCommonFields; diff --git a/plugins/course-apps/live/Settings.jsx b/plugins/course-apps/live/Settings.jsx index ed409d997..af46c4070 100644 --- a/plugins/course-apps/live/Settings.jsx +++ b/plugins/course-apps/live/Settings.jsx @@ -2,7 +2,7 @@ import React, { useEffect } from 'react'; import { useDispatch, useSelector } from 'react-redux'; import { camelCase } from 'lodash'; import { Icon } from '@openedx/paragon'; -import { injectIntl, intlShape } from '@edx/frontend-platform/i18n'; +import { useIntl } from '@edx/frontend-platform/i18n'; import PropTypes from 'prop-types'; import * as Yup from 'yup'; import { useNavigate } from 'react-router-dom'; @@ -20,9 +20,9 @@ import ZoomSettings from './ZoomSettings'; import BBBSettings from './BBBSettings'; const LiveSettings = ({ - intl, onClose, }) => { + const intl = useIntl(); const navigate = useNavigate(); const dispatch = useDispatch(); const courseId = useSelector(state => state.courseDetail.courseId); @@ -130,8 +130,7 @@ const LiveSettings = ({ }; LiveSettings.propTypes = { - intl: intlShape.isRequired, onClose: PropTypes.func.isRequired, }; -export default injectIntl(LiveSettings); +export default LiveSettings; diff --git a/plugins/course-apps/live/ZoomSettings.jsx b/plugins/course-apps/live/ZoomSettings.jsx index edb17f830..5150935e7 100644 --- a/plugins/course-apps/live/ZoomSettings.jsx +++ b/plugins/course-apps/live/ZoomSettings.jsx @@ -1,5 +1,5 @@ import React from 'react'; -import { injectIntl, intlShape } from '@edx/frontend-platform/i18n'; +import { useIntl } from '@edx/frontend-platform/i18n'; import PropTypes from 'prop-types'; import FormikControl from 'CourseAuthoring/generic/FormikControl'; @@ -8,37 +8,38 @@ import { providerNames } from './constants'; import LiveCommonFields from './LiveCommonFields'; const ZoomSettings = ({ - intl, values, -}) => ( - // eslint-disable-next-line react/jsx-no-useless-fragment - <> - {!values.piiSharingEnable ? ( -

- {intl.formatMessage(messages.requestPiiSharingEnable, { provider: providerNames[values.provider] })} -

- ) : ( - <> - {(values.piiSharingEmail || values.piiSharingUsername) - && ( -

- {intl.formatMessage(messages.providerHelperText, { providerName: providerNames[values.provider] })} -

- )} - - - - )} - -); +}) => { + const intl = useIntl(); + return ( + // eslint-disable-next-line react/jsx-no-useless-fragment + <> + {!values.piiSharingEnable ? ( +

+ {intl.formatMessage(messages.requestPiiSharingEnable, { provider: providerNames[values.provider] })} +

+ ) : ( + <> + {(values.piiSharingEmail || values.piiSharingUsername) + && ( +

+ {intl.formatMessage(messages.providerHelperText, { providerName: providerNames[values.provider] })} +

+ )} + + + + )} + + ); +}; ZoomSettings.propTypes = { - intl: intlShape.isRequired, values: PropTypes.shape({ consumerKey: PropTypes.string, consumerSecret: PropTypes.string, @@ -51,4 +52,4 @@ ZoomSettings.propTypes = { }).isRequired, }; -export default injectIntl(ZoomSettings); +export default ZoomSettings; diff --git a/plugins/course-apps/proctoring/Settings.jsx b/plugins/course-apps/proctoring/Settings.jsx index c4bcec80a..645bc95dd 100644 --- a/plugins/course-apps/proctoring/Settings.jsx +++ b/plugins/course-apps/proctoring/Settings.jsx @@ -8,7 +8,7 @@ import PropTypes from 'prop-types'; import { getConfig } from '@edx/frontend-platform'; import { getAuthenticatedUser } from '@edx/frontend-platform/auth'; -import { injectIntl, intlShape, FormattedMessage } from '@edx/frontend-platform/i18n'; +import { useIntl, FormattedMessage } from '@edx/frontend-platform/i18n'; import { ActionRow, Alert, Badge, Form, Hyperlink, ModalDialog, StatefulButton, } from '@openedx/paragon'; @@ -25,7 +25,8 @@ import { PagesAndResourcesContext } from 'CourseAuthoring/pages-and-resources/Pa import messages from './messages'; -const ProctoringSettings = ({ intl, onClose }) => { +const ProctoringSettings = ({ onClose }) => { + const intl = useIntl(); const initialFormValues = { enableProctoredExams: false, proctoringProvider: false, @@ -652,10 +653,9 @@ const ProctoringSettings = ({ intl, onClose }) => { }; ProctoringSettings.propTypes = { - intl: intlShape.isRequired, onClose: PropTypes.func.isRequired, }; ProctoringSettings.defaultProps = {}; -export default injectIntl(ProctoringSettings); +export default ProctoringSettings; diff --git a/plugins/course-apps/progress/Settings.jsx b/plugins/course-apps/progress/Settings.jsx index 248ae4abb..04da126ba 100644 --- a/plugins/course-apps/progress/Settings.jsx +++ b/plugins/course-apps/progress/Settings.jsx @@ -1,4 +1,4 @@ -import { injectIntl, intlShape } from '@edx/frontend-platform/i18n'; +import { useIntl } from '@edx/frontend-platform/i18n'; import PropTypes from 'prop-types'; import React from 'react'; import * as Yup from 'yup'; @@ -8,7 +8,8 @@ import { useAppSetting } from 'CourseAuthoring/utils'; import AppSettingsModal from 'CourseAuthoring/pages-and-resources/app-settings-modal/AppSettingsModal'; import messages from './messages'; -const ProgressSettings = ({ intl, onClose }) => { +const ProgressSettings = ({ onClose }) => { + const intl = useIntl(); const [disableProgressGraph, saveSetting] = useAppSetting('disableProgressGraph'); const showProgressGraphSetting = getConfig().ENABLE_PROGRESS_GRAPH_SETTINGS.toString().toLowerCase() === 'true'; @@ -48,8 +49,7 @@ const ProgressSettings = ({ intl, onClose }) => { }; ProgressSettings.propTypes = { - intl: intlShape.isRequired, onClose: PropTypes.func.isRequired, }; -export default injectIntl(ProgressSettings); +export default ProgressSettings; diff --git a/plugins/course-apps/teams/GroupEditor.jsx b/plugins/course-apps/teams/GroupEditor.jsx index 0e96d6ad6..b43348b51 100644 --- a/plugins/course-apps/teams/GroupEditor.jsx +++ b/plugins/course-apps/teams/GroupEditor.jsx @@ -1,4 +1,4 @@ -import { injectIntl, intlShape } from '@edx/frontend-platform/i18n'; +import { useIntl } from '@edx/frontend-platform/i18n'; import { Button, Form, TransitionReplace } from '@openedx/paragon'; import PropTypes from 'prop-types'; import React, { useState } from 'react'; @@ -30,8 +30,9 @@ const TeamTypeNameMessage = { }; const GroupEditor = ({ - intl, group, onDelete, onChange, onBlur, fieldNameCommonBase, errors, + group, onDelete, onChange, onBlur, fieldNameCommonBase, errors, }) => { + const intl = useIntl(); const [isDeleting, setDeleting] = useState(false); const [isOpen, setOpen] = useState(group.id === null); const initiateDeletion = () => setDeleting(true); @@ -149,7 +150,6 @@ export const groupShape = PropTypes.shape({ }); GroupEditor.propTypes = { - intl: intlShape.isRequired, fieldNameCommonBase: PropTypes.string.isRequired, errors: PropTypes.shape({ name: PropTypes.string, @@ -170,4 +170,4 @@ GroupEditor.defaultProps = { }, }; -export default injectIntl(GroupEditor); +export default GroupEditor; diff --git a/plugins/course-apps/teams/Settings.jsx b/plugins/course-apps/teams/Settings.jsx index dfb15ccff..1a4a8786d 100644 --- a/plugins/course-apps/teams/Settings.jsx +++ b/plugins/course-apps/teams/Settings.jsx @@ -1,4 +1,4 @@ -import { injectIntl, intlShape } from '@edx/frontend-platform/i18n'; +import { useIntl } from '@edx/frontend-platform/i18n'; import { Button, Form } from '@openedx/paragon'; import { Add } from '@openedx/paragon/icons'; @@ -17,9 +17,9 @@ import messages from './messages'; setupYupExtensions(); const TeamSettings = ({ - intl, onClose, }) => { + const intl = useIntl(); const [teamsConfiguration, saveSettings] = useAppSetting('teamsConfiguration'); const blankNewGroup = { name: '', @@ -166,8 +166,7 @@ const TeamSettings = ({ }; TeamSettings.propTypes = { - intl: intlShape.isRequired, onClose: PropTypes.func.isRequired, }; -export default injectIntl(TeamSettings); +export default TeamSettings; diff --git a/plugins/course-apps/wiki/Settings.jsx b/plugins/course-apps/wiki/Settings.jsx index e71b27f81..c1ede7344 100644 --- a/plugins/course-apps/wiki/Settings.jsx +++ b/plugins/course-apps/wiki/Settings.jsx @@ -1,4 +1,4 @@ -import { injectIntl, intlShape } from '@edx/frontend-platform/i18n'; +import { useIntl } from '@edx/frontend-platform/i18n'; import PropTypes from 'prop-types'; import React from 'react'; import * as Yup from 'yup'; @@ -8,7 +8,8 @@ import { useAppSetting } from 'CourseAuthoring/utils'; import AppSettingsModal from 'CourseAuthoring/pages-and-resources/app-settings-modal/AppSettingsModal'; import messages from './messages'; -const WikiSettings = ({ intl, onClose }) => { +const WikiSettings = ({ onClose }) => { + const intl = useIntl(); const [enablePublicWiki, saveSetting] = useAppSetting('allowPublicWikiAccess'); const handleSettingsSave = (values) => saveSetting(values.enablePublicWiki); @@ -32,7 +33,7 @@ const WikiSettings = ({ intl, onClose }) => { label={intl.formatMessage(messages.enablePublicWikiLabel)} helpText={intl.formatMessage(messages.enablePublicWikiHelp)} onChange={handleChange} - onBlue={handleBlur} + onBlur={handleBlur} checked={values.enablePublicWiki} /> ) @@ -42,8 +43,7 @@ const WikiSettings = ({ intl, onClose }) => { }; WikiSettings.propTypes = { - intl: intlShape.isRequired, onClose: PropTypes.func.isRequired, }; -export default injectIntl(WikiSettings); +export default WikiSettings; diff --git a/plugins/course-apps/xpert_unit_summary/Settings.jsx b/plugins/course-apps/xpert_unit_summary/Settings.jsx index 99825b9b7..69577444e 100644 --- a/plugins/course-apps/xpert_unit_summary/Settings.jsx +++ b/plugins/course-apps/xpert_unit_summary/Settings.jsx @@ -1,7 +1,6 @@ import React, { useCallback, useContext, useEffect } from 'react'; import { useDispatch } from 'react-redux'; - -import { injectIntl, intlShape } from '@edx/frontend-platform/i18n'; +import { useIntl } from '@edx/frontend-platform/i18n'; import { PagesAndResourcesContext } from 'CourseAuthoring/pages-and-resources/PagesAndResourcesProvider'; import { useNavigate } from 'react-router-dom'; @@ -10,7 +9,8 @@ import messages from './messages'; import { fetchXpertSettings } from './data/thunks'; -const XpertUnitSummarySettings = ({ intl }) => { +const XpertUnitSummarySettings = () => { + const intl = useIntl(); const { path: pagesAndResourcesPath, courseId } = useContext(PagesAndResourcesContext); const dispatch = useDispatch(); const navigate = useNavigate(); @@ -38,8 +38,4 @@ const XpertUnitSummarySettings = ({ intl }) => { ); }; -XpertUnitSummarySettings.propTypes = { - intl: intlShape.isRequired, -}; - -export default injectIntl(XpertUnitSummarySettings); +export default XpertUnitSummarySettings; diff --git a/plugins/course-apps/xpert_unit_summary/settings-modal/SettingsModal.jsx b/plugins/course-apps/xpert_unit_summary/settings-modal/SettingsModal.jsx index b50ccf8e4..87c99afac 100644 --- a/plugins/course-apps/xpert_unit_summary/settings-modal/SettingsModal.jsx +++ b/plugins/course-apps/xpert_unit_summary/settings-modal/SettingsModal.jsx @@ -1,4 +1,4 @@ -import { injectIntl, intlShape } from '@edx/frontend-platform/i18n'; +import { useIntl } from '@edx/frontend-platform/i18n'; import { ActionRow, Alert, @@ -70,38 +70,40 @@ AppSettingsForm.defaultProps = { }; const SettingsModalBase = ({ - intl, title, onClose, variant, isMobile, children, footer, -}) => ( - - - - {title} - - - - {children} - - - - - {intl.formatMessage(messages.cancel)} - - {footer} - - - -); + title, onClose, variant, isMobile, children, footer, +}) => { + const intl = useIntl(); + return ( + + + + {title} + + + + {children} + + + + + {intl.formatMessage(messages.cancel)} + + {footer} + + + + ); +}; SettingsModalBase.propTypes = { - intl: intlShape.isRequired, title: PropTypes.string.isRequired, onClose: PropTypes.func.isRequired, variant: PropTypes.oneOf(['default', 'dark']).isRequired, @@ -115,11 +117,11 @@ SettingsModalBase.defaultProps = { }; const ResetUnitsButton = ({ - intl, courseId, checked, visible, }) => { + const intl = useIntl(); const resetStatusRequestStatus = useSelector(getResetStatus); const dispatch = useDispatch(); @@ -185,7 +187,6 @@ const ResetUnitsButton = ({ }; ResetUnitsButton.propTypes = { - intl: intlShape.isRequired, courseId: PropTypes.string.isRequired, checked: PropTypes.oneOf(['true', 'false']).isRequired, visible: PropTypes.bool, @@ -196,7 +197,6 @@ ResetUnitsButton.defaultProps = { }; const SettingsModal = ({ - intl, appId, title, children, @@ -213,6 +213,7 @@ const SettingsModal = ({ allUnitsEnabledText, noUnitsEnabledText, }) => { + const intl = useIntl(); const { courseId } = useContext(PagesAndResourcesContext); const loadingStatus = useSelector(getLoadingStatus); const updateSettingsRequestStatus = useSelector(getSavingStatus); @@ -372,7 +373,6 @@ const SettingsModal = ({ > {allUnitsEnabledText} {noUnitsEnabledText} { +const PagesAndResources = ({ courseId }) => { + const intl = useIntl(); const courseDetails = useModel('courseDetails', courseId); document.title = getPageHeadTitle(courseDetails?.name, intl.formatMessage(messages.heading)); @@ -108,7 +109,6 @@ const PagesAndResources = ({ courseId, intl }) => { PagesAndResources.propTypes = { courseId: PropTypes.string.isRequired, - intl: intlShape.isRequired, }; -export default injectIntl(PagesAndResources); +export default PagesAndResources; diff --git a/src/pages-and-resources/discussions/DiscussionsSettings.jsx b/src/pages-and-resources/discussions/DiscussionsSettings.jsx index 18f939177..06896167f 100644 --- a/src/pages-and-resources/discussions/DiscussionsSettings.jsx +++ b/src/pages-and-resources/discussions/DiscussionsSettings.jsx @@ -4,7 +4,7 @@ import React, { import PropTypes from 'prop-types'; import { useNavigate, useParams } from 'react-router-dom'; import { useDispatch, useSelector } from 'react-redux'; -import { injectIntl, intlShape } from '@edx/frontend-platform/i18n'; +import { useIntl } from '@edx/frontend-platform/i18n'; import { Alert, Button, FullscreenModal, Stepper, } from '@openedx/paragon'; @@ -25,7 +25,8 @@ import Loading from '../../generic/Loading'; const SELECTION_STEP = 'selection'; const SETTINGS_STEP = 'settings'; -const DiscussionsSettings = ({ courseId, intl }) => { +const DiscussionsSettings = ({ courseId }) => { + const intl = useIntl(); const navigate = useNavigate(); const dispatch = useDispatch(); const { path: pagesAndResourcesPath } = useContext(PagesAndResourcesContext); @@ -148,7 +149,6 @@ const DiscussionsSettings = ({ courseId, intl }) => { DiscussionsSettings.propTypes = { courseId: PropTypes.string.isRequired, - intl: intlShape.isRequired, }; -export default injectIntl(DiscussionsSettings); +export default DiscussionsSettings; diff --git a/src/pages-and-resources/pages/PageGrid.jsx b/src/pages-and-resources/pages/PageGrid.jsx index 64079570f..d86e4b50a 100644 --- a/src/pages-and-resources/pages/PageGrid.jsx +++ b/src/pages-and-resources/pages/PageGrid.jsx @@ -1,6 +1,5 @@ import PropTypes from 'prop-types'; import React from 'react'; -import { injectIntl } from '@edx/frontend-platform/i18n'; import { CardGrid } from '@openedx/paragon'; import { PluginSlot } from '@openedx/frontend-plugin-framework'; import PageCard, { CoursePageShape } from './PageCard'; @@ -31,4 +30,4 @@ PageGrid.propTypes = { courseId: PropTypes.string, }; -export default injectIntl(PageGrid); +export default PageGrid;