Fix blocks for emby/jellyfin, support enable/disable

pull/1101/head
shamoon 1 year ago
parent 29c7a51b04
commit eaf7ba608b

@ -72,7 +72,11 @@
"playing": "Playing",
"transcoding": "Transcoding",
"bitrate": "Bitrate",
"no_active": "No Active Streams"
"no_active": "No Active Streams",
"movies": "Movies",
"series": "Series",
"episodes": "Episodes",
"songs": "Songs"
},
"flood": {
"download": "Download",

@ -247,7 +247,9 @@ export function cleanServiceGroups(groups) {
namespace, // kubernetes widget
app,
podSelector,
wan // opnsense widget
wan, // opnsense widget,
enableBlocks, // emby/jellyfin
enableNowPlaying
} = cleanedService.widget;
const fieldsList = typeof fields === 'string' ? JSON.parse(fields) : fields;
@ -278,6 +280,10 @@ export function cleanServiceGroups(groups) {
if (type === "opnsense") {
if (wan) cleanedService.widget.wan = wan;
}
if (type === "emby" || type === "jellyfin") {
if (enableBlocks) cleanedService.widget.enableBlocks = enableBlocks === 'true';
if (enableNowPlaying) cleanedService.widget.enableNowPlaying = enableNowPlaying === 'true';
}
}
return cleanedService;

@ -149,6 +149,33 @@ function SessionEntry({ playCommand, session }) {
);
}
function CountBlocks({ service, countData }) {
const { t } = useTranslation();
// allows filtering
// eslint-disable-next-line no-param-reassign
if (service.widget?.type === 'jellyfin') service.widget.type = 'emby'
if (!countData) {
return (
<Container service={service}>
<Block label="emby.movies" />
<Block label="emby.series" />
<Block label="emby.episodes" />
<Block label="emby.songs" />
</Container>
)
}
return (
<Container service={service}>
<Block label="emby.movies" value={t("common.number", { value: countData.MovieCount })} />
<Block label="emby.series" value={t("common.number", { value: countData.SeriesCount })} />
<Block label="emby.episodes" value={t("common.number", { value: countData.EpisodeCount })} />
<Block label="emby.songs" value={t("common.number", { value: countData.SongCount })} />
</Container>
)
}
export default function Component({ service }) {
const { t } = useTranslation();
@ -179,114 +206,92 @@ export default function Component({ service }) {
}
if (sessionsError || countError) {
return <Container error={sessionsError || countError} />;
return <Container error={sessionsError ?? countError} />;
}
if (!sessionsData && countData) {
const enableBlocks = service.widget?.enableBlocks
const enableNowPlaying = service.widget?.enableNowPlaying ?? true
if (!sessionsData || !countData) {
return (
<>
<Container>
<Block label="Movies" value={t("common.number", { value: countData.MovieCount })} />
<Block label="Series" value={t("common.number", { value: countData.SeriesCount })} />
<Block label="Episodes" value={t("common.number", { value: countData.EpisodeCount })} />
<Block label="Songs" value={t("common.number", { value: countData.SongCount })} />
</Container>
<div className="flex flex-col pb-1">
{enableBlocks && <CountBlocks service={service} countData={null} />}
{enableNowPlaying && <div className="flex flex-col pb-1">
<div className="text-theme-700 dark:text-theme-200 text-xs relative h-5 w-full rounded-md bg-theme-200/50 dark:bg-theme-900/20 mt-1">
<span className="absolute left-2 text-xs mt-[2px]">-</span>
</div>
<div className="text-theme-700 dark:text-theme-200 text-xs relative h-5 w-full rounded-md bg-theme-200/50 dark:bg-theme-900/20 mt-1">
<span className="absolute left-2 text-xs mt-[2px]">-</span>
</div>
</div>
</div>}
</>
);
}
if (!sessionsData) {
return (
<div className="flex flex-col pb-1">
<div className="text-theme-700 dark:text-theme-200 text-xs relative h-5 w-full rounded-md bg-theme-200/50 dark:bg-theme-900/20 mt-1">
<span className="absolute left-2 text-xs mt-[2px]">-</span>
if (enableNowPlaying) {
const playing = sessionsData
.filter((session) => session?.NowPlayingItem)
.sort((a, b) => {
if (a.PlayState.PositionTicks > b.PlayState.PositionTicks) {
return 1;
}
if (a.PlayState.PositionTicks < b.PlayState.PositionTicks) {
return -1;
}
return 0;
});
if (playing.length === 0) {
return (
<>
{enableBlocks && <CountBlocks service={service} countData={countData} />}
<div className="flex flex-col pb-1 mx-1">
<div className="text-theme-700 dark:text-theme-200 text-xs relative h-5 w-full rounded-md bg-theme-200/50 dark:bg-theme-900/20 mt-1">
<span className="absolute left-2 text-xs mt-[2px]">{t("emby.no_active")}</span>
</div>
<div className="text-theme-700 dark:text-theme-200 text-xs relative h-5 w-full rounded-md bg-theme-200/50 dark:bg-theme-900/20 mt-1">
<span className="absolute left-2 text-xs mt-[2px]">-</span>
</div>
</div>
<div className="text-theme-700 dark:text-theme-200 text-xs relative h-5 w-full rounded-md bg-theme-200/50 dark:bg-theme-900/20 mt-1">
<span className="absolute left-2 text-xs mt-[2px]">-</span>
</>
);
}
if (playing.length === 1) {
const session = playing[0];
return (
<>
{enableBlocks && <CountBlocks service={service} countData={countData} />}
<div className="flex flex-col pb-1 mx-1">
<SingleSessionEntry
playCommand={(currentSession, command) => handlePlayCommand(currentSession, command)}
session={session}
/>
</div>
</div>
);
}
const playing = sessionsData
.filter((session) => session?.NowPlayingItem)
.sort((a, b) => {
if (a.PlayState.PositionTicks > b.PlayState.PositionTicks) {
return 1;
}
if (a.PlayState.PositionTicks < b.PlayState.PositionTicks) {
return -1;
}
return 0;
});
if (playing.length === 0 && countData) {
</>
);
}
if (playing.length === -1)
return (
<>
<Container>
<Block label="Movies" value={t("common.number", { value: countData.MovieCount })} />
<Block label="Series" value={t("common.number", { value: countData.SeriesCount })} />
<Block label="Episodes" value={t("common.number", { value: countData.EpisodeCount })} />
<Block label="Songs" value={t("common.number", { value: countData.SongCount })} />
</Container>
{enableBlocks && <CountBlocks service={service} countData={countData} />}
<div className="flex flex-col pb-1 mx-1">
<div className="text-theme-700 dark:text-theme-200 text-xs relative h-5 w-full rounded-md bg-theme-200/50 dark:bg-theme-900/20 mt-1">
<span className="absolute left-2 text-xs mt-[2px]">{t("emby.no_active")}</span>
</div>
<div className="text-theme-700 dark:text-theme-200 text-xs relative h-5 w-full rounded-md bg-theme-200/50 dark:bg-theme-900/20 mt-1">
<span className="absolute left-2 text-xs mt-[2px]">-</span>
</div>
{playing.map((session) => (
<SessionEntry
key={session.Id}
playCommand={(currentSession, command) => handlePlayCommand(currentSession, command)}
session={session}
/>
))}
</div>
</>
);
}
if (playing.length === 1 && countData) {
const session = playing[0];
if (enableBlocks) {
return (
<>
<Container>
<Block label="Movies" value={t("common.number", { value: countData.MovieCount })} />
<Block label="Series" value={t("common.number", { value: countData.SeriesCount })} />
<Block label="Episodes" value={t("common.number", { value: countData.EpisodeCount })} />
<Block label="Songs" value={t("common.number", { value: countData.SongCount })} />
</Container>
<div className="flex flex-col pb-1 mx-1">
<SingleSessionEntry
playCommand={(currentSession, command) => handlePlayCommand(currentSession, command)}
session={session}
/>
</div>
</>
);
<CountBlocks service={service} countData={countData} />
)
}
if (countData && playing.length === -1)
return (
<>
<Container>
<Block label="Movies" value={t("common.number", { value: countData.MovieCount })} />
<Block label="Series" value={t("common.number", { value: countData.SeriesCount })} />
<Block label="Episodes" value={t("common.number", { value: countData.EpisodeCount })} />
<Block label="Songs" value={t("common.number", { value: countData.SongCount })} />
</Container>
<div className="flex flex-col pb-1 mx-1">
{playing.map((session) => (
<SessionEntry
key={session.Id}
playCommand={(currentSession, command) => handlePlayCommand(currentSession, command)}
session={session}
/>
))}
</div>
</>
);
}

Loading…
Cancel
Save