style: Fix nits

openedx · Mar 4, 2024 · 1d505da · 1d505da
1 parent 92eea93
commit 1d505da
Show file tree

Hide file tree

Showing 5 changed files with 18 additions and 5 deletions.
diff --git a/src/content-tags-drawer/ContentTagsDrawer.jsx b/src/content-tags-drawer/ContentTagsDrawer.jsx
@@ -21,6 +21,14 @@ import Loading from '../generic/Loading';
 /** @typedef {import("../taxonomy/data/types.mjs").TaxonomyData} TaxonomyData */
 /** @typedef {import("./data/types.mjs").Tag} ContentTagData */
 
+/**
+ * Drawer with the functionality to show and manage tags in a certain content.
+ * It is used both in interfaces of this MFE and in edx-platform interfaces such as iframe.
+ * - If you want to use it as an iframe, the component obtains the `contentId` from the url parameters.
+ *   Functions to close the drawer are handled internally.
+ * - If you want to use it as react component, you need to pass the content id and the close functions
+ *   through the component parameters.
+ */
 const ContentTagsDrawer = ({ id, onClose }) => {
   const intl = useIntl();
   const params = useParams();

diff --git a/src/content-tags-drawer/messages.js b/src/content-tags-drawer/messages.js
@@ -35,7 +35,7 @@ const messages = defineMessages({
   },
   manageTagsButton: {
     id: 'course-authoring.content-tags-drawer.button.manage',
-    defaultMessage: 'Manage tags',
+    defaultMessage: 'Manage Tags',
   },
   tagsSidebarTitle: {
     id: 'course-authoring.course-unit.sidebar.tags.title',

diff --git a/src/content-tags-drawer/tags-sidebar/TagsSidebarBody.jsx b/src/content-tags-drawer/tags-sidebar/TagsSidebarBody.jsx
@@ -1,4 +1,5 @@
-import { useState, useMemo } from 'react';
+// @ts-check
+import React, { useState, useMemo } from 'react';
 import {
   Card, Stack, Button, Sheet, Collapsible, Icon,
 } from '@openedx/paragon';
@@ -21,7 +22,7 @@ const TagsSidebarBody = () => {
   const {
     data: contentTaxonomyTagsData,
     isSuccess: isContentTaxonomyTagsLoaded,
-  } = useContentTaxonomyTagsData(contentId);
+  } = useContentTaxonomyTagsData(contentId || '');
 
   const buildTagsTree = (contentTags) => {
     const resultTree = {};
@@ -85,7 +86,7 @@ const TagsSidebarBody = () => {
               </div>
             )}
 
-          <Button className="mt-3 ml-2" variant="outline-primary" onClick={() => setShowManageTags(true)}>
+          <Button className="mt-3 ml-2" variant="outline-primary" size="sm" onClick={() => setShowManageTags(true)}>
             {intl.formatMessage(messages.manageTagsButton)}
           </Button>
         </Stack>

diff --git a/src/content-tags-drawer/tags-sidebar/TagsSidebarHeader.jsx b/src/content-tags-drawer/tags-sidebar/TagsSidebarHeader.jsx
@@ -1,3 +1,5 @@
+// @ts-check
+import React from 'react';
 import { Stack } from '@openedx/paragon';
 import { useParams } from 'react-router-dom';
 import { useIntl } from '@edx/frontend-platform/i18n';
@@ -13,7 +15,7 @@ const TagsSidebarHeader = () => {
   const {
     data: contentTaxonomyTagsCount,
     isSuccess: isContentTaxonomyTagsCountLoaded,
-  } = useContentTaxonomyTagsCount(contentId);
+  } = useContentTaxonomyTagsCount(contentId || '');
 
   return (
     <Stack className="course-unit-sidebar-header justify-content-between" direction="horizontal">

diff --git a/src/content-tags-drawer/tags-sidebar/TagsTree.jsx b/src/content-tags-drawer/tags-sidebar/TagsTree.jsx
@@ -1,3 +1,5 @@
+// @ts-check
+import React from 'react';
 import PropTypes from 'prop-types';
 import { Icon } from '@openedx/paragon';
 import { Tag } from '@openedx/paragon/icons';