Merge branch 'main' into spalmurray/otherci-onboarding-refactor

package.json

@@ -44,7 +44,7 @@
     "@hookform/resolvers": "^2.8.5",
     "@radix-ui/react-accordion": "^1.1.2",
     "@radix-ui/react-popover": "^1.0.6",
-    "@sentry/react": "^8.0.0-beta.3",
+    "@sentry/react": "^8.0.0-beta.4",
     "@stripe/react-stripe-js": "^1.7.2",
     "@stripe/stripe-js": "^1.52.1",
     "@tanstack/react-query": "^4.29.5",

src/pages/AccountSettings/tabs/Admin/ManageAdminCard/AdminTable/AdminTable.tsx

@@ -60,7 +60,7 @@ const columns = [
 ]
 
 function getOrderingDirection(sorting: Array<{ id: string; desc: boolean }>) {
-  const state = sorting.at(0)
+  const state = sorting[0]
   return state ? (state.desc ? `-${state.id}` : state.id) : undefined
 }
 

src/pages/AnalyticsPage/Chart/Chart.jsx

@@ -2,6 +2,7 @@ import { format } from 'date-fns'
 import PropTypes from 'prop-types'
 
 import CoverageAreaChart from 'ui/CoverageAreaChart'
+import Icon from 'ui/Icon'
 
 import { useCoverage } from './useCoverage'
 
@@ -36,15 +37,21 @@ function Chart({ params }) {
   })
 
   return (
-    <CoverageAreaChart
-      axisLabelFunc={data?.coverageAxisLabel}
-      data={data?.coverage}
-      title={`${repos?.join(', ')} coverage chart`}
-      desc={desc}
-      renderAreaChart={isPreviousData || isSuccess}
-      aproxWidth={260.5}
-      aproxHeight={47.5}
-    />
+    <>
+      <p className="flex items-center gap-1 self-end text-sm text-ds-gray-senary">
+        <Icon name="informationCircle" size="sm" />
+        Data is average of selected repos
+      </p>
+      <CoverageAreaChart
+        axisLabelFunc={data?.coverageAxisLabel}
+        data={data?.coverage}
+        title={`${repos?.join(', ')} coverage chart`}
+        desc={desc}
+        renderAreaChart={isPreviousData || isSuccess}
+        aproxWidth={260.5}
+        aproxHeight={47.5}
+      />
+    </>
   )
 }
 

src/pages/AnalyticsPage/Chart/Chart.spec.jsx

@@ -32,7 +32,7 @@ describe('Analytics coverage chart', () => {
       measurements: [
         {
           timestamp: '2020-01-01T00:00:00Z',
-          max: 91.11,
+          avg: 91.11,
         },
       ],
     },
@@ -43,11 +43,11 @@ describe('Analytics coverage chart', () => {
       measurements: [
         {
           timestamp: '2020-01-01T00:00:00Z',
-          max: 90.0,
+          avg: 90.0,
         },
         {
           timestamp: '2021-01-01T00:00:00Z',
-          max: 91.11,
+          avg: 91.11,
         },
       ],
     },
@@ -65,7 +65,10 @@ describe('Analytics coverage chart', () => {
         }
 
         return res(ctx.status(200), ctx.data(mockDataPoints))
-      })
+      }),
+      graphql.query('OwnerTier', (req, res, ctx) =>
+        res(ctx.status(200), ctx.data({ owner: { tier: 'pro' } }))
+      )
     )
   }
 
@@ -88,12 +91,29 @@ describe('Analytics coverage chart', () => {
       const message = await screen.findByTitle('coverage chart')
       expect(message).toBeInTheDocument()
     })
