Merge branch 'main' into chore-update-ui-toggle-element

codecov.yml

@@ -23,7 +23,7 @@ comment:
   require_changes: false
   require_base: false
   require_head: true
-  after_n_builds: 10 # ceil(number of test files / 80). See ci.yml for more details.
+  after_n_builds: 9 # ceil(number of test files / 80). See ci.yml for more details.
 
 ignore:
   - ./src/**/*.stories.js

package.json

@@ -209,7 +209,8 @@
   },
   "resolutions": {
     "react-refresh": "^0.14.0",
-    "resolve-url-loader/postcss": "8.4.31"
+    "resolve-url-loader/postcss": "8.4.31",
+    "micromatch": "^4.0.8"
   },
   "packageManager": "[email protected]",
   "engineStrict": false

src/App.tsx

@@ -21,6 +21,7 @@ import { ThemeContextProvider } from 'shared/ThemeContext'
 import AccountSettings from './pages/AccountSettings'
 import AdminSettings from './pages/AdminSettings'
 const AnalyticsPage = lazy(() => import('./pages/AnalyticsPage'))
+const CodecovAIPage = lazy(() => import('./pages/CodecovAIPage'))
 const CommitDetailPage = lazy(() => import('./pages/CommitDetailPage'))
 const EnterpriseLandingPage = lazy(() => import('pages/EnterpriseLandingPage'))
 const LoginPage = lazy(() => import('./pages/LoginPage'))
