chore(deps): bump to react 18

Signed-off-by: Kristóf Marussy <kristof@marussy.com>

10 files changed, 58 insertions, 51 deletions

diff --git a/packages/main/esbuild.config.js b/packages/main/esbuild.config.js
index dddda75..ae8565d 100644
--- a/packages/main/esbuild.config.js
+++ b/packages/main/esbuild.config.js
@@ -13,11 +13,7 @@ const thisDir = fileUrlToDirname(import.meta.url);
 const externalPackages = ['electron'];
 
 if (process.env.MODE !== 'development') {
-  externalPackages.push(
-    'electron-devtools-installer',
-    'mkdirp',
-    'source-map-support',
-  );
+  externalPackages.push('electron-devtools-installer', 'source-map-support');
 }
 
 const gitInfo = getRepoInfo();
diff --git a/packages/main/package.json b/packages/main/package.json
index ab8155c..a746e31 100644
--- a/packages/main/package.json
+++ b/packages/main/package.json
@@ -11,31 +11,30 @@
     "@sophie/service-shared": "workspace:*",
     "@sophie/shared": "workspace:*",
     "chalk": "^5.0.1",
-    "electron": "^19.0.0-beta.3",
-    "i18next": "^21.6.16",
+    "electron": "^19.0.0-beta.4",
+    "i18next": "^21.7.1",
     "lodash-es": "^4.17.21",
     "loglevel": "^1.8.0",
     "loglevel-plugin-prefix": "^0.8.4",
     "mobx": "^6.5.0",
-    "mobx-state-tree": "^5.1.3",
-    "nanoid": "^3.3.3",
+    "mobx-state-tree": "^5.1.4",
+    "nanoid": "^3.3.4",
     "slug": "^5.3.0"
   },
   "devDependencies": {
-    "@jest/globals": "^28.0.3",
+    "@jest/globals": "^28.1.0",
     "@sophie/test-utils": "workspace:*",
     "@types/electron-devtools-installer": "^2.2.2",
     "@types/lodash-es": "^4.17.6",
-    "@types/mkdirp": "^1",
+    "@types/mkdirp": "^1.0.2",
     "@types/node": "^17.0.31",
     "@types/slug": "^5.0.3",
     "@types/source-map-support": "^0.5.4",
     "electron-devtools-installer": "^3.2.0",
     "esbuild": "^0.14.38",
     "git-repo-info": "^2.1.1",
-    "jest": "^28.0.3",
-    "jest-mock": "^28.0.2",
-    "mkdirp": "^1.0.4",
+    "jest": "^28.1.0",
+    "jest-mock": "^28.1.0",
     "source-map-support": "^0.5.21"
   }
 }
diff --git a/packages/preload/package.json b/packages/preload/package.json
index 516e455..813d618 100644
--- a/packages/preload/package.json
+++ b/packages/preload/package.json
@@ -10,17 +10,17 @@
   },
   "dependencies": {
     "@sophie/shared": "workspace:*",
-    "electron": "^19.0.0-beta.3",
-    "i18next": "^21.6.16",
+    "electron": "^19.0.0-beta.4",
+    "i18next": "^21.7.1",
     "loglevel": "^1.8.0",
     "mobx": "^6.5.0",
-    "mobx-state-tree": "^5.1.3"
+    "mobx-state-tree": "^5.1.4"
   },
   "devDependencies": {
-    "@jest/globals": "^28.0.3",
+    "@jest/globals": "^28.1.0",
     "@types/jest": "^27.5.0",
-    "jest": "^28.0.3",
-    "jest-mock": "^28.0.2",
+    "jest": "^28.1.0",
+    "jest-mock": "^28.1.0",
     "jsdom": "^19.0.0"
   }
 }
diff --git a/packages/renderer/package.json b/packages/renderer/package.json
index 6358009..2a83a1f 100644
--- a/packages/renderer/package.json
+++ b/packages/renderer/package.json
@@ -13,35 +13,35 @@
     "@emotion/styled": "^11.8.1",
     "@fontsource/roboto": "^4.5.5",
     "@mui/icons-material": "^5.6.2",
-    "@mui/material": "^5.6.2",
+    "@mui/material": "^5.6.4",
     "@sophie/shared": "workspace:*",
-    "i18next": "^21.6.16",
+    "i18next": "^21.7.1",
     "lodash-es": "^4.17.21",
     "loglevel": "^1.8.0",
     "loglevel-plugin-prefix": "^0.8.4",
     "mobx": "^6.5.0",