+
+    it('renders data label', async () => {
+      setup({ hasNoData: true })
+      render(
+        <Chart
+          params={{
+            startDate: '2020-01-15',
+            endDate: '2020-01-19',
+          }}
+        />,
+        {
+          wrapper,
+        }
+      )
+
+      const label = await screen.findByText(/Data is average of selected repos/)
+      expect(label).toBeInTheDocument()
+    })
   })
 
   describe('One data point', () => {
     it('Not enough data to render', async () => {
       setup({ hasSingleData: true })
-
       render(
         <Chart
           params={{
@@ -110,6 +130,25 @@ describe('Analytics coverage chart', () => {
       const message = await screen.findByText(/Not enough data to render/)
       expect(message).toBeInTheDocument()
     })
+
+    it('renders data label', async () => {
+      setup({ hasSingleData: true })
+      render(
+        <Chart
+          params={{
+            startDate: '2020-01-15',
+            endDate: '2020-01-19',
+            repositories: [],
+          }}
+        />,
+        {
+          wrapper,
+        }
+      )
+
+      const label = await screen.findByText(/Data is average of selected repos/)
+      expect(label).toBeInTheDocument()
+    })
   })
 
   describe('Chart with data', () => {
@@ -154,5 +193,24 @@ describe('Analytics coverage chart', () => {
       )
       expect(message).toBeInTheDocument()
     })
+
+    it('renders data label', async () => {
+      setup({ hasNoData: false, hasSingleData: false })
+      render(
+        <Chart
+          params={{
+            startDate: '2020-01-15',
+            endDate: '2020-01-19',
+            repositories: ['api', 'frontend'],
+          }}
+        />,
+        {
+          wrapper,
+        }
+      )
+
+      const label = await screen.findByText(/Data is average of selected repos/)
+      expect(label).toBeInTheDocument()
+    })
   })
 })

src/pages/AnalyticsPage/Chart/useCoverage.js

@@ -28,14 +28,14 @@ export const useCoverage = ({ params, options = {} }) => {
     isPublic: shouldDisplayPublicReposOnly,
     opts: {
       select: (data) => {
-        if (data?.measurements?.[0]?.max === null) {
-          data.measurements[0].max = 0
+        if (data?.measurements?.[0]?.avg === null) {
+          data.measurements[0].avg = 0
         }
 
         // set prevPercent so we can reuse value if next value is null
         let prevPercent = data?.measurements?.[0]
         const coverage = data?.measurements?.map((measurement) => {
-          let coverage = measurement?.max ?? prevPercent
+          let coverage = measurement?.avg ?? prevPercent
 
           // can save on a few reassignments
           if (prevPercent !== coverage) {

src/pages/AnalyticsPage/Chart/useCoverage.spec.js

@@ -15,23 +15,23 @@ const mockRepoMeasurements = {
     measurements: [
       {
         timestamp: '2023-01-01T00:00:00+00:00',
-        max: 85,
+        avg: 85,
       },
       {
         timestamp: '2023-01-02T00:00:00+00:00',
-        max: 80,
+        avg: 80,
       },
       {
         timestamp: '2023-01-02T00:00:00+00:00',
-        max: null,
+        avg: null,
       },
       {
         timestamp: '2023-01-03T00:00:00+00:00',
-        max: 80,
+        avg: 80,
       },
       {
         timestamp: '2023-01-04T00:00:00+00:00',
-        max: 95,
+        avg: 95,
       },
     ],
   },
@@ -42,11 +42,11 @@ const mockNullFirstValRepoMeasurements = {
     measurements: [
       {
         timestamp: '2023-01-01T00:00:00+00:00',
-        max: null,
+        avg: null,
       },
       {
         timestamp: '2023-01-02T00:00:00+00:00',
-        max: 80,
+        avg: 80,
       },
     ],
   },
@@ -57,7 +57,7 @@ const mockPublicRepoMeasurements = {
     measurements: [
       {
         timestamp: '2023-01-02T00:00:00+00:00',
-        max: 80,
+        avg: 80,
       },
     ],
   },

src/pages/CommitDetailPage/CommitCoverage/routes/FilesChangedTab/FilesChangedTable/FilesChangedTable.tsx

@@ -34,7 +34,7 @@ const isNumericValue = (value: string) =>
   value === 'patchPercentage' || value === 'head' || value === 'change'
 
 function getFilter(sorting: Array<{ id: string; desc: boolean }>) {
-  const state = sorting.at(0)
+  const state = sorting[0]
 
   if (state) {
     const direction = state?.desc

src/pages/CommitDetailPage/CommitCoverage/routes/FilesChangedTab/FilesChangedTableTeam/FilesChangedTableTeam.tsx

@@ -34,7 +34,7 @@ const isNumericColumn = (cellId: string) =>
   cellId === 'missedLines' || cellId === 'patchPercentage'
 
 export function getFilter(sorting: Array<{ id: string; desc: boolean }>) {
-  const state = sorting.at(0)
+  const state = sorting[0]
 
   if (state) {
     const direction = state?.desc

src/pages/MembersPage/MembersList/MembersTable/MembersTable.tsx

@@ -138,7 +138,7 @@ function LoadMoreTrigger({
 }
 
 function getOrderingDirection(sorting: Array<{ id: string; desc: boolean }>) {
-  const state = sorting.at(0)
+  const state = sorting[0]
   return state ? (state.desc ? `-${state.id}` : state.id) : undefined
 }
 

src/pages/OwnerPage/Header/HeaderBanners/GithubConfigBanner/GithubConfigBanner.jsx

@@ -20,14 +20,17 @@ const GithubConfigBanner = () => {
             Configure{' '}
             <A
               data-testid="codecovGithubApp-link"
-              to={{ pageName: 'codecovGithubApp' }}
+              to={{ pageName: 'codecovGithubAppSelectTarget' }}
             >
               Codecov&apos;s GitHub app
             </A>
           </h2>
         </BannerHeading>
         <BannerContent>
-          <p>Codecov will use the integration to post statuses and comments.</p>
+          <p>
+            Enable status posts, comments, improved rate limit handling, and
+            private repo management.
+          </p>
         </BannerContent>
       </Banner>
     </div>

src/pages/OwnerPage/Header/HeaderBanners/GithubConfigBanner/GithubConfigBanner.spec.jsx

@@ -30,7 +30,7 @@ describe('GithubConfigBanner', () => {
       })
 
       const body = screen.queryByText(
-        /Codecov will use the integration to post statuses and comments./
+        /Enable status posts, comments, improved rate limit handling, and private repo management./
       )
       expect(body).toBeInTheDocument()
     })
@@ -50,7 +50,7 @@ describe('GithubConfigBanner', () => {
       })
 
       const body = screen.queryByText(
-        /Codecov will use the integration to post statuses and comments./
+        /Enable status posts, comments, improved rate limit handling, and private repo management./
       )
       expect(body).not.toBeInTheDocument()
     })

src/pages/PullRequestPage/PullCoverage/routes/ComponentsTab/ComponentsTable.spec.jsx

@@ -57,6 +57,9 @@ const mockPull = {
             },
           ],
         },
+        head: {
+          branchName: 'abc',
+        },
       },
     },
   },

src/pages/PullRequestPage/PullCoverage/routes/ComponentsTab/ComponentsTable.tsx

@@ -10,6 +10,7 @@ import qs, { type ParsedQs } from 'qs'
 import { useMemo } from 'react'
 import { useLocation } from 'react-router-dom'
 
+import A from 'ui/A'
 import Spinner from 'ui/Spinner'
 import TotalsNumber from 'ui/TotalsNumber'
 
@@ -132,7 +133,17 @@ export default function ComponentsTable() {
 
   return (
     <>
-      <div className="my-2 flex flex-row-reverse">
+      <div className="flex w-full items-center justify-between px-5 py-2">
+        <A
+          hook="components"
+          to={{
+            pageName: 'componentsTab',
+            options: { branch: data?.pull?.head?.branchName },
+          }}
+          isExternal
+        >
+          View components over time
+        </A>
         <ComponentsSelector />
       </div>
       <div className="tableui">

src/pages/PullRequestPage/PullCoverage/routes/ComponentsTab/hooks/query.ts

@@ -40,6 +40,9 @@ export const query = `
                 message
               }
             }
+            head {
+              branchName
+            }
           }
         }
         ... on NotFoundError {

src/pages/PullRequestPage/PullCoverage/routes/ComponentsTab/hooks/useComponentComparison.spec.tsx

@@ -28,6 +28,9 @@ const mockResponse = {
             },
           ],
         },
+        head: {
+          branchName: 'abc',
+        },
       },
     },
   },
@@ -139,6 +142,9 @@ describe('useComponentComparison', () => {
                   },
                 ],
               },
+              head: {
+                branchName: 'abc',
+              },
             },
           })
         )

src/pages/PullRequestPage/PullCoverage/routes/ComponentsTab/hooks/useComponentComparison.tsx

@@ -51,6 +51,11 @@ const RepositorySchema = z.object({
         MissingHeadCommitSchema,
         MissingHeadReportSchema,
       ]),
+      head: z
+        .object({
+          branchName: z.string().nullable(),
+        })
+        .nullable(),
     })
     .nullable(),
 })