fix: merge errors

openedx · Oct 8, 2024 · 5c2842a · 5c2842a
1 parent d602803
commit 5c2842a
Show file tree

Hide file tree

Showing 6 changed files with 23 additions and 22 deletions.
diff --git a/src/library-authoring/LibraryAuthoringPage.tsx b/src/library-authoring/LibraryAuthoringPage.tsx
@@ -59,21 +59,18 @@ const TabContent = ({ eventKey, handleTabChange }: TabContentProps) => {
   }
 };
 
-interface HeaderActionsProps {
-  canEditLibrary: boolean;
-}
-
-const HeaderActions = ({ canEditLibrary }: HeaderActionsProps) => {
+const HeaderActions = () => {
   const intl = useIntl();
   const {
     componentPickerMode,
     openAddContentSidebar,
     openInfoSidebar,
     closeLibrarySidebar,
     sidebarBodyComponent,
+    readOnly,
   } = useLibraryContext();
 
-  if (!canEditLibrary) {
+  if (!readOnly) {
     return null;
   }
 
@@ -217,7 +214,7 @@ const LibraryAuthoringPage = () => {
               )}
               subtitle={intl.formatMessage(messages.headingSubtitle)}
               headerActions={(
-                <HeaderActions canEditLibrary={libraryData.canEditLibrary} />
+                <HeaderActions />
               )}
             />
             <SearchKeywordsField className="w-50" />

diff --git a/src/library-authoring/component-info/ComponentAdvancedInfo.tsx b/src/library-authoring/component-info/ComponentAdvancedInfo.tsx
@@ -14,7 +14,6 @@ import { LoadingSpinner } from '../../generic/Loading';
 import { CodeEditor, EditorAccessor } from '../../generic/CodeEditor';
 import { useLibraryContext } from '../common/context';
 import {
-  useContentLibrary,
   useUpdateXBlockOLX,
   useXBlockAssets,
   useXBlockOLX,
@@ -27,9 +26,7 @@ interface Props {
 
 export const ComponentAdvancedInfo: React.FC<Props> = ({ usageKey }) => {
   const intl = useIntl();
-  const { libraryId } = useLibraryContext();
-  const { data: library } = useContentLibrary(libraryId);
-  const canEditLibrary = library?.canEditLibrary ?? false;
+  const { readOnly } = useLibraryContext();
   const { data: olx, isLoading: isOLXLoading } = useXBlockOLX(usageKey);
   const { data: assets, isLoading: areAssetsLoading } = useXBlockAssets(usageKey);
   const editorRef = React.useRef<EditorAccessor | undefined>(undefined);
@@ -83,7 +80,7 @@ export const ComponentAdvancedInfo: React.FC<Props> = ({ usageKey }) => {
                       <FormattedMessage {...messages.advancedDetailsOLXCancelButton} />
                     </Button>
                   </>
-                ) : canEditLibrary ? (
+                ) : !readOnly ? (
                   <OverlayTrigger
                     placement="bottom-start"
                     overlay={(

diff --git a/src/library-authoring/component-info/ComponentInfo.tsx b/src/library-authoring/component-info/ComponentInfo.tsx
@@ -7,15 +7,12 @@ import {
 } from '@openedx/paragon';
 
 import { useLibraryContext } from '../common/context';
-import { getEditUrl } from '../components/utils';
 import { ComponentMenu } from '../components';
+import { canEditComponent } from '../components/ComponentEditorModal';
 import ComponentDetails from './ComponentDetails';
 import ComponentManagement from './ComponentManagement';
 import ComponentPreview from './ComponentPreview';
 import messages from './messages';
-import { canEditComponent } from '../components/ComponentEditorModal';
-import { useLibraryContext } from '../common/context';
-import { useContentLibrary } from '../data/apiHooks';
 
 const ComponentInfo = () => {
   const intl = useIntl();
@@ -30,15 +27,14 @@ const ComponentInfo = () => {
     return null;
   }
 
-  const editUrl = getEditUrl(usageKey);
   const canEdit = canEditComponent(usageKey);
 
   return (
     <Stack>
       {!readOnly && (
         <div className="d-flex flex-wrap">
           <Button
-             {...(canEdit ? { onClick: () => openComponentEditor(usageKey) } : { disabled: true })}
+            {...(canEdit ? { onClick: () => openComponentEditor(usageKey) } : { disabled: true })}
             variant="outline-primary"
             className="m-1 text-nowrap flex-grow-1"
           >

diff --git a/src/library-authoring/component-info/ComponentPreview.tsx b/src/library-authoring/component-info/ComponentPreview.tsx
@@ -33,15 +33,15 @@ const ComponentPreview = () => {
   const intl = useIntl();
 
   const [isModalOpen, openModal, closeModal] = useToggle();
-  const { data: componentMetadata } = useLibraryBlockMetadata(usageKey);
-
   const { currentComponentUsageKey: usageKey } = useLibraryContext();
 
   // istanbul ignore if: this should never happen
   if (!usageKey) {
     throw new Error('usageKey is required');
   }
 
+  const { data: componentMetadata } = useLibraryBlockMetadata(usageKey);
+
   return (
     <>
       <div className="position-relative m-2">

diff --git a/src/library-authoring/components/BaseComponentCard.tsx b/src/library-authoring/components/BaseComponentCard.tsx
@@ -38,7 +38,7 @@ const BaseComponentCard = ({
             + (tags.level2?.length || 0) + (tags.level3?.length || 0);
   }, [tags]);
 
-  const componentIcon = getItemIcon(type);
+  const componentIcon = getItemIcon(componentType);
   const { componentPickerMode } = useLibraryContext();
 
   return (

diff --git a/src/library-authoring/components/ComponentCard.tsx b/src/library-authoring/components/ComponentCard.tsx
@@ -2,9 +2,10 @@ import React, { useContext, useState } from 'react';
 import { FormattedMessage, useIntl } from '@edx/frontend-platform/i18n';
 import {
   ActionRow,
+  Button,
+  Dropdown,
   Icon,
   IconButton,
-  Dropdown,
 } from '@openedx/paragon';
 import { MoreVert } from '@openedx/paragon/icons';
 
@@ -24,6 +25,7 @@ type ComponentCardProps = {
 export const ComponentMenu = ({ usageKey }: { usageKey: string }) => {
   const intl = useIntl();
   const { openComponentEditor } = useLibraryContext();
+
   const canEdit = usageKey && canEditComponent(usageKey);
   const { showToast } = useContext(ToastContext);
   const [clipboardBroadcastChannel] = useState(() => new BroadcastChannel(STUDIO_CLIPBOARD_CHANNEL));
@@ -65,6 +67,7 @@ export const ComponentMenu = ({ usageKey }: { usageKey: string }) => {
 const ComponentCard = ({ contentHit } : ComponentCardProps) => {
   const {
     openComponentInfoSidebar,
+    componentPickerMode,
   } = useLibraryContext();
 
   const {
@@ -88,6 +91,14 @@ const ComponentCard = ({ contentHit } : ComponentCardProps) => {
       tags={tags}
       actions={(
         <ActionRow>
+          {componentPickerMode && (
+            <Button
+              variant="primary"
+              onClick={() => alert('Hi')}
+            >
+              Hi!
+            </Button>
+          )}
           <ComponentMenu usageKey={usageKey} />
         </ActionRow>
       )}