From 7814d4b53f29fe6162c79f18a4625edaba53de42 Mon Sep 17 00:00:00 2001 From: Nidharshan A <cb.en.u4cse18036@cb.students.amrita.edu> Date: Wed, 3 Mar 2021 13:56:25 +0000 Subject: [PATCH] Upload New File --- digital-course-file/src/user/FolderNav.js | 46 +++++++++++++++++++++++ 1 file changed, 46 insertions(+) create mode 100644 digital-course-file/src/user/FolderNav.js diff --git a/digital-course-file/src/user/FolderNav.js b/digital-course-file/src/user/FolderNav.js new file mode 100644 index 0000000..ca67384 --- /dev/null +++ b/digital-course-file/src/user/FolderNav.js @@ -0,0 +1,46 @@ +import { react } from "react"; +import { Breadcrumb } from "react-bootstrap"; +import { Link } from "react-router-dom"; +import { ROOT_FOLDER } from "../hooks/useFolder"; + +export default function FolderNav( {currentFolder} ) { + + let path = currentFolder === ROOT_FOLDER ? [] : [ROOT_FOLDER] + if (currentFolder){ + path = [...path,...currentFolder.path]; + } + + + return( + <Breadcrumb + className="flex-grow-1" + listProps = {{ className : "bg-white pl-0 m-0"}} + > + {path.map((folder,index) => ( + <Breadcrumb.Item + key={folder.id} + linkAs ={Link} + linkProps = {{ + to : folder.id ? `/folder/${folder.id}` : "/", + }} + className="text-truncate d-inline-block" + style = { {maxWidth : "175px"} } + > + {folder.name} + </Breadcrumb.Item> + ))} + { currentFolder && ( + <Breadcrumb.Item + className="text-truncate d-inline-block" + style = { {maxWidth : "200px"} } + active + > + {currentFolder.name} + </Breadcrumb.Item> + ) + + } + </Breadcrumb> + ); + +} \ No newline at end of file -- GitLab