feat: add all branches option to TA branch selector

we want to allow users to not filter by any specific branch and
aggregate the results from all branches

we also want to make this the default option when users land on the
tests tab from now on

i'm putting this behind a feature flag because the backend is not
capable of serving this data yet since it relies on the TA timescale
data migration

Author: joseph-sentry

src/pages/RepoPage/FailedTestsTab/FailedTestsPage/FailedTestsTable/FailedTestsTable.test.tsx

@@ -24,6 +24,19 @@ vi.mock('../TableHeader/TableHeader', () => ({
   default: () => 'Table Header',
 }))
 
+const mocks = vi.hoisted(() => ({
+  useFlags: vi.fn(() => ({ allBranchesEnabled: false })),
+}))
+
+vi.mock('shared/featureFlags', async () => {
+  const actual = await vi.importActual('shared/featureFlags')
+
+  return {
+    ...actual,
+    useFlags: mocks.useFlags,
+  }
+})
+
 const node1 = {
   updatedAt: '2023-01-01T00:00:00Z',
   name: 'test-1',
@@ -139,7 +152,12 @@ interface SetupArgs {
   isFirstPullRequest?: boolean
 }
 
-describe('FailedTestsTable', () => {
+describe.each([true, false])('FailedTestsTable', (allBranchesEnabled) => {
+  beforeEach(() => {
+    queryClient.clear()
+    mocks.useFlags.mockReturnValue({ allBranchesEnabled })
+  })
+
   function setup({
     noEntries = false,
     planValue = Plans.USERS_ENTERPRISEM,

src/pages/RepoPage/FailedTestsTab/FailedTestsPage/FailedTestsTable/FailedTestsTable.tsx

@@ -14,6 +14,7 @@ import { useInView } from 'react-intersection-observer'
 import { useLocation, useParams } from 'react-router-dom'
 
 import { MeasurementInterval } from 'pages/RepoPage/shared/constants'
+import { ALL_BRANCHES } from 'services/navigation/useNavLinks'
 import { formatTimeToNow } from 'shared/utils/dates'
 import Icon from 'ui/Icon'
 import Spinner from 'ui/Spinner'
@@ -226,7 +227,8 @@ const FailedTestsTable = () => {
     },
   })
 
-  const isDefaultBranch = testData?.defaultBranch === branch
+  const isDefaultBranch =
+    testData?.defaultBranch === branch || ALL_BRANCHES === branch
   const isTeamOrFreePlan = testData?.isTeamPlan || testData?.isFreePlan
   // Only show flake rate column when on default branch for pro / enterprise plans or public repos
   const hideFlakeRate =
@@ -308,7 +310,8 @@ const FailedTestsTable = () => {
         <div className="mt-4 text-center text-ds-gray-quinary">
           <p>No data yet</p>
           <p>
-            To see data for the main branch, merge your PR into the main branch.
+            To see data for the {testData?.defaultBranch} branch, merge your PR
+            into the {testData?.defaultBranch} branch.
           </p>
         </div>
       </div>

src/pages/RepoPage/FailedTestsTab/FailedTestsPage/MetricsSection/MetricsSection.test.tsx

@@ -12,6 +12,15 @@ import MetricsSection, { historicalTrendToCopy } from './MetricsSection'
 
 import { TestResultsFilterParameter } from '../hooks/useInfiniteTestResults/useInfiniteTestResults'
 
+vi.mock('shared/featureFlags', async () => {
+  const actual = await vi.importActual('shared/featureFlags')
+
+  return {
+    ...actual,
+    useFlags: vi.fn(() => ({ allBranchesEnabled: false })),
+  }
+})
+
 const mockAggResponse = (
   planValue: PlanName = Plans.USERS_ENTERPRISEM,
   isPrivate = false
@@ -148,11 +157,14 @@ describe('MetricsSection', () => {
     })
   })
 
-  describe('when on default branch', () => {
+  describe.each([
+    ['default branch', 'main'],
+    ['all branches', 'All%20branches'],
+  ])('when on %s', (_, encodedBranch) => {
     it('renders subheaders', async () => {
       setup()
       render(<MetricsSection />, {
-        wrapper: wrapper('/gh/owner/repo/tests/main'),
+        wrapper: wrapper(`/gh/owner/repo/tests/${encodedBranch}`),
       })
 
       const runEfficiency = await screen.findByText('Improve CI Run Efficiency')
@@ -164,7 +176,7 @@ describe('MetricsSection', () => {
     it('renders total test runtime card', async () => {
       setup()
       render(<MetricsSection />, {
-        wrapper: wrapper('/gh/owner/repo/tests/main'),
+        wrapper: wrapper(`/gh/owner/repo/tests/${encodedBranch}`),
       })
 
       const title = await screen.findByText('Total test run time')
@@ -182,7 +194,7 @@ describe('MetricsSection', () => {
       it('renders slowest tests card', async () => {
         setup()
         render(<MetricsSection />, {
-          wrapper: wrapper('/gh/owner/repo/tests/main'),
+          wrapper: wrapper(`/gh/owner/repo/tests/${encodedBranch}`),
         })
 
         const title = await screen.findByText('Slowest tests')
@@ -199,7 +211,7 @@ describe('MetricsSection', () => {
       it('can update the location params on button click', async () => {
         const { user } = setup()
         render(<MetricsSection />, {
-          wrapper: wrapper('/gh/owner/repo/tests/main'),
+          wrapper: wrapper(`/gh/owner/repo/tests/${encodedBranch}`),
         })
         const select = await screen.findByText('12')
         expect(select).toBeInTheDocument()
@@ -217,7 +229,7 @@ describe('MetricsSection', () => {
       it('removes the location param on second button click', async () => {
         const { user } = setup()
         render(<MetricsSection />, {
-          wrapper: wrapper('/gh/owner/repo/tests/main'),
+          wrapper: wrapper(`/gh/owner/repo/tests/${encodedBranch}`),
         })
         const select = await screen.findByText('12')
         expect(select).toBeInTheDocument()
@@ -239,7 +251,7 @@ describe('MetricsSection', () => {
       it('renders total flaky tests card', async () => {
         setup()
         render(<MetricsSection />, {
-          wrapper: wrapper('/gh/owner/repo/tests/main'),
+          wrapper: wrapper(`/gh/owner/repo/tests/${encodedBranch}`),
         })
 
         const title = await screen.findByText('Flaky tests')
@@ -256,7 +268,7 @@ describe('MetricsSection', () => {
       it('can update the location params on button click', async () => {
         const { user } = setup()
         render(<MetricsSection />, {
-          wrapper: wrapper('/gh/owner/repo/tests/main'),
+          wrapper: wrapper(`/gh/owner/repo/tests/${encodedBranch}`),
         })
         const select = await screen.findByText(88)
         expect(select).toBeInTheDocument()
@@ -274,7 +286,7 @@ describe('MetricsSection', () => {
       it('removes the location param on second button click', async () => {
         const { user } = setup()
         render(<MetricsSection />, {
-          wrapper: wrapper('/gh/owner/repo/tests/main'),
+          wrapper: wrapper(`/gh/owner/repo/tests/${encodedBranch}`),
         })
         const select = await screen.findByText(88)
         expect(select).toBeInTheDocument()
@@ -313,7 +325,7 @@ describe('MetricsSection', () => {
       it('renders total failures card', async () => {
         setup()
         render(<MetricsSection />, {
-          wrapper: wrapper('/gh/owner/repo/tests/main'),
+          wrapper: wrapper(`/gh/owner/repo/tests/${encodedBranch}`),
         })
 
         const title = await screen.findByText('Cumulative Failures')
@@ -330,7 +342,7 @@ describe('MetricsSection', () => {
       it('can update the location params on button click', async () => {
         const { user } = setup()
         render(<MetricsSection />, {
-          wrapper: wrapper('/gh/owner/repo/tests/main'),
+          wrapper: wrapper(`/gh/owner/repo/tests/${encodedBranch}`),
         })
         const select = await screen.findByText(1)
         expect(select).toBeInTheDocument()
@@ -370,7 +382,7 @@ describe('MetricsSection', () => {
       it('renders total skips card', async () => {
         setup()
         render(<MetricsSection />, {
-          wrapper: wrapper('/gh/owner/repo/tests/main'),
+          wrapper: wrapper(`/gh/owner/repo/tests/${encodedBranch}`),
         })
 
         const title = await screen.findByText('Skipped tests')
@@ -387,7 +399,7 @@ describe('MetricsSection', () => {
       it('can update the location params on button click', async () => {
         const { user } = setup()
         render(<MetricsSection />, {
-          wrapper: wrapper('/gh/owner/repo/tests/main'),
+          wrapper: wrapper(`/gh/owner/repo/tests/${encodedBranch}`),
         })
         const select = await screen.findByText(20)
         expect(select).toBeInTheDocument()
@@ -405,7 +417,7 @@ describe('MetricsSection', () => {
       it('removes the location param on second button click', async () => {
         const { user } = setup()
         render(<MetricsSection />, {
-          wrapper: wrapper('/gh/owner/repo/tests/main'),
+          wrapper: wrapper(`/gh/owner/repo/tests/${encodedBranch}`),
         })
         const select = await screen.findByText(20)
         expect(select).toBeInTheDocument()

src/pages/RepoPage/FailedTestsTab/FailedTestsPage/MetricsSection/MetricsSection.tsx

@@ -3,6 +3,7 @@ import { useLocation, useParams } from 'react-router-dom'
 
 import { MeasurementInterval } from 'pages/RepoPage/shared/constants'
 import { useLocationParams } from 'services/navigation/useLocationParams'
+import { ALL_BRANCHES } from 'services/navigation/useNavLinks'
 import { cn } from 'shared/utils/cn'
 import { formatTimeFromSeconds } from 'shared/utils/dates'
 import Badge from 'ui/Badge'
@@ -379,7 +380,10 @@ function MetricsSection() {
   const decodedBranch = getDecodedBranch(branch)
   const selectedBranch = decodedBranch ?? testResults?.defaultBranch ?? ''
 
-  if (selectedBranch !== testResults?.defaultBranch) {
+  if (
+    selectedBranch !== testResults?.defaultBranch &&
+    selectedBranch !== ALL_BRANCHES
+  ) {
     return null
   }