diff --git a/src/files-and-videos/files-page/FilesPage.jsx b/src/files-and-videos/files-page/FilesPage.jsx index 318c5e333..013d7a511 100644 --- a/src/files-and-videos/files-page/FilesPage.jsx +++ b/src/files-and-videos/files-page/FilesPage.jsx @@ -80,6 +80,7 @@ const FilesPage = ({ loadingStatus, usagePathStatus, usageErrorMessages: errorMessages.usageMetrics, + fileType: 'file', }; const maxFileSize = 20 * 1048576; diff --git a/src/files-and-videos/files-page/FilesPage.test.jsx b/src/files-and-videos/files-page/FilesPage.test.jsx index cd1bc65b6..80028bbad 100644 --- a/src/files-and-videos/files-page/FilesPage.test.jsx +++ b/src/files-and-videos/files-page/FilesPage.test.jsx @@ -225,7 +225,7 @@ describe('FilesAndUploads', () => { axiosMock.onDelete(`${getAssetsUrl(courseId)}mOckID1`).reply(204); fireEvent.click(deleteButton); - expect(screen.getByText(messages.deleteConfirmationTitle.defaultMessage)).toBeVisible(); + expect(screen.getByText('Delete file(s) confirmation')).toBeVisible(); await act(async () => { userEvent.click(deleteButton); }); @@ -239,7 +239,7 @@ describe('FilesAndUploads', () => { userEvent.click(confirmDeleteButton); }); - expect(screen.queryByText(messages.deleteConfirmationTitle.defaultMessage)).toBeNull(); + expect(screen.queryByText('Delete file(s) confirmation')).toBeNull(); // Check if the asset is deleted in the store and UI const deleteStatus = store.getState().assets.deletingStatus; @@ -451,10 +451,10 @@ describe('FilesAndUploads', () => { axiosMock.onDelete(`${getAssetsUrl(courseId)}mOckID1`).reply(204); fireEvent.click(within(assetMenuButton).getByLabelText('file-menu-toggle')); fireEvent.click(screen.getByTestId('open-delete-confirmation-button')); - expect(screen.getByText(messages.deleteConfirmationTitle.defaultMessage)).toBeVisible(); + expect(screen.getByText('Delete file(s) confirmation')).toBeVisible(); fireEvent.click(screen.getByText(messages.deleteFileButtonLabel.defaultMessage)); - expect(screen.queryByText(messages.deleteConfirmationTitle.defaultMessage)).toBeNull(); + expect(screen.queryByText('Delete file(s) confirmation')).toBeNull(); executeThunk(deleteAssetFile(courseId, 'mOckID1', 5), store.dispatch); }); @@ -509,10 +509,10 @@ describe('FilesAndUploads', () => { axiosMock.onDelete(`${getAssetsUrl(courseId)}mOckID1`).reply(404); fireEvent.click(within(assetMenuButton).getByLabelText('file-menu-toggle')); fireEvent.click(screen.getByTestId('open-delete-confirmation-button')); - expect(screen.getByText(messages.deleteConfirmationTitle.defaultMessage)).toBeVisible(); + expect(screen.getByText('Delete file(s) confirmation')).toBeVisible(); fireEvent.click(screen.getByText(messages.deleteFileButtonLabel.defaultMessage)); - expect(screen.queryByText(messages.deleteConfirmationTitle.defaultMessage)).toBeNull(); + expect(screen.queryByText('Delete file(s) confirmation')).toBeNull(); executeThunk(deleteAssetFile(courseId, 'mOckID1', 5), store.dispatch); }); diff --git a/src/files-and-videos/generic/ApiStatusToast.jsx b/src/files-and-videos/generic/ApiStatusToast.jsx index ade1d2aa1..6d59e1f45 100644 --- a/src/files-and-videos/generic/ApiStatusToast.jsx +++ b/src/files-and-videos/generic/ApiStatusToast.jsx @@ -10,6 +10,7 @@ const ApiStatusToast = ({ isOpen, setClose, setSelectedRows, + fileType, // injected intl, }) => { @@ -23,7 +24,7 @@ const ApiStatusToast = ({ show={isOpen} onClose={handleClose} > - {intl.formatMessage(messages.apiStatusToastMessage, { actionType, selectedRowCount })} + {intl.formatMessage(messages.apiStatusToastMessage, { actionType, selectedRowCount, fileType })} ); }; @@ -34,6 +35,7 @@ ApiStatusToast.propTypes = { isOpen: PropTypes.bool.isRequired, setClose: PropTypes.func.isRequired, setSelectedRows: PropTypes.func.isRequired, + fileType: PropTypes.string.isRequired, // injected intl: intlShape.isRequired, }; diff --git a/src/files-and-videos/generic/FileTable.jsx b/src/files-and-videos/generic/FileTable.jsx index 9ad2a0087..38fea10db 100644 --- a/src/files-and-videos/generic/FileTable.jsx +++ b/src/files-and-videos/generic/FileTable.jsx @@ -66,6 +66,7 @@ const FileTable = ({ usageErrorMessages, encodingsDownloadUrl, supportedFileFormats, + fileType, } = data; useEffect(() => { @@ -136,6 +137,7 @@ const FileTable = ({ handleBulkDownload, handleOpenDeleteConfirmation, supportedFileFormats, + fileType, }} /> ); @@ -225,6 +227,7 @@ const FileTable = ({ isOpen={isDeleteOpen} setClose={setDeleteClose} setSelectedRows={setSelectedRows} + fileType={fileType} /> @@ -247,7 +251,7 @@ const FileTable = ({ /> )} )} > - {intl.formatMessage(messages.deleteConfirmationMessage, { fileNumber: selectedRows.length })} + {intl.formatMessage(messages.deleteConfirmationMessage, { fileNumber: selectedRows.length, fileType })} ); @@ -277,6 +281,7 @@ FileTable.propTypes = { usageErrorMessages: PropTypes.arrayOf(PropTypes.string).isRequired, encodingsDownloadUrl: PropTypes.string, supportedFileFormats: PropTypes.shape({}), + fileType: PropTypes.string.isRequired, }).isRequired, handleAddFile: PropTypes.func.isRequired, handleDeleteFile: PropTypes.func.isRequired, diff --git a/src/files-and-videos/generic/messages.js b/src/files-and-videos/generic/messages.js index c7340d3bc..8ee8ce0a9 100644 --- a/src/files-and-videos/generic/messages.js +++ b/src/files-and-videos/generic/messages.js @@ -7,7 +7,7 @@ const messages = defineMessages({ }, apiStatusToastMessage: { id: 'course-authoring.files-and-upload.apiStatus.message', - defaultMessage: '{actionType} {selectedRowCount} file(s)', + defaultMessage: '{actionType} {selectedRowCount} {fileType}(s)', }, apiStatusAddingAction: { id: 'course-authoring.files-and-upload.apiStatus.addingAction.message', @@ -27,7 +27,7 @@ const messages = defineMessages({ }, addFilesButtonLabel: { id: 'course-authoring.files-and-upload.addFiles.button.label', - defaultMessage: 'Add files', + defaultMessage: 'Add {fileType}s', }, actionsButtonLabel: { id: 'course-authoring.files-and-upload.action.button.label', @@ -83,11 +83,11 @@ const messages = defineMessages({ }, deleteConfirmationTitle: { id: 'course-authoring.files-and-uploads..deleteConfirmation.title', - defaultMessage: 'Delete File(s) Confirmation', + defaultMessage: 'Delete {fileType}(s) confirmation', }, deleteConfirmationMessage: { id: 'course-authoring.files-and-uploads..deleteConfirmation.message', - defaultMessage: 'Are you sure you want to delete {fileNumber} file(s)? This action cannot be undone.', + defaultMessage: 'Are you sure you want to delete {fileNumber} {fileType}(s)? This action cannot be undone.', }, deleteFileButtonLabel: { id: 'course-authoring.files-and-uploads.deleteConfirmation.deleteFile.label', @@ -99,7 +99,7 @@ const messages = defineMessages({ }, sortButtonLabel: { id: 'course-authoring.files-and-uploads.sortButton.label', - defaultMessage: 'Sort and Filter', + defaultMessage: 'Sort and filter', }, sortModalTitleLabel: { id: 'course-authoring.files-and-uploads.sortModal.title', diff --git a/src/files-and-videos/generic/table-components/TableActions.jsx b/src/files-and-videos/generic/table-components/TableActions.jsx index d36f0606c..6e775f51c 100644 --- a/src/files-and-videos/generic/table-components/TableActions.jsx +++ b/src/files-and-videos/generic/table-components/TableActions.jsx @@ -1,7 +1,7 @@ import React from 'react'; import _ from 'lodash'; import { PropTypes } from 'prop-types'; -import { injectIntl, FormattedMessage } from '@edx/frontend-platform/i18n'; +import { injectIntl, intlShape, FormattedMessage } from '@edx/frontend-platform/i18n'; import { getConfig } from '@edx/frontend-platform'; import { Button, @@ -19,6 +19,9 @@ const TableActions = ({ handleBulkDownload, handleOpenDeleteConfirmation, encodingsDownloadUrl, + fileType, + // injected + intl, }) => { const [isSortOpen, openSort, closeSort] = useToggle(false); return ( @@ -60,7 +63,7 @@ const TableActions = ({ @@ -91,6 +94,8 @@ TableActions.propTypes = { handleBulkDownload: PropTypes.func.isRequired, encodingsDownloadUrl: PropTypes.string, handleSort: PropTypes.func.isRequired, + fileType: PropTypes.string.isRequired, + intl: intlShape.isRequired, }; TableActions.defaultProps = { diff --git a/src/files-and-videos/videos-page/VideosPage.jsx b/src/files-and-videos/videos-page/VideosPage.jsx index 448f3ccec..16e0b5c2d 100644 --- a/src/files-and-videos/videos-page/VideosPage.jsx +++ b/src/files-and-videos/videos-page/VideosPage.jsx @@ -104,6 +104,7 @@ const VideosPage = ({ loadingStatus, usagePathStatus, usageErrorMessages: errorMessages.usageMetrics, + fileType: 'video', }; const thumbnailPreview = (props) => VideoThumbnail({ ...props, handleAddThumbnail, videoImageSettings }); const infoModalSidebar = (video) => VideoInfoModalSidebar({ video }); diff --git a/src/files-and-videos/videos-page/VideosPage.test.jsx b/src/files-and-videos/videos-page/VideosPage.test.jsx index ad16c30cf..766bd87bb 100644 --- a/src/files-and-videos/videos-page/VideosPage.test.jsx +++ b/src/files-and-videos/videos-page/VideosPage.test.jsx @@ -266,7 +266,7 @@ describe('FilesAndUploads', () => { axiosMock.onDelete(`${getCoursVideosApiUrl(courseId)}/mOckID1`).reply(204); fireEvent.click(deleteButton); - expect(screen.getByText(messages.deleteConfirmationTitle.defaultMessage)).toBeVisible(); + expect(screen.getByText('Delete video(s) confirmation')).toBeVisible(); await act(async () => { userEvent.click(deleteButton); }); @@ -280,7 +280,7 @@ describe('FilesAndUploads', () => { userEvent.click(confirmDeleteButton); }); - expect(screen.queryByText(messages.deleteConfirmationTitle.defaultMessage)).toBeNull(); + expect(screen.queryByText('Delete video(s) confirmation')).toBeNull(); // Check if the video is deleted in the store and UI const deleteStatus = store.getState().videos.deletingStatus; @@ -518,10 +518,10 @@ describe('FilesAndUploads', () => { axiosMock.onDelete(`${getCoursVideosApiUrl(courseId)}/mOckID1`).reply(204); fireEvent.click(within(fileMenuButton).getByLabelText('file-menu-toggle')); fireEvent.click(screen.getByTestId('open-delete-confirmation-button')); - expect(screen.getByText(messages.deleteConfirmationTitle.defaultMessage)).toBeVisible(); + expect(screen.getByText('Delete video(s) confirmation')).toBeVisible(); fireEvent.click(screen.getByText(messages.deleteFileButtonLabel.defaultMessage)); - expect(screen.queryByText(messages.deleteConfirmationTitle.defaultMessage)).toBeNull(); + expect(screen.queryByText('Delete video(s) confirmation')).toBeNull(); executeThunk(deleteVideoFile(courseId, 'mOckID1', 5), store.dispatch); }); @@ -612,10 +612,10 @@ describe('FilesAndUploads', () => { axiosMock.onDelete(`${getCoursVideosApiUrl(courseId)}/mOckID1`).reply(404); fireEvent.click(within(videoMenuButton).getByLabelText('file-menu-toggle')); fireEvent.click(screen.getByTestId('open-delete-confirmation-button')); - expect(screen.getByText(messages.deleteConfirmationTitle.defaultMessage)).toBeVisible(); + expect(screen.getByText('Delete video(s) confirmation')).toBeVisible(); fireEvent.click(screen.getByText(messages.deleteFileButtonLabel.defaultMessage)); - expect(screen.queryByText(messages.deleteConfirmationTitle.defaultMessage)).toBeNull(); + expect(screen.queryByText('Delete video(s) confirmation')).toBeNull(); executeThunk(deleteVideoFile(courseId, 'mOckID1', 5), store.dispatch); });