From 031d9a680316c41c0fbf836a424b20b913bdf2ef Mon Sep 17 00:00:00 2001
From: Ives van Hoorne <ives@codesandbox.io>
Date: Wed, 11 Sep 2024 15:25:20 +0200
Subject: [PATCH] fix(dashboard): folders with same name but different parents
 (#8605)

* fix(dashboard): folders with same name but different parents

* remove log
---
 .../routes/Sandboxes/useFilteredItems.ts        |  6 ++++--
 .../pages/Dashboard/Sidebar/NestableRowItem.tsx |  3 ++-
 .../app/src/app/pages/Dashboard/utils/path.ts   | 17 +++++++++++++++++
 3 files changed, 23 insertions(+), 3 deletions(-)
 create mode 100644 packages/app/src/app/pages/Dashboard/utils/path.ts

diff --git a/packages/app/src/app/pages/Dashboard/Content/routes/Sandboxes/useFilteredItems.ts b/packages/app/src/app/pages/Dashboard/Content/routes/Sandboxes/useFilteredItems.ts
index e4145f626d2..fb5f912c6f6 100644
--- a/packages/app/src/app/pages/Dashboard/Content/routes/Sandboxes/useFilteredItems.ts
+++ b/packages/app/src/app/pages/Dashboard/Content/routes/Sandboxes/useFilteredItems.ts
@@ -8,6 +8,8 @@ import {
   DashboardSkeletonRow,
 } from 'app/pages/Dashboard/types';
 
+import { getParentPath, normalizePath } from '../../../utils/path';
+
 const skeletonRow = {
   type: 'skeleton-row' as 'skeleton-row',
 };
@@ -36,10 +38,10 @@ export const useFilteredItems = (
 
   useEffect(() => {
     const sandboxesForPath = getFilteredSandboxes(folderSandboxes || []);
-    const parent = path.split('/').pop();
+    const normalizedPath = normalizePath(path);
     const folderFolders =
       allCollections?.filter(
-        collection => collection.level === level && collection.parent === parent
+        collection => getParentPath(collection.path) === normalizedPath
       ) || [];
 
     const sortedFolders = orderBy(folderFolders, 'name').sort(a => 1);
diff --git a/packages/app/src/app/pages/Dashboard/Sidebar/NestableRowItem.tsx b/packages/app/src/app/pages/Dashboard/Sidebar/NestableRowItem.tsx
index 64ca9e2dbcd..dadf74f39ad 100644
--- a/packages/app/src/app/pages/Dashboard/Sidebar/NestableRowItem.tsx
+++ b/packages/app/src/app/pages/Dashboard/Sidebar/NestableRowItem.tsx
@@ -27,6 +27,7 @@ import {
 } from './utils';
 import { NEW_FOLDER_ID } from './constants';
 import { RowItem } from './RowItem';
+import { getParentPath } from '../utils/path';
 
 interface NestableRowItemProps {
   name: string;
@@ -110,7 +111,7 @@ export const NestableRowItem: React.FC<NestableRowItemProps> = ({
     });
   } else {
     subFolders = folders.filter(folder => {
-      const parentPath = folder.path.split('/').slice(0, -1).join('/');
+      const parentPath = getParentPath(folder.path);
 
       return parentPath === folderPath;
     });
diff --git a/packages/app/src/app/pages/Dashboard/utils/path.ts b/packages/app/src/app/pages/Dashboard/utils/path.ts
new file mode 100644
index 00000000000..88e6786ef90
--- /dev/null
+++ b/packages/app/src/app/pages/Dashboard/utils/path.ts
@@ -0,0 +1,17 @@
+export function getParentPath(path: string) {
+  if (path === '/' || path === '') {
+    return '/';
+  }
+
+  const split = path.split('/');
+  split.pop();
+
+  return split.join('/');
+}
+
+export function normalizePath(path: string) {
+  if (!path.startsWith('/')) {
+    return '/' + path;
+  }
+  return path;
+}