diff --git a/public/locales/en/modules/media-requests-list.json b/public/locales/en/modules/media-requests-list.json index 7f37e800d..8e39ba4d7 100644 --- a/public/locales/en/modules/media-requests-list.json +++ b/public/locales/en/modules/media-requests-list.json @@ -31,28 +31,5 @@ "request": "request...", "approved": "Request was approved!", "declined": "Request was declined!" - }, - "detail": { - "label": "Stats for nerds", - "id": "ID", - "device": "Device", - "video": { - "video":"Video", - "resolution": "Resolution", - "framerate": "Framerate", - "codec": "Video Codec" - }, - "audio": { - "audio": "Audio", - "channels": "Audio Channels", - "codec": "Audio Codec" - }, - "transcoding": { - "transcoding": "Transcoding", - "context": "Context", - "requested": "Hardware Encoding Requested", - "source": "Source Codec", - "target": "Target Codec" - } } } diff --git a/src/server/api/routers/media-server.ts b/src/server/api/routers/media-server.ts index 64df92178..7f3188cc5 100644 --- a/src/server/api/routers/media-server.ts +++ b/src/server/api/routers/media-server.ts @@ -100,72 +100,74 @@ const handleServer = async (app: ConfigAppType): Promise ({ - id: session.Id ?? '?', - username: session.UserName ?? undefined, - sessionName: `${session.Client} (${session.DeviceName})`, - supportsMediaControl: session.SupportsMediaControl ?? false, - currentlyPlaying: session.NowPlayingItem - ? { - name: `${session.NowPlayingItem.SeriesName ?? session.NowPlayingItem.Name}`, - seasonName: session.NowPlayingItem.SeasonName as string, - episodeName: session.NowPlayingItem.Name as string, - albumName: session.NowPlayingItem.Album as string, - episodeCount: session.NowPlayingItem.EpisodeCount ?? undefined, - metadata: { - video: - session.NowPlayingItem && - session.NowPlayingItem.Width && - session.NowPlayingItem.Height + sessions: sessions + .filter((session) => session.NowPlayingItem) + .map( + (session): GenericSessionInfo => ({ + id: session.Id ?? '?', + username: session.UserName ?? undefined, + sessionName: `${session.Client} (${session.DeviceName})`, + supportsMediaControl: session.SupportsMediaControl ?? false, + currentlyPlaying: session.NowPlayingItem + ? { + name: `${session.NowPlayingItem.SeriesName ?? session.NowPlayingItem.Name}`, + seasonName: session.NowPlayingItem.SeasonName as string, + episodeName: session.NowPlayingItem.Name as string, + albumName: session.NowPlayingItem.Album as string, + episodeCount: session.NowPlayingItem.EpisodeCount ?? undefined, + metadata: { + video: + session.NowPlayingItem && + session.NowPlayingItem.Width && + session.NowPlayingItem.Height + ? { + videoCodec: undefined, + width: session.NowPlayingItem.Width ?? undefined, + height: session.NowPlayingItem.Height ?? undefined, + bitrate: undefined, + videoFrameRate: session.TranscodingInfo?.Framerate + ? String(session.TranscodingInfo?.Framerate) + : undefined, + } + : undefined, + audio: session.TranscodingInfo ? { - videoCodec: undefined, - width: session.NowPlayingItem.Width ?? undefined, - height: session.NowPlayingItem.Height ?? undefined, - bitrate: undefined, - videoFrameRate: session.TranscodingInfo?.Framerate - ? String(session.TranscodingInfo?.Framerate) - : undefined, + audioChannels: session.TranscodingInfo.AudioChannels ?? undefined, + audioCodec: session.TranscodingInfo.AudioCodec ?? undefined, } : undefined, - audio: session.TranscodingInfo - ? { - audioChannels: session.TranscodingInfo.AudioChannels ?? undefined, - audioCodec: session.TranscodingInfo.AudioCodec ?? undefined, - } - : undefined, - transcoding: session.TranscodingInfo - ? { - audioChannels: session.TranscodingInfo.AudioChannels ?? -1, - audioCodec: session.TranscodingInfo.AudioCodec ?? undefined, - container: session.TranscodingInfo.Container ?? undefined, - width: session.TranscodingInfo.Width ?? undefined, - height: session.TranscodingInfo.Height ?? undefined, - videoCodec: session.TranscodingInfo?.VideoCodec ?? undefined, - audioDecision: undefined, - context: undefined, - duration: undefined, - error: undefined, - sourceAudioCodec: undefined, - sourceVideoCodec: undefined, - timeStamp: undefined, - transcodeHwRequested: undefined, - videoDecision: undefined, - } - : undefined, - }, - type: convertJellyfinType(session.NowPlayingItem.Type), - } - : undefined, - userProfilePicture: undefined, - }) - ), + transcoding: session.TranscodingInfo + ? { + audioChannels: session.TranscodingInfo.AudioChannels ?? -1, + audioCodec: session.TranscodingInfo.AudioCodec ?? undefined, + container: session.TranscodingInfo.Container ?? undefined, + width: session.TranscodingInfo.Width ?? undefined, + height: session.TranscodingInfo.Height ?? undefined, + videoCodec: session.TranscodingInfo?.VideoCodec ?? undefined, + audioDecision: undefined, + context: undefined, + duration: undefined, + error: undefined, + sourceAudioCodec: undefined, + sourceVideoCodec: undefined, + timeStamp: undefined, + transcodeHwRequested: undefined, + videoDecision: undefined, + } + : undefined, + }, + type: convertJellyfinType(session.NowPlayingItem.Type), + } + : undefined, + userProfilePicture: undefined, + }) + ), success: true, }; } diff --git a/src/widgets/media-server/DetailCollapseable.tsx b/src/widgets/media-server/DetailCollapseable.tsx index 85aa18531..a1669f82c 100644 --- a/src/widgets/media-server/DetailCollapseable.tsx +++ b/src/widgets/media-server/DetailCollapseable.tsx @@ -1,30 +1,29 @@ import { Card, Divider, Flex, Grid, Group, Text } from '@mantine/core'; import { IconDeviceMobile, IconId } from '@tabler/icons-react'; +import { useTranslation } from 'react-i18next'; import { GenericSessionInfo } from '../../types/api/media-server/session-info'; -import { useTranslation } from 'react-i18next'; export const DetailCollapseable = ({ session }: { session: GenericSessionInfo }) => { let details: { title: string; metrics: { name: string; value: string | undefined }[] }[] = []; - const { t } = useTranslation('modules/media-server-list'); if (session.currentlyPlaying) { if (session.currentlyPlaying.metadata.video) { details = [ ...details, { - title: t('detail.video.'), + title: "Video", metrics: [ { - name: t('detail.video.resolution'), + name: "Resolution", value: `${session.currentlyPlaying.metadata.video.width}x${session.currentlyPlaying.metadata.video.height}`, }, { - name: t('detail.video.framerate'), + name: "Framerate", value: session.currentlyPlaying.metadata.video.videoFrameRate, }, { - name: t('detail.video.codec'), + name: "Video Codec", value: session.currentlyPlaying.metadata.video.videoCodec, }, { @@ -41,14 +40,14 @@ export const DetailCollapseable = ({ session }: { session: GenericSessionInfo }) details = [ ...details, { - title: t('detail.audio.audio'), + title: "Audio", metrics: [ { - name: t('detail.audio.channels'), + name: "Audio Channels", value: `${session.currentlyPlaying.metadata.audio.audioChannels}`, }, { - name: t('detail.audio.codec'), + name: "Audio Codec", value: session.currentlyPlaying.metadata.audio.audioCodec, }, ], @@ -60,24 +59,24 @@ export const DetailCollapseable = ({ session }: { session: GenericSessionInfo }) details = [ ...details, { - title: t('detail.transcoding.transcoding'), + title: "Transcoding", metrics: [ { - name: t('detail.video.resolution'), + name: "Resolution", value: `${session.currentlyPlaying.metadata.transcoding.width}x${session.currentlyPlaying.metadata.transcoding.height}`, }, { - name: t('detail.transcoding.context'), + name: "Context", value: session.currentlyPlaying.metadata.transcoding.context, }, { - name: t('detail.transcoding.requested'), + name: "Hardware Encoding Requested", value: session.currentlyPlaying.metadata.transcoding.transcodeHwRequested ? 'yes' : 'no', }, { - name: t('detail.transcoding.source'), + name: "Source Codec", value: session.currentlyPlaying.metadata.transcoding.sourceAudioCodec || session.currentlyPlaying.metadata.transcoding.sourceVideoCodec @@ -85,7 +84,7 @@ export const DetailCollapseable = ({ session }: { session: GenericSessionInfo }) : undefined, }, { - name: t('detail.transcoding.target'), + name: "Target Codec", value: `${session.currentlyPlaying.metadata.transcoding.videoCodec} ${session.currentlyPlaying.metadata.transcoding.audioCodec}`, }, ], @@ -99,19 +98,19 @@ export const DetailCollapseable = ({ session }: { session: GenericSessionInfo }) - {t('detail.id')} + ID {session.id} - {t('detail.device')} + Device {session.sessionName} {details.length > 0 && ( - + )} {details.map((detail, index) => ( diff --git a/src/widgets/media-server/MediaServerTile.tsx b/src/widgets/media-server/MediaServerTile.tsx index c2257ee49..cc9106579 100644 --- a/src/widgets/media-server/MediaServerTile.tsx +++ b/src/widgets/media-server/MediaServerTile.tsx @@ -13,12 +13,11 @@ import { IconAlertTriangle, IconMovie } from '@tabler/icons-react'; import { useTranslation } from 'next-i18next'; import { AppAvatar } from '../../components/AppAvatar'; -import { useEditModeStore } from '../../components/Dashboard/Views/useEditModeStore'; import { useConfigContext } from '../../config/provider'; -import { useGetMediaServers } from './useGetMediaServers'; import { defineWidget } from '../helper'; import { IWidget } from '../widgets'; import { TableRow } from './TableRow'; +import { useGetMediaServers } from './useGetMediaServers'; const definition = defineWidget({ id: 'media-server', @@ -71,7 +70,7 @@ function MediaServerTile({ widget }: MediaServerWidgetProps) { {t('descriptor.name')} - {t('descriptor.loading')} + {t('loading')} ); @@ -79,7 +78,7 @@ function MediaServerTile({ widget }: MediaServerWidgetProps) { return ( - + @@ -99,7 +98,7 @@ function MediaServerTile({ widget }: MediaServerWidgetProps) {
- + {data?.servers.map((server) => { const app = config?.apps.find((x) => x.id === server.appId); diff --git a/src/widgets/media-server/NowPlayingDisplay.tsx b/src/widgets/media-server/NowPlayingDisplay.tsx index d03e4935c..d4ad15893 100644 --- a/src/widgets/media-server/NowPlayingDisplay.tsx +++ b/src/widgets/media-server/NowPlayingDisplay.tsx @@ -1,24 +1,21 @@ import { Flex, Stack, Text } from '@mantine/core'; import { - Icon, IconDeviceTv, IconHeadphones, IconMovie, IconQuestionMark, IconVideo, } from '@tabler/icons-react'; -import { useTranslation } from 'next-i18next'; import { GenericSessionInfo } from '../../types/api/media-server/session-info'; export const NowPlayingDisplay = ({ session }: { session: GenericSessionInfo }) => { - const { t } = useTranslation(); if (!session.currentlyPlaying) { return null; } - const Icon = (): Icon => { + const IconSelector = () => { switch (session.currentlyPlaying?.type) { case 'audio': return IconHeadphones; @@ -33,11 +30,12 @@ export const NowPlayingDisplay = ({ session }: { session: GenericSessionInfo }) } }; - const Test = Icon(); + const Icon = IconSelector(); + return ( - - + + {session.currentlyPlaying.name} {session.currentlyPlaying.albumName ? ( @@ -46,7 +44,7 @@ export const NowPlayingDisplay = ({ session }: { session: GenericSessionInfo }) ) : ( session.currentlyPlaying.seasonName && ( - + {session.currentlyPlaying.seasonName} - {session.currentlyPlaying.episodeName} )