diff --git a/client/src/javascript/app.tsx b/client/src/javascript/app.tsx
index e6d330b4..f8b753a5 100644
--- a/client/src/javascript/app.tsx
+++ b/client/src/javascript/app.tsx
@@ -1,7 +1,7 @@
 import {BrowserRouter} from 'react-router-dom';
+import {createRoot} from 'react-dom/client';
 import {FC, lazy, Suspense, useEffect} from 'react';
 import {observer} from 'mobx-react';
-import ReactDOM from 'react-dom';
 import {Route, Routes} from 'react-router';
 import {useMedia} from 'react-use';
 
@@ -82,4 +82,7 @@ const FloodApp: FC = observer(() => {
   );
 });
 
-ReactDOM.render(<FloodApp />, document.getElementById('app'));
+const container = document.getElementById('app') as HTMLElement;
+const root = createRoot(container);
+
+root.render(<FloodApp />);
diff --git a/client/src/javascript/components/general/Tooltip.tsx b/client/src/javascript/components/general/Tooltip.tsx
index e5c5e41e..1d497d4f 100644
--- a/client/src/javascript/components/general/Tooltip.tsx
+++ b/client/src/javascript/components/general/Tooltip.tsx
@@ -18,6 +18,7 @@ type Clearance = Coordinates & {
 };
 
 interface TooltipProps {
+  children?: React.ReactNode;
   align?: Align;
   anchor?: Align;
   position?: Position;
diff --git a/client/src/javascript/components/modals/Modal.tsx b/client/src/javascript/components/modals/Modal.tsx
index d05df5ae..6df5b58f 100644
--- a/client/src/javascript/components/modals/Modal.tsx
+++ b/client/src/javascript/components/modals/Modal.tsx
@@ -53,7 +53,7 @@ const Modal: FC<ModalProps> = (props: ModalProps) => {
     const activeTab = tabs[activeTabId];
     const contentClasses = classnames('modal__content', activeTab.modalContentClasses);
 
-    const ModalContentComponent = activeTab.content as FC;
+    const ModalContentComponent = activeTab.content;
     const modalContentData = activeTab.props;
 
     const modalTabs = (
diff --git a/client/src/javascript/components/modals/ModalTabs.tsx b/client/src/javascript/components/modals/ModalTabs.tsx
index 649bf55a..14f130b4 100644
--- a/client/src/javascript/components/modals/ModalTabs.tsx
+++ b/client/src/javascript/components/modals/ModalTabs.tsx
@@ -4,7 +4,8 @@ import {FC, ReactNode} from 'react';
 export interface Tab {
   id?: string;
   label: ReactNode;
-  content: ReactNode | FC;
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  content: FC<any>;
   props?: Record<string, unknown>;
   modalContentClasses?: string;
 }
diff --git a/client/src/javascript/components/modals/settings-modal/UITab.tsx b/client/src/javascript/components/modals/settings-modal/UITab.tsx
index 1facd706..6697a78e 100644
--- a/client/src/javascript/components/modals/settings-modal/UITab.tsx
+++ b/client/src/javascript/components/modals/settings-modal/UITab.tsx
@@ -54,9 +54,7 @@ const UITab: FC<UITabProps> = ({onSettingsChange}: UITabProps) => {
         <Select defaultID={selectedLanguage} id="language">
           {Object.keys(Languages).map((languageID) => (
             <SelectItem key={languageID} id={languageID}>
-              {Languages[languageID as 'auto'].id != null
-                ? i18n._(Languages[languageID as 'auto'].id)
-                : Languages[languageID as Language]}
+              {languageID === 'auto' ? i18n._(Languages[languageID].id) : (Languages[languageID as Language] as string)}
             </SelectItem>
           ))}
         </Select>
diff --git a/client/src/javascript/ui/components/Button.tsx b/client/src/javascript/ui/components/Button.tsx
index e1e45f1e..fcd52b95 100644
--- a/client/src/javascript/ui/components/Button.tsx
+++ b/client/src/javascript/ui/components/Button.tsx
@@ -88,7 +88,7 @@ const Button: FC<ButtonProps> = ({
   );
 
   if (wrap) {
-    const WrapperComponent = wrapper as FC;
+    const WrapperComponent = wrapper as FC<{children?: React.ReactNode}>;
     return (
       <WrapperComponent
         {...{
diff --git a/client/src/javascript/ui/components/Form.tsx b/client/src/javascript/ui/components/Form.tsx
index 664b8eb2..9a714b07 100644
--- a/client/src/javascript/ui/components/Form.tsx
+++ b/client/src/javascript/ui/components/Form.tsx
@@ -3,6 +3,7 @@ import {Component, FormEvent, ReactNode} from 'react';
 import {getDataFromForm, resetFormData} from './util/forms';
 
 interface FormProps {
+  children?: React.ReactNode;
   className?: string;
   onChange?: ({
     event,
diff --git a/package-lock.json b/package-lock.json
index 0c323b51..862806b3 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -57,8 +57,8 @@
         "@types/parse-torrent": "^5.8.4",
         "@types/passport": "^1.0.7",
         "@types/passport-jwt": "^3.0.6",
-        "@types/react": "^17.0.45",
-        "@types/react-dom": "^17.0.16",
+        "@types/react": "^18.0.9",
+        "@types/react-dom": "^18.0.3",
         "@types/react-measure": "^2.0.8",
         "@types/react-router-dom": "^5.3.3",
         "@types/react-transition-group": "^4.4.4",
@@ -128,9 +128,9 @@
         "postcss-loader": "^6.2.1",
         "prettier": "^2.6.2",
         "promise": "^8.1.0",
-        "react": "^17.0.2",
+        "react": "^18.1.0",
         "react-dev-utils": "^12.0.1",
-        "react-dom": "^17.0.2",
+        "react-dom": "^18.1.0",
         "react-dropzone": "^14.2.1",
         "react-measure": "^2.5.2",
         "react-refresh": "^0.13.0",
@@ -3934,9 +3934,9 @@
       "dev": true
     },
     "node_modules/@types/react": {
-      "version": "17.0.45",
-      "resolved": "https://registry.npmjs.org/@types/react/-/react-17.0.45.tgz",
-      "integrity": "sha512-YfhQ22Lah2e3CHPsb93tRwIGNiSwkuz1/blk4e6QrWS0jQzCSNbGLtOEYhPg02W0yGTTmpajp7dCTbBAMN3qsg==",
+      "version": "18.0.9",
+      "resolved": "https://registry.npmjs.org/@types/react/-/react-18.0.9.tgz",
+      "integrity": "sha512-9bjbg1hJHUm4De19L1cHiW0Jvx3geel6Qczhjd0qY5VKVE2X5+x77YxAepuCwVh4vrgZJdgEJw48zrhRIeF4Nw==",
       "dev": true,
       "dependencies": {
         "@types/prop-types": "*",
@@ -3945,12 +3945,12 @@
       }
     },
     "node_modules/@types/react-dom": {
-      "version": "17.0.16",
-      "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-17.0.16.tgz",
-      "integrity": "sha512-DWcXf8EbMrO/gWnQU7Z88Ws/p16qxGpPyjTKTpmBSFKeE+HveVubqGO1CVK7FrwlWD5MuOcvh8gtd0/XO38NdQ==",
+      "version": "18.0.3",
+      "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.0.3.tgz",
+      "integrity": "sha512-1RRW9kst+67gveJRYPxGmVy8eVJ05O43hg77G2j5m76/RFJtMbcfAs2viQ2UNsvvDg8F7OfQZx8qQcl6ymygaQ==",
       "dev": true,
       "dependencies": {
-        "@types/react": "^17"
+        "@types/react": "*"
       }
     },
     "node_modules/@types/react-measure": {
@@ -14316,13 +14316,12 @@
       }
     },
     "node_modules/react": {
-      "version": "17.0.2",
-      "resolved": "https://registry.npmjs.org/react/-/react-17.0.2.tgz",
-      "integrity": "sha512-gnhPt75i/dq/z3/6q/0asP78D0u592D5L1pd7M8P+dck6Fu/jJeL6iVVK23fptSUZj8Vjf++7wXA8UNclGQcbA==",
+      "version": "18.1.0",
+      "resolved": "https://registry.npmjs.org/react/-/react-18.1.0.tgz",
+      "integrity": "sha512-4oL8ivCz5ZEPyclFQXaNksK3adutVS8l2xzZU0cqEFrE9Sb7fC0EFK5uEk74wIreL1DERyjvsU915j1pcT2uEQ==",
       "dev": true,
       "dependencies": {
-        "loose-envify": "^1.1.0",
-        "object-assign": "^4.1.1"
+        "loose-envify": "^1.1.0"
       },
       "engines": {
         "node": ">=0.10.0"
@@ -14373,17 +14372,16 @@
       }
     },
     "node_modules/react-dom": {
-      "version": "17.0.2",
-      "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-17.0.2.tgz",
-      "integrity": "sha512-s4h96KtLDUQlsENhMn1ar8t2bEa+q/YAtj8pPPdIjPDGBDIVNsrD9aXNWqspUe6AzKCIG0C1HZZLqLV7qpOBGA==",
+      "version": "18.1.0",
+      "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.1.0.tgz",
+      "integrity": "sha512-fU1Txz7Budmvamp7bshe4Zi32d0ll7ect+ccxNu9FlObT605GOEB8BfO4tmRJ39R5Zj831VCpvQ05QPBW5yb+w==",
       "dev": true,
       "dependencies": {
         "loose-envify": "^1.1.0",
-        "object-assign": "^4.1.1",
-        "scheduler": "^0.20.2"
+        "scheduler": "^0.22.0"
       },
       "peerDependencies": {
-        "react": "17.0.2"
+        "react": "^18.1.0"
       }
     },
     "node_modules/react-dropzone": {
@@ -15006,13 +15004,12 @@
       "dev": true
     },
     "node_modules/scheduler": {
-      "version": "0.20.2",
-      "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.20.2.tgz",
-      "integrity": "sha512-2eWfGgAqqWFGqtdMmcL5zCMK1U8KlXv8SQFGglL3CEtd0aDVDWgeF/YoCmvln55m5zSk3J/20hTaSBeSObsQDQ==",
+      "version": "0.22.0",
+      "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.22.0.tgz",
+      "integrity": "sha512-6QAm1BgQI88NPYymgGQLCZgvep4FyePDWFpXVK+zNSUgHwlqpJy8VEh8Et0KxTACS4VWwMousBElAZOH9nkkoQ==",
       "dev": true,
       "dependencies": {
-        "loose-envify": "^1.1.0",
-        "object-assign": "^4.1.1"
+        "loose-envify": "^1.1.0"
       }
     },
     "node_modules/schema-utils": {
@@ -20279,9 +20276,9 @@
       "dev": true
     },
     "@types/react": {
-      "version": "17.0.45",
-      "resolved": "https://registry.npmjs.org/@types/react/-/react-17.0.45.tgz",
-      "integrity": "sha512-YfhQ22Lah2e3CHPsb93tRwIGNiSwkuz1/blk4e6QrWS0jQzCSNbGLtOEYhPg02W0yGTTmpajp7dCTbBAMN3qsg==",
+      "version": "18.0.9",
+      "resolved": "https://registry.npmjs.org/@types/react/-/react-18.0.9.tgz",
+      "integrity": "sha512-9bjbg1hJHUm4De19L1cHiW0Jvx3geel6Qczhjd0qY5VKVE2X5+x77YxAepuCwVh4vrgZJdgEJw48zrhRIeF4Nw==",
       "dev": true,
       "requires": {
         "@types/prop-types": "*",
@@ -20290,12 +20287,12 @@
       }
     },
     "@types/react-dom": {
-      "version": "17.0.16",
-      "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-17.0.16.tgz",
-      "integrity": "sha512-DWcXf8EbMrO/gWnQU7Z88Ws/p16qxGpPyjTKTpmBSFKeE+HveVubqGO1CVK7FrwlWD5MuOcvh8gtd0/XO38NdQ==",
+      "version": "18.0.3",
+      "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.0.3.tgz",
+      "integrity": "sha512-1RRW9kst+67gveJRYPxGmVy8eVJ05O43hg77G2j5m76/RFJtMbcfAs2viQ2UNsvvDg8F7OfQZx8qQcl6ymygaQ==",
       "dev": true,
       "requires": {
-        "@types/react": "^17"
+        "@types/react": "*"
       }
     },
     "@types/react-measure": {
@@ -27947,13 +27944,12 @@
       }
     },
     "react": {
-      "version": "17.0.2",
-      "resolved": "https://registry.npmjs.org/react/-/react-17.0.2.tgz",
-      "integrity": "sha512-gnhPt75i/dq/z3/6q/0asP78D0u592D5L1pd7M8P+dck6Fu/jJeL6iVVK23fptSUZj8Vjf++7wXA8UNclGQcbA==",
+      "version": "18.1.0",
+      "resolved": "https://registry.npmjs.org/react/-/react-18.1.0.tgz",
+      "integrity": "sha512-4oL8ivCz5ZEPyclFQXaNksK3adutVS8l2xzZU0cqEFrE9Sb7fC0EFK5uEk74wIreL1DERyjvsU915j1pcT2uEQ==",
       "dev": true,
       "requires": {
-        "loose-envify": "^1.1.0",
-        "object-assign": "^4.1.1"
+        "loose-envify": "^1.1.0"
       }
     },
     "react-dev-utils": {
@@ -27997,14 +27993,13 @@
       }
     },
     "react-dom": {
-      "version": "17.0.2",
-      "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-17.0.2.tgz",
-      "integrity": "sha512-s4h96KtLDUQlsENhMn1ar8t2bEa+q/YAtj8pPPdIjPDGBDIVNsrD9aXNWqspUe6AzKCIG0C1HZZLqLV7qpOBGA==",
+      "version": "18.1.0",
+      "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.1.0.tgz",
+      "integrity": "sha512-fU1Txz7Budmvamp7bshe4Zi32d0ll7ect+ccxNu9FlObT605GOEB8BfO4tmRJ39R5Zj831VCpvQ05QPBW5yb+w==",
       "dev": true,
       "requires": {
         "loose-envify": "^1.1.0",
-        "object-assign": "^4.1.1",
-        "scheduler": "^0.20.2"
+        "scheduler": "^0.22.0"
       }
     },
     "react-dropzone": {
@@ -28463,13 +28458,12 @@
       "dev": true
     },
     "scheduler": {
-      "version": "0.20.2",
-      "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.20.2.tgz",
-      "integrity": "sha512-2eWfGgAqqWFGqtdMmcL5zCMK1U8KlXv8SQFGglL3CEtd0aDVDWgeF/YoCmvln55m5zSk3J/20hTaSBeSObsQDQ==",
+      "version": "0.22.0",
+      "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.22.0.tgz",
+      "integrity": "sha512-6QAm1BgQI88NPYymgGQLCZgvep4FyePDWFpXVK+zNSUgHwlqpJy8VEh8Et0KxTACS4VWwMousBElAZOH9nkkoQ==",
       "dev": true,
       "requires": {
-        "loose-envify": "^1.1.0",
-        "object-assign": "^4.1.1"
+        "loose-envify": "^1.1.0"
       }
     },
     "schema-utils": {
diff --git a/package.json b/package.json
index 4ce57154..56c4d3d9 100644
--- a/package.json
+++ b/package.json
@@ -106,8 +106,8 @@
     "@types/parse-torrent": "^5.8.4",
     "@types/passport": "^1.0.7",
     "@types/passport-jwt": "^3.0.6",
-    "@types/react": "^17.0.45",
-    "@types/react-dom": "^17.0.16",
+    "@types/react": "^18.0.9",
+    "@types/react-dom": "^18.0.3",
     "@types/react-measure": "^2.0.8",
     "@types/react-router-dom": "^5.3.3",
     "@types/react-transition-group": "^4.4.4",
@@ -177,9 +177,9 @@
     "postcss-loader": "^6.2.1",
     "prettier": "^2.6.2",
     "promise": "^8.1.0",
-    "react": "^17.0.2",
+    "react": "^18.1.0",
     "react-dev-utils": "^12.0.1",
-    "react-dom": "^17.0.2",
+    "react-dom": "^18.1.0",
     "react-dropzone": "^14.2.1",
     "react-measure": "^2.5.2",
     "react-refresh": "^0.13.0",