Use type import for react FC

Co-authored-by: Bill Thornton <thornbill@users.noreply.github.com>

src/components/cardbuilder/Card/Card.tsx

@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import React, { type FC } from 'react';
 import useCard from './useCard';
 import CardWrapper from './CardWrapper';
 import CardBox from './CardBox';

src/components/cardbuilder/Card/CardBox.tsx

@@ -1,5 +1,4 @@
-
+import React, { type FC } from 'react';
-import React, { FC } from 'react';
 import layoutManager from 'components/layoutManager';
 
 import CardOverlayButtons from './CardOverlayButtons';

src/components/cardbuilder/Card/CardContent.tsx

@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import React, { type FC } from 'react';
 import classNames from 'classnames';
 import { getDefaultBackgroundClass } from '../cardBuilderUtils';
 import CardImageContainer from './CardImageContainer';

src/components/cardbuilder/Card/CardFooterText.tsx

@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import React, { type FC } from 'react';
 import Box from '@mui/material/Box';
 import useCardText from './useCardText';
 import layoutManager from 'components/layoutManager';

src/components/cardbuilder/Card/CardHoverMenu.tsx

@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import React, { type FC } from 'react';
 import Box from '@mui/material/Box';
 import ButtonGroup from '@mui/material/ButtonGroup';
 import classNames from 'classnames';

src/components/cardbuilder/Card/CardImageContainer.tsx

@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import React, { type FC } from 'react';
 import Box from '@mui/material/Box';
 import classNames from 'classnames';
 import useIndicator from 'components/indicators/useIndicator';

src/components/cardbuilder/Card/CardInnerFooter.tsx

@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import React, { type FC } from 'react';
 import classNames from 'classnames';
 import CardFooterText from './CardFooterText';
 import type { ItemDto } from 'types/itemDto';

src/components/cardbuilder/Card/CardOuterFooter.tsx

@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import React, { type FC } from 'react';
 import classNames from 'classnames';
 import { useApi } from 'hooks/useApi';
 import { getCardLogoUrl } from './cardHelper';

src/components/cardbuilder/Card/CardOverlayButtons.tsx

@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import React, { type FC } from 'react';
 import ButtonGroup from '@mui/material/ButtonGroup';
 import classNames from 'classnames';
 import { appRouter } from 'components/router/appRouter';

src/components/cardbuilder/Card/CardText.tsx

@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import React, { type FC } from 'react';
 import Box from '@mui/material/Box';
 import escapeHTML from 'escape-html';
 import type { TextLine } from './cardHelper';

src/components/cardbuilder/Card/CardWrapper.tsx

@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import React, { type FC } from 'react';
 import layoutManager from 'components/layoutManager';
 import type { DataAttributes } from 'types/dataAttributes';
 

src/components/cardbuilder/Card/Cards.tsx

@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import React, { type FC } from 'react';
 import { setCardData } from '../cardBuilder';
 import Card from './Card';
 import type { ItemDto } from 'types/itemDto';

src/components/common/DefaultIconText.tsx

@@ -1,5 +1,5 @@
 import { BaseItemKind } from '@jellyfin/sdk/lib/generated-client';
-import React, { FC } from 'react';
+import React, { type FC } from 'react';
 import Icon from '@mui/material/Icon';
 import imageHelper from 'utils/image';
 import DefaultName from './DefaultName';

src/components/common/DefaultName.tsx

@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import React, { type FC } from 'react';
 import Box from '@mui/material/Box';
 import escapeHTML from 'escape-html';
 import itemHelper from 'components/itemHelper';

src/components/common/Image.tsx

@@ -1,4 +1,4 @@
-import React, { FC, useCallback, useState } from 'react';
+import React, { type FC, useCallback, useState } from 'react';
 import { BlurhashCanvas } from 'react-blurhash';
 import { LazyLoadImage } from 'react-lazy-load-image-component';
 

src/components/common/InfoIconButton.tsx

@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import React, { type FC } from 'react';
 import IconButton from '@mui/material/IconButton';
 import InfoIcon from '@mui/icons-material/Info';
 import globalize from 'scripts/globalize';

src/components/common/Media.tsx

@@ -1,5 +1,5 @@
 import { BaseItemKind, ImageType } from '@jellyfin/sdk/lib/generated-client';
