chore: Remove dark mode feature flag

src/layouts/Header/Header.test.tsx

@@ -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: {
@@ -117,7 +114,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 +183,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/GuestHeader/GuestHeader.test.tsx

@@ -2,17 +2,14 @@ import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
 import { cleanup, 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,12 +30,6 @@ const wrapper: React.FC<React.PropsWithChildren> = ({ children }) => (
  </QueryClientProvider>
 )
 
-const mockedUseFlags = useFlags as Mock
-
-beforeEach(() => {
- mockedUseFlags.mockReturnValue({ darkMode: false })
-})
-
 afterEach(() => {
  cleanup()
  queryClient.clear()
@@ -118,19 +109,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/LoginLayout/LoginLayout.test.tsx

@@ -4,6 +4,8 @@ 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>
  )