refactor: update a few dev deps and convert to using type imports where possible (#2886)

* build: bump deps and add some new eslint rules

* refactor: run eslint --fix on code to convert to type imports where possible

src/components/Common/Button/index.tsx

@@ -1,4 +1,5 @@
-import React, { ForwardedRef } from 'react';
+import type { ForwardedRef } from 'react';
+import React from 'react';
 
 export type ButtonType =
   | 'default'

src/components/Common/ButtonWithDropdown/index.tsx

@@ -1,11 +1,10 @@
 import { ChevronDownIcon } from '@heroicons/react/solid';
-import React, {
+import type {
   AnchorHTMLAttributes,
   ButtonHTMLAttributes,
   ReactNode,
-  useRef,
-  useState,
 } from 'react';
+import React, { useRef, useState } from 'react';
 import useClickOutside from '../../../hooks/useClickOutside';
 import { withProperties } from '../../../utils/typeHelpers';
 import Transition from '../../Transition';

src/components/Common/CachedImage/index.tsx

@@ -1,4 +1,5 @@
-import Image, { ImageProps } from 'next/image';
+import type { ImageProps } from 'next/image';
+import Image from 'next/image';
 import React from 'react';
 import useSettings from '../../../hooks/useSettings';
 

src/components/Common/ImageFader/index.tsx

@@ -1,9 +1,5 @@
-import React, {
-  ForwardRefRenderFunction,
-  HTMLAttributes,
-  useEffect,
-  useState,
-} from 'react';
+import type { ForwardRefRenderFunction, HTMLAttributes } from 'react';
+import React, { useEffect, useState } from 'react';
 import CachedImage from '../CachedImage';
 
 interface ImageFaderProps extends HTMLAttributes<HTMLDivElement> {

src/components/Common/ListView/index.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import { useIntl } from 'react-intl';
-import {
+import type {
   MovieResult,
   PersonResult,
   TvResult,

src/components/Common/Modal/index.tsx

@@ -1,11 +1,13 @@
-import React, { MouseEvent, ReactNode, useRef } from 'react';
+import type { MouseEvent, ReactNode } from 'react';
+import React, { useRef } from 'react';
 import ReactDOM from 'react-dom';
 import { useIntl } from 'react-intl';
 import useClickOutside from '../../../hooks/useClickOutside';
 import { useLockBodyScroll } from '../../../hooks/useLockBodyScroll';
 import globalMessages from '../../../i18n/globalMessages';
 import Transition from '../../Transition';
-import Button, { ButtonType } from '../Button';
+import type { ButtonType } from '../Button';
+import Button from '../Button';
 import CachedImage from '../CachedImage';
 import LoadingSpinner from '../LoadingSpinner';
 

src/components/Common/PlayButton/index.tsx

@@ -1,4 +1,5 @@
-import React, { ReactNode } from 'react';
+import type { ReactNode } from 'react';
+import React from 'react';
 import ButtonWithDropdown from '../ButtonWithDropdown';
 
 interface PlayButtonProps {

src/components/Common/SettingsTabs/index.tsx

@@ -1,7 +1,8 @@
 import Link from 'next/link';
 import { useRouter } from 'next/router';
 import React from 'react';
-import { hasPermission, Permission } from '../../../../server/lib/permissions';
+import type { Permission } from '../../../../server/lib/permissions';
+import { hasPermission } from '../../../../server/lib/permissions';
 import { useUser } from '../../../hooks/useUser';
 
 export interface SettingsRoute {

src/components/Common/Table/index.tsx

@@ -1,4 +1,5 @@
-import React, { AllHTMLAttributes } from 'react';
+import type { AllHTMLAttributes } from 'react';
+import React from 'react';
 import { withProperties } from '../../../utils/typeHelpers';
 
 const TBody: React.FC = ({ children }) => {

src/components/Discover/DiscoverNetwork/index.tsx

@@ -8,7 +8,7 @@ import { useRouter } from 'next/router';
 import globalMessages from '../../../i18n/globalMessages';
 import useDiscover from '../../../hooks/useDiscover';
 import Error from '../../../pages/_error';
-import { TvNetwork } from '../../../../server/models/common';
+import type { TvNetwork } from '../../../../server/models/common';
 
 const messages = defineMessages({
   networkSeries: '{network} Series',

src/components/Discover/DiscoverStudio/index.tsx

@@ -8,7 +8,7 @@ import { useRouter } from 'next/router';
 import globalMessages from '../../../i18n/globalMessages';
 import useDiscover from '../../../hooks/useDiscover';
 import Error from '../../../pages/_error';
-import { ProductionCompany } from '../../../../server/models/common';
+import type { ProductionCompany } from '../../../../server/models/common';
 
 const messages = defineMessages({
   studioMovies: '{studio} Movies',

src/components/Discover/MovieGenreList/index.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import { defineMessages, useIntl } from 'react-intl';
 import useSWR from 'swr';
-import { GenreSliderItem } from '../../../../server/interfaces/api/discoverInterfaces';
+import type { GenreSliderItem } from '../../../../server/interfaces/api/discoverInterfaces';
 import Error from '../../../pages/_error';
 import Header from '../../Common/Header';
 import LoadingSpinner from '../../Common/LoadingSpinner';

src/components/Discover/MovieGenreSlider/index.tsx

@@ -3,7 +3,7 @@ import Link from 'next/link';
 import React from 'react';
 import { defineMessages, useIntl } from 'react-intl';
 import useSWR from 'swr';
-import { GenreSliderItem } from '../../../../server/interfaces/api/discoverInterfaces';
+import type { GenreSliderItem } from '../../../../server/interfaces/api/discoverInterfaces';
 import GenreCard from '../../GenreCard';
 import Slider from '../../Slider';
 import { genreColorMap } from '../constants';

src/components/Discover/TvGenreList/index.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import { defineMessages, useIntl } from 'react-intl';
 import useSWR from 'swr';
-import { GenreSliderItem } from '../../../../server/interfaces/api/discoverInterfaces';
+import type { GenreSliderItem } from '../../../../server/interfaces/api/discoverInterfaces';
 import Error from '../../../pages/_error';
 import Header from '../../Common/Header';
 import LoadingSpinner from '../../Common/LoadingSpinner';

src/components/Discover/TvGenreSlider/index.tsx

@@ -3,7 +3,7 @@ import Link from 'next/link';
 import React from 'react';
 import { defineMessages, useIntl } from 'react-intl';
 import useSWR from 'swr';
-import { GenreSliderItem } from '../../../../server/interfaces/api/discoverInterfaces';
+import type { GenreSliderItem } from '../../../../server/interfaces/api/discoverInterfaces';
 import GenreCard from '../../GenreCard';
 import Slider from '../../Slider';
 import { genreColorMap } from '../constants';

src/components/DownloadBlock/index.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import { defineMessages, FormattedRelativeTime, useIntl } from 'react-intl';
-import { DownloadingItem } from '../../../server/lib/downloadtracker';
+import type { DownloadingItem } from '../../../server/lib/downloadtracker';
 import Badge from '../Common/Badge';
 
 const messages = defineMessages({

src/components/IssueList/IssueItem/index.tsx

@@ -6,9 +6,9 @@ import { defineMessages, FormattedRelativeTime, useIntl } from 'react-intl';
 import useSWR from 'swr';
 import { IssueStatus } from '../../../../server/constants/issue';
 import { MediaType } from '../../../../server/constants/media';
-import Issue from '../../../../server/entity/Issue';
-import { MovieDetails } from '../../../../server/models/Movie';
-import { TvDetails } from '../../../../server/models/Tv';
+import type Issue from '../../../../server/entity/Issue';
+import type { MovieDetails } from '../../../../server/models/Movie';
+import type { TvDetails } from '../../../../server/models/Tv';
 import { Permission, useUser } from '../../../hooks/useUser';
 import globalMessages from '../../../i18n/globalMessages';
 import Badge from '../../Common/Badge';

src/components/IssueList/index.tsx

@@ -8,7 +8,7 @@ import { useRouter } from 'next/router';
 import React, { useEffect, useState } from 'react';
 import { defineMessages, useIntl } from 'react-intl';
 import useSWR from 'swr';
-import { IssueResultsResponse } from '../../../server/interfaces/api/issueInterfaces';
+import type { IssueResultsResponse } from '../../../server/interfaces/api/issueInterfaces';
 import Button from '../../components/Common/Button';
 import { useUpdateQueryParams } from '../../hooks/useUpdateQueryParams';
 import globalMessages from '../../i18n/globalMessages';

src/components/IssueModal/CreateIssueModal/index.tsx

@@ -11,8 +11,8 @@ import useSWR from 'swr';
 import * as Yup from 'yup';
 import { MediaStatus } from '../../../../server/constants/media';
 import type Issue from '../../../../server/entity/Issue';
-import { MovieDetails } from '../../../../server/models/Movie';
-import { TvDetails } from '../../../../server/models/Tv';
+import type { MovieDetails } from '../../../../server/models/Movie';
+import type { TvDetails } from '../../../../server/models/Tv';
 import useSettings from '../../../hooks/useSettings';
 import { Permission, useUser } from '../../../hooks/useUser';
 import globalMessages from '../../../i18n/globalMessages';

src/components/IssueModal/constants.ts

@@ -1,4 +1,5 @@
-import { defineMessages, MessageDescriptor } from 'react-intl';
+import type { MessageDescriptor } from 'react-intl';
+import { defineMessages } from 'react-intl';
 import { IssueType } from '../../../server/constants/issue';
 
 const messages = defineMessages({

src/components/JSONEditor/index.tsx

@@ -1,4 +1,5 @@
-import React, { HTMLAttributes } from 'react';
+import type { HTMLAttributes } from 'react';
+import React from 'react';
 import AceEditor from 'react-ace';
 import 'ace-builds/src-noconflict/mode-json';
 import 'ace-builds/src-noconflict/theme-dracula';

src/components/LanguageSelector/index.tsx

@@ -1,9 +1,10 @@
 import { sortBy } from 'lodash';
 import React, { useMemo } from 'react';
 import { defineMessages, useIntl } from 'react-intl';
-import Select, { CSSObjectWithLabel } from 'react-select';
+import type { CSSObjectWithLabel } from 'react-select';
+import Select from 'react-select';
 import useSWR from 'swr';
-import { Language } from '../../../server/lib/settings';
+import type { Language } from '../../../server/lib/settings';
 import globalMessages from '../../i18n/globalMessages';
 
 const messages = defineMessages({

src/components/Layout/LanguagePicker/index.tsx

@@ -1,10 +1,8 @@
 import { TranslateIcon } from '@heroicons/react/solid';
 import React, { useRef, useState } from 'react';
 import { defineMessages, useIntl } from 'react-intl';
-import {
-  availableLanguages,
-  AvailableLocale,
-} from '../../../context/LanguageContext';
+import type { AvailableLocale } from '../../../context/LanguageContext';
+import { availableLanguages } from '../../../context/LanguageContext';
 import useClickOutside from '../../../hooks/useClickOutside';
 import useLocale from '../../../hooks/useLocale';
 import Transition from '../../Transition';

src/components/Layout/Sidebar/index.tsx

@@ -8,7 +8,8 @@ import {
 } from '@heroicons/react/outline';
 import Link from 'next/link';
 import { useRouter } from 'next/router';
-import React, { ReactNode, useRef } from 'react';
+import type { ReactNode } from 'react';
+import React, { useRef } from 'react';
 import { defineMessages, useIntl } from 'react-intl';
 import useClickOutside from '../../../hooks/useClickOutside';
 import { Permission, useUser } from '../../../hooks/useUser';

src/components/Layout/VersionStatus/index.tsx

@@ -8,7 +8,7 @@ import Link from 'next/link';
 import React from 'react';
 import { defineMessages, useIntl } from 'react-intl';
 import useSWR from 'swr';
-import { StatusResponse } from '../../../../server/interfaces/api/settingsInterfaces';
+import type { StatusResponse } from '../../../../server/interfaces/api/settingsInterfaces';
 
 const messages = defineMessages({
   streamdevelop: 'Overseerr Develop',

src/components/Layout/index.tsx

@@ -2,7 +2,7 @@ import { MenuAlt2Icon } from '@heroicons/react/outline';
 import { ArrowLeftIcon } from '@heroicons/react/solid';
 import { useRouter } from 'next/router';
 import React, { useEffect, useState } from 'react';
-import { AvailableLocale } from '../../context/LanguageContext';
+import type { AvailableLocale } from '../../context/LanguageContext';
 import useLocale from '../../hooks/useLocale';
 import useSettings from '../../hooks/useSettings';
 import { useUser } from '../../hooks/useUser';

src/components/ManageSlideOver/index.tsx

@@ -10,9 +10,9 @@ import {
   MediaRequestStatus,
   MediaStatus,
 } from '../../../server/constants/media';
-import { MediaWatchDataResponse } from '../../../server/interfaces/api/mediaInterfaces';
-import { MovieDetails } from '../../../server/models/Movie';
-import { TvDetails } from '../../../server/models/Tv';
+import type { MediaWatchDataResponse } from '../../../server/interfaces/api/mediaInterfaces';
+import type { MovieDetails } from '../../../server/models/Movie';
+import type { TvDetails } from '../../../server/models/Tv';
 import useSettings from '../../hooks/useSettings';
 import { Permission, useUser } from '../../hooks/useUser';
 import globalMessages from '../../i18n/globalMessages';

src/components/MovieDetails/MovieCast/index.tsx

@@ -3,7 +3,7 @@ import { useRouter } from 'next/router';
 import React from 'react';
 import { defineMessages, useIntl } from 'react-intl';
 import useSWR from 'swr';
-import { MovieDetails } from '../../../../server/models/Movie';
+import type { MovieDetails } from '../../../../server/models/Movie';
 import Error from '../../../pages/_error';
 import Header from '../../Common/Header';
 import LoadingSpinner from '../../Common/LoadingSpinner';

src/components/MovieDetails/MovieCrew/index.tsx

@@ -3,7 +3,7 @@ import { useRouter } from 'next/router';
 import React from 'react';
 import { defineMessages, useIntl } from 'react-intl';
 import useSWR from 'swr';
-import { MovieDetails } from '../../../../server/models/Movie';
+import type { MovieDetails } from '../../../../server/models/Movie';
 import Error from '../../../pages/_error';
 import Header from '../../Common/Header';
 import LoadingSpinner from '../../Common/LoadingSpinner';

src/components/MovieDetails/index.tsx

@@ -38,7 +38,8 @@ import Button from '../Common/Button';
 import CachedImage from '../Common/CachedImage';
 import LoadingSpinner from '../Common/LoadingSpinner';
 import PageTitle from '../Common/PageTitle';
-import PlayButton, { PlayButtonLink } from '../Common/PlayButton';
+import type { PlayButtonLink } from '../Common/PlayButton';
+import PlayButton from '../Common/PlayButton';
 import ExternalLinkBlock from '../ExternalLinkBlock';
 import IssueModal from '../IssueModal';
 import ManageSlideOver from '../ManageSlideOver';

src/components/NotificationTypeSelector/NotificationType/index.tsx

@@ -1,5 +1,6 @@
 import React from 'react';
-import { hasNotificationType, NotificationItem } from '..';
+import type { NotificationItem } from '..';
+import { hasNotificationType } from '..';
 
 interface NotificationTypeProps {
   option: NotificationItem;

src/components/NotificationTypeSelector/index.tsx

@@ -2,7 +2,8 @@ import { sortBy } from 'lodash';
 import React, { useMemo, useState } from 'react';
 import { defineMessages, useIntl } from 'react-intl';
 import useSettings from '../../hooks/useSettings';
-import { Permission, User, useUser } from '../../hooks/useUser';
+import type { User } from '../../hooks/useUser';
+import { Permission, useUser } from '../../hooks/useUser';
 import NotificationType from './NotificationType';
 
 const messages = defineMessages({

src/components/PermissionEdit/index.tsx

@@ -1,7 +1,9 @@
 import React from 'react';
 import { defineMessages, useIntl } from 'react-intl';
-import { Permission, User } from '../../hooks/useUser';
-import PermissionOption, { PermissionItem } from '../PermissionOption';
+import type { User } from '../../hooks/useUser';
+import { Permission } from '../../hooks/useUser';
+import type { PermissionItem } from '../PermissionOption';
+import PermissionOption from '../PermissionOption';
 
 export const messages = defineMessages({
   admin: 'Admin',

src/components/PermissionOption/index.tsx

@@ -1,7 +1,8 @@
 import React from 'react';
 import { hasPermission } from '../../../server/lib/permissions';
 import useSettings from '../../hooks/useSettings';
-import { Permission, User } from '../../hooks/useUser';
+import type { User } from '../../hooks/useUser';
+import { Permission } from '../../hooks/useUser';
 
 export interface PermissionItem {
   id: string;

src/components/RequestButton/index.tsx

@@ -11,8 +11,8 @@ import {
   MediaRequestStatus,
   MediaStatus,
 } from '../../../server/constants/media';
-import Media from '../../../server/entity/Media';
-import { MediaRequest } from '../../../server/entity/MediaRequest';
+import type Media from '../../../server/entity/Media';
+import type { MediaRequest } from '../../../server/entity/MediaRequest';
 import useSettings from '../../hooks/useSettings';
 import { Permission, useUser } from '../../hooks/useUser';
 import globalMessages from '../../i18n/globalMessages';

src/components/RequestModal/AdvancedRequester/index.tsx

@@ -12,7 +12,8 @@ import type {
   ServiceCommonServerWithDetails,
 } from '../../../../server/interfaces/api/serviceInterfaces';
 import type { UserResultsResponse } from '../../../../server/interfaces/api/userInterfaces';
-import { Permission, User, useUser } from '../../../hooks/useUser';
+import type { User } from '../../../hooks/useUser';
+import { Permission, useUser } from '../../../hooks/useUser';
 import globalMessages from '../../../i18n/globalMessages';
 import { formatBytes } from '../../../utils/numberHelpers';
 import { SmallLoadingSpinner } from '../../Common/LoadingSpinner';

src/components/RequestModal/CollectionRequestModal.tsx

@@ -8,17 +8,18 @@ import {
   MediaRequestStatus,
   MediaStatus,
 } from '../../../server/constants/media';
-import { MediaRequest } from '../../../server/entity/MediaRequest';
-import { QuotaResponse } from '../../../server/interfaces/api/userInterfaces';
+import type { MediaRequest } from '../../../server/entity/MediaRequest';
+import type { QuotaResponse } from '../../../server/interfaces/api/userInterfaces';
 import { Permission } from '../../../server/lib/permissions';
-import { Collection } from '../../../server/models/Collection';
+import type { Collection } from '../../../server/models/Collection';
 import { useUser } from '../../hooks/useUser';
 import globalMessages from '../../i18n/globalMessages';
 import Alert from '../Common/Alert';
 import Badge from '../Common/Badge';
 import CachedImage from '../Common/CachedImage';
 import Modal from '../Common/Modal';
-import AdvancedRequester, { RequestOverrides } from './AdvancedRequester';
+import type { RequestOverrides } from './AdvancedRequester';
+import AdvancedRequester from './AdvancedRequester';
 import QuotaDisplay from './QuotaDisplay';
 
 const messages = defineMessages({

src/components/RequestModal/MovieRequestModal.tsx

@@ -5,15 +5,16 @@ import { defineMessages, useIntl } from 'react-intl';
 import { useToasts } from 'react-toast-notifications';
 import useSWR from 'swr';
 import { MediaStatus } from '../../../server/constants/media';
-import { MediaRequest } from '../../../server/entity/MediaRequest';
-import { QuotaResponse } from '../../../server/interfaces/api/userInterfaces';
+import type { MediaRequest } from '../../../server/entity/MediaRequest';
+import type { QuotaResponse } from '../../../server/interfaces/api/userInterfaces';
 import { Permission } from '../../../server/lib/permissions';
-import { MovieDetails } from '../../../server/models/Movie';
+import type { MovieDetails } from '../../../server/models/Movie';
 import { useUser } from '../../hooks/useUser';
 import globalMessages from '../../i18n/globalMessages';
 import Alert from '../Common/Alert';
 import Modal from '../Common/Modal';
-import AdvancedRequester, { RequestOverrides } from './AdvancedRequester';
+import type { RequestOverrides } from './AdvancedRequester';
+import AdvancedRequester from './AdvancedRequester';
 import QuotaDisplay from './QuotaDisplay';
 
 const messages = defineMessages({

src/components/RequestModal/QuotaDisplay/index.tsx

@@ -2,7 +2,7 @@ import { ChevronDownIcon, ChevronUpIcon } from '@heroicons/react/solid';
 import Link from 'next/link';
 import React, { useState } from 'react';
 import { defineMessages, useIntl } from 'react-intl';
-import { QuotaStatus } from '../../../../server/interfaces/api/userInterfaces';
+import type { QuotaStatus } from '../../../../server/interfaces/api/userInterfaces';
 import ProgressCircle from '../../Common/ProgressCircle';
 
 const messages = defineMessages({

src/components/RequestModal/SearchByNameModal/index.tsx

@@ -2,7 +2,7 @@ import { DownloadIcon } from '@heroicons/react/outline';
 import React from 'react';
 import { defineMessages, useIntl } from 'react-intl';
 import useSWR from 'swr';
-import { SonarrSeries } from '../../../../server/api/servarr/sonarr';
+import type { SonarrSeries } from '../../../../server/api/servarr/sonarr';
 import globalMessages from '../../../i18n/globalMessages';
 import Alert from '../../Common/Alert';
 import { SmallLoadingSpinner } from '../../Common/LoadingSpinner';

src/components/RequestModal/TvRequestModal.tsx

@@ -9,18 +9,19 @@ import {
   MediaRequestStatus,
   MediaStatus,
 } from '../../../server/constants/media';
-import { MediaRequest } from '../../../server/entity/MediaRequest';
-import SeasonRequest from '../../../server/entity/SeasonRequest';
-import { QuotaResponse } from '../../../server/interfaces/api/userInterfaces';
+import type { MediaRequest } from '../../../server/entity/MediaRequest';
+import type SeasonRequest from '../../../server/entity/SeasonRequest';
+import type { QuotaResponse } from '../../../server/interfaces/api/userInterfaces';
 import { Permission } from '../../../server/lib/permissions';
-import { TvDetails } from '../../../server/models/Tv';
+import type { TvDetails } from '../../../server/models/Tv';
 import useSettings from '../../hooks/useSettings';
 import { useUser } from '../../hooks/useUser';
 import globalMessages from '../../i18n/globalMessages';
 import Alert from '../Common/Alert';
 import Badge from '../Common/Badge';
 import Modal from '../Common/Modal';
-import AdvancedRequester, { RequestOverrides } from './AdvancedRequester';
+import type { RequestOverrides } from './AdvancedRequester';
+import AdvancedRequester from './AdvancedRequester';
 import QuotaDisplay from './QuotaDisplay';
 import SearchByNameModal from './SearchByNameModal';
 

src/components/RequestModal/index.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import type { MediaStatus } from '../../../server/constants/media';
-import { MediaRequest } from '../../../server/entity/MediaRequest';
+import type { MediaRequest } from '../../../server/entity/MediaRequest';
 import Transition from '../Transition';
 import CollectionRequestModal from './CollectionRequestModal';
 import MovieRequestModal from './MovieRequestModal';

src/components/Search/index.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import { useRouter } from 'next/router';
-import {
+import type {
   TvResult,
   MovieResult,
   PersonResult,

src/components/ServiceWorkerSetup/index.tsx

@@ -1,6 +1,7 @@
 /* eslint-disable no-console */
 import axios from 'axios';
-import React, { useEffect } from 'react';
+import type React from 'react';
+import { useEffect } from 'react';
 import useSettings from '../../hooks/useSettings';
 import { useUser } from '../../hooks/useUser';
 

src/components/Settings/SettingsAbout/index.tsx

@@ -2,7 +2,7 @@ import { InformationCircleIcon } from '@heroicons/react/solid';
 import React from 'react';
 import { defineMessages, useIntl } from 'react-intl';
 import useSWR from 'swr';
-import {
+import type {
   SettingsAboutResponse,
   StatusResponse,
 } from '../../../../server/interfaces/api/settingsInterfaces';

src/components/Settings/SettingsJobsCache/index.tsx

@@ -2,16 +2,12 @@ import { PlayIcon, StopIcon, TrashIcon } from '@heroicons/react/outline';
 import { PencilIcon } from '@heroicons/react/solid';
 import axios from 'axios';
 import React, { useState } from 'react';
-import {
-  defineMessages,
-  FormattedRelativeTime,
-  MessageDescriptor,
-  useIntl,
-} from 'react-intl';
+import type { MessageDescriptor } from 'react-intl';
+import { defineMessages, FormattedRelativeTime, useIntl } from 'react-intl';
 import { useToasts } from 'react-toast-notifications';
 import useSWR from 'swr';
-import { CacheItem } from '../../../../server/interfaces/api/settingsInterfaces';
-import { JobId } from '../../../../server/lib/settings';
+import type { CacheItem } from '../../../../server/interfaces/api/settingsInterfaces';
+import type { JobId } from '../../../../server/lib/settings';
 import Spinner from '../../../assets/spinner.svg';
 import globalMessages from '../../../i18n/globalMessages';
 import { formatBytes } from '../../../utils/numberHelpers';

src/components/Settings/SettingsLayout.tsx

@@ -2,7 +2,8 @@ import React from 'react';
 import { defineMessages, useIntl } from 'react-intl';
 import globalMessages from '../../i18n/globalMessages';
 import PageTitle from '../Common/PageTitle';
-import SettingsTabs, { SettingsRoute } from '../Common/SettingsTabs';
+import type { SettingsRoute } from '../Common/SettingsTabs';
+import SettingsTabs from '../Common/SettingsTabs';
 
 const messages = defineMessages({
   menuGeneralSettings: 'General',

src/components/Settings/SettingsLogs/index.tsx

@@ -13,7 +13,7 @@ import React, { useEffect, useState } from 'react';
 import { defineMessages, useIntl } from 'react-intl';
 import { useToasts } from 'react-toast-notifications';
 import useSWR from 'swr';
-import {
+import type {
   LogMessage,
   LogsResultsResponse,
 } from '../../../../server/interfaces/api/settingsInterfaces';

src/components/Settings/SettingsMain.tsx

@@ -7,12 +7,10 @@ import { defineMessages, useIntl } from 'react-intl';
 import { useToasts } from 'react-toast-notifications';
 import useSWR, { mutate } from 'swr';
 import * as Yup from 'yup';
-import { UserSettingsGeneralResponse } from '../../../server/interfaces/api/userSettingsInterfaces';
+import type { UserSettingsGeneralResponse } from '../../../server/interfaces/api/userSettingsInterfaces';
 import type { MainSettings } from '../../../server/lib/settings';
-import {
-  availableLanguages,
-  AvailableLocale,
-} from '../../context/LanguageContext';
+import type { AvailableLocale } from '../../context/LanguageContext';
+import { availableLanguages } from '../../context/LanguageContext';
 import useLocale from '../../hooks/useLocale';
 import { Permission, useUser } from '../../hooks/useUser';
 import globalMessages from '../../i18n/globalMessages';

src/components/Settings/SettingsNotifications.tsx

@@ -10,7 +10,8 @@ import SlackLogo from '../../assets/extlogos/slack.svg';
 import TelegramLogo from '../../assets/extlogos/telegram.svg';
 import globalMessages from '../../i18n/globalMessages';
 import PageTitle from '../Common/PageTitle';
-import SettingsTabs, { SettingsRoute } from '../Common/SettingsTabs';
+import type { SettingsRoute } from '../Common/SettingsTabs';
+import SettingsTabs from '../Common/SettingsTabs';
 
 const messages = defineMessages({
   notifications: 'Notifications',

src/components/Settings/SonarrModal/index.tsx

@@ -3,7 +3,8 @@ import axios from 'axios';
 import { Field, Formik } from 'formik';
 import React, { useCallback, useEffect, useRef, useState } from 'react';
 import { defineMessages, useIntl } from 'react-intl';
-import Select, { OnChangeValue } from 'react-select';
+import type { OnChangeValue } from 'react-select';
+import Select from 'react-select';
 import { useToasts } from 'react-toast-notifications';
 import * as Yup from 'yup';
 import type { SonarrSettings } from '../../../../server/lib/settings';

src/components/Slider/index.tsx

@@ -1,12 +1,7 @@
 import { ChevronLeftIcon, ChevronRightIcon } from '@heroicons/react/outline';
 import { debounce } from 'lodash';
-import React, {
-  ReactNode,
-  useCallback,
-  useEffect,
-  useRef,
-  useState,
-} from 'react';
+import type { ReactNode } from 'react';
+import React, { useCallback, useEffect, useRef, useState } from 'react';
 import { useIntl } from 'react-intl';
 import { useSpring } from 'react-spring';
 import globalMessages from '../../i18n/globalMessages';

src/components/StatusChacker/index.tsx

@@ -2,7 +2,7 @@ import { SparklesIcon } from '@heroicons/react/outline';
 import React from 'react';
 import { defineMessages, useIntl } from 'react-intl';
 import useSWR from 'swr';
-import { StatusResponse } from '../../../server/interfaces/api/settingsInterfaces';
+import type { StatusResponse } from '../../../server/interfaces/api/settingsInterfaces';
 import Modal from '../Common/Modal';
 import Transition from '../Transition';
 

src/components/ToastContainer/index.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { ToastContainerProps } from 'react-toast-notifications';
+import type { ToastContainerProps } from 'react-toast-notifications';
 
 const ToastContainer: React.FC<ToastContainerProps> = ({
   hasToasts,

src/components/TvDetails/TvRecommendations.tsx

@@ -4,7 +4,7 @@ import React from 'react';
 import { defineMessages, useIntl } from 'react-intl';
 import useSWR from 'swr';
 import type { TvResult } from '../../../server/models/Search';
-import { TvDetails } from '../../../server/models/Tv';
+import type { TvDetails } from '../../../server/models/Tv';
 import useDiscover from '../../hooks/useDiscover';
 import Error from '../../pages/_error';
 import Header from '../Common/Header';

src/components/TvDetails/index.tsx

@@ -16,8 +16,8 @@ import type { RTRating } from '../../../server/api/rottentomatoes';
 import { ANIME_KEYWORD_ID } from '../../../server/api/themoviedb/constants';
 import { IssueStatus } from '../../../server/constants/issue';
 import { MediaStatus } from '../../../server/constants/media';
-import { Crew } from '../../../server/models/common';
-import { TvDetails as TvDetailsType } from '../../../server/models/Tv';
+import type { Crew } from '../../../server/models/common';
+import type { TvDetails as TvDetailsType } from '../../../server/models/Tv';
 import RTAudFresh from '../../assets/rt_aud_fresh.svg';
 import RTAudRotten from '../../assets/rt_aud_rotten.svg';
 import RTFresh from '../../assets/rt_fresh.svg';
@@ -33,7 +33,8 @@ import Button from '../Common/Button';
 import CachedImage from '../Common/CachedImage';
 import LoadingSpinner from '../Common/LoadingSpinner';
 import PageTitle from '../Common/PageTitle';
-import PlayButton, { PlayButtonLink } from '../Common/PlayButton';
+import type { PlayButtonLink } from '../Common/PlayButton';
+import PlayButton from '../Common/PlayButton';
 import ExternalLinkBlock from '../ExternalLinkBlock';
 import IssueModal from '../IssueModal';
 import ManageSlideOver from '../ManageSlideOver';

src/components/UserList/BulkEditModal.tsx

@@ -3,7 +3,8 @@ import axios from 'axios';
 import React, { useEffect, useState } from 'react';
 import { defineMessages, useIntl } from 'react-intl';
 import { useToasts } from 'react-toast-notifications';
-import { User, useUser } from '../../hooks/useUser';
+import type { User } from '../../hooks/useUser';
+import { useUser } from '../../hooks/useUser';
 import globalMessages from '../../i18n/globalMessages';
 import Modal from '../Common/Modal';
 import PermissionEdit from '../PermissionEdit';

src/components/UserList/index.tsx

@@ -20,7 +20,8 @@ import type { UserResultsResponse } from '../../../server/interfaces/api/userInt
 import { hasPermission } from '../../../server/lib/permissions';
 import useSettings from '../../hooks/useSettings';
 import { useUpdateQueryParams } from '../../hooks/useUpdateQueryParams';
-import { Permission, User, UserType, useUser } from '../../hooks/useUser';
+import type { User } from '../../hooks/useUser';
+import { Permission, UserType, useUser } from '../../hooks/useUser';
 import globalMessages from '../../i18n/globalMessages';
 import Alert from '../Common/Alert';
 import Badge from '../Common/Badge';

src/components/UserProfile/ProfileHeader/index.tsx

@@ -2,7 +2,8 @@ import { CogIcon, UserIcon } from '@heroicons/react/solid';
 import Link from 'next/link';
 import React from 'react';
 import { defineMessages, useIntl } from 'react-intl';
-import { Permission, User, useUser } from '../../../hooks/useUser';
+import type { User } from '../../../hooks/useUser';
+import { Permission, useUser } from '../../../hooks/useUser';
 import Button from '../../Common/Button';
 
 const messages = defineMessages({

src/components/UserProfile/UserSettings/UserGeneralSettings/index.tsx

@@ -7,11 +7,9 @@ import { defineMessages, useIntl } from 'react-intl';
 import { useToasts } from 'react-toast-notifications';
 import useSWR from 'swr';
 import * as Yup from 'yup';
-import { UserSettingsGeneralResponse } from '../../../../../server/interfaces/api/userSettingsInterfaces';
-import {
-  availableLanguages,
-  AvailableLocale,
-} from '../../../../context/LanguageContext';
+import type { UserSettingsGeneralResponse } from '../../../../../server/interfaces/api/userSettingsInterfaces';
+import type { AvailableLocale } from '../../../../context/LanguageContext';
+import { availableLanguages } from '../../../../context/LanguageContext';
 import useLocale from '../../../../hooks/useLocale';
 import useSettings from '../../../../hooks/useSettings';
 import { Permission, UserType, useUser } from '../../../../hooks/useUser';

src/components/UserProfile/UserSettings/UserNotificationSettings/UserNotificationsDiscord.tsx

@@ -7,7 +7,7 @@ import { defineMessages, useIntl } from 'react-intl';
 import { useToasts } from 'react-toast-notifications';
 import useSWR from 'swr';
 import * as Yup from 'yup';
-import { UserSettingsNotificationsResponse } from '../../../../../server/interfaces/api/userSettingsInterfaces';
+import type { UserSettingsNotificationsResponse } from '../../../../../server/interfaces/api/userSettingsInterfaces';
 import { useUser } from '../../../../hooks/useUser';
 import globalMessages from '../../../../i18n/globalMessages';
 import Button from '../../../Common/Button';

src/components/UserProfile/UserSettings/UserNotificationSettings/UserNotificationsEmail.tsx

@@ -7,7 +7,7 @@ import { defineMessages, useIntl } from 'react-intl';
 import { useToasts } from 'react-toast-notifications';
 import useSWR from 'swr';
 import * as Yup from 'yup';
-import { UserSettingsNotificationsResponse } from '../../../../../server/interfaces/api/userSettingsInterfaces';
+import type { UserSettingsNotificationsResponse } from '../../../../../server/interfaces/api/userSettingsInterfaces';
 import { useUser } from '../../../../hooks/useUser';
 import globalMessages from '../../../../i18n/globalMessages';
 import Badge from '../../../Common/Badge';

src/components/UserProfile/UserSettings/UserNotificationSettings/UserNotificationsPushbullet.tsx

@@ -6,7 +6,7 @@ import { defineMessages, useIntl } from 'react-intl';
 import { useToasts } from 'react-toast-notifications';
 import useSWR from 'swr';
 import * as Yup from 'yup';
-import { UserSettingsNotificationsResponse } from '../../../../../server/interfaces/api/userSettingsInterfaces';
+import type { UserSettingsNotificationsResponse } from '../../../../../server/interfaces/api/userSettingsInterfaces';
 import { useUser } from '../../../../hooks/useUser';
 import globalMessages from '../../../../i18n/globalMessages';
 import Button from '../../../Common/Button';

src/components/UserProfile/UserSettings/UserNotificationSettings/UserNotificationsPushover.tsx

@@ -6,7 +6,7 @@ import { defineMessages, useIntl } from 'react-intl';
 import { useToasts } from 'react-toast-notifications';
 import useSWR from 'swr';
 import * as Yup from 'yup';
-import { UserSettingsNotificationsResponse } from '../../../../../server/interfaces/api/userSettingsInterfaces';
+import type { UserSettingsNotificationsResponse } from '../../../../../server/interfaces/api/userSettingsInterfaces';
 import useSettings from '../../../../hooks/useSettings';
 import { useUser } from '../../../../hooks/useUser';
 import globalMessages from '../../../../i18n/globalMessages';

src/components/UserProfile/UserSettings/UserNotificationSettings/UserNotificationsTelegram.tsx

@@ -7,7 +7,7 @@ import { defineMessages, useIntl } from 'react-intl';
 import { useToasts } from 'react-toast-notifications';
 import useSWR from 'swr';
 import * as Yup from 'yup';
-import { UserSettingsNotificationsResponse } from '../../../../../server/interfaces/api/userSettingsInterfaces';
+import type { UserSettingsNotificationsResponse } from '../../../../../server/interfaces/api/userSettingsInterfaces';
 import { useUser } from '../../../../hooks/useUser';
 import globalMessages from '../../../../i18n/globalMessages';
 import Button from '../../../Common/Button';

src/components/UserProfile/UserSettings/UserNotificationSettings/UserNotificationsWebPush.tsx

@@ -6,7 +6,7 @@ import React from 'react';
 import { defineMessages, useIntl } from 'react-intl';
 import { useToasts } from 'react-toast-notifications';
 import useSWR, { mutate } from 'swr';
-import { UserSettingsNotificationsResponse } from '../../../../../server/interfaces/api/userSettingsInterfaces';
+import type { UserSettingsNotificationsResponse } from '../../../../../server/interfaces/api/userSettingsInterfaces';
 import { useUser } from '../../../../hooks/useUser';
 import globalMessages from '../../../../i18n/globalMessages';
 import Button from '../../../Common/Button';

src/components/UserProfile/UserSettings/UserNotificationSettings/index.tsx

@@ -3,7 +3,7 @@ import { useRouter } from 'next/router';
 import React from 'react';
 import { defineMessages, useIntl } from 'react-intl';
 import useSWR from 'swr';
-import { UserSettingsNotificationsResponse } from '../../../../../server/interfaces/api/userSettingsInterfaces';
+import type { UserSettingsNotificationsResponse } from '../../../../../server/interfaces/api/userSettingsInterfaces';
 import DiscordLogo from '../../../../assets/extlogos/discord.svg';
 import PushbulletLogo from '../../../../assets/extlogos/pushbullet.svg';
 import PushoverLogo from '../../../../assets/extlogos/pushover.svg';
@@ -13,7 +13,8 @@ import globalMessages from '../../../../i18n/globalMessages';
 import Error from '../../../../pages/_error';
 import LoadingSpinner from '../../../Common/LoadingSpinner';
 import PageTitle from '../../../Common/PageTitle';
-import SettingsTabs, { SettingsRoute } from '../../../Common/SettingsTabs';
+import type { SettingsRoute } from '../../../Common/SettingsTabs';
+import SettingsTabs from '../../../Common/SettingsTabs';
 
 const messages = defineMessages({
   notifications: 'Notifications',

src/components/UserProfile/UserSettings/index.tsx

@@ -2,7 +2,7 @@ import { useRouter } from 'next/router';
 import React from 'react';
 import { defineMessages, useIntl } from 'react-intl';
 import useSWR from 'swr';
-import { UserSettingsNotificationsResponse } from '../../../../server/interfaces/api/userSettingsInterfaces';
+import type { UserSettingsNotificationsResponse } from '../../../../server/interfaces/api/userSettingsInterfaces';
 import { hasPermission, Permission } from '../../../../server/lib/permissions';
 import useSettings from '../../../hooks/useSettings';
 import { useUser } from '../../../hooks/useUser';
@@ -11,7 +11,8 @@ import Error from '../../../pages/_error';
 import Alert from '../../Common/Alert';
 import LoadingSpinner from '../../Common/LoadingSpinner';
 import PageTitle from '../../Common/PageTitle';
-import SettingsTabs, { SettingsRoute } from '../../Common/SettingsTabs';
+import type { SettingsRoute } from '../../Common/SettingsTabs';
+import SettingsTabs from '../../Common/SettingsTabs';
 import ProfileHeader from '../ProfileHeader';
 
 const messages = defineMessages({

src/components/UserProfile/index.tsx

@@ -4,13 +4,13 @@ import { useRouter } from 'next/router';
 import React, { useCallback, useEffect, useState } from 'react';
 import { defineMessages, FormattedNumber, useIntl } from 'react-intl';
 import useSWR from 'swr';
-import {
+import type {
   QuotaResponse,
   UserRequestsResponse,
   UserWatchDataResponse,
 } from '../../../server/interfaces/api/userInterfaces';
-import { MovieDetails } from '../../../server/models/Movie';
-import { TvDetails } from '../../../server/models/Tv';
+import type { MovieDetails } from '../../../server/models/Movie';
+import type { TvDetails } from '../../../server/models/Tv';
 import { Permission, UserType, useUser } from '../../hooks/useUser';
 import Error from '../../pages/_error';
 import ImageFader from '../Common/ImageFader';

src/context/LanguageContext.tsx

@@ -1,4 +1,5 @@
-import React, { ReactNode } from 'react';
+import type { ReactNode } from 'react';
+import React from 'react';
 
 export type AvailableLocale =
   | 'ca'

src/context/SettingsContext.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import useSWR from 'swr';
-import { PublicSettingsResponse } from '../../server/interfaces/api/settingsInterfaces';
+import type { PublicSettingsResponse } from '../../server/interfaces/api/settingsInterfaces';
 
 export interface SettingsContextProps {
   currentSettings: PublicSettingsResponse;

src/context/UserContext.tsx

@@ -1,6 +1,7 @@
 import { useRouter } from 'next/dist/client/router';
 import React, { useEffect, useRef } from 'react';
-import { User, useUser } from '../hooks/useUser';
+import type { User } from '../hooks/useUser';
+import { useUser } from '../hooks/useUser';
 
 interface UserContextProps {
   initialUser: User;

src/hooks/useDebouncedState.ts

@@ -1,4 +1,5 @@
-import { useState, useEffect, Dispatch, SetStateAction } from 'react';
+import type { Dispatch, SetStateAction } from 'react';
+import { useState, useEffect } from 'react';
 
 /**
  * A hook to help with debouncing state

src/hooks/useLocale.ts

@@ -1,8 +1,6 @@
 import { useContext } from 'react';
-import {
-  LanguageContext,
-  LanguageContextProps,
-} from '../context/LanguageContext';
+import type { LanguageContextProps } from '../context/LanguageContext';
+import { LanguageContext } from '../context/LanguageContext';
 
 const useLocale = (): Omit<LanguageContextProps, 'children'> => {
   const languageContext = useContext(LanguageContext);

src/hooks/useRequestOverride.ts

@@ -1,6 +1,6 @@
 import useSWR from 'swr';
-import { MediaRequest } from '../../server/entity/MediaRequest';
-import {
+import type { MediaRequest } from '../../server/entity/MediaRequest';
+import type {
   ServiceCommonServer,
   ServiceCommonServerWithDetails,
 } from '../../server/interfaces/api/serviceInterfaces';

src/hooks/useRouteGuard.ts

@@ -1,6 +1,7 @@
 import { useRouter } from 'next/router';
 import { useEffect } from 'react';
-import { Permission, PermissionCheckOptions, useUser } from './useUser';
+import type { Permission, PermissionCheckOptions } from './useUser';
+import { useUser } from './useUser';
 
 const useRouteGuard = (
   permission: Permission | Permission[],

src/hooks/useSearchInput.ts

@@ -1,6 +1,7 @@
 /* eslint-disable react-hooks/exhaustive-deps */
 import { useRouter } from 'next/router';
-import { Dispatch, SetStateAction, useEffect, useState } from 'react';
+import type { Dispatch, SetStateAction } from 'react';
+import { useEffect, useState } from 'react';
 import type { UrlObject } from 'url';
 import type { Nullable } from '../utils/typeHelpers';
 import useDebouncedState from './useDebouncedState';

src/hooks/useSettings.ts

@@ -1,8 +1,6 @@
 import { useContext } from 'react';
-import {
-  SettingsContext,
-  SettingsContextProps,
-} from '../context/SettingsContext';
+import type { SettingsContextProps } from '../context/SettingsContext';
+import { SettingsContext } from '../context/SettingsContext';
 
 const useSettings = (): SettingsContextProps => {
   const settings = useContext(SettingsContext);

src/hooks/useUpdateQueryParams.ts

@@ -1,5 +1,6 @@
-import { NextRouter, useRouter } from 'next/router';
-import { ParsedUrlQuery } from 'querystring';
+import type { NextRouter } from 'next/router';
+import { useRouter } from 'next/router';
+import type { ParsedUrlQuery } from 'querystring';
 import { useCallback } from 'react';
 
 type UseQueryParamReturnedFunction = (

src/hooks/useUser.ts

@@ -1,12 +1,9 @@
 import useSWR from 'swr';
-import { MutatorCallback } from 'swr/dist/types';
+import type { MutatorCallback } from 'swr/dist/types';
 import { UserType } from '../../server/constants/user';
-import {
-  hasPermission,
-  Permission,
-  PermissionCheckOptions,
-} from '../../server/lib/permissions';
-import { NotificationAgentKey } from '../../server/lib/settings';
+import type { PermissionCheckOptions } from '../../server/lib/permissions';
+import { hasPermission, Permission } from '../../server/lib/permissions';
+import type { NotificationAgentKey } from '../../server/lib/settings';
 
 export { Permission, UserType };
 export type { PermissionCheckOptions };

src/hooks/useVerticalScroll.ts

@@ -1,4 +1,5 @@
-import { useState, useEffect, useRef, MutableRefObject } from 'react';
+import type { MutableRefObject } from 'react';
+import { useState, useEffect, useRef } from 'react';
 import { debounce } from 'lodash';
 
 const IS_SCROLLING_CHECK_THROTTLE = 200;

src/pages/_app.tsx

@@ -1,11 +1,12 @@
 import axios from 'axios';
-import App, { AppInitialProps, AppProps } from 'next/app';
+import type { AppInitialProps, AppProps } from 'next/app';
+import App from 'next/app';
 import Head from 'next/head';
 import React, { useEffect, useState } from 'react';
 import { IntlProvider } from 'react-intl';
 import { ToastProvider } from 'react-toast-notifications';
 import { SWRConfig } from 'swr';
-import { PublicSettingsResponse } from '../../server/interfaces/api/settingsInterfaces';
+import type { PublicSettingsResponse } from '../../server/interfaces/api/settingsInterfaces';
 import Layout from '../components/Layout';
 import LoadingBar from '../components/LoadingBar';
 import PWAHeader from '../components/PWAHeader';
@@ -14,10 +15,11 @@ import StatusChecker from '../components/StatusChacker';
 import Toast from '../components/Toast';
 import ToastContainer from '../components/ToastContainer';
 import { InteractionProvider } from '../context/InteractionContext';
-import { AvailableLocale, LanguageContext } from '../context/LanguageContext';
+import type { AvailableLocale } from '../context/LanguageContext';
+import { LanguageContext } from '../context/LanguageContext';
 import { SettingsProvider } from '../context/SettingsContext';
 import { UserContext } from '../context/UserContext';
-import { User } from '../hooks/useUser';
+import type { User } from '../hooks/useUser';
 import '../styles/globals.css';
 
 // eslint-disable-next-line @typescript-eslint/no-explicit-any

src/pages/_document.tsx

@@ -1,11 +1,5 @@
-import Document, {
-  DocumentContext,
-  DocumentInitialProps,
-  Head,
-  Html,
-  Main,
-  NextScript,
-} from 'next/document';
+import type { DocumentContext, DocumentInitialProps } from 'next/document';
+import Document, { Head, Html, Main, NextScript } from 'next/document';
 import React from 'react';
 
 class MyDocument extends Document {

src/pages/collection/[collectionId]/index.tsx

@@ -1,5 +1,5 @@
 import axios from 'axios';
-import { GetServerSideProps, NextPage } from 'next';
+import type { GetServerSideProps, NextPage } from 'next';
 import React from 'react';
 import type { Collection } from '../../../../server/models/Collection';
 import CollectionDetails from '../../../components/CollectionDetails';

src/pages/discover/movies/genre/[genreId]/index.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { NextPage } from 'next';
+import type { NextPage } from 'next';
 import DiscoverMovieGenre from '../../../../../components/Discover/DiscoverMovieGenre';
 
 const DiscoverMoviesGenrePage: NextPage = () => {

src/pages/discover/movies/genres.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { NextPage } from 'next';
+import type { NextPage } from 'next';
 import MovieGenreList from '../../../components/Discover/MovieGenreList';
 
 const MovieGenresPage: NextPage = () => {

src/pages/discover/movies/index.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { NextPage } from 'next';
+import type { NextPage } from 'next';
 import DiscoverMovies from '../../../components/Discover/DiscoverMovies';
 
 const DiscoverMoviesPage: NextPage = () => {

src/pages/discover/movies/language/[language]/index.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { NextPage } from 'next';
+import type { NextPage } from 'next';
 import DiscoverMovieLanguage from '../../../../../components/Discover/DiscoverMovieLanguage';
 
 const DiscoverMovieLanguagePage: NextPage = () => {

src/pages/discover/movies/studio/[studioId]/index.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { NextPage } from 'next';
+import type { NextPage } from 'next';
 import DiscoverMovieStudio from '../../../../../components/Discover/DiscoverStudio';
 
 const DiscoverMoviesStudioPage: NextPage = () => {

src/pages/discover/movies/upcoming.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { NextPage } from 'next';
+import type { NextPage } from 'next';
 import UpcomingMovies from '../../../components/Discover/Upcoming';
 
 const UpcomingMoviesPage: NextPage = () => {

src/pages/discover/tv/genre/[genreId]/index.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { NextPage } from 'next';
+import type { NextPage } from 'next';
 import DiscoverTvGenre from '../../../../../components/Discover/DiscoverTvGenre';
 
 const DiscoverTvGenrePage: NextPage = () => {

src/pages/discover/tv/genres.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { NextPage } from 'next';
+import type { NextPage } from 'next';
 import TvGenreList from '../../../components/Discover/TvGenreList';
 
 const TvGenresPage: NextPage = () => {

src/pages/discover/tv/index.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { NextPage } from 'next';
+import type { NextPage } from 'next';
 import DiscoverTv from '../../../components/Discover/DiscoverTv';
 
 const DiscoverTvPage: NextPage = () => {

src/pages/discover/tv/language/[language]/index.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { NextPage } from 'next';
+import type { NextPage } from 'next';
 import DiscoverTvLanguage from '../../../../../components/Discover/DiscoverTvLanguage';
 
 const DiscoverTvLanguagePage: NextPage = () => {

src/pages/discover/tv/network/[networkId]/index.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { NextPage } from 'next';
+import type { NextPage } from 'next';
 import DiscoverNetwork from '../../../../../components/Discover/DiscoverNetwork';
 
 const DiscoverTvNetworkPage: NextPage = () => {

src/pages/discover/tv/upcoming.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { NextPage } from 'next';
+import type { NextPage } from 'next';
 import DiscoverTvUpcoming from '../../../components/Discover/DiscoverTvUpcoming';
 
 const DiscoverTvPage: NextPage = () => {

src/pages/issues/[issueId]/index.tsx

@@ -1,4 +1,4 @@
-import { NextPage } from 'next';
+import type { NextPage } from 'next';
 import React from 'react';
 import IssueDetails from '../../../components/IssueDetails';
 import useRouteGuard from '../../../hooks/useRouteGuard';

src/pages/issues/index.tsx

@@ -1,4 +1,4 @@
-import { NextPage } from 'next';
+import type { NextPage } from 'next';
 import React from 'react';
 import IssueList from '../../components/IssueList';
 import useRouteGuard from '../../hooks/useRouteGuard';

src/pages/movie/[movieId]/cast.tsx

@@ -1,4 +1,4 @@
-import { NextPage } from 'next';
+import type { NextPage } from 'next';
 import React from 'react';
 import MovieCast from '../../../components/MovieDetails/MovieCast';
 

src/pages/movie/[movieId]/crew.tsx

@@ -1,4 +1,4 @@
-import { NextPage } from 'next';
+import type { NextPage } from 'next';
 import React from 'react';
 import MovieCrew from '../../../components/MovieDetails/MovieCrew';