fix: Update codecov dark logo and fix broken invoice img (#3729)

Author: calvin-codecov

public/logo_dark.svg

@@ -1,6 +1,7 @@
 import { render, screen, waitFor } from '@testing-library/react'
 import { MemoryRouter } from 'react-router-dom'
 
+import { ThemeContextProvider } from 'shared/ThemeContext/ThemeContext'
 import { Plans } from 'shared/utils/billing'
 
 import InvoiceDetail from './InvoiceDetail'
@@ -117,7 +118,9 @@ describe('InvoiceDetail', () => {
     })
     render(
       <MemoryRouter initialEntries={[url]}>
-        <InvoiceDetail />
+        <ThemeContextProvider>
+          <InvoiceDetail />
+        </ThemeContextProvider>
       </MemoryRouter>
     )
   }

src/pages/PlanPage/subRoutes/InvoiceDetailsPage/InvoiceDetail.test.tsx

@@ -3,6 +3,7 @@ import { MemoryRouter, Route, Switch } from 'react-router-dom'
 import { z } from 'zod'
 
 import { InvoiceSchema } from 'services/account'
+import { ThemeContextProvider } from 'shared/ThemeContext/ThemeContext'
 import { Plans } from 'shared/utils/billing'
 
 import InvoiceHeader from './InvoiceHeader'
@@ -114,9 +115,11 @@ const accountDetails = ({ collectionMethod = '' } = {}) => {
 const wrapper: React.FC<React.PropsWithChildren> = ({ children }) => (
   <MemoryRouter initialEntries={['/plan/gh/invoices/9']}>
     <Switch>
-      <Route path="/plan/:provider/invoices/:id" exact>
-        {children}
-      </Route>
+      <ThemeContextProvider>
+        <Route path="/plan/:provider/invoices/:id" exact>
+          {children}
+        </Route>
+      </ThemeContextProvider>
     </Switch>
   </MemoryRouter>
 )

src/pages/PlanPage/subRoutes/InvoiceDetailsPage/sections/InvoiceHeader.test.tsx

@@ -4,6 +4,7 @@ import { z } from 'zod'
 
 import { AccountDetailsSchema, InvoiceSchema } from 'services/account'
 import { CollectionMethods } from 'shared/utils/billing'
+import LightDarkImg from 'ui/LightDarkImg'
 
 import { generateAddressInfo } from './generateAddressInfo'
 import InvoiceOverview from './InvoiceOverview'
@@ -27,9 +28,10 @@ function InvoiceHeader({ invoice, accountDetails }: InvoiceHeaderProps) {
       <div className="flex justify-between">
         <InvoiceOverview isPaid={isPaid} invoice={invoice} dueDate={dueDate} />
         <div>
-          <img
+          <LightDarkImg
             alt="Codecov Logo"
-            src={`${process.env.PUBLIC_URL}/logo.svg`}
+            src="/logo.svg"
+            darkSrc="/logo_dark.svg"
             width={200}
           />
         </div>