chore: migrate to mui 5

package.json

@@ -9,16 +9,15 @@
  "@mui/material": "^5.6.3",
  "@mui/styles": "^5.6.2",
  "@mui/types": "^7.1.3",
- "@testing-library/jest-dom": "^5.11.4",
  "@testing-library/react": "^11.1.0",
  "@testing-library/user-event": "^12.1.10",
  "@types/jest": "^26.0.15",
  "@types/node": "^12.0.0",
  "@types/react": "^17.0.0",
  "@types/react-dom": "^17.0.0",
  "axios": "0.21.1",
- "react": "^17.0.2",
- "react-dom": "^17.0.2",
+ "react": "^18.1.0",
+ "react-dom": "^18.1.0",
  "react-query": "^3.38.0",
  "react-router-dom": "^5.2.0",
  "react-scripts": "^5.0.1",

src/index.tsx

@@ -1,11 +1,17 @@
 import { StrictMode } from 'react';
 import ReactDOM from 'react-dom';
+import { createRoot } from 'react-dom/client';
 import App from './App';
 // import { AuthProvider } from './contexts/JWTContext';
 
-ReactDOM.render(
- <StrictMode>
- <App />
- </StrictMode>,
- document.getElementById('root'),
-);
+// ReactDOM.render(
+// <StrictMode>
+// <App />
+// </StrictMode>,
+// document.getElementById('root'),
+// );
+
+const container = document.getElementById('app');
+const root = createRoot(container); // createRoot(container!) if you use TypeScript
+root.render(<App tab="home" />);
+

yarn.lock

@@ -7672,14 +7672,13 @@ react-dev-utils@^12.0.1:
  strip-ansi "^6.0.1"
  text-table "^0.2.0"
 
-react-dom@^17.0.2:
- version "17.0.2"
- resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-17.0.2.tgz#ecffb6845e3ad8dbfcdc498f0d0a939736502c23"
- integrity sha512-s4h96KtLDUQlsENhMn1ar8t2bEa+q/YAtj8pPPdIjPDGBDIVNsrD9aXNWqspUe6AzKCIG0C1HZZLqLV7qpOBGA==
+react-dom@^18.1.0:
+ version "18.1.0"
+ resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-18.1.0.tgz#7f6dd84b706408adde05e1df575b3a024d7e8a2f"
+ integrity sha512-fU1Txz7Budmvamp7bshe4Zi32d0ll7ect+ccxNu9FlObT605GOEB8BfO4tmRJ39R5Zj831VCpvQ05QPBW5yb+w==
  dependencies:
  loose-envify "^1.1.0"
- object-assign "^4.1.1"
- scheduler "^0.20.2"
+ scheduler "^0.22.0"
 
 react-error-overlay@^6.0.11:
  version "6.0.11"
@@ -7809,13 +7808,12 @@ react-transition-group@^4.4.2:
  loose-envify "^1.4.0"
  prop-types "^15.6.2"
 
-react@^17.0.2:
- version "17.0.2"
- resolved "https://registry.yarnpkg.com/react/-/react-17.0.2.tgz#d0b5cc516d29eb3eee383f75b62864cfb6800037"
- integrity sha512-gnhPt75i/dq/z3/6q/0asP78D0u592D5L1pd7M8P+dck6Fu/jJeL6iVVK23fptSUZj8Vjf++7wXA8UNclGQcbA==
+react@^18.1.0:
+ version "18.1.0"
+ resolved "https://registry.yarnpkg.com/react/-/react-18.1.0.tgz#6f8620382decb17fdc5cc223a115e2adbf104890"
+ integrity sha512-4oL8ivCz5ZEPyclFQXaNksK3adutVS8l2xzZU0cqEFrE9Sb7fC0EFK5uEk74wIreL1DERyjvsU915j1pcT2uEQ==
  dependencies:
  loose-envify "^1.1.0"
- object-assign "^4.1.1"
 
 readable-stream@^2.0.1:
  version "2.3.7"
@@ -8100,13 +8098,12 @@ saxes@^5.0.1:
  dependencies:
  xmlchars "^2.2.0"
 
-scheduler@^0.20.2:
- version "0.20.2"
- resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.20.2.tgz#4baee39436e34aa93b4874bddcbf0fe8b8b50e91"
- integrity sha512-2eWfGgAqqWFGqtdMmcL5zCMK1U8KlXv8SQFGglL3CEtd0aDVDWgeF/YoCmvln55m5zSk3J/20hTaSBeSObsQDQ==
+scheduler@^0.22.0:
+ version "0.22.0"
+ resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.22.0.tgz#83a5d63594edf074add9a7198b1bae76c3db01b8"
+ integrity sha512-6QAm1BgQI88NPYymgGQLCZgvep4FyePDWFpXVK+zNSUgHwlqpJy8VEh8Et0KxTACS4VWwMousBElAZOH9nkkoQ==
  dependencies:
  loose-envify "^1.1.0"
- object-assign "^4.1.1"
 
 [email protected]:
  version "2.7.0"