diff --git a/src/components/pages/ModuleResources/components/FoldersView.tsx b/src/components/pages/ModuleResources/components/FoldersView.tsx index 5aa86b14e6fb04e78cce9694e1e5b98684459419..691f2f3af3a50396139e3206c36380d10336e06d 100644 --- a/src/components/pages/ModuleResources/components/FoldersView.tsx +++ b/src/components/pages/ModuleResources/components/FoldersView.tsx @@ -4,6 +4,7 @@ import SelectionView, { SelectionProps, } from "components/molecules/SelectionView"; import FoldersRow from "components/molecules/FoldersRow"; +import { useHistory, useLocation } from "react-router-dom"; export interface FoldersViewProps { resources: Resource[]; @@ -16,24 +17,31 @@ const FoldersView: React.FC<FoldersViewProps> = ({ scope, searchText, }) => { - let folders: { title: string; id: number }[] = Array.from( - new Set<string>(resources.map((res: Resource) => res.folder)) - ).map((title: string, id: number) => ({ - title: title, - id: id, - })); + let history = useHistory(); + let location = useLocation(); + let folders: { title: string; id: number }[] = Array.from( + new Set<string>(resources.map((res: Resource) => res.folder)) + ).map((title: string, id: number) => ({ + title: title, + id: id, + })); - if (searchText === "" && scope === "" && folders.length > 0) { - return ( - <SelectionView - heading="Folders" - onDownloadClick={() => {}} - onItemClick={() => {}} - selectionItems={folders} - render={(select: SelectionProps) => <FoldersRow select={select} />} - /> - ); - } + function handleFolderClick(foldersId: number) { + let title = folders.filter(({ id }) => id === foldersId)[0].title; + history.push(`${location.pathname}/${title}`); + } + + if (searchText === "" && scope === "" && folders.length > 0) { + return ( + <SelectionView + heading="Folders" + onDownloadClick={() => {}} + onItemClick={handleFolderClick} + selectionItems={folders} + render={(select: SelectionProps) => <FoldersRow select={select} />} + /> + ); + } return null; };