Merge branch 'main' into chore-update-layouts-footer-tests

src/pages/DefaultOrgSelector/DefaultOrgSelector.jsx

@@ -47,7 +47,7 @@ const renderItem = ({ item }) => {
   if (item?.isProvider) {
     return (
       <div className="flex h-8 items-center gap-2">
-        <A pathname={{ pageName: 'codecovAppInstallation' }}>
+        <A to={{ pageName: 'codecovAppInstallation' }}>
           <Icon name="plus-circle" />
           <span>Install Codecov GitHub app</span>
         </A>

src/pages/DefaultOrgSelector/DefaultOrgSelector.spec.jsx

@@ -330,8 +330,8 @@ describe('DefaultOrgSelector', () => {
       const selfOrg = screen.getByRole('option', { name: 'Rula' })
       expect(selfOrg).toBeInTheDocument()
 
-      const addNewOrg = screen.getByRole('option', {
-        name: 'plus-circle.svg Install Codecov GitHub app',
+      const addNewOrg = screen.getByRole('link', {
+        name: 'plus-circle.svg Install Codecov GitHub app external-link.svg',
       })
       expect(addNewOrg).toBeInTheDocument()
     })
@@ -378,8 +378,8 @@ describe('DefaultOrgSelector', () => {
       const selfOrg = screen.queryByRole('option', { name: 'janedoe' })
       expect(selfOrg).not.toBeInTheDocument()
 
-      const addNewOrg = screen.getByRole('option', {
-        name: 'plus-circle.svg Install Codecov GitHub app',
+      const addNewOrg = screen.getByRole('link', {
+        name: 'plus-circle.svg Install Codecov GitHub app external-link.svg',
       })
       expect(addNewOrg).toBeInTheDocument()
     })
@@ -417,8 +417,8 @@ describe('DefaultOrgSelector', () => {
       const noOrgsFound = screen.getByText(/No organizations found/)
       expect(noOrgsFound).toBeInTheDocument()
 
-      const addNewOrg = screen.getByRole('option', {
-        name: 'plus-circle.svg Install Codecov GitHub app',
+      const addNewOrg = screen.getByRole('link', {
+        name: 'plus-circle.svg Install Codecov GitHub app external-link.svg',
       })
       expect(addNewOrg).toBeInTheDocument()
     })
@@ -458,8 +458,8 @@ describe('DefaultOrgSelector', () => {
       const orgInList = screen.getByRole('option', { name: 'criticalRole' })
       expect(orgInList).toBeInTheDocument()
 
-      const addNewOrg = screen.queryByRole('option', {
-        name: 'plus-circle.svg Install Codecov GitHub app',
+      const addNewOrg = screen.queryByRole('link', {
+        name: 'plus-circle.svg Install Codecov GitHub app external-link.svg',
       })
       expect(addNewOrg).not.toBeInTheDocument()
     })
@@ -496,8 +496,8 @@ describe('DefaultOrgSelector', () => {
 
       await user.click(selectOrg)
 
-      const addNewOrg = screen.getByRole('option', {
-        name: 'plus-circle.svg Install Codecov GitHub app',
+      const addNewOrg = screen.getByRole('link', {
+        name: 'plus-circle.svg Install Codecov GitHub app external-link.svg',
       })
 
       await user.click(addNewOrg)

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
   }
 

src/ui/A/A.jsx

@@ -30,7 +30,10 @@ const variantClasses = {
   configure: `rounded bg-ds-blue-default px-4 py-1 font-semibold text-ds-gray-primary dark:text-white dark:bg-ds-blue-nonary`,
 }
 
-const getHostnameFromRegex = (url) => {
+export const getHostnameFromRegex = (url) => {
+  if (!url) {
+    return 'app.codecov.io'
+  }
   // run against regex
   const matches = url.match(/^https?:\/\/([^/?#]+)(?:[/?#]|$)/i)
   // extract hostname (will be null if no match is found)

src/ui/A/A.spec.jsx

@@ -1,7 +1,7 @@
 import { render, screen } from '@testing-library/react'
 import { MemoryRouter } from 'react-router-dom'
 
-import A from '.'
+import A, { getHostnameFromRegex } from './A'
 
 describe('A', () => {
   function setup(props = {}) {
@@ -10,6 +10,17 @@ describe('A', () => {
     })
   }
 
+  describe('hostnameWithoutRegex', () => {
+    it('returns to home if no url passed', () => {
+      expect(getHostnameFromRegex(undefined)).toBe('app.codecov.io')
+    })
+    it('scrubs URL if one exists', () => {
+      expect(getHostnameFromRegex('https://app.codecov.io')).toBe(
+        'app.codecov.io'
+      )
+    })
+  })
+
   describe('when rendered with the prop `to`', () => {
     beforeEach(() => {
       setup({

src/ui/CodeRenderer/CodeRendererProgressHeader/CodeRendererProgressHeader.jsx

@@ -12,7 +12,7 @@ function CodeRendererProgressHeader({ path, fileCoverage, change }) {
    * Header component that shows progress bar for the Code Renderer component.
    * @param {[String]} treePaths path of file from root directory. Only used in standalone file viewer
    * @param {Float} fileCoverage total coverage of current file
-   * @param {Float} change difference between head and base coverage. Only used in commmit based file viewer
+   * @param {Float} change difference between head and base coverage. Only used in commit based file viewer
    */
 
   const isUnsupportedFileType = unsupportedExtensionsMapper({ path })

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