-import React, { FC } from 'react';
+import React, { type FC } from 'react';
 import Image from './Image';
 import DefaultIconText from './DefaultIconText';
 import type { ItemDto } from 'types/itemDto';

src/components/common/MoreVertIconButton.tsx

@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import React, { type FC } from 'react';
 import IconButton from '@mui/material/IconButton';
 import MoreVertIcon from '@mui/icons-material/MoreVert';
 import globalize from 'scripts/globalize';

src/components/common/NoItemsMessage.tsx

@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import React, { type FC } from 'react';
 import Box from '@mui/material/Box';
 import Typography from '@mui/material/Typography';
 import globalize from 'scripts/globalize';

src/components/common/PlayArrowIconButton.tsx

@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import React, { type FC } from 'react';
 import IconButton from '@mui/material/IconButton';
 import PlayArrowIcon from '@mui/icons-material/PlayArrow';
 import globalize from 'scripts/globalize';

src/components/common/PlaylistAddIconButton.tsx

@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import React, { type FC } from 'react';
 import IconButton from '@mui/material/IconButton';
 import PlaylistAddIcon from '@mui/icons-material/PlaylistAdd';
 import globalize from 'scripts/globalize';

src/components/common/RightIconButtons.tsx

@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import React, { type FC } from 'react';
 import IconButton from '@mui/material/IconButton';
 
 interface RightIconButtonsProps {

src/components/listview/List/List.tsx

@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import React, { type FC } from 'react';
 import useList from './useList';
 import ListContent from './ListContent';
 import ListWrapper from './ListWrapper';

src/components/listview/List/ListContent.tsx

@@ -1,5 +1,5 @@
 import { BaseItemKind } from '@jellyfin/sdk/lib/generated-client';
-import React, { FC } from 'react';
+import React, { type FC } from 'react';
 import DragHandleIcon from '@mui/icons-material/DragHandle';
 import Box from '@mui/material/Box';
 

src/components/listview/List/ListContentWrapper.tsx

@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import React, { type FC } from 'react';
 import Box from '@mui/material/Box';
 
 interface ListContentWrapperProps {

src/components/listview/List/ListGroupHeaderWrapper.tsx

@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import React, { type FC } from 'react';
 import Typography from '@mui/material/Typography';
 
 interface ListGroupHeaderWrapperProps {

src/components/listview/List/ListImageContainer.tsx

@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import React, { type FC } from 'react';
 import classNames from 'classnames';
 import Box from '@mui/material/Box';
 import { useApi } from 'hooks/useApi';

src/components/listview/List/ListItemBody.tsx

@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import React, { type FC } from 'react';
 import classNames from 'classnames';
 import Box from '@mui/material/Box';
 import useListTextlines from './useListTextlines';

src/components/listview/List/ListTextWrapper.tsx

@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import React, { type FC } from 'react';
 import Box from '@mui/material/Box';
 import Typography from '@mui/material/Typography';
 

src/components/listview/List/ListViewUserDataButtons.tsx

@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import React, { type FC } from 'react';
 import { Box } from '@mui/material';
 import itemHelper from '../../itemHelper';
 import PlayedButton from 'elements/emby-playstatebutton/PlayedButton';

src/components/listview/List/ListWrapper.tsx

@@ -1,6 +1,6 @@
 import classNames from 'classnames';
 import escapeHTML from 'escape-html';
-import React, { FC } from 'react';
+import React, { type FC } from 'react';
 import Box from '@mui/material/Box';
 import Button from '@mui/material/Button';
 import layoutManager from '../../layoutManager';

src/components/listview/List/Lists.tsx

@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import React, { type FC } from 'react';
 import escapeHTML from 'escape-html';
 import { groupBy } from 'lodash-es';
 import Box from '@mui/material/Box';

src/components/mediainfo/CaptionMediaInfo.tsx

@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import React, { type FC } from 'react';
 import classNames from 'classnames';
 import ClosedCaptionIcon from '@mui/icons-material/ClosedCaption';
 import Box from '@mui/material/Box';

src/components/mediainfo/CriticRatingMediaInfo.tsx

@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import React, { type FC } from 'react';
 import classNames from 'classnames';
 import Box from '@mui/material/Box';
 

src/components/mediainfo/EndsAt.tsx

@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import React, { type FC } from 'react';
 import classNames from 'classnames';
 import Box from '@mui/material/Box';
 import datetime from 'scripts/datetime';

src/components/mediainfo/MediaInfoItem.tsx

@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import React, { type FC } from 'react';
 import Box from '@mui/material/Box';
 import classNames from 'classnames';
 import type { MiscInfo } from 'types/mediaInfoItem';

src/components/mediainfo/PrimaryMediaInfo.tsx

@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import React, { type FC } from 'react';
 import classNames from 'classnames';
 import Box from '@mui/material/Box';
 import usePrimaryMediaInfo from './usePrimaryMediaInfo';

src/components/mediainfo/StarIcons.tsx

@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import React, { type FC } from 'react';
 import classNames from 'classnames';
 import StarIcon from '@mui/icons-material/Star';
 import Box from '@mui/material/Box';

src/elements/emby-itemrefreshindicator/RefreshIndicator.tsx

@@ -1,4 +1,4 @@
-import React, { FC, useCallback, useEffect, useState } from 'react';
+import React, { type FC, useCallback, useEffect, useState } from 'react';
 import Events, { Event } from 'utils/events';
 import serverNotifications from 'scripts/serverNotifications';
 import classNames from 'classnames';

src/elements/emby-itemscontainer/ItemsContainer.tsx

@@ -1,7 +1,7 @@
 import type {
     LibraryUpdateInfo
 } from '@jellyfin/sdk/lib/generated-client';
-import React, { FC, useCallback, useEffect, useRef } from 'react';
+import React, { type FC, useCallback, useEffect, useRef } from 'react';
 import classNames from 'classnames';
 import Box from '@mui/material/Box';
 import Sortable from 'sortablejs';
@@ -19,7 +19,7 @@ import itemShortcuts from 'components/shortcuts';
 import MultiSelect from 'components/multiSelect/multiSelect';
 import loading from 'components/loading/loading';
 import focusManager from 'components/focusManager';
-import { ParentId } from 'types/library';
+import type { ParentId } from 'types/library';
 
 function disableEvent(e: MouseEvent) {
     e.preventDefault();

src/elements/emby-playstatebutton/PlayedButton.tsx

@@ -1,6 +1,6 @@
 import { BaseItemKind } from '@jellyfin/sdk/lib/generated-client';
 import { useQueryClient } from '@tanstack/react-query';
-import React, { FC, useCallback } from 'react';
+import React, { type FC, useCallback } from 'react';
 import CheckIcon from '@mui/icons-material/Check';
 import { IconButton } from '@mui/material';
 import classNames from 'classnames';

src/elements/emby-progressbar/AutoTimeProgressBar.tsx

@@ -1,7 +1,7 @@
-import React, { FC, useCallback, useEffect, useRef, useState } from 'react';
+import React, { type FC, useCallback, useEffect, useRef, useState } from 'react';
-import { ProgressOptions } from 'types/progressOptions';
 import LinearProgress, { linearProgressClasses } from '@mui/material/LinearProgress';
 import classNames from 'classnames';
+import type { ProgressOptions } from 'types/progressOptions';
 
 interface AutoTimeProgressBarProps {
     pct: number;

src/elements/emby-ratingbutton/FavoriteButton.tsx

@@ -1,4 +1,4 @@
-import React, { FC, useCallback } from 'react';
+import React, { type FC, useCallback } from 'react';
 import { useQueryClient } from '@tanstack/react-query';
 import FavoriteIcon from '@mui/icons-material/Favorite';
 import { IconButton } from '@mui/material';

src/elements/emby-scrollbuttons/ScrollButtons.tsx

@@ -1,4 +1,4 @@
-import React, { FC, useCallback, useEffect, useRef, useState } from 'react';
+import React, { type FC, useCallback, useEffect, useRef, useState } from 'react';
 import scrollerFactory from '../../libraries/scroller';
 import globalize from '../../scripts/globalize';
 import IconButton from '../emby-button/IconButton';

src/elements/emby-scroller/Scroller.tsx

@@ -1,4 +1,4 @@
-import React, { FC, useCallback, useEffect, useRef, useState } from 'react';
+import React, { type FC, useCallback, useEffect, useRef, useState } from 'react';
 import classNames from 'classnames';
 import useElementSize from 'hooks/useElementSize';
 import layoutManager from '../../components/layoutManager';