@@ -120,6 +121,11 @@ const MainAppRoutes = () => (
         <AnalyticsPage />
       </BaseLayout>
     </SentryRoute>
+    <SentryRoute path="/codecovai/:provider/:owner" exact>
+      <BaseLayout>
+        <CodecovAIPage />
+      </BaseLayout>
+    </SentryRoute>
     <SentryRoute path="/:provider" exact>
       <BaseLayout>
         <HomePageRedirect />

src/config.js

@@ -9,6 +9,7 @@ const defaultConfig = {
   SENTRY_SESSION_SAMPLE_RATE: 0.1,
   SENTRY_ERROR_SAMPLE_RATE: 1.0,
   GH_APP: 'codecov',
+  GH_APP_AI: 'codecov', // TODO: Update to proper GH app name once it is live
 }
 
 // To be removed after we're satisfied session_expiry cookie cleanup is complete

src/layouts/BaseLayout/BaseLayout.test.tsx

@@ -1,5 +1,5 @@
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
-import { cleanup, render, screen, waitFor } from '@testing-library/react'
+import { render, screen, waitFor } from '@testing-library/react'
 import { graphql, http, HttpResponse } from 'msw2'
 import { setupServer } from 'msw2/node'
 import { MemoryRouter, Route, useLocation } from 'react-router-dom'
@@ -193,7 +193,6 @@ afterEach(() => {
   queryClient.clear()
   server.resetHandlers()
   vi.clearAllMocks()
-  cleanup()
 })
 
 afterAll(() => {

src/layouts/BaseLayout/InstallationHelpBanner/InstallationHelpBanner.test.jsx

@@ -1,5 +1,5 @@
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
-import { cleanup, render, screen, waitFor } from '@testing-library/react'
+import { render, screen, waitFor } from '@testing-library/react'
 import userEvent from '@testing-library/user-event'
 import { graphql, HttpResponse } from 'msw2'
 import { setupServer } from 'msw2/node'
@@ -18,7 +18,6 @@ beforeAll(() => {
 })
 
 beforeEach(() => {
-  cleanup()
   queryClient.clear()
   server.resetHandlers()
 })

src/layouts/BaseLayout/hooks/useUserAccessGate.test.tsx

@@ -1,5 +1,5 @@
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
-import { cleanup, renderHook, waitFor } from '@testing-library/react'
+import { renderHook, waitFor } from '@testing-library/react'
 import { delay, graphql, http, HttpResponse } from 'msw2'
 import { setupServer } from 'msw2/node'
 import { MemoryRouter, Route } from 'react-router-dom'
@@ -221,7 +221,6 @@ beforeAll(() => {
 })
 
 beforeEach(() => {
-  cleanup()
   queryClient.clear()
   server.resetHandlers()
 })

src/layouts/Header/Header.test.tsx

@@ -1,5 +1,5 @@
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
-import { cleanup, render, screen } from '@testing-library/react'
+import { render, screen } from '@testing-library/react'
 import { graphql, HttpResponse } from 'msw2'
 import { setupServer } from 'msw2/node'
 import { MemoryRouter, Route } from 'react-router-dom'
@@ -9,7 +9,6 @@ import config from 'config'
 
 import { useImpersonate } from 'services/impersonate'
 import { User } from 'services/user'
-import { useFlags } from 'shared/featureFlags'
 
 import Header from './Header'
 
@@ -33,9 +32,7 @@ vi.mock('src/layouts/Header/components/ThemeToggle', () => ({
 }))
 
 vi.mock('services/impersonate')
-vi.mock('shared/featureFlags')
 const mockedUseImpersonate = useImpersonate as Mock
-const mockedUseFlags = useFlags as Mock
 
 const mockUser = {
   me: {
@@ -93,7 +90,6 @@ beforeAll(() => {
 })
 
 afterEach(() => {
-  cleanup()
   server.resetHandlers()
   queryClient.clear()
 })
@@ -117,7 +113,6 @@ type SetupArgs = {
 describe('Header', () => {
   function setup({ user = mockUser }: SetupArgs) {
     mockedUseImpersonate.mockReturnValue({ isImpersonating: false })
-    mockedUseFlags.mockReturnValue({ darkMode: false })
     server.use(
       graphql.query('CurrentUser', (info) => {
         return HttpResponse.json({ data: user })
@@ -187,21 +182,14 @@ describe('Header', () => {
       const userDropdown = await screen.findByText(/User Dropdown/)
       expect(userDropdown).toBeInTheDocument()
     })
-    it('has toggle for light/dark mode when flag on', async () => {
+
+    it('has toggle for light/dark mode', async () => {
       setup({})
-      mockedUseFlags.mockReturnValue({ darkMode: true })
       render(<Header />, { wrapper })
 
       const toggle = await screen.findByText(/Theme Toggle/)
       expect(toggle).toBeInTheDocument()
     })
-    it('has no toggle for light/dark mode when flag off', () => {
-      setup({})
-      render(<Header />, { wrapper })
-
-      const toggle = screen.queryAllByText(/Theme Toggle/)
-      expect(toggle).toEqual([])
-    })
   })
 
   describe('when on self-hosted', () => {

src/layouts/Header/Header.tsx

@@ -4,7 +4,6 @@ import config from 'config'
 
 import { useImpersonate } from 'services/impersonate'
 import { useUser } from 'services/user'
-import { useFlags } from 'shared/featureFlags'
 
 import AdminLink from './components/AdminLink'
 import GuestHeader from './components/GuestHeader'
@@ -18,10 +17,6 @@ function Header() {
   const { isImpersonating } = useImpersonate()
   const { data: currentUser } = useUser()
 
-  const { darkMode } = useFlags({
-    darkMode: false,
-  })
-
   return (
     <header>
       {!currentUser ? <GuestHeader /> : null}
@@ -44,7 +39,7 @@ function Header() {
                 </Suspense>
               </div>
             ) : null}
-            {darkMode ? <ThemeToggle /> : null}
+            <ThemeToggle />
             <HelpDropdown />
             <UserDropdown />
           </div>

src/layouts/Header/components/AdminLink/AdminLink.test.tsx

@@ -1,5 +1,5 @@
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
-import { cleanup, render, screen } from '@testing-library/react'
+import { render, screen } from '@testing-library/react'
 import { http, HttpResponse } from 'msw2'
 import { setupServer } from 'msw2/node'
 import { MemoryRouter, Route } from 'react-router-dom'
@@ -32,7 +32,6 @@ beforeAll(() => {
 })
 
 beforeEach(() => {
-  cleanup()
   server.resetHandlers()
   queryClient.clear()
 })

src/layouts/Header/components/GuestHeader/GuestHeader.test.tsx

@@ -1,18 +1,15 @@
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
-import { cleanup, render, screen } from '@testing-library/react'
+import { render, screen } from '@testing-library/react'
 import React from 'react'
 import { MemoryRouter, Route } from 'react-router-dom'
-import { type Mock } from 'vitest'
 
 import config from 'config'
 
-import { useFlags } from 'shared/featureFlags'
 import { ThemeContextProvider } from 'shared/ThemeContext'
 
 import GuestHeader from './GuestHeader'
 
 vi.mock('config')
-vi.mock('shared/featureFlags')
 
 // silence console errors
 console.error = () => {}
@@ -33,14 +30,7 @@ const wrapper: React.FC<React.PropsWithChildren> = ({ children }) => (
   </QueryClientProvider>
 )
 
-const mockedUseFlags = useFlags as Mock
-
-beforeEach(() => {
-  mockedUseFlags.mockReturnValue({ darkMode: false })
-})
-
 afterEach(() => {
-  cleanup()
   queryClient.clear()
 })
 
@@ -118,19 +108,13 @@ describe('GuestHeader', () => {
         )
       })
     })
-    it('has toggle for light/dark mode when flag on', async () => {
-      mockedUseFlags.mockReturnValueOnce({ darkMode: true })
+
+    it('has toggle for light/dark mode', async () => {
       render(<GuestHeader />, { wrapper })
 
       const toggle = await screen.findByTestId('theme-toggle')
       expect(toggle).toBeInTheDocument()
     })
-    it('has no toggle for light/dark mode when flag off', () => {
-      render(<GuestHeader />, { wrapper })
-
-      const toggle = screen.queryAllByTestId('theme-toggle')
-      expect(toggle).toEqual([])
-    })
   })
 
   describe('self hosted build', () => {

src/layouts/Header/components/GuestHeader/GuestHeader.tsx

@@ -1,7 +1,6 @@
 import config from 'config'
 
 import { CodecovIcon } from 'assets/svg/codecov'
-import { useFlags } from 'shared/featureFlags'
 import A from 'ui/A'
 import Button from 'ui/Button'
 
@@ -26,10 +25,6 @@ const LogoButton = () => {
 }
 
 function GuestHeader() {
-  const { darkMode } = useFlags({
-    darkMode: false,
-  })
-
   const isSelfHosted = config.IS_SELF_HOSTED
 
   return (
@@ -71,7 +66,7 @@ function GuestHeader() {
           )}
         </div>
         <div className="flex items-center gap-4 md:mx-4">
-          {darkMode ? <ThemeToggle /> : null}
+          <ThemeToggle />
           {isSelfHosted ? (
             <Button
               to={{ pageName: 'login' }}

src/layouts/Header/components/Navigator/MyContextSwitcher.test.tsx

@@ -1,5 +1,5 @@
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
-import { cleanup, render, screen, waitFor } from '@testing-library/react'
+import { render, screen, waitFor } from '@testing-library/react'
 import userEvent from '@testing-library/user-event'
 import { graphql, HttpResponse } from 'msw2'
 import { setupServer } from 'msw2/node'
@@ -59,7 +59,6 @@ beforeAll(() => {
 })
 
 afterEach(() => {
-  cleanup()
   queryClient.clear()
   server.restoreHandlers()
 })

src/layouts/Header/components/SeatDetails/SeatDetails.test.tsx

@@ -1,5 +1,5 @@
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
-import { cleanup, render, screen } from '@testing-library/react'
+import { render, screen } from '@testing-library/react'
 import { graphql, HttpResponse } from 'msw2'
 import { setupServer } from 'msw2/node'
 import { MemoryRouter, Route } from 'react-router-dom'
@@ -43,7 +43,6 @@ beforeAll(() => {
 })
 
 afterEach(() => {
-  cleanup()
   server.resetHandlers()
   queryClient.clear()
 })

src/layouts/Header/components/ThemeToggle/ThemeToggle.test.tsx

@@ -1,11 +1,5 @@
 import * as Sentry from '@sentry/react'
-import {
-  cleanup,
-  render,
-  screen,
-  waitFor,
-  within,
-} from '@testing-library/react'
+import { render, screen, waitFor, within } from '@testing-library/react'
 import userEvent from '@testing-library/user-event'
 
 import { ThemeContextProvider } from 'shared/ThemeContext'
@@ -33,7 +27,6 @@ describe('ThemeToggle', () => {
   })
 
   afterEach(() => {
-    cleanup()
     vi.clearAllMocks()
   })
 

src/layouts/Header/components/UserDropdown/UserDropdown.test.tsx

@@ -1,5 +1,5 @@
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
-import { cleanup, render, screen, waitFor } from '@testing-library/react'
+import { render, screen, waitFor } from '@testing-library/react'
 import userEvent from '@testing-library/user-event'
 import { graphql, http, HttpResponse } from 'msw2'
 import { setupServer } from 'msw2/node'
@@ -92,7 +92,6 @@ beforeAll(() => {
 })
 
 afterEach(() => {
-  cleanup()
   queryClient.clear()
   server.resetHandlers()
 })

src/layouts/LoginLayout/LoginLayout.test.tsx

@@ -1,9 +1,11 @@
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
-import { cleanup, render, screen, waitFor } from '@testing-library/react'
+import { render, screen, waitFor } from '@testing-library/react'
 import { graphql, HttpResponse } from 'msw2'
 import { setupServer } from 'msw2/node'
 import { MemoryRouter, Route } from 'react-router-dom'
 
+import { ThemeContextProvider } from 'shared/ThemeContext'
+
 import LoginLayout from './LoginLayout'
 
 const mocks = vi.hoisted(() => ({
@@ -30,9 +32,11 @@ const wrapper =
   ): React.FC<React.PropsWithChildren> =>
   ({ children }) => (
     <QueryClientProvider client={queryClient}>
-      <MemoryRouter initialEntries={[initialEntries]}>
-        <Route path={path}>{children}</Route>
-      </MemoryRouter>
+      <ThemeContextProvider>
+        <MemoryRouter initialEntries={[initialEntries]}>
+          <Route path={path}>{children}</Route>
+        </MemoryRouter>
+      </ThemeContextProvider>
     </QueryClientProvider>
   )
 
@@ -44,7 +48,6 @@ beforeAll(() => {
 afterEach(() => {
   queryClient.clear()
   server.resetHandlers()
-  cleanup()
   vi.clearAllMocks()
 })