From 83c28a8d5ebc997b21cddda6a946a13fc6fad84a Mon Sep 17 00:00:00 2001
From: Djeeberjr <djeeberjr@gmail.com>
Date: Wed, 29 Sep 2021 21:01:15 +0200
Subject: [PATCH] added bucket select

---
 src/App.tsx                     |  2 ++
 src/components/BucketSelect.tsx | 30 ++++++++++++++++++++++++++++++
 src/components/FileBrowser.tsx  |  2 +-
 3 files changed, 33 insertions(+), 1 deletion(-)
 create mode 100644 src/components/BucketSelect.tsx

diff --git a/src/App.tsx b/src/App.tsx
index 27ef7e2..d7618a9 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -5,6 +5,7 @@ import NotFound from "./components/NotFound"
 import Login from "./components/Login"
 import { useIsAuthQuery } from "./generated/graphql"
 import { useEffect } from "react"
+import BucketSelect from "./components/BucketSelect"
 
 const App: React.FC = () => {
 	const { data } = useIsAuthQuery()
@@ -27,6 +28,7 @@ const App: React.FC = () => {
 						{/* Private only routes */}
 						{
 							isAuth && [
+								<Route path="/f/" exact component={BucketSelect} key={null} />,
 								<Route path="/f/" component={FileBrowser} key={null} />,
 								<Redirect from="/" exact to="/f/" key={null} />,
 								<Redirect from="/login" exact to="/f/" key={null} />,
diff --git a/src/components/BucketSelect.tsx b/src/components/BucketSelect.tsx
new file mode 100644
index 0000000..d902419
--- /dev/null
+++ b/src/components/BucketSelect.tsx
@@ -0,0 +1,30 @@
+import React from "react"
+import { useState } from "react"
+import { Link } from "react-router-dom"
+import Breadcrum from "./Breadcrum"
+import MoreMenu from "./MoreMenu"
+
+const BucketSelect: React.FC = () => {
+
+	const [buckets] = useState(["dev"])
+
+	return (
+		<div>
+			<div className="flex justify-between h-12">
+				<Breadcrum />
+				<div className="ml-auto">
+					<MoreMenu />
+				</div>
+			</div>
+			<ul>
+				{buckets.map((e)=>
+					<li key={e}>
+						<Link to={`/f/${e}/`} >{e}</Link>
+					</li>
+				)}
+			</ul>
+		</div>
+	)
+}
+
+export default BucketSelect
diff --git a/src/components/FileBrowser.tsx b/src/components/FileBrowser.tsx
index b2382ca..d89927f 100644
--- a/src/components/FileBrowser.tsx
+++ b/src/components/FileBrowser.tsx
@@ -107,7 +107,7 @@ const FileBrowser: React.FC<RouteComponentProps> = (props) => {
 					await handleDrop(files)
 				}}
 			>
-				<div className="flex justify-between">
+				<div className="flex justify-between h-12">
 					<Breadcrum path={path} onDirClick={(newPath)=>{
 						props.history.push(newPath.toURI())
 					}}/>