diff --git a/package-lock.json b/package-lock.json index 44458c322..2ed994aae 100644 --- a/package-lock.json +++ b/package-lock.json @@ -14,6 +14,7 @@ "@fortawesome/free-regular-svg-icons": "6.6.0", "@fortawesome/free-solid-svg-icons": "6.6.0", "@fortawesome/react-fontawesome": "0.2.2", + "classnames": "^2.5.1", "jest-environment-jsdom": "^29.7.0", "lodash": "^4.17.21", "ts-jest": "^29.1.2" @@ -25,7 +26,7 @@ "@edx/reactifex": "^2.1.1", "@openedx/frontend-build": "14.1.5", "@openedx/frontend-plugin-framework": "^1.1.2", - "@openedx/paragon": "22.8.1", + "@openedx/paragon": "^22.8.1", "@testing-library/jest-dom": "^5.16.4", "@testing-library/react": "^12.1.1", "husky": "8.0.3", @@ -7061,8 +7062,7 @@ "node_modules/classnames": { "version": "2.5.1", "resolved": "https://registry.npmjs.org/classnames/-/classnames-2.5.1.tgz", - "integrity": "sha512-saHYOzhIQs6wy2sVxTM6bUDsQO4F50V9RQ22qBpEdCW+I+/Wmke2HOl6lS6dTpdxVhb88/I6+Hs+438c3lfUow==", - "dev": true + "integrity": "sha512-saHYOzhIQs6wy2sVxTM6bUDsQO4F50V9RQ22qBpEdCW+I+/Wmke2HOl6lS6dTpdxVhb88/I6+Hs+438c3lfUow==" }, "node_modules/clean-css": { "version": "5.3.3", diff --git a/package.json b/package.json index 7929b7465..7395c865e 100644 --- a/package.json +++ b/package.json @@ -40,7 +40,7 @@ "@edx/reactifex": "^2.1.1", "@openedx/frontend-build": "14.1.5", "@openedx/frontend-plugin-framework": "^1.1.2", - "@openedx/paragon": "22.8.1", + "@openedx/paragon": "^22.8.1", "@testing-library/jest-dom": "^5.16.4", "@testing-library/react": "^12.1.1", "husky": "8.0.3", @@ -59,6 +59,7 @@ "@fortawesome/free-regular-svg-icons": "6.6.0", "@fortawesome/free-solid-svg-icons": "6.6.0", "@fortawesome/react-fontawesome": "0.2.2", + "classnames": "^2.5.1", "jest-environment-jsdom": "^29.7.0", "lodash": "^4.17.21", "ts-jest": "^29.1.2" diff --git a/src/components/studio-footer/StudioFooter.jsx b/src/components/studio-footer/StudioFooter.jsx index 81add577d..ddb0745d7 100644 --- a/src/components/studio-footer/StudioFooter.jsx +++ b/src/components/studio-footer/StudioFooter.jsx @@ -1,6 +1,6 @@ import React, { useContext, useState } from 'react'; import _ from 'lodash'; -import { intlShape, injectIntl, FormattedMessage } from '@edx/frontend-platform/i18n'; +import { useIntl, FormattedMessage } from '@edx/frontend-platform/i18n'; import { ensureConfig } from '@edx/frontend-platform'; import { AppContext } from '@edx/frontend-platform/react'; import { @@ -12,6 +12,9 @@ import { TransitionReplace, } from '@openedx/paragon'; import { ExpandLess, ExpandMore, Help } from '@openedx/paragon/icons'; +import classNames from 'classnames'; +import PropTypes from 'prop-types'; + import messages from './messages'; ensureConfig([ @@ -26,12 +29,14 @@ ensureConfig([ ], 'Studio Footer component'); const StudioFooter = ({ - // injected - intl, + containerProps, }) => { + const intl = useIntl(); const [isOpen, setIsOpen] = useState(false); const { config } = useContext(AppContext); + const { containerClassName, ...restContainerProps } = containerProps || {}; + return ( <>
@@ -49,7 +54,11 @@ const StudioFooter = ({
- + {isOpen ? ( @@ -139,8 +148,11 @@ const StudioFooter = ({ }; StudioFooter.propTypes = { - // injected - intl: intlShape.isRequired, + containerProps: PropTypes.shape(Container.propTypes), +}; + +StudioFooter.defaultProps = { + containerProps: {}, }; -export default injectIntl(StudioFooter); +export default StudioFooter;