Feature/update dependency react to v18.x (#346)

* Update dependency "react" to v18.x

Update to v18.2.0

* Update dependency "react" to v18.x - Fix some dependency version issue

Something caused weird tsc issues, most likely a version mismatch since it got fixed by doing a clean install (deleting node_modules folder, yarn.lock and clearing the cache) of the dependencies

* Update dependency "react" to v18.x - Fix "i18n" tsc issues

* Update dependency "react" to v18.x - Fix tsc issue

Typography can only have a single child

* Update dependency "react" to v18.x - Prevent build warning

TODO: migrate to Vite

Gets used without being declared as a dependency.
Since CRA is unmaintained this will not get fixed.

* Update dependency "react" to v18.x - Use "createRoot"

* Update dependency "react" to v18.x - Fix dnd in strict mode

src/lib/StrictModeDroppable.tsx

@@ -0,0 +1,31 @@
+/*
+ * Copyright (C) Contributors to the Suwayomi project
+ *
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at https://mozilla.org/MPL/2.0/.
+ */
+
+import React, { useEffect, useState } from 'react';
+import { Droppable, DroppableProps } from 'react-beautiful-dnd';
+
+// issue: https://github.com/atlassian/react-beautiful-dnd/issues/2399
+// credit for fix: https://github.com/atlassian/react-beautiful-dnd/issues/2399#issuecomment-1175638194
+export default function StrictModeDroppable({ children, ...props }: DroppableProps) {
+    const [enabled, setEnabled] = useState(false);
+
+    useEffect(() => {
+        const animation = requestAnimationFrame(() => setEnabled(true));
+
+        return () => {
+            cancelAnimationFrame(animation);
+            setEnabled(false);
+        };
+    }, []);
+
+    if (!enabled) {
+        return null;
+    }
+
+    return <Droppable {...props}>{children}</Droppable>;
+}