diff --git a/src/editors/EditorContainer.tsx b/src/editors/EditorContainer.tsx index fc6fa417c1..3b6bea1749 100644 --- a/src/editors/EditorContainer.tsx +++ b/src/editors/EditorContainer.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { useParams } from 'react-router-dom'; +import { useLocation, useParams } from 'react-router-dom'; import { getConfig } from '@edx/frontend-platform'; import EditorPage from './EditorPage'; @@ -8,9 +8,9 @@ interface Props { /** Course ID or Library ID */ learningContextId: string; /** Event handler for when user cancels out of the editor page */ - onClose?: () => void; + onClose?: (prevPath?: string) => void; /** Event handler called after when user saves their changes using an editor */ - afterSave?: () => (newData: Record) => void; + afterSave?: (prevPath?: string) => (newData: Record) => void; } const EditorContainer: React.FC = ({ @@ -19,6 +19,8 @@ const EditorContainer: React.FC = ({ afterSave, }) => { const { blockType, blockId } = useParams(); + const location = useLocation(); + if (blockType === undefined || blockId === undefined) { // istanbul ignore next - This shouldn't be possible; it's just here to satisfy the type checker. return
Error: missing URL parameters
; @@ -41,8 +43,8 @@ const EditorContainer: React.FC = ({ blockId={blockId} studioEndpointUrl={getConfig().STUDIO_BASE_URL} lmsEndpointUrl={getConfig().LMS_BASE_URL} - onClose={onClose} - returnFunction={afterSave} + onClose={onClose ? () => onClose(location.state?.from) : undefined} + returnFunction={afterSave ? () => afterSave(location.state?.from) : undefined} /> ); diff --git a/src/library-authoring/LibraryLayout.tsx b/src/library-authoring/LibraryLayout.tsx index ad0f446f92..2ab448bcca 100644 --- a/src/library-authoring/LibraryLayout.tsx +++ b/src/library-authoring/LibraryLayout.tsx @@ -25,9 +25,14 @@ const LibraryLayout = () => { } const navigate = useNavigate(); - const goBack = React.useCallback(() => { - // Go back to the library - navigate(`/library/${libraryId}`); + + const goBack = React.useCallback((prevPath?: string) => { + if (prevPath) { + // Redirects back to the previous route like collection page or library page + navigate(prevPath); + } else { + navigate(`/library/${libraryId}`); + } // The following function is called only if changes are saved: return ({ id: usageKey }) => { // invalidate any queries that involve this XBlock: diff --git a/src/library-authoring/add-content/AddContentContainer.tsx b/src/library-authoring/add-content/AddContentContainer.tsx index 0ba42b2d04..5dfd4cd9a0 100644 --- a/src/library-authoring/add-content/AddContentContainer.tsx +++ b/src/library-authoring/add-content/AddContentContainer.tsx @@ -16,7 +16,7 @@ import { ContentPaste, } from '@openedx/paragon/icons'; import { v4 as uuid4 } from 'uuid'; -import { useNavigate, useParams } from 'react-router-dom'; +import { useLocation, useNavigate, useParams } from 'react-router-dom'; import { ToastContext } from '../../generic/toast-context'; import { useCopyToClipboard } from '../../generic/clipboard'; @@ -62,7 +62,9 @@ const AddContentButton = ({ contentType, onCreateContent } : AddContentButtonPro const AddContentContainer = () => { const intl = useIntl(); const navigate = useNavigate(); - const { libraryId } = useParams(); + const location = useLocation(); + const currentPath = location.pathname; + const { libraryId, collectionId } = useParams(); const createBlockMutation = useCreateLibraryBlock(); const pasteClipboardMutation = useLibraryPasteClipboard(); const { showToast } = useContext(ToastContext); @@ -147,10 +149,13 @@ const AddContentContainer = () => { libraryId, blockType, definitionId: `${uuid4()}`, + collectionId, }).then((data) => { const editUrl = getEditUrl(data.id); if (editUrl) { - navigate(editUrl); + // Pass currentPath in state so that we can come back to + // current page on save or cancel + navigate(editUrl, { state: { from: currentPath } }); } else { // We can't start editing this right away so just show a toast message: showToast(intl.formatMessage(messages.successCreateMessage)); @@ -168,7 +173,7 @@ const AddContentContainer = () => { return ( - + {!collectionId && }
{contentTypes.map((contentType) => ( { const client = getAuthenticatedHttpClient(); const { data } = await client.post( @@ -204,6 +206,7 @@ export async function createLibraryBlock({ { block_type: blockType, definition_id: definitionId, + collection_key: collectionId, }, ); return camelCaseObject(data); diff --git a/src/library-authoring/data/apiHooks.ts b/src/library-authoring/data/apiHooks.ts index c55d3663a1..7fc5823401 100644 --- a/src/library-authoring/data/apiHooks.ts +++ b/src/library-authoring/data/apiHooks.ts @@ -128,7 +128,7 @@ export const useCreateLibraryBlock = () => { mutationFn: createLibraryBlock, onSettled: (_data, _error, variables) => { queryClient.invalidateQueries({ queryKey: libraryAuthoringQueryKeys.contentLibrary(variables.libraryId) }); - queryClient.invalidateQueries({ queryKey: ['content_search'] }); + queryClient.invalidateQueries({ predicate: (query) => libraryQueryPredicate(query, variables.libraryId) }); }, }); };