Prevent scrollbar from shortly disappearing on library category change

Due to the MangaGrid getting unmounted when changing the category, the "y overflow" value got reset to "auto" which caused the scrollbar from disappearing and immediately reappearing again.
This caused the site content to slightly "jump" due to the increase and immediate decrease in is width.

Related commit 871908eba9

src/components/MangaGrid.tsx

@@ -288,7 +288,7 @@ export const MangaGrid: React.FC<IMangaGridProps> = ({
             clearTimeout(timeout);
         };
     }, [gridLayout]);
-    useEffect(
+    useLayoutEffect(
         () => () => {
             document.body.style.overflowY = 'auto';
         },

src/components/library/LibraryMangaGrid.tsx

@@ -6,11 +6,11 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import React, { useEffect } from 'react';
+import React, { useEffect, useLayoutEffect } from 'react';
 import { StringParam, useQueryParam } from 'use-query-params';
 import { useTranslation } from 'react-i18next';
 import { TManga } from '@/typings';
-import { useLibraryOptionsContext } from '@/components/context/LibraryOptionsContext';
+import { GridLayout, useLibraryOptionsContext } from '@/components/context/LibraryOptionsContext';
 import { IMangaGridProps, MangaGrid } from '@/components/MangaGrid';
 
 interface LibraryMangaGridProps
@@ -37,6 +37,13 @@ export const LibraryMangaGrid: React.FC<LibraryMangaGridProps> = ({
         window.scrollTo(0, 0);
     }, [query, unread, downloaded]);
 
+    useLayoutEffect(() => {
+        document.body.style.overflowY = options.gridLayout === GridLayout.List ? 'auto' : 'scroll';
+        return () => {
+            document.body.style.overflowY = 'auto';
+        };
+    }, []);
+
     return (
         <MangaGrid
             {...gridProps}