From 219919d94f952333ce7a1f91018bce0a23c4eda6 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Chris=20Ch=C3=A1vez?= Date: Thu, 28 Aug 2025 11:15:24 -0500 Subject: [PATCH 1/3] [Teak] style: Fixing nits about sync units [FC-0097] (#2320) * Add a warning banner about units in the libraries sync page. * Update the message in the sync unit modal. * Stay visible the sync icon in the course outline. * Add a tooltip to the edit (in normal and disabled mode) and sync button. --- src/course-libraries/CourseLibraries.test.tsx | 8 ++-- src/course-libraries/CourseLibraries.tsx | 9 ++++- src/course-libraries/messages.ts | 5 +++ src/course-outline/card-header/CardHeader.jsx | 40 +++++++++++++------ .../card-header/CardHeader.scss | 6 +++ src/course-outline/card-header/messages.js | 9 ++++- .../unit-card/UnitCard.test.jsx | 4 +- .../component-comparison/messages.ts | 2 +- 8 files changed, 61 insertions(+), 22 deletions(-) diff --git a/src/course-libraries/CourseLibraries.test.tsx b/src/course-libraries/CourseLibraries.test.tsx index 4c44144246..486c995bd7 100644 --- a/src/course-libraries/CourseLibraries.test.tsx +++ b/src/course-libraries/CourseLibraries.test.tsx @@ -82,7 +82,7 @@ describe('', () => { expect(reviewTab).toHaveAttribute('aria-selected', 'true'); userEvent.click(allTab); - const alert = await screen.findByRole('alert'); + const alert = (await screen.findAllByRole('alert'))[0]; expect(await within(alert).findByText( '5 library components are out of sync. Review updates to accept or ignore changes', )).toBeInTheDocument(); @@ -105,7 +105,7 @@ describe('', () => { userEvent.click(allTab); expect(allTab).toHaveAttribute('aria-selected', 'true'); - const alert = await screen.findByRole('alert'); + const alert = (await screen.findAllByRole('alert'))[0]; expect(await within(alert).findByText( '5 library components are out of sync. Review updates to accept or ignore changes', )).toBeInTheDocument(); @@ -133,7 +133,7 @@ describe('', () => { expect(reviewTab).toHaveAttribute('aria-selected', 'true'); userEvent.click(allTab); - const alert = await screen.findByRole('alert'); + const alert = (await screen.findAllByRole('alert'))[0]; expect(await within(alert).findByText( '5 library components are out of sync. Review updates to accept or ignore changes', )).toBeInTheDocument(); @@ -156,7 +156,7 @@ describe('', () => { screen.logTestingPlaygroundURL(); - expect(screen.queryByRole('alert')).not.toBeInTheDocument(); + expect(screen.queryAllByRole('alert').length).toEqual(1); }); }); diff --git a/src/course-libraries/CourseLibraries.tsx b/src/course-libraries/CourseLibraries.tsx index 2d0cfadf0f..9298c5d2cb 100644 --- a/src/course-libraries/CourseLibraries.tsx +++ b/src/course-libraries/CourseLibraries.tsx @@ -17,7 +17,7 @@ import { Tabs, } from '@openedx/paragon'; import { - Cached, CheckCircle, Launch, Loop, + Cached, CheckCircle, Launch, Loop, Info, } from '@openedx/paragon/icons'; import sumBy from 'lodash/sumBy'; @@ -33,6 +33,7 @@ import { useStudioHome } from '../studio-home/hooks'; import NewsstandIcon from '../generic/NewsstandIcon'; import ReviewTabContent from './ReviewTabContent'; import { OutOfSyncAlert } from './OutOfSyncAlert'; +import AlertMessage from '../generic/alert-message'; interface Props { courseId: string; @@ -199,6 +200,12 @@ export const CourseLibraries: React.FC = ({ courseId }) => { showAlert={showReviewAlert && tabKey === CourseLibraryTabs.all} setShowAlert={setShowReviewAlert} /> + { /* TODO: Remove this alert after implement container in this page */} + {titleComponent} - {readyToSync && ( - - )} - + {intl.formatMessage( + isDisabledEditField ? messages.cannotEditTooltip : messages.altButtonRename, + )} + + )} iconAs={EditIcon} onClick={onClickEdit} // @ts-ignore @@ -161,6 +168,15 @@ const CardHeader = ({ )} {extraActionsComponent} + {readyToSync && ( + {intl.formatMessage(messages.readyToSyncButtonAlt)}} + onClick={onClickSync} + /> + )} ', () => { // Should open compare preview modal expect(screen.getByRole('heading', { name: /preview changes: unit name/i })).toBeInTheDocument(); - expect(screen.getByText('Preview not available')).toBeInTheDocument(); + expect(screen.getByText('Preview not available for unit changes at this time')).toBeInTheDocument(); // Click on accept changes const acceptChangesButton = screen.getByText(/accept changes/i); @@ -196,7 +196,7 @@ describe('', () => { // Should open compare preview modal expect(screen.getByRole('heading', { name: /preview changes: unit name/i })).toBeInTheDocument(); - expect(screen.getByText('Preview not available')).toBeInTheDocument(); + expect(screen.getByText('Preview not available for unit changes at this time')).toBeInTheDocument(); // Click on ignore changes const ignoreChangesButton = screen.getByRole('button', { name: /ignore changes/i }); diff --git a/src/library-authoring/component-comparison/messages.ts b/src/library-authoring/component-comparison/messages.ts index 322eaee3a4..5a86fdaad5 100644 --- a/src/library-authoring/component-comparison/messages.ts +++ b/src/library-authoring/component-comparison/messages.ts @@ -19,7 +19,7 @@ const messages = defineMessages({ }, previewNotAvailable: { id: 'course-authoring.library-authoring.component-comparison.preview-not-available', - defaultMessage: 'Preview not available', + defaultMessage: 'Preview not available for unit changes at this time', description: 'Message shown when preview is not available.', }, }); From 0c49006fc7c39ed3d9ef37139991e8b382f7a7f3 Mon Sep 17 00:00:00 2001 From: Asad Ali Date: Tue, 9 Sep 2025 08:45:27 +0500 Subject: [PATCH 2/3] fix: allow thumbnail upload on Videos page if no thumbnail (#2388) (#2434) * fix: allow thumbnail upload if no thumbnail * fix: improve thumbnail upload impl * test: fix tests * test: fix tests * fix: do not show thumbnail upload if not allowed * test: fix coverage * test: add thumbnail test * fix: display thumbnail overlay when video status is success --- .../videos-page/VideoThumbnail.jsx | 27 ++++++++++------ .../videos-page/VideoThumbnail.test.jsx | 32 +++++++++++++++++++ 2 files changed, 50 insertions(+), 9 deletions(-) create mode 100644 src/files-and-videos/videos-page/VideoThumbnail.test.jsx diff --git a/src/files-and-videos/videos-page/VideoThumbnail.jsx b/src/files-and-videos/videos-page/VideoThumbnail.jsx index 2929c6d32d..fb7bf62054 100644 --- a/src/files-and-videos/videos-page/VideoThumbnail.jsx +++ b/src/files-and-videos/videos-page/VideoThumbnail.jsx @@ -48,21 +48,30 @@ const VideoThumbnail = ({ const isFailed = VIDEO_FAILURE_STATUSES.includes(status); const failedMessage = intl.formatMessage(messages.failedCheckboxLabel); - const showThumbnail = allowThumbnailUpload && thumbnail && isUploaded; + const showThumbnail = allowThumbnailUpload && isUploaded; return (
- {allowThumbnailUpload && showThumbnail &&
} + {allowThumbnailUpload && isUploaded &&
} {showThumbnail && !thumbnailError && pageLoadStatus === RequestStatus.SUCCESSFUL ? ( <>
- {intl.formatMessage(messages.thumbnailAltMessage, setThumbnailError(true)} - /> + { thumbnail ? ( + {intl.formatMessage(messages.thumbnailAltMessage, setThumbnailError(true)} + /> + ) : ( +
+ +
+ )}