From 6ec17a4010bcdf8f5ade82aa58d17abeb059e9e4 Mon Sep 17 00:00:00 2001
From: Jonathan Summers-Muir <MildTomato@users.noreply.github.com>
Date: Wed, 17 Jul 2024 23:39:19 +0200
Subject: [PATCH] updated nav icons

---
 .../src/app/[org]/[project]/side-nav.tsx             |  7 +++++++
 apps/studio-prototype/src/app/[org]/org-menu.tsx     |  4 ++--
 .../src/app/[org]/{ => projects}/page.tsx            | 12 ++++--------
 .../src/app/[org]/side-nav-menu-icon.tsx             |  5 ++++-
 apps/studio-prototype/src/app/[org]/top-header.tsx   |  2 +-
 5 files changed, 18 insertions(+), 12 deletions(-)
 rename apps/studio-prototype/src/app/[org]/{ => projects}/page.tsx (88%)

diff --git a/apps/studio-prototype/src/app/[org]/[project]/side-nav.tsx b/apps/studio-prototype/src/app/[org]/[project]/side-nav.tsx
index 07632bc5c87..077100d59aa 100644
--- a/apps/studio-prototype/src/app/[org]/[project]/side-nav.tsx
+++ b/apps/studio-prototype/src/app/[org]/[project]/side-nav.tsx
@@ -4,11 +4,18 @@ import { Separator } from 'ui'
 import SideMenuOrgMenu from '../side-menu-org-menu'
 import SideNavMenuIcon from '../side-nav-menu-icon'
 import SideNavMotion from '../side-nav-motion'
+import { Box } from 'lucide-react'
 
 function SideNav() {
   return (
     <SideNavMotion>
       {/* <SideMenuOrgMenu /> */}
+      {/* <div className="flex justify-center w-full">
+        <div className="text-[10px] uppercase flex justify-center bg-surface-200 w-full h-[37px] -top-8 items-center">
+          <Box size={16} className="text-foreground-muted" strokeWidth={1} />
+        </div>
+      </div> */}
+      {/* <Separator /> */}
       <div className="grow w-full flex flex-col my-5 gap-6">
         {SideNavData.map((group, i) => {
           return (
diff --git a/apps/studio-prototype/src/app/[org]/org-menu.tsx b/apps/studio-prototype/src/app/[org]/org-menu.tsx
index 2246f3e5801..236ac9dcd72 100644
--- a/apps/studio-prototype/src/app/[org]/org-menu.tsx
+++ b/apps/studio-prototype/src/app/[org]/org-menu.tsx
@@ -63,7 +63,7 @@ export default function OrgMenu() {
               </div>
             </div>
             <DropdownMenuSeparator />
-            <DropdownMenuItem onSelect={() => router.push(`/${selectedOrg?.key}`)}>
+            <DropdownMenuItem onSelect={() => router.push(`/${selectedOrg?.key}/projects`)}>
               All Projects
             </DropdownMenuItem>
             <DropdownMenuSeparator />
@@ -83,7 +83,7 @@ export default function OrgMenu() {
                     <DropdownMenuItem
                       key={org.key}
                       onSelect={() => {
-                        router.push(`/${org.key}`)
+                        router.push(`/${org.key}/projects`)
                         setConfig({
                           ...config,
                           selectedOrg: db.orgs.find((o: Org) => o.key === org.key),
diff --git a/apps/studio-prototype/src/app/[org]/page.tsx b/apps/studio-prototype/src/app/[org]/projects/page.tsx
similarity index 88%
rename from apps/studio-prototype/src/app/[org]/page.tsx
rename to apps/studio-prototype/src/app/[org]/projects/page.tsx
index bdc24ee5de0..28aedcd83d7 100644
--- a/apps/studio-prototype/src/app/[org]/page.tsx
+++ b/apps/studio-prototype/src/app/[org]/projects/page.tsx
@@ -1,14 +1,10 @@
-import ReadAndWritesChart from '@/src/components/charts/read-and-writes-chart'
-import ProjectList from './projects/project-list'
-import ProjectsCharts from './projects/projects-charts'
-import ProjectsHeader from './projects/projects-header'
 import QueriesChart from '@/src/components/charts/queries-chart'
-import IOPSChart from '@/src/components/charts/iops-chart'
-import StorageChart from '@/src/components/charts/storage-chart'
-import CPUAndMemoryChart from '@/src/components/charts/cpu-and-memory-chart'
-import { Button, Separator } from 'ui'
+import ReadAndWritesChart from '@/src/components/charts/read-and-writes-chart'
 import { Clock, MoreVertical } from 'lucide-react'
 import Image from 'next/image'
+import { Button, Separator } from 'ui'
+import ProjectList from './project-list'
+import ProjectsHeader from './projects-header'
 
 export default function ProjectsPage() {
   return (
diff --git a/apps/studio-prototype/src/app/[org]/side-nav-menu-icon.tsx b/apps/studio-prototype/src/app/[org]/side-nav-menu-icon.tsx
index 45884b64558..716e8c39e70 100644
--- a/apps/studio-prototype/src/app/[org]/side-nav-menu-icon.tsx
+++ b/apps/studio-prototype/src/app/[org]/side-nav-menu-icon.tsx
@@ -10,7 +10,10 @@ export default function SideNavMenuIcon({ product }: { product: any }) {
   const [config] = useConfig()
   const { selectedOrg, selectedProject } = config
   const pathname = usePathname()
-  const isActive = pathname.startsWith(`/${org}/${selectedProject?.key}${product.href}`)
+
+  const isActive =
+    pathname.startsWith(`/${org}/${selectedProject?.key}${product.href}`) ||
+    pathname.startsWith(`/${org}${product.href}`)
 
   // console.log('config.tableEditor.activeTabId', config.tableEditor.activeTabId)
 
diff --git a/apps/studio-prototype/src/app/[org]/top-header.tsx b/apps/studio-prototype/src/app/[org]/top-header.tsx
index 078b539d4c0..294b2d107b0 100644
--- a/apps/studio-prototype/src/app/[org]/top-header.tsx
+++ b/apps/studio-prototype/src/app/[org]/top-header.tsx
@@ -48,7 +48,7 @@ export default function TopHeader() {
     >
       <div className="flex items-center justify-between w-full">
         <div className="flex gap-3">
-          <Link href={`/${selectedOrg?.key}`}>
+          <Link href={`/${selectedOrg?.key}/projects`}>
             <svg
               width="109"
               height="113"