Apply review feedback

src/apps/dashboard/components/widgets/RunningTasksWidget.tsx

@@ -9,11 +9,11 @@ import TaskProgress from 'apps/dashboard/features/tasks/components/TaskProgress'
 import Box from '@mui/material/Box';
 import Stack from '@mui/material/Stack';
 
-type IProps = {
+type RunningTasksWidgetProps = {
     tasks?: TaskInfo[];
 };
 
-const RunningTasksWidget = ({ tasks }: IProps) => {
+const RunningTasksWidget = ({ tasks }: RunningTasksWidgetProps) => {
     const runningTasks = useMemo(() => {
         return tasks?.filter(v => v.State == TaskState.Running) || [];
     }, [ tasks ]);

src/apps/dashboard/components/widgets/ServerInfoWidget.tsx

@@ -5,18 +5,16 @@ import Paper from '@mui/material/Paper';
 import Typography from '@mui/material/Typography';
 import Stack from '@mui/material/Stack';
 import Button from '@mui/material/Button';
-import type { SystemInfo } from '@jellyfin/sdk/lib/generated-client/models';
 import Skeleton from '@mui/material/Skeleton';
 import { useSystemInfo } from 'hooks/useSystemInfo';
 
-type IProps = {
-    systemInfo?: SystemInfo;
+type ServerInfoWidgetProps = {
     onScanLibrariesClick?: () => void;
     onRestartClick?: () => void;
     onShutdownClick?: () => void;
 };
 
-const ServerInfoWidget = ({ onScanLibrariesClick, onRestartClick, onShutdownClick }: IProps) => {
+const ServerInfoWidget = ({ onScanLibrariesClick, onRestartClick, onShutdownClick }: ServerInfoWidgetProps) => {
     const { data: systemInfo, isPending } = useSystemInfo();
 
     return (

src/apps/dashboard/components/widgets/Widget.tsx

@@ -5,13 +5,13 @@ import ChevronRight from '@mui/icons-material/ChevronRight';
 import React from 'react';
 import { Link as RouterLink } from 'react-router-dom';
 
-type IProps = {
+type WidgetProps = {
     title: string;
     href: string;
     children: React.ReactNode;
 };
 
-const Widget = ({ title, href, children }: IProps) => {
+const Widget = ({ title, href, children }: WidgetProps) => {
     return (
         <Box>
             <Button

src/apps/dashboard/features/activity/components/ActivityListItem.tsx

@@ -13,12 +13,12 @@ import Stack from '@mui/material/Stack';
 import getLogLevelColor from '../utils/getLogLevelColor';
 import { LogLevel } from '@jellyfin/sdk/lib/generated-client/models/log-level';
 
-type IProps = {
+type ActivityListItemProps = {
     item: ActivityLogEntry;
     displayShortOverview: boolean;
 };
 
-const ActivityListItem = ({ item, displayShortOverview }: IProps) => {
+const ActivityListItem = ({ item, displayShortOverview }: ActivityListItemProps) => {
     const relativeDate = useMemo(() => {
         if (item.Date) {
             return formatRelative(Date.parse(item.Date), Date.now(), { locale: getLocale() });

src/apps/dashboard/features/devices/components/DeviceCard.tsx

@@ -26,11 +26,11 @@ import { PlaystateCommand } from '@jellyfin/sdk/lib/generated-client/models/play
 import InputDialog from 'components/InputDialog';
 import { useSendMessage } from '../../sessions/api/useSendMessage';
 
-type IProps = {
+type DeviceCardProps = {
     device: SessionInfo;
 };
 
-const DeviceCard = ({ device }: IProps) => {
+const DeviceCard = ({ device }: DeviceCardProps) => {
     const [ playbackInfoTitle, setPlaybackInfoTitle ] = useState('');
     const [ playbackInfoDesc, setPlaybackInfoDesc ] = useState('');
     const [ isPlaybackInfoOpen, setIsPlaybackInfoOpen ] = useState(false);

src/apps/dashboard/features/sessions/hooks/useLiveSessions.ts

@@ -9,18 +9,18 @@ import { QUERY_KEY, useSessions } from '../api/useSessions';
 import { queryClient } from 'utils/query/queryClient';
 import filterSessions from '../utils/filterSessions';
 
+const QUERY_PARAMS = {
+    activeWithinSeconds: 960
+};
+
 const useLiveSessions = () => {
     const { __legacyApiClient__ } = useApi();
 
-    const params = {
-        activeWithinSeconds: 960
-    };
-
-    const sessionsQuery = useSessions(params);
+    const sessionsQuery = useSessions(QUERY_PARAMS);
 
     const updateSessions = useCallback((sessions: SessionInfoDto[]) => {
         const newSessions = filterSessions(sessions);
-        const data = queryClient.getQueryData([ QUERY_KEY, params ]) as SessionInfoDto[];
+        const data = queryClient.getQueryData([ QUERY_KEY, QUERY_PARAMS ]) as SessionInfoDto[];
         if (data) {
             const currentSessions = [ ...data ];
 
@@ -40,7 +40,7 @@ const useLiveSessions = () => {
 
     useEffect(() => {
         const onSessionsUpdate = (evt: Event, apiClient: ApiClient, info: SessionInfoDto[]) => {
-            queryClient.setQueryData([ QUERY_KEY, params ], updateSessions(info));
+            queryClient.setQueryData([ QUERY_KEY, QUERY_PARAMS ], updateSessions(info));
         };
 
         __legacyApiClient__?.sendMessage(SessionMessageType.SessionsStart, '0,1500');

src/apps/dashboard/features/sessions/utils/getNowPlayingImageUrl.ts

@@ -1,4 +1,5 @@
 import type { BaseItemDto } from '@jellyfin/sdk/lib/generated-client/models/base-item-dto';
+import { ImageType } from '@jellyfin/sdk/lib/generated-client/models/image-type';
 import { ServerConnections } from 'lib/jellyfin-apiclient';
 import dom from 'scripts/dom';
 
@@ -12,7 +13,7 @@ const getNowPlayingImageUrl = (item: BaseItemDto) => {
     if (item?.BackdropImageTags?.length && item.Id) {
         return apiClient.getScaledImageUrl(item.Id, {
             maxWidth: Math.round(dom.getScreenWidth() * 0.20),
-            type: 'Backdrop',
+            type: ImageType.Backdrop,
             tag: item.BackdropImageTags[0]
         });
     }
@@ -20,7 +21,7 @@ const getNowPlayingImageUrl = (item: BaseItemDto) => {
     if (item?.ParentBackdropImageTags?.length && item.ParentBackdropItemId) {
         return apiClient.getScaledImageUrl(item.ParentBackdropItemId, {
             maxWidth: Math.round(dom.getScreenWidth() * 0.20),
-            type: 'Backdrop',
+            type: ImageType.Backdrop,
             tag: item.ParentBackdropImageTags[0]
         });
     }
@@ -30,7 +31,7 @@ const getNowPlayingImageUrl = (item: BaseItemDto) => {
     if (item && item.Id && imageTags.Thumb) {
         return apiClient.getScaledImageUrl(item.Id, {
             maxWidth: Math.round(dom.getScreenWidth() * 0.20),
-            type: 'Thumb',
+            type: ImageType.Thumb,
             tag: imageTags.Thumb
         });
     }
@@ -38,7 +39,7 @@ const getNowPlayingImageUrl = (item: BaseItemDto) => {
     if (item?.ParentThumbImageTag && item.ParentThumbItemId) {
         return apiClient.getScaledImageUrl(item.ParentThumbItemId, {
             maxWidth: Math.round(dom.getScreenWidth() * 0.20),
-            type: 'Thumb',
+            type: ImageType.Thumb,
             tag: item.ParentThumbImageTag
         });
     }
@@ -46,7 +47,7 @@ const getNowPlayingImageUrl = (item: BaseItemDto) => {
     if (item && item.Id && imageTags.Primary) {
         return apiClient.getScaledImageUrl(item.Id, {
             maxWidth: Math.round(dom.getScreenWidth() * 0.20),
-            type: 'Primary',
+            type: ImageType.Primary,
             tag: imageTags.Primary
         });
     }
@@ -54,7 +55,7 @@ const getNowPlayingImageUrl = (item: BaseItemDto) => {
     if (item?.AlbumPrimaryImageTag && item.AlbumId) {
         return apiClient.getScaledImageUrl(item.AlbumId, {
             maxWidth: Math.round(dom.getScreenWidth() * 0.20),
-            type: 'Primary',
+            type: ImageType.Primary,
             tag: item.AlbumPrimaryImageTag
         });
     }

src/components/InputDialog.tsx

@@ -8,7 +8,7 @@ import TextField from '@mui/material/TextField';
 import globalize from 'lib/globalize';
 import Stack from '@mui/material/Stack';
 
-interface IProps extends DialogProps {
+interface InputDialogProps extends DialogProps {
     title: string;
     label: string;
     confirmButtonText?: string;
@@ -16,7 +16,7 @@ interface IProps extends DialogProps {
     onConfirm: (text: string) => void;
 };
 
-const InputDialog = ({ open, title, label, onClose, confirmButtonText, onConfirm }: IProps) => {
+const InputDialog = ({ open, title, label, onClose, confirmButtonText, onConfirm }: InputDialogProps) => {
     const [ text, setText ] = useState('');
 
     const onTextChange = useCallback((e: React.ChangeEvent<HTMLInputElement>) => {