From be9dc76940bfb6300dc9420e67f1879f4bb75f68 Mon Sep 17 00:00:00 2001
From: Mantvydas Deltuva <mantvydasdeltuva@gmail.com>
Date: Sun, 8 Sep 2024 00:38:45 +0300
Subject: [PATCH] MDE/PKFE-31 updated workspace provider for file tree array

---
 .../stores/workspaceContextProvider.tsx       | 10 +++++--
 .../src/features/editor/utils/helpers.tsx     | 26 ++++++++++++++++++-
 .../src/features/editor/utils/index.ts        |  2 +-
 3 files changed, 34 insertions(+), 4 deletions(-)

diff --git a/app/front-end/src/features/editor/stores/workspaceContextProvider.tsx b/app/front-end/src/features/editor/stores/workspaceContextProvider.tsx
index 7a87392..16de5d8 100644
--- a/app/front-end/src/features/editor/stores/workspaceContextProvider.tsx
+++ b/app/front-end/src/features/editor/stores/workspaceContextProvider.tsx
@@ -1,4 +1,5 @@
 import { FileContentModel, FileModel, FilePaginationModel, FileTypes } from '@/features/editor/types';
+import { getWorkspaceArray } from '@/features/editor/utils';
 import { useSessionContext, useStatusContext } from '@/hooks';
 import { axios, socket } from '@/lib';
 import { Endpoints, Events } from '@/types';
@@ -20,6 +21,7 @@ export interface WorkspaceContextProps {
   // File tree state properties
   fileTreeIsLoading: boolean;
   fileTree: TreeViewBaseItem<FileModel>[];
+  fileTreeArray: FileModel[];
 }
 
 export const WorkspaceContext = createContext<WorkspaceContextProps>({
@@ -37,6 +39,7 @@ export const WorkspaceContext = createContext<WorkspaceContextProps>({
   // File tree state defaults
   fileTreeIsLoading: true,
   fileTree: [],
+  fileTreeArray: [],
 });
 
 interface Props {
@@ -148,6 +151,7 @@ export const WorkspaceContextProvider: React.FC<Props> = ({ children }) => {
   // File tree state
   const [fileTreeIsLoading, setFileTreeIsLoading] = useState(true);
   const [fileTree, setFileTree] = useState<TreeViewBaseItem<FileModel>[]>([]);
+  const [fileTreeArray, setFileTreeArray] = useState<FileModel[]>([]);
 
   const { blockedStateUpdate } = useStatusContext();
 
@@ -157,6 +161,7 @@ export const WorkspaceContextProvider: React.FC<Props> = ({ children }) => {
     try {
       const response = await axios.get(Endpoints.WORKSPACE);
       setFileTree(response.data);
+      setFileTreeArray(getWorkspaceArray(response.data));
     } catch (error) {
       console.error('Failed to fetch workspace data:', error);
     } finally {
@@ -192,8 +197,9 @@ export const WorkspaceContextProvider: React.FC<Props> = ({ children }) => {
     filesHistory,
     filesHistoryStateUpdate,
 
-    fileTreeIsLoading: fileTreeIsLoading,
-    fileTree: fileTree,
+    fileTreeIsLoading,
+    fileTree,
+    fileTreeArray,
   };
 
   return <WorkspaceContext.Provider value={WorkspaceContextValue}>{children}</WorkspaceContext.Provider>;
diff --git a/app/front-end/src/features/editor/utils/helpers.tsx b/app/front-end/src/features/editor/utils/helpers.tsx
index 6b4db62..c0263bb 100644
--- a/app/front-end/src/features/editor/utils/helpers.tsx
+++ b/app/front-end/src/features/editor/utils/helpers.tsx
@@ -1,6 +1,6 @@
+import { FileModel, FileTreeViewItemProps, FileTypes } from '@/features/editor/types';
 import { Article as ArticleIcon, FolderRounded, InsertDriveFile as InsertDriveFileIcon } from '@mui/icons-material';
 import { TreeViewBaseItem } from '@mui/x-tree-view';
-import { FileTreeViewItemProps, FileTypes } from '../types';
 
 export const isExpandable = (reactChildren: React.ReactNode) => {
   if (Array.isArray(reactChildren)) {
@@ -66,3 +66,27 @@ export const getFileExtension = (filename: string): string => {
   const dotIndex = filename.lastIndexOf('.');
   return dotIndex !== -1 ? filename.substring(dotIndex + 1).toLowerCase() : '';
 };
+
+export const getWorkspaceArray = (fileTreeView: TreeViewBaseItem<FileTreeViewItemProps>[]): FileModel[] => {
+  const workspaceArray: FileModel[] = [];
+  fileTreeView.sort((a, b) => {
+    if (a.fileType === FileTypes.FOLDER || b.fileType === FileTypes.FOLDER) {
+      if (a.fileType === b.fileType) {
+        return a.id.localeCompare(b.id);
+      }
+
+      return a.fileType === FileTypes.FOLDER ? 1 : -1;
+    }
+
+    return a.id.localeCompare(b.id);
+  });
+
+  for (const item of fileTreeView) {
+    workspaceArray.push({ id: item.id, label: item.label, type: item.fileType });
+    if (item.children && item.children.length !== 0) {
+      workspaceArray.push(...getWorkspaceArray(item.children));
+    }
+  }
+
+  return workspaceArray;
+};
diff --git a/app/front-end/src/features/editor/utils/index.ts b/app/front-end/src/features/editor/utils/index.ts
index 76178c3..acd3fe7 100644
--- a/app/front-end/src/features/editor/utils/index.ts
+++ b/app/front-end/src/features/editor/utils/index.ts
@@ -1 +1 @@
-export { doesFileExist, findUniqueFileName, getFileExtension, getIconFromFileType, isExpandable } from './helpers';
+export { doesFileExist, findUniqueFileName, getFileExtension, getIconFromFileType, isExpandable, getWorkspaceArray } from './helpers';