Upgrade react-script 3.x.x to 4.x.x

Fix to unexpected token issue

Issue log

src/components/CommonStyles.tsx
  Line 4:41:  Parsing error: Unexpected token, expected ","

  2 | import { SunsetOrange, rem, xsmall } from 'styled/config';
  3 |
> 4 | export const Error = styled.p<{ noMargin?: boolean }>`
    |                                         ^
  5 |   color: ${SunsetOrange};
  6 |   font-size: ${rem(12)};
  7 |   line-height: 1;

src/components/Graphs/DataTable.tsx
  Line 28:37:  Parsing error: Unexpected token, expected ","

  26 | `;
  27 |
> 28 | const TableCell = styled.th<{ sticky?: boolean }>`
     |                                     ^
  29 |   background: ${White};
  30 |   border-bottom: 1px solid ${Plaster};
  31 |   font-size: 13px;

src/components/Icon/Icon.tsx
  Line 5:25:  Parsing error: Unexpected token, expected ","

  3 |
  4 | const Icon = styled.div<{
> 5 |   width: number | string;
    |                         ^
  6 |   height: number | string;
  7 |   color?: string;
  8 | }>`

Fix

Add this below code to your package.json after upgrading react-script from 3 to 4

"eslintConfig": {
   "extends": [
     "react-app",
     "react-app/jest"
   ]
 },