From fad72c6e2cf33121a74c507d34c9621bd30faf66 Mon Sep 17 00:00:00 2001
From: Lucas Oliveira <lucas.edu.oli@hotmail.com>
Date: Thu, 2 Nov 2023 00:58:46 -0300
Subject: [PATCH] Added new folder on My Collection

---
 .../src/components/sidebarComponent/index.tsx  | 18 ++++++++++++++++++
 src/frontend/src/pages/MainPage/index.tsx      |  5 ++++-
 src/frontend/src/style/applies.css             |  6 +++---
 src/frontend/src/utils/styleUtils.ts           |  2 ++
 4 files changed, 27 insertions(+), 4 deletions(-)

diff --git a/src/frontend/src/components/sidebarComponent/index.tsx b/src/frontend/src/components/sidebarComponent/index.tsx
index f1fbec8e3..153b80c45 100644
--- a/src/frontend/src/components/sidebarComponent/index.tsx
+++ b/src/frontend/src/components/sidebarComponent/index.tsx
@@ -7,11 +7,16 @@ interface SidebarNavProps extends React.HTMLAttributes<HTMLElement> {
     href: string;
     title: string;
   }[];
+  secondaryItems?: {
+    href: string;
+    title: string;
+  }[];
 }
 
 export default function SidebarNav({
   className,
   items,
+  secondaryItems,
   ...props
 }: SidebarNavProps) {
   const location = useLocation();
@@ -40,6 +45,19 @@ export default function SidebarNav({
           {item.title}
         </Link>
       ))}
+      {/* {secondaryItems && (
+        <>
+          <div className="py-2">
+            <Separator />
+          </div>
+          <div className="flex justify-center">
+            <button className="flex h-8 w-fit items-center justify-between rounded-md border border-ring/60 px-4 py-2 text-sm text-primary hover:bg-muted">
+              <IconComponent name="FolderPlus" className="mr-2 h-4 w-4 " />
+              New Folder
+            </button>
+          </div>
+        </>
+      )} */}
     </nav>
   );
 }
diff --git a/src/frontend/src/pages/MainPage/index.tsx b/src/frontend/src/pages/MainPage/index.tsx
index 01d582c0d..38a15ab72 100644
--- a/src/frontend/src/pages/MainPage/index.tsx
+++ b/src/frontend/src/pages/MainPage/index.tsx
@@ -93,7 +93,10 @@ export default function HomePage(): JSX.Element {
         <div className="flex flex-col space-y-8 lg:flex-row lg:space-x-8 lg:space-y-0">
           <aside className="space-y-6 lg:w-1/5">
             {/* <Input placeholder="Search" onChange={(e) => {}} /> */}
-            <SidebarNav items={sidebarNavItems} />
+            <SidebarNav
+              items={sidebarNavItems}
+              secondaryItems={sidebarNavItems}
+            />
           </aside>
           <div className="w-full flex-1">
             <Outlet />
diff --git a/src/frontend/src/style/applies.css b/src/frontend/src/style/applies.css
index 25ad9267c..98cc101a7 100644
--- a/src/frontend/src/style/applies.css
+++ b/src/frontend/src/style/applies.css
@@ -217,7 +217,7 @@
   }
 
   .main-page-nav-arrangement {
-    @apply flex-max-width justify-between px-6 py-8 pb-2;
+    @apply flex-max-width justify-between py-8 pb-2;
   }
 
   .main-page-nav-title {
@@ -229,11 +229,11 @@
   }
 
   .main-page-description-text {
-    @apply flex w-[60%] px-6 pb-4 text-muted-foreground;
+    @apply flex w-[60%] pb-4 text-muted-foreground;
   }
 
   .admin-page-description-text {
-    @apply flex w-[80%] px-6 pb-8 text-muted-foreground;
+    @apply flex w-[80%] pb-8 text-muted-foreground;
   }
 
   .main-page-flows-display {
diff --git a/src/frontend/src/utils/styleUtils.ts b/src/frontend/src/utils/styleUtils.ts
index a5bebeae3..44c1a583f 100644
--- a/src/frontend/src/utils/styleUtils.ts
+++ b/src/frontend/src/utils/styleUtils.ts
@@ -32,6 +32,7 @@ import {
   FileText,
   FileUp,
   Fingerprint,
+  FolderPlus,
   Gift,
   GitBranchPlus,
   GitFork,
@@ -300,6 +301,7 @@ export const nodeIconsLucide: iconsType = {
   DownloadCloud,
   File,
   FileText,
+  FolderPlus,
   GitFork,
   GithubIcon,
   FileDown,