(null);
- const [iFrameHeight, setIFrameHeight] = useState(600);
+ const [iFrameHeight, setIFrameHeight] = useState(50);
const studioBaseUrl = getConfig().STUDIO_BASE_URL;
const intl = useIntl();
@@ -59,6 +59,10 @@ export const LibraryBlock = ({ onBlockNotification, usageKey, version }: Library
// Messages are the only way that the code in the IFrame can communicate
// with the surrounding UI.
window.addEventListener('message', receivedWindowMessage);
+ if (window.self !== window.top) {
+ // This component is loaded inside an iframe.
+ setIFrameHeight(86);
+ }
return () => {
window.removeEventListener('message', receivedWindowMessage);
@@ -69,7 +73,7 @@ export const LibraryBlock = ({ onBlockNotification, usageKey, version }: Library
return (
> = () => {
title={intl.formatMessage(messages.advancedDetailsAssetsDeleteFileTitle)}
description={`Are you sure you want to delete ${filePathToDelete}?`}
onDeleteSubmit={deleteFile}
- btnState="default"
/>
>
);
diff --git a/src/library-authoring/components/CollectionCard.tsx b/src/library-authoring/components/CollectionCard.tsx
index c7c5164f62..67f97d3b8b 100644
--- a/src/library-authoring/components/CollectionCard.tsx
+++ b/src/library-authoring/components/CollectionCard.tsx
@@ -1,4 +1,4 @@
-import { useCallback, useContext, useState } from 'react';
+import { useCallback, useContext } from 'react';
import { FormattedMessage, useIntl } from '@edx/frontend-platform/i18n';
import {
ActionRow,
@@ -26,7 +26,6 @@ const CollectionMenu = ({ collectionHit } : CollectionMenuProps) => {
const intl = useIntl();
const { showToast } = useContext(ToastContext);
const [isDeleteModalOpen, openDeleteModal, closeDeleteModal] = useToggle(false);
- const [confirmBtnState, setConfirmBtnState] = useState('default');
const { closeLibrarySidebar, sidebarComponentInfo } = useLibraryContext();
const restoreCollectionMutation = useRestoreCollection(collectionHit.contextKey, collectionHit.blockId);
@@ -40,28 +39,26 @@ const CollectionMenu = ({ collectionHit } : CollectionMenuProps) => {
}, []);
const deleteCollectionMutation = useDeleteCollection(collectionHit.contextKey, collectionHit.blockId);
- const deleteCollection = useCallback(() => {
- setConfirmBtnState('pending');
+ const deleteCollection = useCallback(async () => {
if (sidebarComponentInfo?.id === collectionHit.blockId) {
// Close sidebar if current collection is open to avoid displaying
// deleted collection in sidebar
closeLibrarySidebar();
}
- deleteCollectionMutation.mutateAsync()
- .then(() => {
- showToast(
- intl.formatMessage(messages.deleteCollectionSuccess),
- {
- label: intl.formatMessage(messages.undoDeleteCollectionToastAction),
- onClick: restoreCollection,
- },
- );
- }).catch(() => {
- showToast(intl.formatMessage(messages.deleteCollectionFailed));
- }).finally(() => {
- setConfirmBtnState('default');
- closeDeleteModal();
- });
+ try {
+ await deleteCollectionMutation.mutateAsync();
+ showToast(
+ intl.formatMessage(messages.deleteCollectionSuccess),
+ {
+ label: intl.formatMessage(messages.undoDeleteCollectionToastAction),
+ onClick: restoreCollection,
+ },
+ );
+ } catch (e) {
+ showToast(intl.formatMessage(messages.deleteCollectionFailed));
+ } finally {
+ closeDeleteModal();
+ }
}, [sidebarComponentInfo?.id]);
return (
@@ -97,7 +94,6 @@ const CollectionMenu = ({ collectionHit } : CollectionMenuProps) => {
collectionTitle: collectionHit.displayName,
})}
onDeleteSubmit={deleteCollection}
- btnState={confirmBtnState}
/>
>
);
diff --git a/src/library-authoring/data/apiHooks.ts b/src/library-authoring/data/apiHooks.ts
index e1ab38f1f5..09151a4602 100644
--- a/src/library-authoring/data/apiHooks.ts
+++ b/src/library-authoring/data/apiHooks.ts
@@ -285,10 +285,11 @@ export const useLibraryPasteClipboard = () => {
});
};
-export const useLibraryBlockMetadata = (usageId: string) => (
+export const useLibraryBlockMetadata = (usageId: string | undefined) => (
useQuery({
- queryKey: xblockQueryKeys.componentMetadata(usageId),
- queryFn: () => getLibraryBlockMetadata(usageId),
+ queryKey: xblockQueryKeys.componentMetadata(usageId!),
+ queryFn: () => getLibraryBlockMetadata(usageId!),
+ enabled: !!usageId,
})
);
diff --git a/src/library-authoring/library-info/LibraryPublishStatus.tsx b/src/library-authoring/library-info/LibraryPublishStatus.tsx
index 2498a10241..1bd707958c 100644
--- a/src/library-authoring/library-info/LibraryPublishStatus.tsx
+++ b/src/library-authoring/library-info/LibraryPublishStatus.tsx
@@ -1,4 +1,4 @@
-import { useCallback, useContext, useState } from 'react';
+import { useCallback, useContext } from 'react';
import { useIntl } from '@edx/frontend-platform/i18n';
import { useToggle } from '@openedx/paragon';
@@ -13,7 +13,6 @@ const LibraryPublishStatus = () => {
const intl = useIntl();
const { libraryData, readOnly } = useLibraryContext();
const [isConfirmModalOpen, openConfirmModal, closeConfirmModal] = useToggle(false);
- const [confirmBtnState, setConfirmBtnState] = useState('default');
const commitLibraryChanges = useCommitLibraryChanges();
const revertLibraryChanges = useRevertLibraryChanges();
@@ -30,18 +29,16 @@ const LibraryPublishStatus = () => {
}
}, [libraryData]);
- const revert = useCallback(() => {
+ const revert = useCallback(async () => {
if (libraryData) {
- setConfirmBtnState('pending');
- revertLibraryChanges.mutateAsync(libraryData.id)
- .then(() => {
- showToast(intl.formatMessage(messages.revertSuccessMsg));
- }).catch(() => {
- showToast(intl.formatMessage(messages.revertErrorMsg));
- }).finally(() => {
- setConfirmBtnState('default');
- closeConfirmModal();
- });
+ try {
+ await revertLibraryChanges.mutateAsync(libraryData.id);
+ showToast(intl.formatMessage(messages.revertSuccessMsg));
+ } catch (e) {
+ showToast(intl.formatMessage(messages.revertErrorMsg));
+ } finally {
+ closeConfirmModal();
+ }
}
}, [libraryData]);
@@ -63,9 +60,7 @@ const LibraryPublishStatus = () => {
title={intl.formatMessage(messages.discardChangesTitle)}
description={intl.formatMessage(messages.discardChangesDescription)}
onDeleteSubmit={revert}
- btnState={confirmBtnState}
- btnDefaultLabel={intl.formatMessage(messages.discardChangesDefaultBtnLabel)}
- btnPendingLabel={intl.formatMessage(messages.discardChangesDefaultBtnLabel)}
+ btnLabel={intl.formatMessage(messages.discardChangesDefaultBtnLabel)}
/>
>
);