0ct0pu5/homepage
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

add emby service widget

Browse source
This commit is contained in:
Ben Phelps 2022-08-25 01:35:02 +03:00
parent 8a9c295e22
commit 10aec6dc60
2 changed files with 64 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/components/services/widget.jsx
View file

@ -2,12 +2,14 @@ import Sonarr from "./widgets/sonarr";
import Radarr from "./widgets/radarr";
import Ombi from "./widgets/ombi";
import Portainer from "./widgets/portainer";
import Emby from "./widgets/emby";
const widgetMappings = {
sonarr: Sonarr,
radarr: Radarr,
ombi: Ombi,
portainer: Portainer,
emby: Emby,
};
export default function Widget({ service }) {

62
src/components/services/widgets/emby.jsx Normal file
View file

@ -0,0 +1,62 @@
import useSWR from "swr";
export default function Emby({ service }) {
const config = service.widget;
function buildApiUrl(endpoint) {
const { url, key } = config;
return `${url}/emby/${endpoint}?api_key=${key}`;
}
const { data: sessionsData, error: sessionsError } = useSWR(buildApiUrl(`Sessions`));
if (sessionsError) {
return (
<div className="bg-theme-200/50 dark:bg-theme-900/20 rounded m-1 flex-1 flex flex-col items-center justify-center p-1">
<div className="font-thin text-sm">Emby API Error</div>
</div>
);
}
if (!sessionsData) {
return (
<div className="flex flex-row w-full">
<div className="bg-theme-200/50 dark:bg-theme-900/20 rounded m-1 flex-1 flex flex-col items-center justify-center p-1">
<div className="font-thin text-sm">-</div>
<div className="font-bold text-xs">PLAYING</div>
</div>
<div className="bg-theme-200/50 dark:bg-theme-900/20 rounded m-1 flex-1 flex flex-col items-center justify-center p-1">
<div className="font-thin text-sm">-</div>
<div className="font-bold text-xs">TRANSCODE</div>
</div>
<div className="bg-theme-200/50 dark:bg-theme-900/20 rounded m-1 flex-1 flex flex-col items-center justify-center p-1">
<div className="font-thin text-sm">-</div>
<div className="font-bold text-xs">BITRATE</div>
</div>
</div>
);
}
const playing = sessionsData.filter((session) => session.hasOwnProperty("NowPlayingItem"));
const transcoding = sessionsData.filter(
(session) => session.hasOwnProperty("PlayState") && session.PlayState.PlayMethod === "Transcode"
);
const bitrate = playing.reduce((acc, session) => acc + session.NowPlayingItem.Bitrate, 0);
return (
<div className="flex flex-row w-full">
<div className="bg-theme-200/50 dark:bg-theme-900/20 rounded m-1 flex-1 flex flex-col items-center justify-center p-1">
<div className="font-thin text-sm">{playing.length}</div>
<div className="font-bold text-xs">PLAYING</div>
</div>
<div className="bg-theme-200/50 dark:bg-theme-900/20 rounded m-1 flex-1 flex flex-col items-center justify-center p-1">
<div className="font-thin text-sm">{transcoding.length}</div>
<div className="font-bold text-xs">TRANSCODE</div>
</div>
<div className="bg-theme-200/50 dark:bg-theme-900/20 rounded m-1 flex-1 flex flex-col items-center justify-center p-1">
<div className="font-thin text-sm">{Math.round((bitrate / 1024 / 1024) * 100) / 100} Mbps</div>
<div className="font-bold text-xs">BITRATE</div>
</div>
</div>
);
}