Add JS tests. Cleanup code and add github workflow to test.

2025-11-08 20:39:25 +00:00 · 2021-01-12 23:40:38 +05:30 · 2021-01-12 23:40:38 +05:30 · 3f8de60160
commit 3f8de60160
parent f3133a38a0
20 changed files with 533 additions and 264 deletions
--- a/.env.development
+++ b/.env.development
@ -1 +1 @@
-REACT_APP_I18N_DEBUG=1
+REACT_APP_I18N_DEBUG=true
--- a/.eslintignore
+++ b/.eslintignore
@ -1,2 +1,4 @@
 src/config.ts
 src/serviceWorker.js
+jest.config.js
+.eslintrc.js
--- a/.github/workflows/main.yml
+++ b/.github/workflows/main.yml
@ -0,0 +1,36 @@
+name: Lint and JS Test
+on:
+  push:
+    branches: [master]
+  pull_request:
+    branches: [master]
+
+jobs:
+  build-and-deploy:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout 🛎️
+        uses: actions/checkout@v2.3.1 # If you're using actions/checkout@v2 you must set persist-credentials to false in most cases for the deployment to work correctly.
+        with:
+          persist-credentials: false
+
+      - name: Get yarn cache directory path
+        id: yarn-cache-dir-path
+        run: echo "::set-output name=dir::$(yarn cache dir)"
+
+      - uses: actions/cache@v2
+        id: yarn-cache # use this to check for `cache-hit` (`steps.yarn-cache.outputs.cache-hit != 'true'`)
+        with:
+          path: ${{ steps.yarn-cache-dir-path.outputs.dir }}
+          key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
+          restore-keys: |
+            ${{ runner.os }}-yarn-
+
+      - name: Install dependencies
+        run: yarn
+
+      - name: Lint 🤖
+        run: yarn lint
+
+      - name: Test 🔧
+        run: yarn test
--- a/jest.config.js
+++ b/jest.config.js
@ -0,0 +1,30 @@
+module.exports = {
+  // The root of your source code, typically /src
+  // `<rootDir>` is a token Jest substitutes
+  roots: ['<rootDir>/src'],
+
+  // Jest transformations -- this adds support for TypeScript
+  // using ts-jest
+  transform: {
+    '^.+\\.tsx?$': 'ts-jest',
+  },
+
+  // Runs special logic, such as cleaning up components
+  // when using React Testing Library and adds special
+  // extended assertions to Jest
+  setupFilesAfterEnv: ['@testing-library/jest-dom/extend-expect'],
+
+  // Test spec file resolution pattern
+  // Matches parent folder `__tests__` and filename
+  // should contain `test` or `spec`.
+  testRegex: '(/__tests__/.*|(\\.|/)(test|spec))\\.tsx?$',
+
+  // Module file extensions for importing
+  moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json', 'node'],
+
+  moduleNameMapper: {
+    '^.+\\.(css|scss)$': 'identity-obj-proxy',
+    '\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$':
+      '<rootDir>/fileMocks.js',
+  },
+};
--- a/package.json
+++ b/package.json
@ -25,12 +25,13 @@
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
-    "test": "react-scripts test",
    "eject": "react-scripts eject",
    "predeploy": "yarn run build",
    "deploy": "gh-pages -d build",
    "format": "prettier --write src/**/*.ts{,x}",