-    "mobx-react-lite": "^3.3.0",
-    "mobx-state-tree": "^5.1.3",
-    "react": "^17.0.2",
-    "react-dom": "^17.0.2",
-    "react-i18next": "^11.16.7",
+    "mobx-react-lite": "^3.4.0",
+    "mobx-state-tree": "^5.1.4",
+    "react": "^18.1.0",
+    "react-dom": "^18.1.0",
+    "react-i18next": "^11.16.9",
     "stylis": "^4.1.1",
     "stylis-plugin-rtl": "^2.1.1"
   },
   "devDependencies": {
-    "@jest/globals": "^28.0.3",
+    "@jest/globals": "^28.1.0",
     "@types/jest": "^27.5.0",
     "@types/lodash-es": "^4.17.6",
-    "@types/react": "^17.0.44",
-    "@types/react-dom": "^17.0.15",
+    "@types/react": "^18.0.9",
+    "@types/react-dom": "^18.0.3",
     "@types/stylis": "^4.0.2",
     "@vitejs/plugin-react": "^1.3.2",
-    "jest": "^28.0.3",
-    "jest-environment-jsdom": "^28.0.2",
-    "jest-mock": "^28.0.2",
+    "jest": "^28.1.0",
+    "jest-environment-jsdom": "^28.1.0",
+    "jest-mock": "^28.1.0",
     "jsdom": "^19.0.0",
-    "mst-middlewares": "^5.1.3",
+    "mst-middlewares": "^5.1.4",
     "remotedev": "^0.2.9",
-    "vite": "^2.9.7"
+    "vite": "^2.9.8"
   }
 }
diff --git a/packages/renderer/src/components/banner/NewWindowBanner.tsx b/packages/renderer/src/components/banner/NewWindowBanner.tsx
index 07fafda..685badf 100644
--- a/packages/renderer/src/components/banner/NewWindowBanner.tsx
+++ b/packages/renderer/src/components/banner/NewWindowBanner.tsx
@@ -96,14 +96,20 @@ function NewWindowBanner({
       }
     >
       {count === 1 ? (
-        <Trans i18nKey="messageSingleLink" t={t}>
-          {{ name }} wants to open <strong>{{ url }}</strong> in a new window
-        </Trans>
+        <Trans
+          i18nKey="messageSingleLink"
+          t={t}
+          components={[<strong>url</strong>]}
+          values={{ name, url }}
+        />
       ) : (
-        <Trans i18nKey="messageMultipleLinks" count={count - 1} t={t}>
-          {{ name }} wants to open <strong>{{ url }}</strong> and{' '}
-          <strong>{{ count: count - 1 }}</strong> other links in new windows
-        </Trans>
+        <Trans
+          i18nKey="messageMultipleLinks"
+          count={count - 1}
+          t={t}
+          components={[<strong>url</strong>, <strong>count</strong>]}
+          values={{ name, url, count: count - 1 }}
+        />
       )}
     </NotificationBanner>
   );
diff --git a/packages/renderer/src/index.tsx b/packages/renderer/src/index.tsx
index 72a9ffd..726e00e 100644
--- a/packages/renderer/src/index.tsx
+++ b/packages/renderer/src/index.tsx
@@ -26,7 +26,7 @@ import CssBaseline from '@mui/material/CssBaseline';
 import { autorun } from 'mobx';
 import { addDisposer } from 'mobx-state-tree';
 import React, { Suspense, lazy } from 'react';
-import { render } from 'react-dom';
+import { createRoot } from 'react-dom/client';
 
 import Loading from './components/Loading';
 import StoreProvider from './components/StoreProvider';
@@ -88,4 +88,10 @@ function Root(): JSX.Element {
   );
 }
 
-render(<Root />, document.querySelector('#app'));
+const rootElement = document.querySelector('#app');
+if (rootElement === null) {
+  log.error('Root element not found');
+} else {
+  const root = createRoot(rootElement);
+  root.render(<Root />);
+}
diff --git a/packages/service-preload/package.json b/packages/service-preload/package.json
index 6cbefb0..4344b7d 100644
--- a/packages/service-preload/package.json
+++ b/packages/service-preload/package.json
@@ -10,7 +10,7 @@
   "dependencies": {
     "@sophie/service-inject": "workspace:*",
     "@sophie/service-shared": "workspace:*",
-    "electron": "^19.0.0-beta.3"
+    "electron": "^19.0.0-beta.4"
   },
   "devDependencies": {
     "@types/color-string": "^1.5.2"
diff --git a/packages/service-shared/package.json b/packages/service-shared/package.json
index 2bd47e9..75ee037 100644
--- a/packages/service-shared/package.json
+++ b/packages/service-shared/package.json
@@ -11,6 +11,6 @@
     "types": "yarn g:types"
   },
   "dependencies": {
-    "zod": "^3.14.4"
+    "zod": "^3.15.1"
   }
 }
diff --git a/packages/shared/package.json b/packages/shared/package.json
index 19b7bb2..db8a6e9 100644
--- a/packages/shared/package.json
+++ b/packages/shared/package.json
@@ -11,9 +11,9 @@
     "types": "yarn g:types"
   },
   "dependencies": {
-    "i18next": "^21.6.16",
+    "i18next": "^21.7.1",
     "mobx": "^6.5.0",
-    "mobx-state-tree": "^5.1.3",
-    "zod": "^3.14.4"
+    "mobx-state-tree": "^5.1.4",
+    "zod": "^3.15.1"
   }
 }
diff --git a/packages/test-utils/package.json b/packages/test-utils/package.json
index c6f4945..8f7bb0e 100644
--- a/packages/test-utils/package.json
+++ b/packages/test-utils/package.json
@@ -11,8 +11,8 @@
   },
   "dependencies": {
     "@types/jest": "^27.5.0",
-    "jest": "^28.0.3",
-    "jest-each": "^28.0.2",
+    "jest": "^28.1.0",
+    "jest-each": "^28.1.0",
     "type-fest": "^2.12.2"
   }
 }