From 77348a9323b6541a7dda1fe8ba7111bb449cb67d Mon Sep 17 00:00:00 2001
From: Stefan Forstenlechner <stefan@forstenlechner.dev>
Date: Thu, 15 Aug 2024 20:33:38 +0200
Subject: [PATCH] Remove default folder

It looked weird having a folder shown, while loading the folder
 structure
---
 .../src/ImageGallery/ImageGalleryDrawer.tsx   | 21 ++++++++++++-------
 .../src/ImageGalleryLayout.tsx                |  7 +------
 2 files changed, 15 insertions(+), 13 deletions(-)

diff --git a/picture-gallery-client/src/ImageGallery/ImageGalleryDrawer.tsx b/picture-gallery-client/src/ImageGallery/ImageGalleryDrawer.tsx
index 1462000..a076f85 100644
--- a/picture-gallery-client/src/ImageGallery/ImageGalleryDrawer.tsx
+++ b/picture-gallery-client/src/ImageGallery/ImageGalleryDrawer.tsx
@@ -11,6 +11,7 @@ import { Chip, useTheme } from "@mui/material";
 import useMediaQuery from "@mui/material/useMediaQuery";
 import { smallScreenMediaQuery } from "../ImageGalleryLayout";
 import { getDefaultExpanded } from "./PathToExpaned";
+import Typography from "@mui/material/Typography";
 
 function generateTreeViewChildren(
   folders: Folders[],
@@ -141,18 +142,24 @@ export const ImageGalleryDrawer = ({
 }: {
   open: boolean;
   drawerWidth: number;
-  folders: Folders;
+  folders: Folders | undefined;
   handleDrawerToggle: () => void;
 }) => {
   const theme = useTheme();
   const smallScreen = !useMediaQuery(smallScreenMediaQuery);
 
-  const drawerContent = (
-    <>
-      <Toolbar sx={{ marginBottom: 3 }} />
-      <GenerateTreeView root={folders} />
-    </>
-  );
+  const drawerContent =
+    folders != undefined ? (
+      <>
+        <Toolbar sx={{ marginBottom: 3 }} />
+        <GenerateTreeView root={folders} />
+      </>
+    ) : (
+      <>
+        <Toolbar sx={{ marginBottom: 3 }} />
+        <Typography sx={{ marginLeft: 2 }}>Loading folders...</Typography>
+      </>
+    );
 
   return smallScreen ? (
     <Drawer
diff --git a/picture-gallery-client/src/ImageGalleryLayout.tsx b/picture-gallery-client/src/ImageGalleryLayout.tsx
index 313f7fa..ad23cde 100644
--- a/picture-gallery-client/src/ImageGalleryLayout.tsx
+++ b/picture-gallery-client/src/ImageGalleryLayout.tsx
@@ -18,12 +18,7 @@ function ImageGalleryLayout() {
   const [imagesLoaded, setImagesLoaded] = useState(false);
   const [images, setImages] = useState<ImageWithThumbnail[]>([]);
 
-  const [folders, setFolders] = useState<Folders>({
-    name: "Home",
-    fullPath: "/",
-    numberOfFiles: 0,
-    children: [],
-  });
+  const [folders, setFolders] = useState<Folders | undefined>(undefined);
 
   const location = useLocation();
   const navigate = useNavigate();