diff --git a/src/content-tags-drawer/tags-sidebar/TagsSidebarBody.jsx b/src/content-tags-drawer/tags-sidebar/TagsSidebarBody.jsx index 50ff0959a2..d981d0353c 100644 --- a/src/content-tags-drawer/tags-sidebar/TagsSidebarBody.jsx +++ b/src/content-tags-drawer/tags-sidebar/TagsSidebarBody.jsx @@ -65,7 +65,7 @@ const TagsSidebarBody = () => { ? ( {tree.map((taxonomy) => ( -
+
{ iconWhenClosed={} iconWhenOpen={} > - +
))} diff --git a/src/content-tags-drawer/tags-sidebar/TagsTree.jsx b/src/content-tags-drawer/tags-sidebar/TagsTree.jsx index 798ae8cf60..9647ff949a 100644 --- a/src/content-tags-drawer/tags-sidebar/TagsTree.jsx +++ b/src/content-tags-drawer/tags-sidebar/TagsTree.jsx @@ -2,24 +2,32 @@ import PropTypes from 'prop-types'; import { Icon } from '@openedx/paragon'; import { Tag } from '@openedx/paragon/icons'; -const TagsTree = ({ tags, rootDepth }) => { +const TagsTree = ({ tags, rootDepth, parentKey }) => { if (Object.keys(tags).length === 0) { return null; } - // Generate tabs for the parents of this tree - const tabs = Array.from({ - length: rootDepth, - }).map(() => ); + // Used to Generate tabs for the parents of this tree + const tabsNumberArray = Array.from({ length: rootDepth }, (_, index) => index + 1); return ( -
+
{Object.keys(tags).map((key) => ( -
-
- {tabs}{key} +
+
+ { + tabsNumberArray.map((index) => ) + } + {key}
- { tags[key].children && } + { tags[key].children + && ( + + )}
))}
@@ -28,11 +36,13 @@ const TagsTree = ({ tags, rootDepth }) => { TagsTree.propTypes = { tags: PropTypes.shape({}).isRequired, + parentKey: PropTypes.string, rootDepth: PropTypes.number, }; TagsTree.defaultProps = { rootDepth: 0, + parentKey: undefined, }; export default TagsTree;