Added theme provider to fix test

__tests__/pages/index.spec.tsx

@@ -1,8 +1,14 @@
 import { render } from '@testing-library/react';
 import Index from 'pages/index';
+import { ThemeProvider } from 'styled-components';
+import defaultTheme from 'themes/default.json';
 
 test('renders index page', () => {
-  const { getByText } = render(<Index />);
+  const { getByText } = render(
+    <ThemeProvider theme={defaultTheme}>
+      <Index />
+    </ThemeProvider>
+  );
   const helloWorldElement = getByText('Hello, world!');
 
   expect(helloWorldElement).toBeInTheDocument();

pages/_app.tsx

@@ -3,6 +3,7 @@ import Head from 'next/head';
 import { description, name } from 'package.json';
 import type { ReactElement } from 'react';
 import { createGlobalStyle, ThemeProvider } from 'styled-components';
+import defaultTheme from 'themes/default.json';
 
 const GlobalStyle = createGlobalStyle`
   html,
@@ -16,12 +17,6 @@ const GlobalStyle = createGlobalStyle`
   }
 `;
 
-const theme = {
-  colors: {
-    primary: '#008000'
-  }
-};
-
 export default function App({ Component, pageProps }: AppProps): ReactElement {
   return (
     <>
@@ -30,7 +25,7 @@ export default function App({ Component, pageProps }: AppProps): ReactElement {
         <meta name="description" content={description} />
       </Head>
       <GlobalStyle />
-      <ThemeProvider theme={theme}>
+      <ThemeProvider theme={defaultTheme}>
         <Component {...pageProps} />
       </ThemeProvider>
     </>

themes/default.json

@@ -0,0 +1,5 @@
+{
+  "colors": {
+    "primary": "#008000"
+  }
+}