From d80a68132a1dcbb41144115e2e2904088a1f2e3e Mon Sep 17 00:00:00 2001 From: Kristin Aoki <42981026+KristinAoki@users.noreply.github.com> Date: Tue, 23 Jul 2024 10:44:07 -0400 Subject: [PATCH] feat: bump frontend-lib-content-components to 2.5.1 (#1174) The primary purpose of this version bump backport is to remove the 2U feedback form link from the editors (https://github.com/openedx/frontend-lib-content-components/issues/476), but several other improvements will also be pulled in: * Fix the Text editor so that when an image is added, it is added at the cursor, instead of the beginning of the component. * Improve editor load time by reducing API calls and switching some calls to be lazy. * Align controls better in the group feedback component. * Add validation for start & stop date fields. * Fix image handling bugs in both the raw & visual text editors. Full changelog: https://github.com/openedx/frontend-lib-content-components/compare/v2.1.11...v2.5.1 Co-authored-by: Kyle McCormick --- package-lock.json | 10 +++--- package.json | 2 +- .../update-form/UpdateForm.test.jsx | 36 ++++++++++++++----- src/generic/WysiwygEditor.jsx | 8 ++--- 4 files changed, 37 insertions(+), 19 deletions(-) diff --git a/package-lock.json b/package-lock.json index 27edb9c57..775697754 100644 --- a/package-lock.json +++ b/package-lock.json @@ -18,7 +18,7 @@ "@edx/frontend-component-footer": "^13.0.2", "@edx/frontend-component-header": "^5.1.0", "@edx/frontend-enterprise-hotjar": "^2.0.0", - "@edx/frontend-lib-content-components": "^2.1.11", + "@edx/frontend-lib-content-components": "^2.5.1", "@edx/frontend-platform": "7.0.1", "@edx/openedx-atlas": "^0.6.0", "@fortawesome/fontawesome-svg-core": "1.2.36", @@ -2580,9 +2580,9 @@ } }, "node_modules/@edx/frontend-lib-content-components": { - "version": "2.1.11", - "resolved": "https://registry.npmjs.org/@edx/frontend-lib-content-components/-/frontend-lib-content-components-2.1.11.tgz", - "integrity": "sha512-vzDpneZIXmjFo5sZxxZiVjt1zgczfEkJhT2h/sg2mcJ0m7Zuo9dPJeilATqB0pSTjZnNsIbX+NfT/Dx/mSJciQ==", + "version": "2.5.1", + "resolved": "https://registry.npmjs.org/@edx/frontend-lib-content-components/-/frontend-lib-content-components-2.5.1.tgz", + "integrity": "sha512-qxSGCF6GxDaeszW/f3ikf8V0j9yR6r1sohV15fHURrNvV0JPF860EIVgbPHR1FKjL1Iwo16Q/KWc0uY+HVwBYA==", "dependencies": { "@codemirror/lang-html": "^6.0.0", "@codemirror/lang-xml": "^6.0.0", @@ -2621,7 +2621,7 @@ "xmlchecker": "^0.1.0" }, "peerDependencies": { - "@edx/frontend-platform": "^7.0.1", + "@edx/frontend-platform": "^7.0.1 || ^8.0.0", "@openedx/paragon": "^21.5.7 || ^22.0.0", "prop-types": "^15.5.10", "react": "^16.14.0 || ^17.0.0", diff --git a/package.json b/package.json index 5a8b9a1e1..d812266f9 100644 --- a/package.json +++ b/package.json @@ -45,7 +45,7 @@ "@edx/frontend-component-footer": "^13.0.2", "@edx/frontend-component-header": "^5.1.0", "@edx/frontend-enterprise-hotjar": "^2.0.0", - "@edx/frontend-lib-content-components": "^2.1.11", + "@edx/frontend-lib-content-components": "^2.5.1", "@edx/frontend-platform": "7.0.1", "@edx/openedx-atlas": "^0.6.0", "@fortawesome/fontawesome-svg-core": "1.2.36", diff --git a/src/course-updates/update-form/UpdateForm.test.jsx b/src/course-updates/update-form/UpdateForm.test.jsx index 569efb725..37389996c 100644 --- a/src/course-updates/update-form/UpdateForm.test.jsx +++ b/src/course-updates/update-form/UpdateForm.test.jsx @@ -5,14 +5,18 @@ import { waitFor, act, } from '@testing-library/react'; +import { AppProvider } from '@edx/frontend-platform/react'; import { IntlProvider } from '@edx/frontend-platform/i18n'; +import { initializeMockApp } from '@edx/frontend-platform'; import moment from 'moment/moment'; +import initializeStore from '../../store'; import { REQUEST_TYPES } from '../constants'; import { courseHandoutsMock, courseUpdatesMock } from '../__mocks__'; import UpdateForm from './UpdateForm'; import messages from './messages'; +let store; const closeMock = jest.fn(); const onSubmitMock = jest.fn(); const addNewUpdateMock = { id: 0, date: moment().utc().toDate(), content: 'Some content' }; @@ -48,18 +52,32 @@ const courseUpdatesInitialValues = (requestType) => { }; const renderComponent = ({ requestType }) => render( - - - , + + + + + , ); describe('', () => { + beforeEach(() => { + initializeMockApp({ + authenticatedUser: { + userId: 3, + username: 'abc123', + administrator: true, + roles: [], + }, + }); + + store = initializeStore(); + }); it('render Add new update form correctly', async () => { const { getByText, getByDisplayValue, getByRole } = renderComponent({ requestType: REQUEST_TYPES.add_new_update }); const { date } = courseUpdatesInitialValues(REQUEST_TYPES.add_new_update); diff --git a/src/generic/WysiwygEditor.jsx b/src/generic/WysiwygEditor.jsx index e89b3b685..175da2082 100644 --- a/src/generic/WysiwygEditor.jsx +++ b/src/generic/WysiwygEditor.jsx @@ -1,6 +1,6 @@ import React from 'react'; import PropTypes from 'prop-types'; -import { connect, Provider } from 'react-redux'; +import { connect, Provider, useSelector } from 'react-redux'; import { createStore } from 'redux'; import { getConfig } from '@edx/frontend-platform'; import { @@ -18,20 +18,19 @@ export const SUPPORTED_TEXT_EDITORS = { }; const mapStateToProps = () => ({ - assets: {}, + images: {}, lmsEndpointUrl: getConfig().LMS_BASE_URL, studioEndpointUrl: getConfig().STUDIO_BASE_URL, isLibrary: true, onEditorChange: () => ({}), }); - const Editor = connect(mapStateToProps)(TinyMceWidget); export const WysiwygEditor = ({ initialValue, editorType, onChange, minHeight, }) => { const { editorRef, refReady, setEditorRef } = prepareEditorRef(); - + const { courseId } = useSelector((state) => state.courseDetail); const isEquivalentCodeExtraSpaces = (first, second) => { // Utils allows to compare code extra spaces const removeWhitespace = (str) => str.replace(/\s/g, ''); @@ -75,6 +74,7 @@ export const WysiwygEditor = ({ setEditorRef={setEditorRef} onChange={handleUpdate} initializeEditor={() => ({})} + learningContextId={courseId} /> );