Update lint rules

.oxlintrc.jsonc

@@ -1,36 +1,34 @@
 {
   "plugins": [
     "react",
+    "unicorn",
     "typescript",
     "import",
     "jsx-a11y"
   ],
   "jsPlugins": [
     "eslint-plugin-lingui",
-    "eslint-plugin-no-relative-import-paths"
+    "eslint-plugin-no-relative-import-paths",
+    "eslint-plugin-unused-imports",
+    "eslint-plugin-no-only-tests"
   ],
   "categories": {
     "correctness": "off"
   },
   "rules": {
     // ── Core JS: correctness (from js.configs.recommended) ──
-    "constructor-super": "error",
+    // Rules redundant with TypeScript strict mode have been removed.
     "for-direction": "error",
-    "getter-return": "error",
     "no-async-promise-executor": "error",
     "no-case-declarations": "error",
-    "no-class-assign": "error",
     "no-compare-neg-zero": "error",
     "no-cond-assign": "error",
-    "no-const-assign": "error",
     "no-constant-binary-expression": "error",
     "no-constant-condition": "error",
     "no-control-regex": "error",
     "no-debugger": "error",
     "no-delete-var": "error",
-    "no-dupe-class-members": "error",
     "no-dupe-else-if": "error",
-    "no-dupe-keys": "error",
     "no-duplicate-case": "error",
     "no-empty": "error",
     "no-empty-character-class": "error",
@@ -38,29 +36,17 @@
     "no-empty-static-block": "error",
     "no-ex-assign": "error",
     "no-extra-boolean-cast": "error",
-    "no-fallthrough": "error",
-    "no-func-assign": "error",
-    "no-global-assign": "error",
-    "no-import-assign": "error",
     "no-invalid-regexp": "error",
     "no-irregular-whitespace": "error",
     "no-loss-of-precision": "error",
     "no-misleading-character-class": "error",
-    "no-new-native-nonconstructor": "error",
     "no-nonoctal-decimal-escape": "error",
-    "no-obj-calls": "error",
     "no-prototype-builtins": "error",
-    "no-redeclare": "error",
     "no-regex-spaces": "error",
     "no-self-assign": "error",
-    "no-setter-return": "error",
     "no-shadow-restricted-names": "error",
     "no-sparse-arrays": "error",
-    "no-this-before-super": "error",
-    "no-undef": "error",
-    "no-unreachable": "error",
     "no-unsafe-finally": "error",
-    "no-unsafe-negation": "error",
     "no-unsafe-optional-chaining": "error",
     "no-unused-labels": "error",
     "no-unused-private-class-members": "error",
@@ -81,13 +67,11 @@
     "no-with": "error",
     "require-yield": "error",
     "use-isnan": "error",
-    "valid-typeof": "error",
     "no-array-constructor": "error",
     "no-unused-expressions": "error",
 
-    // ── Core JS: Airbnb-style rules ──
+    // ── Core JS: style & best practices ──
-    "no-console": "warn",
+    "no-console": "error",
-    "no-nested-ternary": "error",
     "no-else-return": [
       "error",
       {
@@ -113,13 +97,8 @@
     "no-eval": "error",
     "no-script-url": "error",
     "no-self-compare": "error",
-    "no-proto": "error",
     "no-extend-native": "error",
-    "no-caller": "error",
+    "no-alert": "error",
-    "no-alert": "warn",
-    "no-void": "error",
-    "no-bitwise": "error",
-    "no-continue": "error",
     "no-restricted-globals": [
       "error",
       "isFinite",
@@ -140,7 +119,6 @@
         "null": "ignore"
       }
     ],
-    "guard-for-in": "error",
     "default-case": [
       "error",
       {
@@ -148,29 +126,8 @@
       }
     ],
     "default-case-last": "error",
-    "radix": "error",
     "yoda": "error",
-    "max-classes-per-file": [
-      "error",
-      1
-    ],
     "prefer-template": "error",
-    "prefer-destructuring": [
-      "error",
-      {
-        "VariableDeclarator": {
-          "array": false,
-          "object": true
-        },
-        "AssignmentExpression": {
-          "array": true,
-          "object": false
-        }
-      },
-      {
-        "enforceForRenamedProperties": false
-      }
-    ],
     "prefer-exponentiation-operator": "error",
     "prefer-object-spread": "error",
     "prefer-promise-reject-errors": [
@@ -188,12 +145,6 @@
         ]
       }
     ],
-    "no-plusplus": [
-      "error",
-      {
-        "allowForLoopAfterthoughts": true
-      }
-    ],
     "no-restricted-imports": [
       "error",
       {
@@ -215,6 +166,19 @@
       }
     ],
 
+    // ── New: modern JS essentials ──
+    "prefer-const": "error",
+    "no-var": "error",
+    "curly": "error",
+    "no-warning-comments": [
+      "error",
+      {
+        "terms": [
+          "@nocommit"
+        ]
+      }
+    ],
+
     // ── TypeScript rules (non-type-checked) ──
     "no-shadow": "error",
     "no-loop-func": "error",
@@ -243,6 +207,13 @@
     "typescript/prefer-namespace-keyword": "error",
     "typescript/triple-slash-reference": "error",
 
+    // ── New: TypeScript safety ──
+    "typescript/no-explicit-any": "off",
+    "typescript/no-empty-object-type": "error",
+    "typescript/no-unsafe-function-type": "error",
+    "typescript/consistent-type-imports": "error",
+    "typescript/switch-exhaustiveness-check": "error",
+
     // ── TypeScript rules (type-checked) ──
     "typescript/no-implied-eval": "error",
     "typescript/only-throw-error": "error",
@@ -256,7 +227,7 @@
     "import/namespace": "error",
     "import/default": "error",
     "import/export": "error",
-    "import/no-duplicates": "warn",
+    "import/no-duplicates": "error",
     "import/no-mutable-exports": "error",
     "import/first": "error",
     "import/no-amd": "error",
@@ -264,23 +235,11 @@
     "import/no-self-import": "error",
     "import/no-default-export": "error",
 
-    // ── Lingui (via jsPlugin) ──
+    // ── Unicorn: modern JS (auto-fixable) ──
-    "lingui/t-call-in-function": "error",
+    "unicorn/prefer-array-flat-map": "error",
-    "lingui/no-single-tag-to-translate": "warn",
+    "unicorn/prefer-structured-clone": "error",
-    "lingui/no-single-variables-to-translate": "warn",
+    "unicorn/prefer-string-replace-all": "error",
-    "lingui/no-trans-inside-trans": "warn",
+    "unicorn/consistent-function-scoping": "error",
-    "lingui/no-expression-in-message": "off",
-
-    // ── Header — handled by minimal ESLint fallback ──
-
-    // ── No relative import paths (via jsPlugin) ──
-    "no-relative-import-paths/no-relative-import-paths": [
-      "error",
-      {
-        "rootDir": "src",
-        "prefix": "@"
-      }
-    ],
 
     // ── React rules ──
     "react/jsx-key": "error",
@@ -290,14 +249,9 @@
     "react/jsx-no-undef": "error",
     "react/no-children-prop": "error",
     "react/no-danger-with-children": "error",
-    "react/no-direct-mutation-state": "error",
-    "react/no-find-dom-node": "error",
-    "react/no-is-mounted": "error",
     "react/no-render-return-value": "error",
-    "react/no-string-refs": "error",
     "react/no-unescaped-entities": "error",
     "react/no-unknown-property": "error",
-    "react/require-render-return": "error",
     "react/rules-of-hooks": "error",
     "react/no-array-index-key": "error",
     "react/jsx-no-useless-fragment": "error",
@@ -328,12 +282,7 @@
     "react/jsx-no-script-url": "error",
     "react/style-prop-object": "error",
     "react/void-dom-elements-no-children": "error",
-    "react/no-danger": "warn",
+    "react/no-danger": "error",
-    "react/no-this-in-sfc": "error",
-    "react/state-in-constructor": [
-      "error",
-      "always"
-    ],
 
     // ── jsx-a11y rules ──
     "jsx_a11y/alt-text": "error",

package.json

@@ -110,7 +110,9 @@
         "dotenv": "17.3.1",
         "eslint": "9.39.4",
         "eslint-plugin-lingui": "0.11.0",
+        "eslint-plugin-no-only-tests": "3.3.0",
         "eslint-plugin-no-relative-import-paths": "1.6.1",
+        "eslint-plugin-unused-imports": "4.4.1",
         "husky": "9.1.7",
         "lint-staged": "16.3.2",
         "oxfmt": "0.37.0",

src/UtilTypes.d.ts

@@ -44,7 +44,7 @@ type ExtractValueWithDefaultFlag<T extends ValueWithDefaultFlag<any>> = T extend
 
 type MergeObjectsArray<T extends object[]> = T extends [infer F, ...infer R]
     ? F & MergeObjectsArray<R extends object[] ? R : []>
-    : {};
+    : Record<string, never>;
 
 type OmitNotMatching<T, K extends keyof T> = {
     [P in K]: T[K];

src/assets/SuwayomiLogo.tsx

@@ -6,7 +6,8 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import SvgIcon, { SvgIconProps } from '@mui/material/SvgIcon';
+import type { SvgIconProps } from '@mui/material/SvgIcon';
+import SvgIcon from '@mui/material/SvgIcon';
 
 export const SuwayomiLogo = ({
     circleRingColor = '#35d4d5',

src/base/AppRoute.constants.ts

@@ -6,11 +6,11 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import { SourceType } from '@/lib/graphql/generated/graphql.ts';
+import type { SourceType } from '@/lib/graphql/generated/graphql.ts';
-import { MangaIdInfo } from '@/features/manga/Manga.types.ts';
+import type { MangaIdInfo } from '@/features/manga/Manga.types.ts';
 
-import { ChapterSourceOrderInfo } from '@/features/chapter/Chapter.types.ts';
+import type { ChapterSourceOrderInfo } from '@/features/chapter/Chapter.types.ts';
-import { BrowseTab } from '@/features/browse/Browse.types.ts';
+import type { BrowseTab } from '@/features/browse/Browse.types.ts';
 import { SearchParam } from '@/base/Base.types.ts';
 import { UrlUtil } from '@/lib/UrlUtil.ts';
 

src/base/Base.types.ts

@@ -6,8 +6,8 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import { MessageDescriptor } from '@lingui/core';
+import type { MessageDescriptor } from '@lingui/core';
-import { ReactNode } from 'react';
+import type { ReactNode } from 'react';
 
 export enum GridLayout {
     Compact = 0,

src/base/IsoLanguages.ts

@@ -6,7 +6,7 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import { I18nResourceCode } from '@/i18n';
+import type { I18nResourceCode } from '@/i18n';
 
 export type ISOLanguage = {
     name: string;

src/base/components/AppbarSearch.tsx

@@ -74,7 +74,9 @@ export const AppbarSearch: React.FunctionComponent<IProps> = (props) => {
         updateSearchOpenState(false);
     };
     const handleBlur = () => {
-        if (!searchString) updateSearchOpenState(false);
+        if (!searchString) {
+            updateSearchOpenState(false);
+        }
     };
 
     useHotkeys(

src/base/components/AvatarSpinner.tsx

@@ -6,8 +6,10 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import Avatar, { AvatarProps } from '@mui/material/Avatar';
+import type { AvatarProps } from '@mui/material/Avatar';
-import { SpinnerImage, SpinnerImageProps } from '@/base/components/SpinnerImage.tsx';
+import Avatar from '@mui/material/Avatar';
+import type { SpinnerImageProps } from '@/base/components/SpinnerImage.tsx';
+import { SpinnerImage } from '@/base/components/SpinnerImage.tsx';
 
 export const AvatarSpinner = ({
     iconUrl,

src/base/components/CustomTooltip.tsx

@@ -6,7 +6,8 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import Tooltip, { TooltipProps } from '@mui/material/Tooltip';
+import type { TooltipProps } from '@mui/material/Tooltip';
+import Tooltip from '@mui/material/Tooltip';
 
 export const CustomTooltip = ({
     children,

src/base/components/SpinnerImage.tsx

@@ -6,7 +6,8 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import { useState, useEffect, useCallback, useRef, Ref } from 'react';
+import type { Ref } from 'react';
+import { useState, useEffect, useCallback, useRef } from 'react';
 import CircularProgress from '@mui/material/CircularProgress';
 import Box from '@mui/material/Box';
 import Stack from '@mui/material/Stack';
@@ -14,11 +15,12 @@ import Button from '@mui/material/Button';
 import BrokenImageIcon from '@mui/icons-material/BrokenImage';
 import RefreshIcon from '@mui/icons-material/Refresh';
 import ImageIcon from '@mui/icons-material/Image';
-import { SxProps, Theme } from '@mui/material/styles';
+import type { SxProps, Theme } from '@mui/material/styles';
 import { useLingui } from '@lingui/react/macro';
 import { usePrevious } from '@mantine/hooks';
-import { ImageRequest, requestManager } from '@/lib/requests/RequestManager.ts';
+import type { ImageRequest } from '@/lib/requests/RequestManager.ts';
-import { Priority } from '@/lib/Queue.ts';
+import { requestManager } from '@/lib/requests/RequestManager.ts';
+import type { Priority } from '@/lib/Queue.ts';
 import { applyStyles } from '@/base/utils/ApplyStyles.ts';
 import { useIntersectionObserver } from '@/base/hooks/useIntersectionObserver.tsx';
 import { noOp } from '@/lib/HelperFunctions.ts';

src/base/components/buttons/ButtonSelect.tsx

@@ -10,7 +10,7 @@ import Stack from '@mui/material/Stack';
 import Button from '@mui/material/Button';
 import { useLingui } from '@lingui/react/macro';
 import { CustomTooltip } from '@/base/components/CustomTooltip.tsx';
-import { MultiValueButtonProps } from '@/base/Base.types.ts';
+import type { MultiValueButtonProps } from '@/base/Base.types.ts';
 import { Superscript } from '@/base/components/texts/Superscript.tsx';
 
 export const ButtonSelect = <Value extends string | number>({

src/base/components/buttons/CustomButton.tsx

@@ -6,7 +6,8 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import Button, { ButtonProps } from '@mui/material/Button';
+import type { ButtonProps } from '@mui/material/Button';
+import Button from '@mui/material/Button';
 import Stack from '@mui/material/Stack';
 
 export const CustomButton = <C extends React.ElementType>({

src/base/components/buttons/CustomButtonIcon.tsx

@@ -6,7 +6,8 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import Button, { ButtonProps } from '@mui/material/Button';
+import type { ButtonProps } from '@mui/material/Button';
+import Button from '@mui/material/Button';
 
 export const CustomButtonIcon = <C extends React.ElementType>({
     children,

src/base/components/buttons/ResetButton.tsx

@@ -6,9 +6,11 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import Button, { ButtonProps } from '@mui/material/Button';
+import type { ButtonProps } from '@mui/material/Button';
+import Button from '@mui/material/Button';
 import RestartAltIcon from '@mui/icons-material/RestartAlt';
-import IconButton, { IconButtonProps } from '@mui/material/IconButton';
+import type { IconButtonProps } from '@mui/material/IconButton';
+import IconButton from '@mui/material/IconButton';
 import { useLingui } from '@lingui/react/macro';
 import { CustomTooltip } from '@/base/components/CustomTooltip.tsx';
 

src/base/components/buttons/ValueRotationButton.tsx

@@ -6,11 +6,12 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import { ReactNode, useMemo } from 'react';
+import type { ReactNode } from 'react';
+import { useMemo } from 'react';
 import Button from '@mui/material/Button';
 import { useLingui } from '@lingui/react/macro';
 import { CustomTooltip } from '@/base/components/CustomTooltip.tsx';
-import { MultiValueButtonProps } from '@/base/Base.types.ts';
+import type { MultiValueButtonProps } from '@/base/Base.types.ts';
 import { getNextRotationValue } from '@/base/utils/ValueRotationButton.utils.ts';
 import { Superscript } from '@/base/components/texts/Superscript.tsx';
 

src/base/components/downloads/DownloadStateIndicator.tsx

@@ -6,7 +6,7 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import { MessageDescriptor } from '@lingui/core';
+import type { MessageDescriptor } from '@lingui/core';
 import CircularProgress from '@mui/material/CircularProgress';
 import Box from '@mui/material/Box';
 import Typography from '@mui/material/Typography';
@@ -14,7 +14,7 @@ import { useLingui } from '@lingui/react/macro';
 import { msg } from '@lingui/core/macro';
 import { DownloadState } from '@/lib/graphql/generated/graphql.ts';
 import { Chapters } from '@/features/chapter/services/Chapters.ts';
-import { ChapterIdInfo } from '@/features/chapter/Chapter.types.ts';
+import type { ChapterIdInfo } from '@/features/chapter/Chapter.types.ts';
 
 const DOWNLOAD_STATE_TO_TRANSLATION_MAP: { [state in DownloadState]: MessageDescriptor } = {
     DOWNLOADING: msg`Downloading`,

src/base/components/feedback/EmptyView.tsx

@@ -10,7 +10,7 @@
 
 import { type JSX, useMemo, useState } from 'react';
 import Typography from '@mui/material/Typography';
-import { SxProps, Theme } from '@mui/material/styles';
+import type { SxProps, Theme } from '@mui/material/styles';
 import Button from '@mui/material/Button';
 import Stack from '@mui/material/Stack';
 import Collapse from '@mui/material/Collapse';

src/base/components/feedback/EmptyViewAbsoluteCentered.tsx

@@ -6,7 +6,8 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import { EmptyView, EmptyViewProps } from '@/base/components/feedback/EmptyView.tsx';
+import type { EmptyViewProps } from '@/base/components/feedback/EmptyView.tsx';
+import { EmptyView } from '@/base/components/feedback/EmptyView.tsx';
 
 export function EmptyViewAbsoluteCentered({ sx, ...emptyViewProps }: EmptyViewProps) {
     return (

src/base/components/feedback/ErrorBoundary.tsx

@@ -6,7 +6,8 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import { Component, ErrorInfo, ReactNode, useEffect, useRef, useState } from 'react';
+import type { ErrorInfo, ReactNode } from 'react';
+import { Component, useEffect, useRef, useState } from 'react';
 import { useLocation } from 'react-router-dom';
 import { t } from '@lingui/core/macro';
 import { getErrorMessage } from '@/lib/HelperFunctions.ts';

src/base/components/feedback/Progress.tsx

@@ -7,7 +7,8 @@
  */
 
 import Box from '@mui/material/Box';
-import CircularProgress, { CircularProgressProps } from '@mui/material/CircularProgress';
+import type { CircularProgressProps } from '@mui/material/CircularProgress';
+import CircularProgress from '@mui/material/CircularProgress';
 import Typography from '@mui/material/Typography';
 
 export const Progress = ({

src/base/components/feedback/SnackbarWithDescription.tsx

@@ -6,9 +6,11 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import { MessageDescriptor } from '@lingui/core';
+import type { MessageDescriptor } from '@lingui/core';
-import { closeSnackbar, CustomContentProps, SnackbarContent, VariantType } from 'notistack';
+import type { CustomContentProps, VariantType } from 'notistack';
-import { ForwardedRef, Fragment, memo } from 'react';
+import { closeSnackbar, SnackbarContent } from 'notistack';
+import type { ForwardedRef } from 'react';
+import { Fragment, memo } from 'react';
 import Alert from '@mui/material/Alert';
 import AlertTitle from '@mui/material/AlertTitle';
 import Button from '@mui/material/Button';

src/base/components/inputs/ButtonSelectInput.tsx

@@ -8,7 +8,7 @@
 
 import Stack from '@mui/material/Stack';
 import Typography from '@mui/material/Typography';
-import { ComponentProps } from 'react';
+import type { ComponentProps } from 'react';
 
 import { ButtonSelect } from '@/base/components/buttons/ButtonSelect.tsx';
 

src/base/components/inputs/CheckboxInput.tsx

@@ -6,8 +6,10 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import Checkbox, { CheckboxProps } from '@mui/material/Checkbox';
+import type { CheckboxProps } from '@mui/material/Checkbox';
-import FormControlLabel, { FormControlLabelProps } from '@mui/material/FormControlLabel';
+import Checkbox from '@mui/material/Checkbox';
+import type { FormControlLabelProps } from '@mui/material/FormControlLabel';
+import FormControlLabel from '@mui/material/FormControlLabel';
 import React from 'react';
 
 interface IProps extends CheckboxProps {

src/base/components/inputs/PasswordTextField.tsx

@@ -7,7 +7,8 @@
  */
 
 import InputAdornment from '@mui/material/InputAdornment';
-import TextField, { TextFieldProps } from '@mui/material/TextField';
+import type { TextFieldProps } from '@mui/material/TextField';
+import TextField from '@mui/material/TextField';
 import { useState } from 'react';
 import IconButton from '@mui/material/IconButton';
 import Visibility from '@mui/icons-material/Visibility';

src/base/components/inputs/RadioInput.tsx

@@ -7,7 +7,8 @@
  */
 
 import FormControlLabel from '@mui/material/FormControlLabel';
-import Radio, { RadioProps } from '@mui/material/Radio';
+import type { RadioProps } from '@mui/material/Radio';
+import Radio from '@mui/material/Radio';
 import React from 'react';
 
 export interface RadioInputProps extends RadioProps {

src/base/components/inputs/SearchTextField.tsx

@@ -6,8 +6,10 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import TextField, { TextFieldProps } from '@mui/material/TextField';
+import type { TextFieldProps } from '@mui/material/TextField';
-import IconButton, { IconButtonProps } from '@mui/material/IconButton';
+import TextField from '@mui/material/TextField';
+import type { IconButtonProps } from '@mui/material/IconButton';
+import IconButton from '@mui/material/IconButton';
 import InputAdornment from '@mui/material/InputAdornment';
 import CancelIcon from '@mui/icons-material/Cancel';
 

src/base/components/inputs/SliderInput.tsx

@@ -6,8 +6,10 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import Slider, { SliderProps } from '@mui/material/Slider';
+import type { SliderProps } from '@mui/material/Slider';
-import Typography, { TypographyProps } from '@mui/material/Typography';
+import Slider from '@mui/material/Slider';
+import type { TypographyProps } from '@mui/material/Typography';
+import Typography from '@mui/material/Typography';
 import Stack from '@mui/material/Stack';
 import { ResetButton } from '@/base/components/buttons/ResetButton.tsx';
 

src/base/components/inputs/SortRadioInput.tsx

@@ -9,7 +9,8 @@
 import ArrowDownward from '@mui/icons-material/ArrowDownward';
 import ArrowUpward from '@mui/icons-material/ArrowUpward';
 import { memo } from 'react';
-import { RadioInput, RadioInputProps } from '@/base/components/inputs/RadioInput.tsx';
+import type { RadioInputProps } from '@/base/components/inputs/RadioInput.tsx';
+import { RadioInput } from '@/base/components/inputs/RadioInput.tsx';
 
 interface IProps extends RadioInputProps {
     sortDescending?: boolean | null | undefined;

src/base/components/inputs/ThreeStateCheckbox.tsx

@@ -7,14 +7,19 @@
  */
 
 import DisabledByDefaultRounded from '@mui/icons-material/DisabledByDefaultRounded';
-import Checkbox, { CheckboxProps } from '@mui/material/Checkbox';
+import type { CheckboxProps } from '@mui/material/Checkbox';
+import Checkbox from '@mui/material/Checkbox';
 import React, { useCallback } from 'react';
 
 type CheckState = boolean | undefined | null;
 
 function nextState(state: CheckState): CheckState {
-    if (state === true) return false;
+    if (state === true) {
-    if (state === false) return undefined;
+        return false;
+    }
+    if (state === false) {
+        return undefined;
+    }
     return true;
 }
 

src/base/components/inputs/ThreeStateCheckboxInput.tsx

@@ -8,7 +8,8 @@
 
 import FormControlLabel from '@mui/material/FormControlLabel';
 import React from 'react';
-import { ThreeStateCheckbox, ThreeStateCheckboxProps } from '@/base/components/inputs/ThreeStateCheckbox.tsx';
+import type { ThreeStateCheckboxProps } from '@/base/components/inputs/ThreeStateCheckbox.tsx';
+import { ThreeStateCheckbox } from '@/base/components/inputs/ThreeStateCheckbox.tsx';
 
 interface IProps extends ThreeStateCheckboxProps {
     label?: string;

src/base/components/lists/ListItemLink.tsx

@@ -7,7 +7,8 @@
  */
 
 import { Link } from 'react-router-dom';
-import ListItemButton, { ListItemButtonProps } from '@mui/material/ListItemButton';
+import type { ListItemButtonProps } from '@mui/material/ListItemButton';
+import ListItemButton from '@mui/material/ListItemButton';
 
 export function ListItemLink(props: ListItemButtonProps<typeof Link>) {
     return <ListItemButton component={Link} {...props} />;

src/base/components/lists/cards/ListCardAvatar.tsx

@@ -6,7 +6,7 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import { ComponentProps } from 'react';
+import type { ComponentProps } from 'react';
 import { AvatarSpinner } from '@/base/components/AvatarSpinner.tsx';
 
 export const ListCardAvatar = (props: ComponentProps<typeof AvatarSpinner>) => {

src/base/components/lists/cards/ListCardContent.tsx

@@ -6,7 +6,8 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import CardContent, { CardContentProps } from '@mui/material/CardContent';
+import type { CardContentProps } from '@mui/material/CardContent';
+import CardContent from '@mui/material/CardContent';
 
 export const ListCardContent = ({ children, ...props }: CardContentProps) => (
     <CardContent

src/base/components/lists/cards/OptionalCardActionAreaLink.tsx

@@ -8,7 +8,7 @@
 
 import { Link } from 'react-router-dom';
 import CardActionArea from '@mui/material/CardActionArea';
-import { ComponentProps } from 'react';
+import type { ComponentProps } from 'react';
 
 export const OptionalCardActionAreaLink = ({
     disabled,

src/base/components/menu/IconMenuItem.tsx

@@ -11,12 +11,14 @@
  */
 
 import ListItemIcon from '@mui/material/ListItemIcon';
-import MenuItem, { MenuItemProps as MuiMenuItemProps } from '@mui/material/MenuItem';
+import type { MenuItemProps as MuiMenuItemProps } from '@mui/material/MenuItem';
-import { SxProps, Theme } from '@mui/material/styles';
+import MenuItem from '@mui/material/MenuItem';
-import React, { Ref } from 'react';
+import type { SxProps, Theme } from '@mui/material/styles';
+import type { Ref } from 'react';
+import React from 'react';
 
-import { OverridableComponent } from '@mui/material/OverridableComponent';
+import type { OverridableComponent } from '@mui/material/OverridableComponent';
-import { SvgIconTypeMap } from '@mui/material/SvgIcon';
+import type { SvgIconTypeMap } from '@mui/material/SvgIcon';
 import ListItemText from '@mui/material/ListItemText';
 
 type IconMenuItemProps = {

src/base/components/menu/Menu.tsx

@@ -6,7 +6,8 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import MuiMenu, { MenuProps } from '@mui/material/Menu';
+import type { MenuProps } from '@mui/material/Menu';
+import MuiMenu from '@mui/material/Menu';
 import { useState, type JSX } from 'react';
 
 export const Menu = ({

src/base/components/menu/Menu.utils.ts

@@ -6,7 +6,7 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import { MessageDescriptor } from '@lingui/core';
+import type { MessageDescriptor } from '@lingui/core';
 import { i18n } from '@/i18n';
 
 export const createGetMenuItemTitle =

src/base/components/menu/MenuItem.tsx

@@ -8,9 +8,10 @@
 
 import ListItemIcon from '@mui/material/ListItemIcon';
 import ListItemText from '@mui/material/ListItemText';
-import MuiMenuItem, { MenuItemProps } from '@mui/material/MenuItem';
+import type { MenuItemProps } from '@mui/material/MenuItem';
-import { OverridableComponent } from '@mui/material/OverridableComponent';
+import MuiMenuItem from '@mui/material/MenuItem';
-import { SvgIconTypeMap } from '@mui/material/SvgIcon';
+import type { OverridableComponent } from '@mui/material/OverridableComponent';
+import type { SvgIconTypeMap } from '@mui/material/SvgIcon';
 
 interface IProps extends MenuItemProps {
     title: string;

src/base/components/menu/NestedMenuItem.tsx

@@ -12,9 +12,10 @@
  * with a few changes to fix a bug on mobile devices where opening the sub menu immediately triggered the on click of the underlying menu item
  */
 
-import Menu, { MenuProps as MuiMenuProps } from '@mui/material/Menu';
+import type { MenuProps as MuiMenuProps } from '@mui/material/Menu';
-import { MenuItemProps as MuiMenuItemProps } from '@mui/material/MenuItem';
+import Menu from '@mui/material/Menu';
-import {
+import type { MenuItemProps as MuiMenuItemProps } from '@mui/material/MenuItem';
+import type {
     ElementType,
     HTMLAttributes,
     KeyboardEvent,
@@ -22,16 +23,15 @@ import {
     MouseEvent,
     ReactNode,
     RefAttributes,
-    useRef,
-    useState,
     Ref,
 } from 'react';
+import { useRef, useState } from 'react';
 import ChevronRightIcon from '@mui/icons-material/ChevronRight';
 import ChevronLeftIcon from '@mui/icons-material/ChevronLeft';
 import Box from '@mui/material/Box';
 
-import { OverridableComponent } from '@mui/material/OverridableComponent';
+import type { OverridableComponent } from '@mui/material/OverridableComponent';
-import { SvgIconTypeMap } from '@mui/material/SvgIcon';
+import type { SvgIconTypeMap } from '@mui/material/SvgIcon';
 import { useMergedRef } from '@mantine/hooks';
 import { IconMenuItem } from '@/base/components/menu/IconMenuItem.tsx';
 import { getOptionForDirection } from '@/features/theme/services/ThemeCreator.ts';

src/base/components/modals/ConfirmDialog.tsx

@@ -12,7 +12,7 @@ import DialogContent from '@mui/material/DialogContent';
 import DialogTitle from '@mui/material/DialogTitle';
 import Button from '@mui/material/Button';
 import Stack from '@mui/material/Stack';
-import { AwaitableComponentProps } from 'awaitable-component';
+import type { AwaitableComponentProps } from 'awaitable-component';
 import { Link as RouterLink } from 'react-router-dom';
 import { useLingui } from '@lingui/react/macro';
 

src/base/components/modals/LoginDialog.tsx

@@ -7,7 +7,8 @@
  */
 
 import Dialog from '@mui/material/Dialog';
-import { AwaitableComponent, AwaitableComponentProps } from 'awaitable-component';
+import type { AwaitableComponentProps } from 'awaitable-component';
+import { AwaitableComponent } from 'awaitable-component';
 import DialogTitle from '@mui/material/DialogTitle';
 import DialogContent from '@mui/material/DialogContent';
 import TextField from '@mui/material/TextField';

src/base/components/settings/CheckboxListSetting.tsx

@@ -14,7 +14,7 @@ import Dialog from '@mui/material/Dialog';
 import FormGroup from '@mui/material/FormGroup';
 import Stack from '@mui/material/Stack';
 import { useCallback, useMemo } from 'react';
-import { CheckboxProps } from '@mui/material/Checkbox';
+import type { CheckboxProps } from '@mui/material/Checkbox';
 import { useLingui } from '@lingui/react/macro';
 import { CheckboxInput } from '@/base/components/inputs/CheckboxInput.tsx';
 import { useSelectableCollection } from '@/base/collection/hooks/useSelectableCollection.ts';

src/base/components/settings/DateSetting.tsx

@@ -92,7 +92,9 @@ export const DateSetting = ({
                         <DatePicker
                             value={dialogValue ? dayjs(Number(dialogValue)) : null}
                             onChange={(date) => {
-                                if (!date) return;
+                                if (!date) {
+                                    return;
+                                }
                                 setDialogValue(date.valueOf().toString());
                             }}
                         />

src/base/components/settings/MutableListSetting.tsx

@@ -24,7 +24,8 @@ import DialogContentText from '@mui/material/DialogContentText';
 import InfoIcon from '@mui/icons-material/Info';
 import { useLingui } from '@lingui/react/macro';
 import { CustomTooltip } from '@/base/components/CustomTooltip.tsx';
-import { TextSetting, TextSettingProps } from '@/base/components/settings/text/TextSetting.tsx';
+import type { TextSettingProps } from '@/base/components/settings/text/TextSetting.tsx';
+import { TextSetting } from '@/base/components/settings/text/TextSetting.tsx';
 import { TextSettingDialog } from '@/base/components/settings/text/TextSettingDialog.tsx';
 import { makeToast } from '@/base/utils/Toast.ts';
 

src/base/components/settings/NumberSetting.tsx

@@ -23,7 +23,7 @@ import ListItemIcon from '@mui/material/ListItemIcon';
 import Slider from '@mui/material/Slider';
 import DialogContentText from '@mui/material/DialogContentText';
 import InfoIcon from '@mui/icons-material/Info';
-import { SxProps, Theme } from '@mui/material/styles';
+import type { SxProps, Theme } from '@mui/material/styles';
 import { useLingui } from '@lingui/react/macro';
 
 type BaseProps = {

src/base/components/settings/SelectSetting.tsx

@@ -6,7 +6,7 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import { MessageDescriptor } from '@lingui/core';
+import type { MessageDescriptor } from '@lingui/core';
 import Button from '@mui/material/Button';
 import Dialog from '@mui/material/Dialog';
 import DialogTitle from '@mui/material/DialogTitle';

src/base/components/settings/text/TextSetting.tsx

@@ -9,7 +9,8 @@
 import ListItemText from '@mui/material/ListItemText';
 import ListItemButton from '@mui/material/ListItemButton';
 import { useState } from 'react';
-import { TextSettingDialog, TextSettingDialogProps } from '@/base/components/settings/text/TextSettingDialog.tsx';
+import type { TextSettingDialogProps } from '@/base/components/settings/text/TextSettingDialog.tsx';
+import { TextSettingDialog } from '@/base/components/settings/text/TextSettingDialog.tsx';
 
 export type TextSettingProps = Omit<TextSettingDialogProps, 'isDialogOpen' | 'setIsDialogOpen' | 'value'> &
     Required<Pick<TextSettingDialogProps, 'value'>> & {
@@ -27,7 +28,7 @@ export const TextSetting = (props: TextSettingProps) => {
             <ListItemButton disabled={disabled} onClick={() => setIsDialogOpen(true)}>
                 <ListItemText
                     primary={settingName}
-                    secondary={settingDescription ?? (isPassword ? value.replace(/./g, '*') : value)}
+                    secondary={settingDescription ?? (isPassword ? value.replaceAll(/./g, '*') : value)}
                     secondaryTypographyProps={{
                         sx: { display: 'flex', flexDirection: 'column', wordWrap: 'break-word' },
                     }}

src/base/components/tabs/TabPanel.tsx

@@ -6,7 +6,8 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import Box, { BoxProps } from '@mui/material/Box';
+import type { BoxProps } from '@mui/material/Box';
+import Box from '@mui/material/Box';
 import React from 'react';
 
 interface IProps extends BoxProps {

src/base/components/tabs/TabsMenu.tsx

@@ -6,7 +6,8 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import Tabs, { TabsProps } from '@mui/material/Tabs';
+import type { TabsProps } from '@mui/material/Tabs';
+import Tabs from '@mui/material/Tabs';
 import { styled } from '@mui/material/styles';
 import { useNavBarContext } from '@/features/navigation-bar/NavbarContext.tsx';
 

src/base/components/tabs/TabsWrapper.tsx

@@ -6,7 +6,8 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import Box, { BoxProps } from '@mui/material/Box';
+import type { BoxProps } from '@mui/material/Box';
+import Box from '@mui/material/Box';
 
 export const TabsWrapper = ({ children, ...props }: BoxProps) => (
     <Box {...props} sx={{ ...props.sx, position: 'relative', height: `100%` }}>

src/base/components/texts/Metadata.tsx

@@ -6,9 +6,11 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import Stack, { StackProps } from '@mui/material/Stack';
+import type { StackProps } from '@mui/material/Stack';
-import Typography, { TypographyProps } from '@mui/material/Typography';
+import Stack from '@mui/material/Stack';
-import { ReactNode } from 'react';
+import type { TypographyProps } from '@mui/material/Typography';
+import Typography from '@mui/material/Typography';
+import type { ReactNode } from 'react';
 
 export const Metadata = ({
     title,

src/base/components/texts/TypographyMaxLines.tsx

@@ -6,8 +6,10 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import { styled, Theme, TypographyVariant } from '@mui/material/styles';
+import type { Theme, TypographyVariant } from '@mui/material/styles';
-import Typography, { TypographyProps } from '@mui/material/Typography';
+import { styled } from '@mui/material/styles';
+import type { TypographyProps } from '@mui/material/Typography';
+import Typography from '@mui/material/Typography';
 import { shouldForwardProp } from '@/base/utils/ShouldForwardProp.ts';
 
 const DEFAULT_LINE_HEIGHT = '1.5';

src/base/components/virtuoso/StyledGroupHeader.tsx

@@ -7,7 +7,7 @@
  */
 
 import { styled } from '@mui/material/styles';
-import { TypographyProps } from '@mui/material/Typography';
+import type { TypographyProps } from '@mui/material/Typography';
 import Stack from '@mui/material/Stack';
 import { shouldForwardProp } from '@/base/utils/ShouldForwardProp.ts';
 

src/base/components/virtuoso/StyledGroupedVirtuoso.tsx

@@ -6,8 +6,9 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import { ContextProp, TopItemListProps } from 'react-virtuoso';
+import type { ContextProp, TopItemListProps } from 'react-virtuoso';
-import { ComponentProps, useMemo } from 'react';
+import type { ComponentProps } from 'react';
+import { useMemo } from 'react';
 import Box from '@mui/material/Box';
 import { useNavBarContext } from '@/features/navigation-bar/NavbarContext.tsx';
 import { GroupedVirtuosoPersisted } from '@/lib/virtuoso/Component/GroupedVirtuosoPersisted.tsx';

src/base/hoc/withPropsFrom.tsx

@@ -6,7 +6,8 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import { ComponentType, memo, Ref } from 'react';
+import type { ComponentType, Ref } from 'react';
+import { memo } from 'react';
 
 type PropsSourceCreator<T, Props extends Record<string, any>> = (props: Props) => T;
 

src/base/hooks/useAutomaticScrolling.ts

@@ -6,7 +6,8 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import { MutableRefObject, useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import type { MutableRefObject } from 'react';
+import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { ScrollDirection } from '@/base/Base.types.ts';
 import { useResizeObserver } from '@/base/hooks/useResizeObserver.tsx';
 

src/base/hooks/useIntersectionObserver.tsx

@@ -6,7 +6,8 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import { RefObject, useLayoutEffect, useState } from 'react';
+import type { RefObject } from 'react';
+import { useLayoutEffect, useState } from 'react';
 
 export const useIntersectionObserver = (
     ref: RefObject<HTMLElement | null> | HTMLElement | undefined | null,

src/base/hooks/useMouseDragScroll.tsx

@@ -12,7 +12,8 @@
  *  https://github.com/utsb-fmm/MobileLikeScroller/blob/main/mobilelikescroller.js
  */
 
-import { MutableRefObject, useEffect, useRef, useState } from 'react';
+import type { MutableRefObject } from 'react';
+import { useEffect, useRef, useState } from 'react';
 import { ScrollDirection } from '@/base/Base.types.ts';
 import { coerceIn } from '@/lib/HelperFunctions.ts';
 

src/base/hooks/useResizeObserver.tsx

@@ -6,7 +6,8 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import { RefObject, useLayoutEffect, useState } from 'react';
+import type { RefObject } from 'react';
+import { useLayoutEffect, useState } from 'react';
 
 export const useResizeObserver = (
     ref: RefObject<HTMLElement | null> | HTMLElement | undefined | null,

src/base/hooks/useStorage.tsx

@@ -6,8 +6,10 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import { Dispatch, Reducer, SetStateAction, useCallback, useMemo, useReducer, useSyncExternalStore } from 'react';
+import type { Dispatch, Reducer, SetStateAction } from 'react';
-import { AppStorage, Storage } from '@/lib/storage/AppStorage.ts';
+import { useCallback, useMemo, useReducer, useSyncExternalStore } from 'react';
+import type { Storage } from '@/lib/storage/AppStorage.ts';
+import { AppStorage } from '@/lib/storage/AppStorage.ts';
 import { jsonSaveParse } from '@/lib/HelperFunctions.ts';
 
 const subscribeToStorageUpdates = (callback: () => void) => {

src/base/utils/ApplyStyles.ts

@@ -6,7 +6,7 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import { Theme } from '@mui/material/styles';
+import type { Theme } from '@mui/material/styles';
 
 // use CSSObject instead of SxProps<Theme> because this completely fucks over typescript by causing an out of memory error during compilation
 type CSSObject = ReturnType<Theme['applyStyles']>;

src/base/utils/DateHelper.ts

@@ -6,7 +6,8 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import dayjs, { Dayjs } from 'dayjs';
+import type { Dayjs } from 'dayjs';
+import dayjs from 'dayjs';
 import { t } from '@lingui/core/macro';
 
 export const timeFormatter = new Intl.DateTimeFormat(navigator.language, { hour: '2-digit', minute: '2-digit' });

src/base/utils/Languages.ts

@@ -6,10 +6,11 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import { MessageDescriptor } from '@lingui/core';
+import type { MessageDescriptor } from '@lingui/core';
 import { msg, t } from '@lingui/core/macro';
 
-import { getISOLanguage, getPreferredISOLanguageCodes, LanguageObject } from '@/lib/ISOLanguageUtil.ts';
+import type { LanguageObject } from '@/lib/ISOLanguageUtil.ts';
+import { getISOLanguage, getPreferredISOLanguageCodes } from '@/lib/ISOLanguageUtil.ts';
 
 import { i18n } from '@/i18n';
 

src/base/utils/MediaQuery.tsx

@@ -7,7 +7,7 @@
  */
 
 import useMediaQuery from '@mui/material/useMediaQuery';
-import { Breakpoint, SxProps, Theme } from '@mui/material/styles';
+import type { Breakpoint, SxProps, Theme } from '@mui/material/styles';
 import { useCallback, useState } from 'react';
 import { getCurrentTheme } from '@/features/theme/services/ThemeCreator.ts';
 import { useResizeObserver } from '@/base/hooks/useResizeObserver.tsx';

src/base/utils/Strings.ts

@@ -11,7 +11,7 @@ export const baseCleanup = (str: string) => str.toLowerCase().trim();
 export const enhancedCleanup = (str: string): string =>
     baseCleanup(str)
         .normalize('NFKC')
-        .replace(/[^\p{L}\p{N}]+/gu, ' ')
+        .replaceAll(/[^\p{L}\p{N}]+/gu, ' ')
         .trim();
 
 export const reverseString = (str: string, separator: string = ''): string =>

src/base/utils/Toast.ts

@@ -6,7 +6,8 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import { enqueueSnackbar, OptionsObject, SnackbarKey } from 'notistack';
+import type { OptionsObject, SnackbarKey } from 'notistack';
+import { enqueueSnackbar } from 'notistack';
 
 export function makeToast(message: string, severity?: OptionsObject['variant'], description?: string): SnackbarKey;
 export function makeToast(message: string, options?: OptionsObject, description?: string): SnackbarKey;

src/base/utils/cloneObject.tsx

@@ -7,5 +7,5 @@
  */
 
 export function cloneObject<T extends object>(obj: T) {
-    return JSON.parse(JSON.stringify(obj)) as T;
+    return structuredClone(obj);
 }

src/features/app-updates/components/WebUIUpdateChecker.tsx

@@ -15,7 +15,8 @@ import DialogActions from '@mui/material/DialogActions';
 import Button from '@mui/material/Button';
 import { useLingui } from '@lingui/react/macro';
 import { defaultPromiseErrorHandler } from '@/lib/DefaultPromiseErrorHandler.ts';
-import { UpdateState, WebUiChannel, WebUiUpdateStatus } from '@/lib/graphql/generated/graphql.ts';
+import type { WebUiUpdateStatus } from '@/lib/graphql/generated/graphql.ts';
+import { UpdateState, WebUiChannel } from '@/lib/graphql/generated/graphql.ts';
 import { useLocalStorage, useSessionStorage } from '@/base/hooks/useStorage.tsx';
 import { requestManager } from '@/lib/requests/RequestManager.ts';
 import { makeToast } from '@/base/utils/Toast.ts';

src/features/authentication/components/AuthGuard.tsx

@@ -6,7 +6,8 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import { ReactNode, useEffect } from 'react';
+import type { ReactNode } from 'react';
+import { useEffect } from 'react';
 import { SplashScreen } from '@/features/authentication/components/SplashScreen.tsx';
 import { requestManager } from '@/lib/requests/RequestManager.ts';
 import { AuthManager } from '@/features/authentication/AuthManager.ts';

src/features/authentication/components/SplashScreen.tsx

@@ -7,8 +7,9 @@
  */
 
 import { useTheme } from '@mui/material/styles';
-import Stack, { StackProps } from '@mui/material/Stack';
+import type { StackProps } from '@mui/material/Stack';
-import { ComponentProps } from 'react';
+import Stack from '@mui/material/Stack';
+import type { ComponentProps } from 'react';
 import { SuwayomiLogo } from '@/assets/SuwayomiLogo.tsx';
 import { ServerAddressSetting } from '@/features/settings/components/ServerAddressSetting.tsx';
 

src/features/backup/Backup.constants.ts

@@ -6,9 +6,10 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import { MessageDescriptor } from '@lingui/core';
+import type { MessageDescriptor } from '@lingui/core';
 import { msg } from '@lingui/core/macro';
-import { BackupFlag, BackupFlagGroup } from '@/features/backup/Backup.types.ts';
+import type { BackupFlag } from '@/features/backup/Backup.types.ts';
+import { BackupFlagGroup } from '@/features/backup/Backup.types.ts';
 
 export const BACKUP_FLAGS_TO_TRANSLATION: Record<BackupFlag, MessageDescriptor> = {
     includeManga: msg`Library entries`,

src/features/backup/Backup.types.ts

@@ -6,8 +6,8 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import { PartialBackupFlagsInput } from '@/lib/graphql/generated/graphql.ts';
+import type { PartialBackupFlagsInput } from '@/lib/graphql/generated/graphql.ts';
-import { ServerSettings } from '@/features/settings/Settings.types.ts';
+import type { ServerSettings } from '@/features/settings/Settings.types.ts';
 
 export enum BackupFlagGroup {
     LIBRARY = 'library',

src/features/backup/Backup.utils.ts

@@ -7,7 +7,11 @@
  */
 
 import { plural, t } from '@lingui/core/macro';
-import { AutoBackupFlagInclusionState, BackupFlag, BackupFlagInclusionState } from '@/features/backup/Backup.types.ts';
+import type {
+    AutoBackupFlagInclusionState,
+    BackupFlag,
+    BackupFlagInclusionState,
+} from '@/features/backup/Backup.types.ts';
 import { BACKUP_FLAGS_TO_TRANSLATION } from '@/features/backup/Backup.constants.ts';
 
 export const convertToAutoBackupFlags = (flags: BackupFlagInclusionState): AutoBackupFlagInclusionState => ({

src/features/backup/component/BackupFlagInclusionDialog.tsx

@@ -15,7 +15,7 @@ import { useState } from 'react';
 import Button from '@mui/material/Button';
 import Stack from '@mui/material/Stack';
 import Typography from '@mui/material/Typography';
-import { AwaitableComponentProps } from 'awaitable-component';
+import type { AwaitableComponentProps } from 'awaitable-component';
 import { useLingui } from '@lingui/react/macro';
 import { CheckboxInput } from '@/base/components/inputs/CheckboxInput.tsx';
 import {
@@ -24,7 +24,7 @@ import {
     BACKUP_FLAGS_BY_GROUP,
     BACKUP_FLAGS_TO_TRANSLATION,
 } from '@/features/backup/Backup.constants.ts';
-import { BackupFlagGroup, BackupFlagInclusionState } from '@/features/backup/Backup.types.ts';
+import type { BackupFlagGroup, BackupFlagInclusionState } from '@/features/backup/Backup.types.ts';
 
 export const BackupFlagInclusionDialog = ({
     onDismiss,

src/features/backup/component/BackupValidationDialog.tsx

@@ -15,11 +15,11 @@ import Button from '@mui/material/Button';
 import ListItem from '@mui/material/ListItem';
 import { Link } from 'react-router-dom';
 import Stack from '@mui/material/Stack';
-import { AwaitableComponentProps } from 'awaitable-component';
+import type { AwaitableComponentProps } from 'awaitable-component';
 import { useLingui } from '@lingui/react/macro';
 import { BrowseTab } from '@/features/browse/Browse.types.ts';
 import { AppRoutes } from '@/base/AppRoute.constants.ts';
-import { ValidateBackupResult } from '@/lib/graphql/generated/graphql.ts';
+import type { ValidateBackupResult } from '@/lib/graphql/generated/graphql.ts';
 
 export const BackupValidationDialog = ({
     validationResult,

src/features/backup/screens/Backup.tsx

@@ -37,10 +37,17 @@ import {
     getAutoBackupFlagsInfo,
     getBackupCleanupDisplayValue,
 } from '@/features/backup/Backup.utils.ts';
-import { BackupSettingsType } from '@/features/backup/Backup.types.ts';
+import type { BackupSettingsType } from '@/features/backup/Backup.types.ts';
 
 let backupRestoreId: string | undefined;
 
+const resetBackupState = () => {
+    const input = document.getElementById('backup-file') as HTMLInputElement;
+    if (input) {
+        input.value = '';
+    }
+};
+
 export function Backup() {
     const { t } = useLingui();
 
@@ -113,13 +120,6 @@ export function Backup() {
         }
     }, [data?.restoreStatus?.state]);
 
-    const resetBackupState = () => {
-        const input = document.getElementById('backup-file') as HTMLInputElement;
-        if (input) {
-            input.value = '';
-        }
-    };
-
     const createBackup = async () => {
         const flags = await AwaitableComponent.show(BackupFlagInclusionDialog, {
             title: t`Create backup`,

src/features/browse/Browse.types.ts

@@ -6,7 +6,7 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import { SourceIdInfo } from '@/features/source/Source.types.ts';
+import type { SourceIdInfo } from '@/features/source/Source.types.ts';
 
 export type MetadataBrowseSettings = {
     hideLibraryEntries: boolean;

src/features/browse/extensions/Extensions.tsx

@@ -36,12 +36,8 @@ import {
     translateExtensionLanguage,
     filterExtensions,
 } from '@/features/extension/Extensions.utils.ts';
-import {
+import type { TExtension } from '@/features/extension/Extensions.types.ts';
-    ExtensionAction,
+import { ExtensionAction, ExtensionGroupState, ExtensionState } from '@/features/extension/Extensions.types.ts';
-    ExtensionGroupState,
-    ExtensionState,
-    TExtension,
-} from '@/features/extension/Extensions.types.ts';
 import { EXTENSION_ACTION_TO_FAILURE_TRANSLATION_MAP } from '@/features/extension/Extensions.constants.ts';
 import { AppRoutes } from '@/base/AppRoute.constants.ts';
 import { getErrorMessage } from '@/lib/HelperFunctions.ts';
@@ -49,7 +45,7 @@ import {
     createUpdateMetadataServerSettings,
     useMetadataServerSettings,
 } from '@/features/settings/services/ServerSettingsMetadata.ts';
-import { MetadataBrowseSettings } from '@/features/browse/Browse.types.ts';
+import type { MetadataBrowseSettings } from '@/features/browse/Browse.types.ts';
 import { useAppAction } from '@/features/navigation-bar/hooks/useAppAction.ts';
 import { SearchParam } from '@/base/Base.types.ts';
 import { i18n } from '@/i18n';
@@ -159,7 +155,7 @@ export function Extensions({ tabsMenuHeight }: { tabsMenuHeight: number }) {
         [groupedExtensions],
     );
     const visibleExtensions = useMemo(
-        () => groupedExtensions.map(([, extensions]) => extensions).flat(1),
+        () => groupedExtensions.flatMap(([, extensions]) => extensions),
         [groupedExtensions],
     );
 

src/features/browse/extensions/components/ExtensionCard.tsx

@@ -16,13 +16,8 @@ import Stack from '@mui/material/Stack';
 import { useLingui } from '@lingui/react/macro';
 import { requestManager } from '@/lib/requests/RequestManager.ts';
 import { defaultPromiseErrorHandler } from '@/lib/DefaultPromiseErrorHandler.ts';
-import {
+import type { InstalledStates, TExtension } from '@/features/extension/Extensions.types.ts';
-    ExtensionAction,
+import { ExtensionAction, ExtensionState, InstalledState } from '@/features/extension/Extensions.types.ts';
-    ExtensionState,
-    InstalledState,
-    InstalledStates,
-    TExtension,
-} from '@/features/extension/Extensions.types.ts';
 import {
     EXTENSION_ACTION_TO_NEXT_ACTION_MAP,
     EXTENSION_ACTION_TO_STATE_MAP,

src/features/browse/screens/BrowseSettings.tsx

@@ -24,8 +24,8 @@ import { LoadingPlaceholder } from '@/base/components/feedback/LoadingPlaceholde
 import { EmptyViewAbsoluteCentered } from '@/base/components/feedback/EmptyViewAbsoluteCentered.tsx';
 import { defaultPromiseErrorHandler } from '@/lib/DefaultPromiseErrorHandler.ts';
 import { makeToast } from '@/base/utils/Toast.ts';
-import { MetadataBrowseSettings } from '@/features/browse/Browse.types.ts';
+import type { MetadataBrowseSettings } from '@/features/browse/Browse.types.ts';
-import { ServerSettings as GqlServerSettings } from '@/features/settings/Settings.types.ts';
+import type { ServerSettings as GqlServerSettings } from '@/features/settings/Settings.types.ts';
 import { getErrorMessage } from '@/lib/HelperFunctions.ts';
 import { useAppTitle } from '@/features/navigation-bar/hooks/useAppTitle.ts';
 

src/features/browse/sources/Sources.tsx

@@ -89,7 +89,7 @@ export function Sources({ tabsMenuHeight }: { tabsMenuHeight: number }) {
         [filteredSources],
     );
     const visibleSources = useMemo(
-        () => sourcesByLanguage.map(([, sourcesOfLanguage]) => sourcesOfLanguage).flat(1),
+        () => sourcesByLanguage.flatMap(([, sourcesOfLanguage]) => sourcesOfLanguage),
         [sourcesByLanguage],
     );
 
@@ -125,7 +125,9 @@ export function Sources({ tabsMenuHeight }: { tabsMenuHeight: number }) {
         [t, shownLangs, sourceLanguages, sourcesForLanguageFilter],
     );
 
-    if (isLoading) return <LoadingPlaceholder />;
+    if (isLoading) {
+        return <LoadingPlaceholder />;
+    }
 
     if (error) {
         return (

src/features/browse/sources/components/SourceCard.tsx

@@ -19,7 +19,7 @@ import IconButton from '@mui/material/IconButton';
 import { useLingui } from '@lingui/react/macro';
 import { requestManager } from '@/lib/requests/RequestManager.ts';
 import { SourceContentType } from '@/features/source/browse/screens/SourceMangas.tsx';
-import { GetSourcesListQuery } from '@/lib/graphql/generated/graphql.ts';
+import type { GetSourcesListQuery } from '@/lib/graphql/generated/graphql.ts';
 import { AppRoutes } from '@/base/AppRoute.constants.ts';
 import { MUIUtil } from '@/lib/mui/MUI.util.ts';
 import { Sources } from '@/features/source/services/Sources.ts';

src/features/category/Category.types.ts

@@ -6,10 +6,10 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import { LibraryOptions } from '@/features/library/Library.types.ts';
+import type { LibraryOptions } from '@/features/library/Library.types.ts';
-import { CategoryMetaType, CategoryType } from '@/lib/graphql/generated/graphql.ts';
+import type { CategoryMetaType, CategoryType } from '@/lib/graphql/generated/graphql.ts';
 
-export interface ICategoryMetadata extends LibraryOptions {}
+export type ICategoryMetadata = LibraryOptions;
 
 export type CategoryMetadataKeys = keyof ICategoryMetadata;
 

src/features/category/components/CategoriesInclusionSetting.tsx

@@ -22,7 +22,7 @@ import { makeToast } from '@/base/utils/Toast.ts';
 import { IncludeOrExclude } from '@/lib/graphql/generated/graphql.ts';
 import { requestManager } from '@/lib/requests/RequestManager.ts';
 import { CheckboxContainer } from '@/base/components/inputs/CheckboxContainer.ts';
-import {
+import type {
     CategoryDownloadInclusionInfo,
     CategoryIdInfo,
     CategoryNameInfo,

src/features/category/components/CategorySelect.tsx

@@ -15,7 +15,7 @@ import Dialog from '@mui/material/Dialog';
 import FormGroup from '@mui/material/FormGroup';
 import { Link } from 'react-router-dom';
 import Stack from '@mui/material/Stack';
-import { AwaitableComponentProps } from 'awaitable-component';
+import type { AwaitableComponentProps } from 'awaitable-component';
 import { useLingui } from '@lingui/react/macro';
 import { requestManager } from '@/lib/requests/RequestManager.ts';
 import { Mangas } from '@/features/manga/services/Mangas.ts';
@@ -26,7 +26,7 @@ import { CheckboxInput } from '@/base/components/inputs/CheckboxInput.tsx';
 import { makeToast } from '@/base/utils/Toast.ts';
 import { defaultPromiseErrorHandler } from '@/lib/DefaultPromiseErrorHandler.ts';
 import { updateMetadataServerSettings } from '@/features/settings/services/ServerSettingsMetadata.ts';
-import {
+import type {
     GetCategoriesBaseQuery,
     GetCategoriesBaseQueryVariables,
     GetMangaCategoriesQuery,

src/features/category/components/CategorySettingsCard.tsx

@@ -17,7 +17,7 @@ import Typography from '@mui/material/Typography';
 import { useLingui } from '@lingui/react/macro';
 import { CustomTooltip } from '@/base/components/CustomTooltip.tsx';
 import { requestManager } from '@/lib/requests/RequestManager.ts';
-import { CategoryType } from '@/lib/graphql/generated/graphql.ts';
+import type { CategoryType } from '@/lib/graphql/generated/graphql.ts';
 import { ListCardContent } from '@/base/components/lists/cards/ListCardContent.tsx';
 
 export const CategorySettingsCard = ({

src/features/category/components/CreateOrEditCategoryDialog.tsx

@@ -17,7 +17,7 @@ import Checkbox from '@mui/material/Checkbox';
 import FormControlLabel from '@mui/material/FormControlLabel';
 import { useLingui } from '@lingui/react/macro';
 import { requestManager } from '@/lib/requests/RequestManager.ts';
-import { CategoryDefaultInfo, CategoryIdInfo, CategoryNameInfo } from '@/features/category/Category.types.ts';
+import type { CategoryDefaultInfo, CategoryIdInfo, CategoryNameInfo } from '@/features/category/Category.types.ts';
 import { getErrorMessage } from '@/lib/HelperFunctions.ts';
 import { makeToast } from '@/base/utils/Toast.ts';
 import { assertIsDefined } from '@/base/Asserts.ts';

src/features/category/screens/CategorySettings.tsx

@@ -6,11 +6,13 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import { ComponentProps, useMemo, useState } from 'react';
+import type { ComponentProps } from 'react';
+import { useMemo, useState } from 'react';
 import Fab from '@mui/material/Fab';
 import AddIcon from '@mui/icons-material/Add';
 import Box from '@mui/material/Box';
-import { closestCenter, DndContext, DragEndEvent } from '@dnd-kit/core';
+import type { DragEndEvent } from '@dnd-kit/core';
+import { closestCenter, DndContext } from '@dnd-kit/core';
 import { SortableContext, verticalListSortingStrategy } from '@dnd-kit/sortable';
 import { useLingui } from '@lingui/react/macro';
 import { requestManager } from '@/lib/requests/RequestManager.ts';
@@ -18,10 +20,13 @@ import { DEFAULT_FULL_FAB_HEIGHT } from '@/base/components/buttons/StyledFab.tsx
 import { LoadingPlaceholder } from '@/base/components/feedback/LoadingPlaceholder.tsx';
 import { EmptyViewAbsoluteCentered } from '@/base/components/feedback/EmptyViewAbsoluteCentered.tsx';
 import { defaultPromiseErrorHandler } from '@/lib/DefaultPromiseErrorHandler.ts';
-import { GetCategoriesSettingsQuery, GetCategoriesSettingsQueryVariables } from '@/lib/graphql/generated/graphql.ts';
+import type {
+    GetCategoriesSettingsQuery,
+    GetCategoriesSettingsQueryVariables,
+} from '@/lib/graphql/generated/graphql.ts';
 import { GET_CATEGORIES_SETTINGS } from '@/lib/graphql/category/CategoryQuery.ts';
 import { CategorySettingsCard } from '@/features/category/components/CategorySettingsCard.tsx';
-import { CategoryIdInfo } from '@/features/category/Category.types.ts';
+import type { CategoryIdInfo } from '@/features/category/Category.types.ts';
 import { getErrorMessage, noOp } from '@/lib/HelperFunctions.ts';
 import { DndSortableItem } from '@/lib/dnd-kit/DndSortableItem.tsx';
 import { DndKitUtil } from '@/lib/dnd-kit/DndKitUtil.ts';

src/features/category/services/Categories.ts

@@ -6,7 +6,7 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import { CategoryDefaultInfo, CategoryIdInfo } from '@/features/category/Category.types.ts';
+import type { CategoryDefaultInfo, CategoryIdInfo } from '@/features/category/Category.types.ts';
 
 export const DEFAULT_CATEGORY_ID = 0;
 

src/features/category/services/CategoryMetadata.ts

@@ -12,11 +12,11 @@ import {
     requestBatchCategoryMetadataUpdate,
 } from '@/features/metadata/services/MetadataUpdater.ts';
 import { defaultPromiseErrorHandler } from '@/lib/DefaultPromiseErrorHandler.ts';
-import { LibraryOptions } from '@/features/library/Library.types.ts';
+import type { LibraryOptions } from '@/features/library/Library.types.ts';
-import { CategoryIdInfo, CategoryMetadataKeys, ICategoryMetadata } from '@/features/category/Category.types.ts';
+import type { CategoryIdInfo, CategoryMetadataKeys, ICategoryMetadata } from '@/features/category/Category.types.ts';
 import { convertFromGqlMeta } from '@/features/metadata/services/MetadataConverter.ts';
 import { getMetadataFrom } from '@/features/metadata/services/MetadataReader.ts';
-import {
+import type {
     AllowedMetadataValueTypes,
     GqlMetaHolder,
     Metadata,

src/features/chapter/Chapter.constants.ts

@@ -6,9 +6,9 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import { MessageDescriptor } from '@lingui/core';
+import type { MessageDescriptor } from '@lingui/core';
 import { msg } from '@lingui/core/macro';
-import { ChapterAction, ChapterListOptions, ChapterSortMode } from '@/features/chapter/Chapter.types.ts';
+import type { ChapterAction, ChapterListOptions, ChapterSortMode } from '@/features/chapter/Chapter.types.ts';
 
 export const FALLBACK_CHAPTER = { id: -1, name: '', realUrl: '', isDownloaded: false, isBookmarked: false };
 

src/features/chapter/Chapter.types.ts

@@ -6,7 +6,7 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import {
+import type {
     ChapterReaderFieldsFragment,
     ChapterType,
     DownloadStatusFieldsFragment,

src/features/chapter/components/ChapterExcludeSanlatorsFilter.tsx

@@ -11,7 +11,7 @@ import PeopleAltOutlinedIcon from '@mui/icons-material/PeopleAltOutlined';
 import DisabledByDefaultRounded from '@mui/icons-material/DisabledByDefaultRounded';
 import { useLingui } from '@lingui/react/macro';
 import { CheckboxListSetting } from '@/base/components/settings/CheckboxListSetting.tsx';
-import { updateChapterListOptions } from '@/features/chapter/utils/ChapterList.util.tsx';
+import type { updateChapterListOptions } from '@/features/chapter/utils/ChapterList.util.tsx';
 import { CheckboxInput } from '@/base/components/inputs/CheckboxInput.tsx';
 
 export const ChapterExcludeSanlatorsFilter = ({

src/features/chapter/components/ChapterList.tsx

@@ -10,7 +10,8 @@ import Box from '@mui/material/Box';
 import Stack from '@mui/material/Stack';
 import { styled } from '@mui/material/styles';
 import Typography from '@mui/material/Typography';
-import { ComponentProps, useCallback, useMemo, useState } from 'react';
+import type { ComponentProps } from 'react';
+import { useCallback, useMemo, useState } from 'react';
 import { useLingui } from '@lingui/react/macro';
 import { plural } from '@lingui/core/macro';
 import { requestManager } from '@/lib/requests/RequestManager.ts';
@@ -24,7 +25,7 @@ import { EmptyViewAbsoluteCentered } from '@/base/components/feedback/EmptyViewA
 import { ChaptersToolbarMenu } from '@/features/chapter/components/ChaptersToolbarMenu.tsx';
 import { SelectionFAB } from '@/base/collection/components/SelectionFAB.tsx';
 import { DEFAULT_FULL_FAB_HEIGHT } from '@/base/components/buttons/StyledFab.tsx';
-import {
+import type {
     ChapterListFieldsFragment,
     GetChaptersMangaQuery,
     GetChaptersMangaQueryVariables,

src/features/chapter/components/ChapterOptions.tsx

@@ -6,7 +6,7 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import { MessageDescriptor } from '@lingui/core';
+import type { MessageDescriptor } from '@lingui/core';
 import RadioGroup from '@mui/material/RadioGroup';
 import React from 'react';
 import { useLingui } from '@lingui/react/macro';
@@ -16,8 +16,8 @@ import { SortRadioInput } from '@/base/components/inputs/SortRadioInput.tsx';
 import { ThreeStateCheckboxInput } from '@/base/components/inputs/ThreeStateCheckboxInput.tsx';
 import { OptionsTabs } from '@/base/components/modals/OptionsTabs.tsx';
 import { CHAPTER_SORT_OPTIONS_TO_TRANSLATION } from '@/features/chapter/Chapter.constants.ts';
-import { ChapterListOptions } from '@/features/chapter/Chapter.types.ts';
+import type { ChapterListOptions } from '@/features/chapter/Chapter.types.ts';
-import { updateChapterListOptions } from '@/features/chapter/utils/ChapterList.util.tsx';
+import type { updateChapterListOptions } from '@/features/chapter/utils/ChapterList.util.tsx';
 import { ChapterExcludeSanlatorsFilter } from '@/features/chapter/components/ChapterExcludeSanlatorsFilter.tsx';
 
 interface IProps {

src/features/chapter/components/ChaptersToolbarMenu.tsx

@@ -17,8 +17,9 @@ import { useMemo } from 'react';
 import { useLingui } from '@lingui/react/macro';
 import { CustomTooltip } from '@/base/components/CustomTooltip.tsx';
 import { ChapterOptions } from '@/features/chapter/components/ChapterOptions.tsx';
-import { isFilterActive, updateChapterListOptions } from '@/features/chapter/utils/ChapterList.util.tsx';
+import type { updateChapterListOptions } from '@/features/chapter/utils/ChapterList.util.tsx';
-import {
+import { isFilterActive } from '@/features/chapter/utils/ChapterList.util.tsx';
+import type {
     ChapterBookmarkInfo,
     ChapterDownloadInfo,
     ChapterIdInfo,

src/features/chapter/components/actions/ChapterActionMenuItems.tsx

@@ -14,9 +14,10 @@ import Done from '@mui/icons-material/Done';
 import BookmarkRemove from '@mui/icons-material/BookmarkRemove';
 import BookmarkAdd from '@mui/icons-material/BookmarkAdd';
 import DoneAll from '@mui/icons-material/DoneAll';
-import { ComponentProps, useMemo } from 'react';
+import type { ComponentProps } from 'react';
+import { useMemo } from 'react';
 import { useLingui } from '@lingui/react/macro';
-import { SelectableCollectionReturnType } from '@/base/collection/hooks/useSelectableCollection.ts';
+import type { SelectableCollectionReturnType } from '@/base/collection/hooks/useSelectableCollection.ts';
 import { Chapters } from '@/features/chapter/services/Chapters.ts';
 import { MenuItem } from '@/base/components/menu/MenuItem.tsx';
 import {
@@ -26,12 +27,12 @@ import {
 } from '@/base/components/menu/Menu.utils.ts';
 import { defaultPromiseErrorHandler } from '@/lib/DefaultPromiseErrorHandler.ts';
 import { useMetadataServerSettings } from '@/features/settings/services/ServerSettingsMetadata.ts';
-import { ChapterCard } from '@/features/chapter/components/cards/ChapterCard.tsx';
+import type { ChapterCard } from '@/features/chapter/components/cards/ChapterCard.tsx';
 import { requestManager } from '@/lib/requests/RequestManager.ts';
-import { GetChaptersMangaQuery } from '@/lib/graphql/generated/graphql.ts';
+import type { GetChaptersMangaQuery } from '@/lib/graphql/generated/graphql.ts';
 import { GET_CHAPTERS_MANGA } from '@/lib/graphql/chapter/ChapterQuery.ts';
 import { CHAPTER_ACTION_TO_TRANSLATION } from '@/features/chapter/Chapter.constants.ts';
-import {
+import type {
     ChapterAction,
     ChapterBookmarkInfo,
     ChapterDownloadInfo,

src/features/chapter/components/actions/ChaptersDownloadActionMenuItems.tsx

@@ -6,20 +6,19 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import { MessageDescriptor } from '@lingui/core';
+import type { MessageDescriptor } from '@lingui/core';
 import MenuItem from '@mui/material/MenuItem';
 import gql from 'graphql-tag';
 import { msg } from '@lingui/core/macro';
 import { useMetadataServerSettings } from '@/features/settings/services/ServerSettingsMetadata.ts';
 import { Mangas } from '@/features/manga/services/Mangas.ts';
 import { defaultPromiseErrorHandler } from '@/lib/DefaultPromiseErrorHandler.ts';
-import {
+import type {
-    ChapterOrderBy,
     GetChaptersMangaQuery,
     GetChaptersMangaQueryVariables,
     MangaType,
-    SortOrder,
 } from '@/lib/graphql/generated/graphql.ts';
+import { ChapterOrderBy, SortOrder } from '@/lib/graphql/generated/graphql.ts';
 import { MANGA_META_FIELDS } from '@/lib/graphql/manga/MangaFragments.ts';
 import { getMangaMetadata } from '@/features/manga/services/MangaMetadata.ts';
 import { requestManager } from '@/lib/requests/RequestManager.ts';

src/features/chapter/components/buttons/ChapterDownloadButton.tsx

@@ -15,7 +15,7 @@ import { requestManager } from '@/lib/requests/RequestManager.ts';
 import { makeToast } from '@/base/utils/Toast.ts';
 import { getErrorMessage } from '@/lib/HelperFunctions.ts';
 import { MUIUtil } from '@/lib/mui/MUI.util.ts';
-import { ChapterIdInfo } from '@/features/chapter/Chapter.types.ts';
+import type { ChapterIdInfo } from '@/features/chapter/Chapter.types.ts';
 
 export const ChapterDownloadButton = ({
     chapterId,