HPCC-32424 ECL Watch v9 Source Files default sorting

changes the default sorting of files listed on the Source Files tab of the Workunit Details page, such that subfiles immediately follow their respective superfiles Signed-off-by: Jeremy Clements <[email protected]>
hpcc-systems · Aug 21, 2024 · 3924908 · 3924908
1 parent 44f7563
commit 3924908
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 9 deletions.
diff --git a/esp/src/src-react/components/SourceFiles.tsx b/esp/src/src-react/components/SourceFiles.tsx
@@ -25,7 +25,7 @@ interface SourceFilesProps {
 }
 
 const emptyFilter: { [id: string]: any } = {};
-const defaultSort = { attribute: "Name", descending: false };
+const defaultSort = { attribute: undefined, descending: false };
 
 export const SourceFiles: React.FunctionComponent<SourceFilesProps> = ({
     wuid,
@@ -52,7 +52,7 @@ export const SourceFiles: React.FunctionComponent<SourceFilesProps> = ({
                 selectorType: "checkbox"
             },
             Name: {
-                label: "Name", sortable: true,
+                label: "Name", width: 400, sortable: true,
                 formatter: (Name, row) => {
                     let fileUrl = `#/files/${Name}`;
                     if (row?.FileCluster) {
@@ -65,11 +65,8 @@ export const SourceFiles: React.FunctionComponent<SourceFilesProps> = ({
                     </>;
                 }
             },
-            FileCluster: { label: nlsHPCC.FileCluster, width: 300, sortable: false },
-            Count: {
-                label: nlsHPCC.Usage, width: 72, sortable: true,
-                justify: "right"
-            }
+            FileCluster: { label: nlsHPCC.FileCluster, width: 200, sortable: false },
+            Count: { label: nlsHPCC.Usage, width: 72, sortable: true, justify: "right" }
         };
     }, []);
 

diff --git a/esp/src/src-react/hooks/workunit.ts b/esp/src/src-react/hooks/workunit.ts
@@ -132,6 +132,21 @@ export function useWorkunitSourceFiles(wuid: string): [SourceFile[], Workunit, W
     const [sourceFiles, setSourceFiles] = React.useState<SourceFile[]>([]);
     const [count, inc] = useCounter();
 
+    // sorts the WU source files alphabetically by parent name, then name
+    // with children immediately following parents
+    const sortFiles = React.useCallback(files => {
+        const sortedFiles = [];
+        const temp = files.sort((a, b) => a.Name.localeCompare(b.Name));
+
+        temp.filter(item => item.__hpcc_parentName === "").forEach(parent => {
+            sortedFiles.push(parent);
+            const relatedChildren = temp.filter(child => child.__hpcc_parentName === parent.Name);
+            sortedFiles.push(...relatedChildren);
+        });
+
+        return sortedFiles;
+    }, []);
+
     React.useEffect(() => {
         if (workunit) {
             const fetchInfo = singletonDebounce(workunit, "fetchInfo");
@@ -151,10 +166,10 @@ export function useWorkunitSourceFiles(wuid: string): [SourceFile[], Workunit, W
                         });
                     });
                 });
-                setSourceFiles(sourceFiles);
+                setSourceFiles(sortFiles(sourceFiles));
             }).catch(err => logger.error(err));
         }
-    }, [workunit, state, count]);
+    }, [count, sortFiles, state, workunit]);
 
     return [sourceFiles, workunit, state, inc];
 }