-    "lint": "tsc --noEmit && eslint src/**/*.ts{,x}"
+    "lint": "tsc --noEmit && eslint src/**/*.ts{,x}",
+    "test": "jest",
+    "test:watch": "jest --watch"
  },
  "browserslist": {
    "production": [
@ -45,12 +46,16 @@
    ]
  },
  "devDependencies": {
+    "@testing-library/jest-dom": "^5.11.8",
+    "@testing-library/react": "^11.2.3",
+    "@types/jest": "^26.0.20",
    "@types/lodash": "^4.14.167",
    "@types/react": "^17.0.0",
    "@types/react-dom": "^17.0.0",
    "@types/react-router-dom": "^5.1.7",
    "@typescript-eslint/eslint-plugin": "^4.12.0",
    "@typescript-eslint/parser": "^4.12.0",
+    "axios-mock-adapter": "^1.19.0",
    "eslint": "7.2.0",
    "eslint-config-airbnb": "18.2.1",
    "eslint-config-airbnb-typescript": "^12.0.0",
@ -62,9 +67,11 @@
    "eslint-plugin-react": "^7.21.5",
    "eslint-plugin-react-hooks": "4.0.0",
    "husky": "^3.0.5",
+    "jest": "^26.6.3",
    "prettier": "^2.2.1",
    "pretty-quick": "^1.11.1",
    "sass": "^1.32.2",
+    "ts-jest": "^26.4.4",
    "typescript": "^4.1.3"
  },
  "husky": {
--- a/src/App.test.tsx
+++ b/src/App.test.tsx
@ -1,9 +1,18 @@
 import React from 'react';
-import { render, screen } from '@testing-library/react';
+import { render } from '@testing-library/react';
 import App from './App';

-test('renders learn react link', () => {
-  render(<App />);
-  const linkElement = screen.getByText(/learn react/i);
-  expect(linkElement).toBeInTheDocument();
+jest.mock('react-i18next', () => ({
+  useTranslation: () => ({
+    t: (k: string) => k,
+    i18n: {
+      changeLanguage: (l: string) => {},
+      language: 'en',
+    },
+  }),
+}));
+
+test('renders the app container', () => {
+  const { container } = render(<App />);
+  expect(container.querySelector('div.App')).toBeTruthy();
 });
--- a/src/App.tsx
+++ b/src/App.tsx
@ -5,10 +5,10 @@ import './App.scss';
 import { createMuiTheme } from '@material-ui/core/styles';
 import { ThemeProvider } from '@material-ui/styles';
 import LinearProgress from '@material-ui/core/LinearProgress';
-import { Paper, Toolbar } from '@material-ui/core';
 import Header from './components/Header';
 import Home from './containers/home/home';
 import NotFound from './containers/not-found/not-found';
+import Footer from './components/Footer';

 const theme = createMuiTheme({
  palette: {
@ -33,17 +33,7 @@ const App: FunctionComponent = () => {
              <Route default component={NotFound} />
            </Switch>
          </Router>
-          <Toolbar hidden />
-          <Paper elevation={4} className="report-problem-container">
-            <span>
-              If you come across any issue, feel free to report{' '}
-              <a href="https://github.com/aparcar/attendedsysupgrade-server/issues">here</a>.
-            </span>
-            <span className="report-link">
-              For contributions, go to{' '}
-              <a href="https://github.com/sudhanshu16/openwrt-firmware-selector/">Github</a>
-            </span>
-          </Paper>
+          <Footer />
        </div>
      </React.Suspense>
    </ThemeProvider>
--- a/src/components/AlertDialog.tsx
+++ b/src/components/AlertDialog.tsx
@ -1,57 +0,0 @@
-import React, { FunctionComponent } from 'react';
-import {
-  Button,
-  Dialog,
-  DialogActions,
-  DialogContent,
-  DialogContentText,
-  DialogTitle,
-} from '@material-ui/core';
-
-type Props = {
-  open: boolean;
-  cancelHandler: () => void;
-  acceptHandler: () => void;
-  body: React.ReactElement;
-  title: React.ReactElement;
-  cancelComponent: React.ReactElement;
-  acceptComponent: React.ReactElement;
-};
-
-const AlertDialog: FunctionComponent<Props> = ({
-  open,
-  cancelHandler,
-  acceptHandler,
-  body,
-  title,
-  cancelComponent,
-  acceptComponent,
-}) => {
-  return (
-    <Dialog
-      open={open}
-      onClose={cancelHandler}
-      aria-labelledby="alert-dialog-title"
-      aria-describedby="alert-dialog-description"
-    >
-      <DialogTitle id="alert-dialog-title">{title}</DialogTitle>
-      <DialogContent>
-        <DialogContentText id="alert-dialog-description">{body}</DialogContentText>
-      </DialogContent>
-      <DialogActions>
-        {acceptHandler && (
-          <Button onClick={acceptHandler} color="primary">
-            {acceptComponent}
-          </Button>
-        )}
-        {cancelHandler && (
-          <Button onClick={cancelHandler} color="secondary" variant="contained" autoFocus>
-            {cancelComponent}
-          </Button>
-        )}
-      </DialogActions>
-    </Dialog>
-  );
-};
-
-export default AlertDialog;
--- a/src/components/ErrorSnackbar.tsx
+++ b/src/components/ErrorSnackbar.tsx
@ -1,60 +0,0 @@
-import React, { FunctionComponent } from 'react';
-import { IconButton, makeStyles, Snackbar, SnackbarContent } from '@material-ui/core';
-import ErrorIcon from '@material-ui/icons/Error';
-import CloseIcon from '@material-ui/icons/Close';
-
-const SnackBarStyles = makeStyles((theme) => ({
-  error: {
-    backgroundColor: theme.palette.error.dark,
-  },
-  message: {
-    display: 'flex',
-    alignItems: 'center',
-  },
-  icon: {
-    marginRight: '20px',
-    fontSize: 20,
-  },
-}));
-
-type Props = {
-  open: boolean;
-  closeHandle: () => void;
-  errorMessage: string;
-};
-
-const ErrorSnackbar: FunctionComponent<Props> = ({ open, closeHandle, errorMessage }) => {
-  const classes = SnackBarStyles();
-  return (
-    <Snackbar
-      anchorOrigin={{
-        vertical: 'bottom',
-        horizontal: 'left',
-      }}
-      open={open}
-      autoHideDuration={6000}
-      onClose={closeHandle}
-      ContentProps={{
-        'aria-describedby': 'message-id',
-      }}
-    >
-      <SnackbarContent
-        className={classes.error}
-        aria-describedby="client-snackbar"
-        message={
-          <span id="client-snackbar" className={classes.message}>
-            <ErrorIcon className={classes.icon} />
-            {errorMessage || 'An unexpected error occurred. Please try again'}
-          </span>
-        }
-        action={[
-          <IconButton key="close" aria-label="Close" color="inherit" onClick={closeHandle}>
-            <CloseIcon />
-          </IconButton>,
-        ]}
-      />
-    </Snackbar>
-  );
-};
-
-export default ErrorSnackbar;
--- a/src/components/Footer.tsx
+++ b/src/components/Footer.tsx
@ -0,0 +1,22 @@
+import { Paper, Toolbar } from '@material-ui/core';
+import React, { FunctionComponent } from 'react';
+
+const Footer: FunctionComponent = () => {
+  return (
+    <>
+      <Toolbar hidden />
+      <Paper elevation={4} className="report-problem-container">
+        <span>
+          If you come across any issue, feel free to report{' '}
+          <a href="https://github.com/aparcar/attendedsysupgrade-server/issues">here</a>.
+        </span>
+        <span className="report-link">
+          For contributions, go to{' '}
+          <a href="https://github.com/sudhanshu16/openwrt-firmware-selector/">Github</a>
+        </span>
+      </Paper>
+    </>
+  );
+};
+
+export default Footer;
--- a/src/containers/home/components/ProfileDetails.test.tsx
+++ b/src/containers/home/components/ProfileDetails.test.tsx
@ -0,0 +1,149 @@
+/* eslint-disable no-await-in-loop */
+/* eslint-disable no-restricted-syntax */
+import React from 'react';
+import { render, screen, waitFor } from '@testing-library/react';
+import axios from 'axios';
+import MockAdapter from 'axios-mock-adapter';
+import ProfileDetails from './ProfileDetails';
+
+import { Profile } from '../../../types/profile';
+
+const mockAxios = new MockAdapter(axios);
+
+const testVersion = 'TEST_VERSION';
+
+const testProfile1: Profile = {
+  build_at: '2020-12-08 13:51:01',
+  target: 'TEST_TARGET',
+  version_code: 'TEST_VERSION_CODE',
+  version_number: 'TEST_VERSION_NUMBER',
+  id: 'TEST_ID',
+  titles: [
+    {
+      title: 'TEST_TITLE1',
+    },
+    {
+      model: 'TEST_MODEL',
+      vendor: 'TEST_VENDOR',
+    },
+  ],
+  images: [
+    {
+      name: 'testimage',
+      type: 'sysupgrade',
+      sha256: 'sha256',
+    },
+  ],
+};
+
+const testProfile2: Profile = {
+  build_at: '2020-12-08 13:51:01',
+  target: 'TEST_TARGET',
+  version_code: 'TEST_VERSION_CODE',
+  version_number: 'TEST_VERSION_NUMBER',
+  id: 'TEST_ID',
+  titles: [
+    {
+      title: 'TEST_TITLE2',
+    },
+  ],
+};
+
+const testProfiles = [testProfile1, testProfile2];
+
+jest.mock('react-i18next', () => ({
+  useTranslation: () => ({
+    t: (k: string) => k,
+    i18n: {
+      // eslint-disable-next-line @typescript-eslint/no-unused-vars
+      changeLanguage: (l: string) => {},
+      language: 'en',
+    },
+  }),
+}));
+
+describe('Profile Details', () => {
+  afterEach(() => {
+    mockAxios.reset();
+  });
+
+  it('renders the component, sends a get request and displays and shows the profile target', async () => {
+    render(
+      <ProfileDetails
+        selectedProfile={{
+          id: 'TEST_ID1',
+          target: 'TEST_TARGET',
+        }}
+        selectedVersion={testVersion}
+      />
+    );
+
+    mockAxios.onGet().replyOnce(200);
+
+    await waitFor(() => {
+      expect(mockAxios.history.get).toHaveLength(1);
+    });
+  });
+
+  it('renders titles correctly', async () => {
+    let { container } = render(
+      <ProfileDetails
+        selectedProfile={{
+          id: 'TEST_ID1',
+          target: 'TEST_TARGET',
+        }}
+        selectedVersion={testVersion}
+      />
+    );
+
+    mockAxios.onGet().replyOnce(200, testProfile1);
+
+    await waitFor(() => {
+      expect(container.querySelector('#title')).toHaveTextContent(
+        /^TEST_TITLE1, TEST_VENDOR TEST_MODEL$/
+      );
+    });
+
+    ({ container } = render(
+      <ProfileDetails
+        selectedProfile={{
+          id: 'TEST_ID2',
+          target: 'TEST_TARGET',
+        }}
+        selectedVersion={testVersion}
+      />
+    ));
+
+    mockAxios.onGet().replyOnce(200, testProfile2);
+
+    await waitFor(() => {
+      expect(container.querySelector('#title')).toHaveTextContent(/^TEST_TITLE2$/);
+    });
+  });
+
+  it('renders download links correctly', async () => {
+    for (const p of testProfiles) {
+      render(
+        <ProfileDetails
+          selectedProfile={{
+            id: 'TEST_ID1',
+            target: 'TEST_TARGET',
+          }}
+          selectedVersion={testVersion}
+        />
+      );
+
+      mockAxios.onGet().replyOnce(200, p);
+
+      await waitFor(() => {
+        const downloadLinks = screen.getAllByTestId('download_link');
+        let expectedItems = p.images?.map((i) => i.type) || [];
+        downloadLinks.forEach((downloadLink) => {
+          expectedItems = expectedItems.filter((i) => i !== downloadLink.textContent);
+        });
+
+        expect(expectedItems).toHaveLength(0);
+      });
+    }
+  });
+});
--- a/src/containers/home/components/ProfileDetails.tsx
+++ b/src/containers/home/components/ProfileDetails.tsx
@ -1,4 +1,4 @@
-import React, { FunctionComponent, useCallback, useEffect, useState } from 'react';
+import React, { FunctionComponent, ReactNode, useCallback, useEffect, useState } from 'react';
 import {
  Box,
  Button,
@ -34,7 +34,6 @@ const profilesData: { [key: string]: Profile } = {};

 const ProfileDetails: FunctionComponent<Props> = ({ selectedVersion, selectedProfile }) => {
  const [profile, setProfileData] = useState<Profile>();
-  const [working, toggleWorking] = useState<boolean>(true);
  const { t } = useTranslation();

  const getHelpKey = (type: string) => {
@ -63,8 +62,6 @@ const ProfileDetails: FunctionComponent<Props> = ({ selectedVersion, selectedPro
  const getProfileData = useCallback(async () => {
    let profileData = profilesData[selectedProfile.id];

-    toggleWorking(true);
-
    if (!profileData) {
      const response = await Axios.get<Profile>(
        `${process.env.PUBLIC_URL}/data/${selectedVersion}/${selectedProfile.target}/${selectedProfile.id}.json`
@ -73,20 +70,23 @@ const ProfileDetails: FunctionComponent<Props> = ({ selectedVersion, selectedPro
      profilesData[selectedProfile.id] = profileData;
    }

-    toggleWorking(false);
-
    return profileData;
  }, [selectedVersion, selectedProfile]);

  useEffect(() => {
+    let mounted = true;
    if (selectedVersion && selectedProfile) {
      getProfileData().then((_profileData) => {
-        if (!isEqual(profile, _profileData)) setProfileData(_profileData);
+        if (mounted && !isEqual(profile, _profileData)) setProfileData(_profileData);
      });
    }
+
+    return () => {
+      mounted = false;
+    };
  }, [selectedVersion, selectedProfile, getProfileData, profile]);

-  if (working || !profile) return <CircularProgress />;
+  if (!profile) return <CircularProgress />;

  const buildAt = new Date(profile.build_at);

@ -103,11 +103,13 @@ const ProfileDetails: FunctionComponent<Props> = ({ selectedVersion, selectedPro
          <TableBody>
            <TableRow>
              <TableCell>{t('tr-model')}</TableCell>
-              <TableCell>{profile.titles?.map((title) => getTitle(title)).join(', ')}</TableCell>
+              <TableCell id="title">
+                {profile.titles?.map((title) => getTitle(title)).join(', ')}
+              </TableCell>
            </TableRow>
            <TableRow>
              <TableCell>{t('tr-target')}</TableCell>
-              <TableCell>{profile.target}</TableCell>
+              <TableCell id="target">{profile.target}</TableCell>
            </TableRow>
            <TableRow>
              <TableCell>{t('tr-version')}</TableCell>
@ -121,39 +123,37 @@ const ProfileDetails: FunctionComponent<Props> = ({ selectedVersion, selectedPro
            </TableRow>
            <TableRow>
              <TableCell>Info</TableCell>
-              {profile.titles && (
-                <TableCell>
-                  {profile.titles
-                    .map<React.ReactNode>((title) => {
-                      const titleString = getTitle(title);
-                      const infoUrl = config.info_url
-                        .replace('{title}', encodeURI(titleString))
-                        .replace('{target}', profile.target)
-                        .replace('{id}', profile.id)
-                        .replace('{version}', profile.version_number);
-
-                      return (
-                        <Link href={infoUrl}>
-                          {/* eslint-disable-next-line @typescript-eslint/no-non-null-assertion */}
-                          {profile.titles!.length > 1 && (
-                            <Typography component="span">{titleString}</Typography>
-                          )}
-                          <Launch
-                            style={{
-                              marginLeft: 10,
-                              verticalAlign: 'middle',
-                            }}
-                          />
-                        </Link>
-                      );
-                    })
-                    .reduce((prev, curr) => [
-                      prev,
-                      <Box display="inline-block" marginRight={2} />,
-                      curr,
-                    ])}
-                </TableCell>
-              )}
+              <TableCell>
+                {profile.titles
+                  ?.map<React.ReactNode>((title: TitlesEntity) => {
+                    const titleString = getTitle(title);
+                    const infoUrl = config.info_url.replace('{title}', encodeURI(titleString));
+                    return (
+                      <Link href={infoUrl} key={titleString}>
+                        {/* eslint-disable-next-line @typescript-eslint/no-non-null-assertion */}
+                        {profile.titles!.length > 1 && (
+                          <Typography component="span">{titleString}</Typography>
+                        )}
+                        <Launch
+                          style={{
+                            marginLeft: 10,
+                            verticalAlign: 'middle',
+                          }}
+                        />
+                      </Link>
+                    );
+                  })
+                  .reduce((acc: ReactNode, curr: ReactNode) => [
+                    acc,
+                    // eslint-disable-next-line react/no-array-index-key
+                    <Box
+                      display="inline-block"
+                      marginRight={2}
+                      key={(acc?.toString() ?? '') + (curr?.toString() ?? '')}
+                    />,
+                    curr,
+                  ])}
+              </TableCell>
            </TableRow>
          </TableBody>
        </Table>
@ -177,9 +177,9 @@ const ProfileDetails: FunctionComponent<Props> = ({ selectedVersion, selectedPro
                .replace('{target}', profile.target)
                .replace('{version}', profile.version_number)}/${i.name}`;
              return (
-                <TableRow>
+                <TableRow key={downloadURL}>
                  <TableCell>
-                    <Link href={downloadURL} target="_blank">
+                    <Link href={downloadURL} target="_blank" data-testid="download_link">
                      <Button endIcon={<CloudDownload />} variant="contained" color="primary">
                        {i.type}
                      </Button>
--- a/src/global.d.ts
+++ b/src/global.d.ts
@ -0,0 +1 @@
+import '@testing-library/jest-dom/extend-expect';
--- a/src/index.tsx
+++ b/src/index.tsx
@ -4,7 +4,7 @@ import './index.css';
 import App from './App';
 import reportWebVitals from './reportWebVitals';

-import './i18n';
+import './locales/i18n';

 ReactDOM.render(
  <React.StrictMode>
--- a/src/locales/i18n.ts
+++ b/src/locales/i18n.ts
@ -1,7 +1,7 @@
 import i18n from 'i18next';
 import { initReactI18next } from 'react-i18next';
 import LanguageDetector from 'i18next-browser-languagedetector';
-import translations from './locales/translations';
+import translations from './translations';

 const resources = {
  ca: {
@ -39,7 +39,7 @@ i18n
  .init({
    resources,
    fallbackLng: 'en',
-    debug: (process.env.REACT_APP_I18N_DEBUG || '0') === '1',
+    debug: !!process.env.REACT_APP_I18N_DEBUG,
    interpolation: {
      escapeValue: false, // not needed for react as it escapes by default
    },
--- a/src/services/data.ts
+++ b/src/services/data.ts
@ -1,42 +0,0 @@
-import axios from 'axios';
-import config from '../config';
-
-class DataService {
-  // getVersions = versionsPath => axios.get(versionsPath);
-  //
-  // getOverview = overviewPath => axios.get(overviewPath);
-  //
-  // getDeviceData = devicePath => axios.get(devicePath);
-  //
-  // getDeviceManifest = async manifest_path => {
-  //   const manifest = await axios.get(manifest_path);
-  //   return manifest.data.split('\n');
-  // };
-  //
-  // getDevicePackages = (version, target, profile) =>
-  //   axios.get(
-  //     base_api +
-  //       'packages_image?distro=openwrt&version=' +
-  //       version.toLowerCase() +
-  //       '&target=' +
-  //       target +
-  //       '&profile=' +
-  //       profile.toLowerCase()
-  //   );
-  //
-  // buildImage = (board, packages, target, version, uciDefaults) =>
-  //   axios.post(base_api + 'build-request', {
-  //     profile: board,
-  //     board,
-  //     defaults: uciDefaults,
-  //     distro: 'openwrt',
-  //     packages,
-  //     target,
-  //     version,
-  //   });
-  //
-  // buildStatusCheck = request_hash =>
-  //   axios.get(base_api + 'build-request/' + request_hash);
-}
-
-export default DataService;
--- a/src/tests/utils.ts
+++ b/src/tests/utils.ts
@ -0,0 +1,16 @@
+export const mocki18n = (): void => {
+  jest.mock('react-i18next', () => ({
+    // this mock makes sure any components using the translate hook can use it without a warning being shown
+    useTranslation: () => {
+      return {
+        t: (str: string) => str,
+        i18n: {
+          changeLanguage: () => new Promise(() => {}),
+          language: 'en',
+        },
+      };
+    },
+  }));
+};
+
+export default { mocki18n };
--- a/src/types/profile.ts
+++ b/src/types/profile.ts
@ -1,12 +1,12 @@
 export interface Profile {
-  arch_packages: string;
+  arch_packages?: string;
  build_at: string;
  default_packages?: string[] | null;
  device_packages?: string[] | null;
  id: string;
-  image_prefix: string;
+  image_prefix?: string;
  images?: ImagesEntity[] | null;
-  metadata_version: number;
+  metadata_version?: number;
  target: string;
  titles?: TitlesEntity[] | null;
  version_code: string;
--- a/tsconfig.json
+++ b/tsconfig.json
@ -1,11 +1,7 @@
 {
  "compilerOptions": {
    "target": "es5",
-    "lib": [
-      "dom",
-      "dom.iterable",
-      "esnext"
-    ],
+    "lib": ["dom", "dom.iterable", "esnext"],
    "allowJs": true,
    "skipLibCheck": true,
    "esModuleInterop": true,
@ -20,7 +16,5 @@
    "noEmit": true,
    "jsx": "react-jsx"
  },
-  "include": [
-    "src"
-  ]
+  "include": ["src"]
 }
--- a/yarn.lock
+++ b/yarn.lock
@ -1071,7 +1071,7 @@
  dependencies:
    regenerator-runtime "^0.13.4"

-"@babel/runtime@^7.1.2", "@babel/runtime@^7.10.2", "@babel/runtime@^7.11.2", "@babel/runtime@^7.12.1", "@babel/runtime@^7.12.5", "@babel/runtime@^7.3.1", "@babel/runtime@^7.4.4", "@babel/runtime@^7.5.5", "@babel/runtime@^7.7.2", "@babel/runtime@^7.8.3", "@babel/runtime@^7.8.4", "@babel/runtime@^7.8.7":
+"@babel/runtime@^7.1.2", "@babel/runtime@^7.10.2", "@babel/runtime@^7.11.2", "@babel/runtime@^7.12.1", "@babel/runtime@^7.12.5", "@babel/runtime@^7.3.1", "@babel/runtime@^7.4.4", "@babel/runtime@^7.5.5", "@babel/runtime@^7.7.2", "@babel/runtime@^7.8.3", "@babel/runtime@^7.8.4", "@babel/runtime@^7.8.7", "@babel/runtime@^7.9.2":
  version "7.12.5"
  resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.12.5.tgz#410e7e487441e1b360c29be715d870d9b985882e"
  integrity sha512-plcc+hbExy3McchJCEQG3knOsuh3HH+Prx1P6cLIkET/0dLuQDEnrT+s27Axgc9bqfsmNUNHfscgMUdBpC9xfg==
@ -1649,11 +1649,52 @@
    "@svgr/plugin-svgo" "^5.4.0"
    loader-utils "^2.0.0"

+"@testing-library/dom@^7.28.1":
+  version "7.29.2"
+  resolved "https://registry.yarnpkg.com/@testing-library/dom/-/dom-7.29.2.tgz#6cba65d961d8b36d621a98caa8537444075fb42e"
+  integrity sha512-CBMELfyY1jKdtLcSRmEnZWRzRkCRVSNPTzhzrn8wY8OnzUo7Pe/W+HgLzt4TDnWIPYeusHBodf9wUjJF48kPmA==
+  dependencies:
+    "@babel/code-frame" "^7.10.4"
+    "@babel/runtime" "^7.12.5"
+    "@types/aria-query" "^4.2.0"
+    aria-query "^4.2.2"
+    chalk "^4.1.0"
+    dom-accessibility-api "^0.5.4"
+    lz-string "^1.4.4"
+    pretty-format "^26.6.2"
+
+"@testing-library/jest-dom@^5.11.8":
+  version "5.11.8"
+  resolved "https://registry.yarnpkg.com/@testing-library/jest-dom/-/jest-dom-5.11.8.tgz#433a84d6f9a089485101b9e112ef03e5c30bcbfc"
+  integrity sha512-ScyKrWQM5xNcr79PkSewnA79CLaoxVskE+f7knTOhDD9ftZSA1Jw8mj+pneqhEu3x37ncNfW84NUr7lqK+mXjA==
+  dependencies:
+    "@babel/runtime" "^7.9.2"
+    "@types/testing-library__jest-dom" "^5.9.1"
+    aria-query "^4.2.2"
+    chalk "^3.0.0"
+    css "^3.0.0"
+    css.escape "^1.5.1"
+    lodash "^4.17.15"
+    redent "^3.0.0"
+
+"@testing-library/react@^11.2.3":
+  version "11.2.3"
+  resolved "https://registry.yarnpkg.com/@testing-library/react/-/react-11.2.3.tgz#9971ede1c8465a231d7982eeca3c39fc362d5443"
+  integrity sha512-BirBUGPkTW28ULuCwIbYo0y2+0aavHczBT6N9r3LrsswEW3pg25l1wgoE7I8QBIy1upXWkwKpYdWY7NYYP0Bxw==
+  dependencies:
+    "@babel/runtime" "^7.12.5"
+    "@testing-library/dom" "^7.28.1"
+
 "@types/anymatch@*":
  version "1.3.1"
  resolved "https://registry.yarnpkg.com/@types/anymatch/-/anymatch-1.3.1.tgz#336badc1beecb9dacc38bea2cf32adf627a8421a"
  integrity sha512-/+CRPXpBDpo2RK9C68N3b2cOvO0Cf5B9aPijHsoDQTHivnGSObdOF2BRQOYjojWTDy6nQvMjmqRXIxH55VjxxA==

+"@types/aria-query@^4.2.0":
+  version "4.2.0"
+  resolved "https://registry.yarnpkg.com/@types/aria-query/-/aria-query-4.2.0.tgz#14264692a9d6e2fa4db3df5e56e94b5e25647ac0"
+  integrity sha512-iIgQNzCm0v7QMhhe4Jjn9uRh+I6GoPmt03CbEtwx3ao8/EfoQcmgtqH4vQ5Db/lxiIGaWDv6nwvunuh0RyX0+A==
+
 "@types/babel__core@^7.0.0", "@types/babel__core@^7.1.7":
  version "7.1.12"
  resolved "https://registry.yarnpkg.com/@types/babel__core/-/babel__core-7.1.12.tgz#4d8e9e51eb265552a7e4f1ff2219ab6133bdfb2d"
@ -1749,6 +1790,14 @@
  dependencies:
    "@types/istanbul-lib-report" "*"

+"@types/jest@*", "@types/jest@26.x", "@types/jest@^26.0.20":
+  version "26.0.20"
+  resolved "https://registry.yarnpkg.com/@types/jest/-/jest-26.0.20.tgz#cd2f2702ecf69e86b586e1f5223a60e454056307"
+  integrity sha512-9zi2Y+5USJRxd0FsahERhBwlcvFh6D2GLQnY2FH2BzK8J9s9omvNHIbvABwIluXa0fD8XVKMLTO0aOEuUfACAA==
+  dependencies:
+    jest-diff "^26.0.0"
+    pretty-format "^26.0.0"
+
 "@types/js-cookie@2.2.6":
  version "2.2.6"
  resolved "https://registry.yarnpkg.com/@types/js-cookie/-/js-cookie-2.2.6.tgz#f1a1cb35aff47bc5cfb05cb0c441ca91e914c26f"
@ -1865,6 +1914,13 @@
  resolved "https://registry.yarnpkg.com/@types/tapable/-/tapable-1.0.6.tgz#a9ca4b70a18b270ccb2bc0aaafefd1d486b7ea74"
  integrity sha512-W+bw9ds02rAQaMvaLYxAbJ6cvguW/iJXNT6lTssS1ps6QdrMKttqEAMEG/b5CR8TZl3/L7/lH0ZV5nNR1LXikA==

+"@types/testing-library__jest-dom@^5.9.1":
+  version "5.9.5"
+  resolved "https://registry.yarnpkg.com/@types/testing-library__jest-dom/-/testing-library__jest-dom-5.9.5.tgz#5bf25c91ad2d7b38f264b12275e5c92a66d849b0"
+  integrity sha512-ggn3ws+yRbOHog9GxnXiEZ/35Mow6YtPZpd7Z5mKDeZS/o7zx3yAle0ov/wjhVB5QT4N2Dt+GNoGCdqkBGCajQ==
+  dependencies:
+    "@types/jest" "*"
+
 "@types/uglify-js@*":
  version "3.11.1"
  resolved "https://registry.yarnpkg.com/@types/uglify-js/-/uglify-js-3.11.1.tgz#97ff30e61a0aa6876c270b5f538737e2d6ab8ceb"
@ -2613,6 +2669,14 @@ axe-core@^4.0.2:
  resolved "https://registry.yarnpkg.com/axe-core/-/axe-core-4.1.1.tgz#70a7855888e287f7add66002211a423937063eaf"
  integrity sha512-5Kgy8Cz6LPC9DJcNb3yjAXTu3XihQgEdnIg50c//zOC/MyLP0Clg+Y8Sh9ZjjnvBrDZU4DgXS9C3T9r4/scGZQ==

+axios-mock-adapter@^1.19.0:
+  version "1.19.0"
+  resolved "https://registry.yarnpkg.com/axios-mock-adapter/-/axios-mock-adapter-1.19.0.tgz#9d72e321a6c5418e1eff067aa99761a86c5188a4"
+  integrity sha512-D+0U4LNPr7WroiBDvWilzTMYPYTuZlbo6BI8YHZtj7wYQS8NkARlP9KBt8IWWHTQJ0q/8oZ0ClPBtKCCkx8cQg==
+  dependencies:
+    fast-deep-equal "^3.1.3"
+    is-buffer "^2.0.3"
+
 axios@^0.21.1:
  version "0.21.1"
  resolved "https://registry.yarnpkg.com/axios/-/axios-0.21.1.tgz#22563481962f4d6bde9a76d516ef0e5d3c09b2b8"
@ -3032,6 +3096,13 @@ browserslist@^4.0.0, browserslist@^4.12.0, browserslist@^4.14.5, browserslist@^4
    escalade "^3.1.1"
    node-releases "^1.1.69"

+bs-logger@0.x:
+  version "0.2.6"
+  resolved "https://registry.yarnpkg.com/bs-logger/-/bs-logger-0.2.6.tgz#eb7d365307a72cf974cc6cda76b68354ad336bd8"
+  integrity sha512-pd8DCoxmbgc7hyPKOvxtqNcjYoOsABPQdcCUjGp3d42VR2CX1ORhk2A87oqqu5R1kk+76nsxZupkmyd+MVtCog==
+  dependencies:
+    fast-json-stable-stringify "2.x"
+
 bser@2.1.1:
  version "2.1.1"
  resolved "https://registry.yarnpkg.com/bser/-/bser-2.1.1.tgz#e6787da20ece9d07998533cfd9de6f5c38f4bc05"
@ -3039,7 +3110,7 @@ bser@2.1.1:
  dependencies:
    node-int64 "^0.4.0"

-buffer-from@^1.0.0:
+buffer-from@1.x, buffer-from@^1.0.0:
  version "1.1.1"
  resolved "https://registry.yarnpkg.com/buffer-from/-/buffer-from-1.1.1.tgz#32713bc028f75c02fdb710d7c7bcec1f2c6070ef"
  integrity sha512-MQcXEUbCKtEo7bhqEs6560Hyd4XaovZlO/k9V3hjVUF/zwW7KBVdSK4gIt/bzwS9MbR5qob+F5jusZsb0YQK2A==
@ -3233,6 +3304,14 @@ chalk@2.4.2, chalk@^2.0.0, chalk@^2.3.0, chalk@^2.4.1, chalk@^2.4.2:
    escape-string-regexp "^1.0.5"
    supports-color "^5.3.0"

+chalk@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/chalk/-/chalk-3.0.0.tgz#3f73c2bf526591f574cc492c51e2456349f844e4"
+  integrity sha512-4D3B6Wf41KOYRFdszmDqMCGq5VV/uMAB273JILmO+3jAlh8X4qDtdtgCR3fxtbLEMzSx22QdhnDcJvu2u1fVwg==
+  dependencies:
+    ansi-styles "^4.1.0"
+    supports-color "^7.1.0"
+
 chalk@^4.0.0, chalk@^4.1.0:
  version "4.1.0"
  resolved "https://registry.yarnpkg.com/chalk/-/chalk-4.1.0.tgz#4e14870a618d9e2edd97dd8345fd9d9dc315646a"
@ -3867,6 +3946,11 @@ css-what@^3.2.1:
  resolved "https://registry.yarnpkg.com/css-what/-/css-what-3.4.2.tgz#ea7026fcb01777edbde52124e21f327e7ae950e4"
  integrity sha512-ACUm3L0/jiZTqfzRM3Hi9Q8eZqd6IK37mMWPLz9PJxkLWllYeRf+EHUSHYEtFop2Eqytaq1FizFVh7XfBnXCDQ==

+css.escape@^1.5.1:
+  version "1.5.1"
+  resolved "https://registry.yarnpkg.com/css.escape/-/css.escape-1.5.1.tgz#42e27d4fa04ae32f931a4b4d4191fa9cddee97cb"
+  integrity sha1-QuJ9T6BK4y+TGktNQZH6nN3ul8s=
+
 css@^2.0.0:
  version "2.2.4"
  resolved "https://registry.yarnpkg.com/css/-/css-2.2.4.tgz#c646755c73971f2bba6a601e2cf2fd71b1298929"
@ -3877,6 +3961,15 @@ css@^2.0.0:
    source-map-resolve "^0.5.2"
    urix "^0.1.0"

+css@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/css/-/css-3.0.0.tgz#4447a4d58fdd03367c516ca9f64ae365cee4aa5d"
+  integrity sha512-DG9pFfwOrzc+hawpmqX/dHYHJG+Bsdb0klhyi1sDneOgGOXy9wQIC8hzyVp1e4NRYDBdxcylvywPkkXCHAzTyQ==
+  dependencies:
+    inherits "^2.0.4"
+    source-map "^0.6.1"
+    source-map-resolve "^0.6.0"
+
 cssdb@^4.4.0:
  version "4.4.0"
  resolved "https://registry.yarnpkg.com/cssdb/-/cssdb-4.4.0.tgz#3bf2f2a68c10f5c6a08abd92378331ee803cddb0"
@ -4245,6 +4338,11 @@ doctrine@^3.0.0:
  dependencies:
    esutils "^2.0.2"

+dom-accessibility-api@^0.5.4:
+  version "0.5.4"
+  resolved "https://registry.yarnpkg.com/dom-accessibility-api/-/dom-accessibility-api-0.5.4.tgz#b06d059cdd4a4ad9a79275f9d414a5c126241166"
+  integrity sha512-TvrjBckDy2c6v6RLxPv5QXOnU+SmF9nBII5621Ve5fu6Z/BDrENurBEvlC1f44lKEUVqOpK4w9E5Idc5/EgkLQ==
+
 dom-converter@^0.2:
  version "0.2.0"
  resolved "https://registry.yarnpkg.com/dom-converter/-/dom-converter-0.2.0.tgz#6721a9daee2e293682955b6afe416771627bb768"
@ -5148,7 +5246,7 @@ fast-glob@^3.1.1:
    micromatch "^4.0.2"
    picomatch "^2.2.1"

-fast-json-stable-stringify@^2.0.0, fast-json-stable-stringify@^2.1.0:
+fast-json-stable-stringify@2.x, fast-json-stable-stringify@^2.0.0, fast-json-stable-stringify@^2.1.0:
  version "2.1.0"
  resolved "https://registry.yarnpkg.com/fast-json-stable-stringify/-/fast-json-stable-stringify-2.1.0.tgz#874bf69c6f404c2b5d99c481341399fd55892633"
  integrity sha512-lhd/wF+Lk98HZoTCtlVraHtfh5XYijIjalXck7saUtuanSDyLMxnHhSXEDJqHxD7msR8D0uCmqlkwjCV8xvwHw==
@ -6315,6 +6413,11 @@ is-buffer@^1.1.5:
  resolved "https://registry.yarnpkg.com/is-buffer/-/is-buffer-1.1.6.tgz#efaa2ea9daa0d7ab2ea13a97b2b8ad51fefbe8be"
  integrity sha512-NcdALwpXkTm5Zvvbk7owOUSvVvBKDgKP5/ewfXEznmQFfs4ZRmanOeKBTjRVjka3QFoN6XJ+9F3USqfHqTaU5w==

+is-buffer@^2.0.3:
+  version "2.0.5"
+  resolved "https://registry.yarnpkg.com/is-buffer/-/is-buffer-2.0.5.tgz#ebc252e400d22ff8d77fa09888821a24a658c191"
+  integrity sha512-i2R6zNFDwgEHJyQUtJEk0XFi1i0dPFn/oqjK3/vPCcDeJvW5NQ83V8QbicfF1SupOaB0h8ntgBC2YiE7dfyctQ==
+
 is-callable@^1.1.4, is-callable@^1.2.2:
  version "1.2.2"
  resolved "https://registry.yarnpkg.com/is-callable/-/is-callable-1.2.2.tgz#c7c6715cd22d4ddb48d3e19970223aceabb080d9"
@ -6694,7 +6797,7 @@ jest-circus@26.6.0:
    stack-utils "^2.0.2"
    throat "^5.0.0"

-jest-cli@^26.6.0:
+jest-cli@^26.6.0, jest-cli@^26.6.3:
  version "26.6.3"
  resolved "https://registry.yarnpkg.com/jest-cli/-/jest-cli-26.6.3.tgz#43117cfef24bc4cd691a174a8796a532e135e92a"
  integrity sha512-GF9noBSa9t08pSyl3CY4frMrqp+aQXFGFkf5hEPbh/pIUFYWMK6ZLTfbmadxJVcJrdRoChlWQsA2VkJcDFK8hg==
@ -6737,7 +6840,7 @@ jest-config@^26.6.3:
    micromatch "^4.0.2"
    pretty-format "^26.6.2"

-jest-diff@^26.6.2:
+jest-diff@^26.0.0, jest-diff@^26.6.2:
  version "26.6.2"
  resolved "https://registry.yarnpkg.com/jest-diff/-/jest-diff-26.6.2.tgz#1aa7468b52c3a68d7d5c5fdcdfcd5e49bd164394"
  integrity sha512-6m+9Z3Gv9wN0WFVasqjCL/06+EFCMTqDEUl/b87HYK2rAPTyfz4ZIuSlPhY51PIQRWx5TaxeF1qmXKe9gfN3sA==
@ -7017,7 +7120,7 @@ jest-snapshot@^26.6.0, jest-snapshot@^26.6.2:
    pretty-format "^26.6.2"
    semver "^7.3.2"

-jest-util@^26.6.0, jest-util@^26.6.2:
+jest-util@^26.1.0, jest-util@^26.6.0, jest-util@^26.6.2:
  version "26.6.2"
  resolved "https://registry.yarnpkg.com/jest-util/-/jest-util-26.6.2.tgz#907535dbe4d5a6cb4c47ac9b926f6af29576cbc1"
  integrity sha512-MDW0fKfsn0OI7MS7Euz6h8HNDXVQ0gaM9uW6RjfDmd1DAFcaxX9OqIakHIqhbnmF08Cf2DLDG+ulq8YQQ0Lp0Q==
@ -7093,6 +7196,15 @@ jest@26.6.0:
    import-local "^3.0.2"
    jest-cli "^26.6.0"

+jest@^26.6.3:
+  version "26.6.3"
+  resolved "https://registry.yarnpkg.com/jest/-/jest-26.6.3.tgz#40e8fdbe48f00dfa1f0ce8121ca74b88ac9148ef"
+  integrity sha512-lGS5PXGAzR4RF7V5+XObhqz2KZIDUA1yD0DG6pBVmy10eh0ZIXQImRuzocsI/N2XZ1GrLFwTS27In2i2jlpq1Q==
+  dependencies:
+    "@jest/core" "^26.6.3"
+    import-local "^3.0.2"
+    jest-cli "^26.6.3"
+
 js-cookie@^2.2.1:
  version "2.2.1"
  resolved "https://registry.yarnpkg.com/js-cookie/-/js-cookie-2.2.1.tgz#69e106dc5d5806894562902aa5baec3744e9b2b8"
@ -7198,6 +7310,13 @@ json3@^3.3.2:
  resolved "https://registry.yarnpkg.com/json3/-/json3-3.3.3.tgz#7fc10e375fc5ae42c4705a5cc0aa6f62be305b81"
  integrity sha512-c7/8mbUsKigAbLkD5B010BK4D9LZm7A1pNItkEwiUZRpIN66exu/e7YQWysGun+TRKaJp8MhemM+VkfWv42aCA==

+json5@2.x, json5@^2.1.2:
+  version "2.1.3"
+  resolved "https://registry.yarnpkg.com/json5/-/json5-2.1.3.tgz#c9b0f7fa9233bfe5807fe66fcf3a5617ed597d43"
+  integrity sha512-KXPvOm8K9IJKFM0bmdn8QXh7udDh1g/giieX0NLCaMnb4hEiVFqnop2ImTXCc5e0/oHz3LTqmHGtExn5hfMkOA==
+  dependencies:
+    minimist "^1.2.5"
+
 json5@^1.0.1:
  version "1.0.1"
  resolved "https://registry.yarnpkg.com/json5/-/json5-1.0.1.tgz#779fb0018604fa854eacbf6252180d83543e3dbe"
@ -7205,13 +7324,6 @@ json5@^1.0.1:
  dependencies:
    minimist "^1.2.0"

-json5@^2.1.2:
-  version "2.1.3"
-  resolved "https://registry.yarnpkg.com/json5/-/json5-2.1.3.tgz#c9b0f7fa9233bfe5807fe66fcf3a5617ed597d43"
-  integrity sha512-KXPvOm8K9IJKFM0bmdn8QXh7udDh1g/giieX0NLCaMnb4hEiVFqnop2ImTXCc5e0/oHz3LTqmHGtExn5hfMkOA==
-  dependencies:
-    minimist "^1.2.5"
-
 jsonfile@^4.0.0:
  version "4.0.0"
  resolved "https://registry.yarnpkg.com/jsonfile/-/jsonfile-4.0.0.tgz#8771aae0799b64076b76640fca058f9c10e33ecb"
@ -7467,7 +7579,7 @@ lodash._reinterpolate@^3.0.0:
  resolved "https://registry.yarnpkg.com/lodash._reinterpolate/-/lodash._reinterpolate-3.0.0.tgz#0ccf2d89166af03b3663c796538b75ac6e114d9d"
  integrity sha1-DM8tiRZq8Ds2Y8eWU4t1rG4RTZ0=

-lodash.memoize@^4.1.2:
+lodash.memoize@4.x, lodash.memoize@^4.1.2:
  version "4.1.2"
  resolved "https://registry.yarnpkg.com/lodash.memoize/-/lodash.memoize-4.1.2.tgz#bcc6c49a42a2840ed997f323eada5ecd182e0bfe"
  integrity sha1-vMbEmkKihA7Zl/Mj6tpezRguC/4=
@ -7543,6 +7655,11 @@ lru-cache@^6.0.0:
  dependencies:
    yallist "^4.0.0"

+lz-string@^1.4.4:
+  version "1.4.4"
+  resolved "https://registry.yarnpkg.com/lz-string/-/lz-string-1.4.4.tgz#c0d8eaf36059f705796e1e344811cf4c498d3a26"
+  integrity sha1-wNjq82BZ9wV5bh40SBHPTEmNOiY=
+
 magic-string@^0.25.0, magic-string@^0.25.7:
  version "0.25.7"
  resolved "https://registry.yarnpkg.com/magic-string/-/magic-string-0.25.7.tgz#3f497d6fd34c669c6798dcb821f2ef31f5445051"
@ -7565,6 +7682,11 @@ make-dir@^3.0.0, make-dir@^3.0.2:
  dependencies:
    semver "^6.0.0"

+make-error@1.x:
+  version "1.3.6"
+  resolved "https://registry.yarnpkg.com/make-error/-/make-error-1.3.6.tgz#2eb2e37ea9b67c4891f684a1394799af484cf7a2"
+  integrity sha512-s8UhlNe7vPKomQhC1qFelMokr/Sc3AgNbso3n74mVPA5LTZwkB9NlXf4XPamLxJE8h0gh73rM94xvwRT2CVInw==
+
 makeerror@1.0.x:
  version "1.0.11"
  resolved "https://registry.yarnpkg.com/makeerror/-/makeerror-1.0.11.tgz#e01a5c9109f2af79660e4e8b9587790184f5a96c"
@ -7719,6 +7841,11 @@ mimic-fn@^2.1.0:
  resolved "https://registry.yarnpkg.com/mimic-fn/-/mimic-fn-2.1.0.tgz#7ed2c2ccccaf84d3ffcb7a69b57711fc2083401b"
  integrity sha512-OqbOk5oEQeAZ8WXWydlu9HJjz9WVdEIvamMCcXmuqUYjTknH/sqsWvhQ3vgwKFRR1HpjvNBKQ37nbJgYzGqGcg==

+min-indent@^1.0.0:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/min-indent/-/min-indent-1.0.1.tgz#a63f681673b30571fbe8bc25686ae746eefa9869"
+  integrity sha512-I9jwMn07Sy/IwOj3zVkVik2JTvgpaykDZEigL6Rx6N9LbMywwUSMtxET+7lVoDLLd3O3IXwJwvuuns8UB/HeAg==
+
 mini-create-react-context@^0.4.0:
  version "0.4.1"
  resolved "https://registry.yarnpkg.com/mini-create-react-context/-/mini-create-react-context-0.4.1.tgz#072171561bfdc922da08a60c2197a497cc2d1d5e"
@ -7819,6 +7946,11 @@ mixin-deep@^1.2.0:
    for-in "^1.0.2"
    is-extendable "^1.0.1"

+mkdirp@1.x, mkdirp@^1.0.3, mkdirp@^1.0.4:
+  version "1.0.4"
+  resolved "https://registry.yarnpkg.com/mkdirp/-/mkdirp-1.0.4.tgz#3eb5ed62622756d79a5f0e2a221dfebad75c2f7e"
+  integrity sha512-vVqVZQyf3WLx2Shd0qJ9xuvqgAyKPLAiqITEtqW0oIUjzo3PePDd6fW9iFz30ef7Ysp/oiWqbhszeGWW2T6Gzw==
+
 mkdirp@^0.5.1, mkdirp@^0.5.3, mkdirp@^0.5.5, mkdirp@~0.5.1:
  version "0.5.5"
  resolved "https://registry.yarnpkg.com/mkdirp/-/mkdirp-0.5.5.tgz#d91cefd62d1436ca0f41620e251288d420099def"
@ -7826,11 +7958,6 @@ mkdirp@^0.5.1, mkdirp@^0.5.3, mkdirp@^0.5.5, mkdirp@~0.5.1:
  dependencies:
    minimist "^1.2.5"

-mkdirp@^1.0.3, mkdirp@^1.0.4:
-  version "1.0.4"
-  resolved "https://registry.yarnpkg.com/mkdirp/-/mkdirp-1.0.4.tgz#3eb5ed62622756d79a5f0e2a221dfebad75c2f7e"
-  integrity sha512-vVqVZQyf3WLx2Shd0qJ9xuvqgAyKPLAiqITEtqW0oIUjzo3PePDd6fW9iFz30ef7Ysp/oiWqbhszeGWW2T6Gzw==
-
 move-concurrently@^1.0.1:
  version "1.0.1"
  resolved "https://registry.yarnpkg.com/move-concurrently/-/move-concurrently-1.0.1.tgz#be2c005fda32e0b29af1f05d7c4b33214c701f92"
@ -9371,7 +9498,7 @@ pretty-error@^2.1.1:
    lodash "^4.17.20"
    renderkid "^2.0.4"

-pretty-format@^26.6.0, pretty-format@^26.6.2:
+pretty-format@^26.0.0, pretty-format@^26.6.0, pretty-format@^26.6.2:
  version "26.6.2"
  resolved "https://registry.yarnpkg.com/pretty-format/-/pretty-format-26.6.2.tgz#e35c2705f14cb7fe2fe94fa078345b444120fc93"
  integrity sha512-7AeGuCYNGmycyQbCqd/3PWH4eOoX/OiCa0uphp57NVTeAGdJGaAliecxwBDHYQCIvrW7aDBZCYeNTP/WX69mkg==
@ -9887,6 +10014,14 @@ recursive-readdir@2.2.2:
  dependencies:
    minimatch "3.0.4"

+redent@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/redent/-/redent-3.0.0.tgz#e557b7998316bb53c9f1f56fa626352c6963059f"
+  integrity sha512-6tDA8g98We0zd0GvVeMT9arEOnTw9qM03L9cJXaCjrip1OO764RDBLBfrB4cwzNGDj5OA5ioymC9GkizgWJDUg==
+  dependencies:
+    indent-string "^4.0.0"
+    strip-indent "^3.0.0"
+
 regenerate-unicode-properties@^8.2.0:
  version "8.2.0"
  resolved "https://registry.yarnpkg.com/regenerate-unicode-properties/-/regenerate-unicode-properties-8.2.0.tgz#e5de7111d655e7ba60c057dbe9ff37c87e65cdec"
@ -10435,18 +10570,18 @@ semver@7.3.2:
  resolved "https://registry.yarnpkg.com/semver/-/semver-7.3.2.tgz#604962b052b81ed0786aae84389ffba70ffd3938"
  integrity sha512-OrOb32TeeambH6UrhtShmF7CRDqhL6/5XpPNp2DuRH6+9QLw/orhp72j87v8Qa1ScDkvrrBNpZcDejAirJmfXQ==

-semver@^6.0.0, semver@^6.3.0:
-  version "6.3.0"
-  resolved "https://registry.yarnpkg.com/semver/-/semver-6.3.0.tgz#ee0a64c8af5e8ceea67687b133761e1becbd1d3d"
-  integrity sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==
-
-semver@^7.2.1, semver@^7.3.2:
+semver@7.x, semver@^7.2.1, semver@^7.3.2:
  version "7.3.4"
  resolved "https://registry.yarnpkg.com/semver/-/semver-7.3.4.tgz#27aaa7d2e4ca76452f98d3add093a72c943edc97"
  integrity sha512-tCfb2WLjqFAtXn4KEdxIhalnRtoKFN7nAwj0B3ZXCbQloV2tq5eDbcTmT68JJD3nRJq24/XgxtQKFIpQdtvmVw==
  dependencies:
    lru-cache "^6.0.0"

+semver@^6.0.0, semver@^6.3.0:
+  version "6.3.0"
+  resolved "https://registry.yarnpkg.com/semver/-/semver-6.3.0.tgz#ee0a64c8af5e8ceea67687b133761e1becbd1d3d"
+  integrity sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==
+
 send@0.17.1:
  version "0.17.1"
  resolved "https://registry.yarnpkg.com/send/-/send-0.17.1.tgz#c1d8b059f7900f7466dd4938bdc44e11ddb376c8"
@ -10710,6 +10845,14 @@ source-map-resolve@^0.5.0, source-map-resolve@^0.5.2:
    source-map-url "^0.4.0"
    urix "^0.1.0"

+source-map-resolve@^0.6.0:
+  version "0.6.0"
+  resolved "https://registry.yarnpkg.com/source-map-resolve/-/source-map-resolve-0.6.0.tgz#3d9df87e236b53f16d01e58150fc7711138e5ed2"
+  integrity sha512-KXBr9d/fO/bWo97NXsPIAW1bFSBOuCnjbNTBMO7N59hsv5i9yzRDfcYwwt0l04+VqnKC+EwzvJZIP/qkuMgR/w==
+  dependencies:
+    atob "^2.1.2"
+    decode-uri-component "^0.2.0"
+
 source-map-support@^0.5.6, source-map-support@~0.5.12, source-map-support@~0.5.19:
  version "0.5.19"
  resolved "https://registry.yarnpkg.com/source-map-support/-/source-map-support-0.5.19.tgz#a98b62f86dcaf4f67399648c085291ab9e8fed61"
@ -11066,6 +11209,13 @@ strip-final-newline@^2.0.0:
  resolved "https://registry.yarnpkg.com/strip-final-newline/-/strip-final-newline-2.0.0.tgz#89b852fb2fcbe936f6f4b3187afb0a12c1ab58ad"
  integrity sha512-BrpvfNAE3dcvq7ll3xVumzjKjZQ5tI1sEUIKr3Uoks0XUl45St3FlatVqef9prk4jRDzhW6WZg+3bk93y6pLjA==

+strip-indent@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/strip-indent/-/strip-indent-3.0.0.tgz#c32e1cee940b6b3432c771bc2c54bcce73cd3001"
+  integrity sha512-laJTa3Jb+VQpaC6DseHhF7dXVqHTfJPCRDaEbid/drOhgitgYku/letMUqOXFoWV0zIIUbjpdH2t+tYj4bQMRQ==
+  dependencies:
+    min-indent "^1.0.0"
+
 strip-json-comments@^3.1.0, strip-json-comments@^3.1.1:
  version "3.1.1"
  resolved "https://registry.yarnpkg.com/strip-json-comments/-/strip-json-comments-3.1.1.tgz#31f1281b3832630434831c310c01cccda8cbe006"
@ -11444,6 +11594,23 @@ ts-easing@^0.2.0:
  resolved "https://registry.yarnpkg.com/ts-easing/-/ts-easing-0.2.0.tgz#c8a8a35025105566588d87dbda05dd7fbfa5a4ec"
  integrity sha512-Z86EW+fFFh/IFB1fqQ3/+7Zpf9t2ebOAxNI/V6Wo7r5gqiqtxmgTlQ1qbqQcjLKYeSHPTsEmvlJUDg/EuL0uHQ==

+ts-jest@^26.4.4:
+  version "26.4.4"
+  resolved "https://registry.yarnpkg.com/ts-jest/-/ts-jest-26.4.4.tgz#61f13fb21ab400853c532270e52cc0ed7e502c49"
+  integrity sha512-3lFWKbLxJm34QxyVNNCgXX1u4o/RV0myvA2y2Bxm46iGIjKlaY0own9gIckbjZJPn+WaJEnfPPJ20HHGpoq4yg==
+  dependencies:
+    "@types/jest" "26.x"
+    bs-logger "0.x"
+    buffer-from "1.x"
+    fast-json-stable-stringify "2.x"
+    jest-util "^26.1.0"
+    json5 "2.x"
+    lodash.memoize "4.x"
+    make-error "1.x"
+    mkdirp "1.x"
+    semver "7.x"
+    yargs-parser "20.x"
+
 ts-pnp@1.2.0, ts-pnp@^1.1.6:
  version "1.2.0"
  resolved "https://registry.yarnpkg.com/ts-pnp/-/ts-pnp-1.2.0.tgz#a500ad084b0798f1c3071af391e65912c86bca92"
@ -12320,6 +12487,11 @@ yaml@^1.10.0, yaml@^1.7.2:
  resolved "https://registry.yarnpkg.com/yaml/-/yaml-1.10.0.tgz#3b593add944876077d4d683fee01081bd9fff31e"
  integrity sha512-yr2icI4glYaNG+KWONODapy2/jDdMSDnrONSjblABjD9B4Z5LgiircSt8m8sRZFNi08kG9Sm0uSHtEmP3zaEGg==

+yargs-parser@20.x:
+  version "20.2.4"
+  resolved "https://registry.yarnpkg.com/yargs-parser/-/yargs-parser-20.2.4.tgz#b42890f14566796f85ae8e3a25290d205f154a54"
+  integrity sha512-WOkpgNhPTlE73h4VFAFsOnomJVaovO8VqLDzy5saChRBFQFBoMYirowyW+Q9HB4HFF4Z7VZTiG3iSzJJA29yRA==
+
 yargs-parser@^13.1.2:
  version "13.1.2"
  resolved "https://registry.yarnpkg.com/yargs-parser/-/yargs-parser-13.1.2.tgz#130f09702ebaeef2650d54ce6e3e5706f7a4fb38"
				`@ -0,0 +1 @@`
				`import '@testing-library/jest-dom/extend-expect';`