diff --git a/src/components/ResourcesList/index.tsx b/src/components/ResourcesList/index.tsx index 872c165..f8eae11 100644 --- a/src/components/ResourcesList/index.tsx +++ b/src/components/ResourcesList/index.tsx @@ -1,6 +1,6 @@ import { graphql, useStaticQuery } from "gatsby" import sort from "ramda/es/sort" -import React, { FC, HTMLAttributes, memo } from "react" +import React, { FC, HTMLAttributes, memo, useMemo } from "react" import "react-perfect-scrollbar/dist/css/styles.css" import { IAllResourcesQuery, IFileOrFolder, IFolder } from "../../types" import { getPath, humanize } from "../../utils" @@ -47,17 +47,30 @@ function plantTree(item: IFileOrFolder, single?: boolean) { const Language = memo( ({ item, single }: { item: IFolder; single: boolean }) => { + const children = useMemo(() => { + if (single) { + return item.children.filter((child) => { + const [, , , title] = child.title.split("/") + return title !== "intro" + }) + } + + return item.children + }, [item.children, single]) + return ( {!single && {humanize(item.title)}} - - {item.children.map((node) => plantTree(node))} - + {children.map((node) => plantTree(node))} ) } ) +function sortTree(tree: IFileOrFolder[]) { + return sort((a, b) => a.title.localeCompare(b.title), tree) +} + interface IResourcesList extends HTMLAttributes { relativeDirectory?: string } @@ -81,7 +94,7 @@ export const ResourcesList: FC = (props) => { } const tree = useBuildTree(filteredResources) - const sortedTree = sort((a, b) => a.title.localeCompare(b.title), tree) + const sortedTree = sortTree(tree) const isSingle = Boolean(props.relativeDirectory) return (