fix: Move Sunburst logic from recursion to stack based (#3206)

codecov · Sep 18, 2024 · aab98e2 · aab98e2
1 parent 1e8c05a
commit aab98e2
Show file tree

Hide file tree

Showing 2 changed files with 38 additions and 9 deletions.
diff --git a/src/pages/RepoPage/CoverageTab/OverviewTab/OverviewTab.tsx b/src/pages/RepoPage/CoverageTab/OverviewTab/OverviewTab.tsx
@@ -20,6 +20,8 @@ const FileExplorer = lazy(() => import('./subroute/FileExplorer'))
 const CoverageChart = lazy(() => import('./subroute/CoverageChart'))
 const Sunburst = lazy(() => import('./subroute/Sunburst'))
 
+const MAX_FILE_COUNT = 200_000
+
 const Loader = () => (
   <div className="flex items-center justify-center py-16">
     <Spinner />
@@ -50,9 +52,12 @@ function CoverageOverviewTab() {
     branch: branch,
   })
 
-  let displaySunburst = false
   const fileCount = data?.branch?.head?.totals?.fileCount
-  if (typeof fileCount === 'number' && fileCount <= 200_000) {
+  const withinFileCount =
+    typeof fileCount === 'number' && fileCount <= MAX_FILE_COUNT
+
+  let displaySunburst = false
+  if (withinFileCount) {
     displaySunburst = true
   }
 

diff --git a/src/ui/SunburstChart/SunburstChart.jsx b/src/ui/SunburstChart/SunburstChart.jsx
@@ -48,15 +48,39 @@ function SunburstChart({
     // Tracks previous location for rendering .. in the breadcrumb.
     let previous
 
-    const selectorMutate = (node) => {
-      if (Array.isArray(node.children)) {
-        return {
-          ...node,
-          value: selectorHandler.current(node),
-          children: node.children.map((child) => selectorMutate(child)),
+    // const selectorMutate = (node) => {
+    //   if (Array.isArray(node.children)) {
+    //     return {
+    //       ...node,
+    //       value: selectorHandler.current(node),
+    //       children: node.children.map((child) => selectorMutate(child)),
+    //     }
+    //   }
+
+    //   return { ...node, value: selectorHandler.current(node) }
+    // }
+
+    const selectorMutate = (rootNode) => {
+      const stack = [rootNode]
+      const result = { ...rootNode, value: selectorHandler.current(rootNode) }
+      const nodeMap = new Map()
+      nodeMap.set(rootNode, result)
+
+      while (stack.length > 0) {
+        const node = stack.pop()
+        const currentNode = nodeMap.get(node)
+
+        if (Array.isArray(node.children)) {
+          currentNode.children = node.children.map((child) => {
+            const newChild = { ...child, value: selectorHandler.current(child) }
+            nodeMap.set(child, newChild)
+            stack.push(child)
+            return newChild
+          })
         }
       }
-      return { ...node, value: selectorHandler.current(node) }
+
+      return result
     }
 
     // Process data for use in D3