open-source-mirrors
/
homepage
mirror of https://github.com/benphelps/homepage
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Add Docker, Emby, Gotify, Jackett, and JellySeerr widgets

Browse Source
pull/302/head
Jason Fischer 2 years ago
parent 035dd25ece
commit 808e79e2ac
No known key found for this signature in database
15 changed files with 510 additions and 9 deletions
Show Stats Download Patch File Download Diff File

2
src/components/services/widgets/service/docker.jsx
Unescape View File

@ -4,7 +4,7 @@ import { useTranslation } from "next-i18next";
import Widget from "../widget";
import Block from "../block";
import calculateCPUPercent from "utils/stats-helpers";
import calculateCPUPercent from "widgets/docker/stats-helpers";
export default function Docker({ service }) {
const { t } = useTranslation();

14
src/pages/api/services/proxy.js
Unescape View File

@ -1,3 +1,4 @@
import { formatApiCall } from "utils/api-helpers";
import createLogger from "utils/logger";
import genericProxyHandler from "utils/proxies/generic";
import widgets from "widgets/widgets";
@ -31,12 +32,15 @@ export default async function handler(req, res) {
return res.status(403).json({ error: "Unsupported service endpoint" });
}
if (req.query.params) {
const queryParams = JSON.parse(req.query.params);
const query = new URLSearchParams(mappingParams.map((p) => [p, queryParams[p]]));
req.query.endpoint = `${endpoint}?${query}`;
} else {
req.query.endpoint = endpoint;
if (req.query.segments) {
const segments = JSON.parse(req.query.segments);
req.query.endpoint = formatApiCall(endpoint, segments);
}
if (req.query.query) {
const queryParams = JSON.parse(req.query.query);
const query = new URLSearchParams(mappingParams.map((p) => [p, queryParams[p]]));
req.query.endpoint = `${req.query.endpoint}?${query}`;
}
if (endpointProxy instanceof Function) {

19
src/utils/api-helpers.js
Unescape View File

@ -32,15 +32,28 @@ export function formatApiCall(url, args) {
return url.replace(find, replace);
}
export function formatProxyUrl(widget, endpoint, endpointParams) {
function getURLSearchParams(widget, endpoint) {
const params = new URLSearchParams({
type: widget.type,
group: widget.service_group,
service: widget.service_name,
endpoint,
});
if (endpointParams) {
params.append("params", JSON.stringify(endpointParams));
return params;
}
export function formatProxyUrlWithSegments(widget, endpoint, segments) {
const params = getURLSearchParams(widget, endpoint);
if (segments) {
params.append("segments", JSON.stringify(segments))
}
return `/api/services/proxy?${params.toString()}`;
}
export function formatProxyUrl(widget, endpoint, queryParams) {
const params = getURLSearchParams(widget, endpoint);
if (queryParams) {
params.append("query", JSON.stringify(queryParams));
}
return `/api/services/proxy?${params.toString()}`;
}

6
src/widgets/components.js
Unescape View File

@ -4,6 +4,12 @@ const components = {
adguard: dynamic(() => import("./adguard/component")),
bazarr: dynamic(() => import("./bazarr/component")),
coinmarketcap: dynamic(() => import("./coinmarketcap/component")),
docker: dynamic(() => import("./docker/component")),
emby: dynamic(() => import("./emby/component")),
gotify: dynamic(() => import("./gotify/component")),
jackett: dynamic(() => import("./jackett/component")),
jellyfin: dynamic(() => import("./emby/component")),
jellyseerr: dynamic(() => import("./jellyseerr/component")),
overseerr: dynamic(() => import("./overseerr/component")),
portainer: dynamic(() => import("./portainer/component")),
prowlarr: dynamic(() => import("./prowlarr/component")),

63
src/widgets/docker/component.jsx
Unescape View File

@ -0,0 +1,63 @@
import useSWR from "swr";
import { useTranslation } from "next-i18next";
import calculateCPUPercent from "./stats-helpers";
import Widget from "components/services/widgets/widget";
import Block from "components/services/widgets/block";
export default function Component({ service }) {
const { t } = useTranslation();
const config = service.widget;
const { data: statusData, error: statusError } = useSWR(
`/api/docker/status/${config.container}/${config.server || ""}`,
{
refreshInterval: 5000,
}
);
const { data: statsData, error: statsError } = useSWR(
`/api/docker/stats/${config.container}/${config.server || ""}`,
{
refreshInterval: 5000,
}
);
if (statsError || statusError) {
return <Widget error={t("widget.api_error")} />;
}
if (statusData && statusData.status !== "running") {
return (
<Widget>
<Block label={t("widget.status")} value={t("docker.offline")} />
</Widget>
);
}
if (!statsData || !statusData) {
return (
<Widget>
<Block label={t("docker.cpu")} />
<Block label={t("docker.mem")} />
<Block label={t("docker.rx")} />
<Block label={t("docker.tx")} />
</Widget>
);
}
return (
<Widget>
<Block label={t("docker.cpu")} value={t("common.percent", { value: calculateCPUPercent(statsData.stats) })} />
<Block label={t("docker.mem")} value={t("common.bytes", { value: statsData.stats.memory_stats.usage })} />
{statsData.stats.networks && (
<>
<Block label={t("docker.rx")} value={t("common.bytes", { value: statsData.stats.networks.eth0.rx_bytes })} />
<Block label={t("docker.tx")} value={t("common.bytes", { value: statsData.stats.networks.eth0.tx_bytes })} />
</>
)}
</Widget>
);
}

0
src/utils/stats-helpers.js → src/widgets/docker/stats-helpers.js
Unescape View File

239
src/widgets/emby/component.jsx
Unescape View File

@ -0,0 +1,239 @@
import useSWR from "swr";
import { useTranslation } from "next-i18next";
import { BsVolumeMuteFill, BsFillPlayFill, BsPauseFill, BsCpu, BsFillCpuFill } from "react-icons/bs";
import { MdOutlineSmartDisplay } from "react-icons/md";
import Widget from "components/services/widgets/widget";
import { formatProxyUrl, formatProxyUrlWithSegments } from "utils/api-helpers";
function ticksToTime(ticks) {
const milliseconds = ticks / 10000;
const seconds = Math.floor((milliseconds / 1000) % 60);
const minutes = Math.floor((milliseconds / (1000 * 60)) % 60);
const hours = Math.floor((milliseconds / (1000 * 60 * 60)) % 24);
return { hours, minutes, seconds };
}
function ticksToString(ticks) {
const { hours, minutes, seconds } = ticksToTime(ticks);
const parts = [];
if (hours > 0) {
parts.push(hours);
}
parts.push(minutes);
parts.push(seconds);
return parts.map((part) => part.toString().padStart(2, "0")).join(":");
}
function SingleSessionEntry({ playCommand, session }) {
const {
NowPlayingItem: { Name, SeriesName, RunTimeTicks },
PlayState: { PositionTicks, IsPaused, IsMuted },
} = session;
const { IsVideoDirect, VideoDecoderIsHardware, VideoEncoderIsHardware } = session?.TranscodingInfo || {
IsVideoDirect: true,
VideoDecoderIsHardware: true,
VideoEncoderIsHardware: true,
};
const percent = (PositionTicks / RunTimeTicks) * 100;
return (
<>
<div className="text-theme-700 dark:text-theme-200 relative h-5 w-full rounded-md bg-theme-200/50 dark:bg-theme-900/20 mt-1 flex">
<div className="grow text-xs z-10 self-center ml-2 relative w-full h-4 mr-2">
<div className="absolute w-full whitespace-nowrap text-ellipsis overflow-hidden">
{Name}
{SeriesName && ` - ${SeriesName}`}
</div>
</div>
<div className="self-center text-xs flex justify-end mr-1.5 pl-1">
{IsVideoDirect && <MdOutlineSmartDisplay className="opacity-50" />}
{!IsVideoDirect && (!VideoDecoderIsHardware || !VideoEncoderIsHardware) && <BsCpu className="opacity-50" />}
{!IsVideoDirect && VideoDecoderIsHardware && VideoEncoderIsHardware && (
<BsFillCpuFill className="opacity-50" />
)}
</div>
</div>
<div className="text-theme-700 dark:text-theme-200 relative h-5 w-full rounded-md bg-theme-200/50 dark:bg-theme-900/20 mt-1 flex">
<div
className="absolute h-5 rounded-md bg-theme-200 dark:bg-theme-900/40 z-0"
style={{
width: `${percent}%`,
}}
/>
<div className="text-xs z-10 self-center ml-1">
{IsPaused && (
<BsFillPlayFill
onClick={() => {
playCommand(session, "Unpause");
}}
className="inline-block w-4 h-4 cursor-pointer -mt-[1px] mr-1 opacity-80"
/>
)}
{!IsPaused && (
<BsPauseFill
onClick={() => {
playCommand(session, "Pause");
}}
className="inline-block w-4 h-4 cursor-pointer -mt-[1px] mr-1 opacity-80"
/>
)}
</div>
<div className="grow " />
<div className="self-center text-xs flex justify-end mr-1 z-10">{IsMuted && <BsVolumeMuteFill />}</div>
<div className="self-center text-xs flex justify-end mr-2 z-10">
{ticksToString(PositionTicks)}
<span className="mx-0.5 text-[8px]">/</span>
{ticksToString(RunTimeTicks)}
</div>
</div>
</>
);
}
function SessionEntry({ playCommand, session }) {
const {
NowPlayingItem: { Name, SeriesName, RunTimeTicks },
PlayState: { PositionTicks, IsPaused, IsMuted },
} = session;
const { IsVideoDirect, VideoDecoderIsHardware, VideoEncoderIsHardware } = session?.TranscodingInfo || {};
const percent = (PositionTicks / RunTimeTicks) * 100;
return (
<div className="text-theme-700 dark:text-theme-200 relative h-5 w-full rounded-md bg-theme-200/50 dark:bg-theme-900/20 mt-1 flex">
<div
className="absolute h-5 rounded-md bg-theme-200 dark:bg-theme-900/40 z-0"
style={{
width: `${percent}%`,
}}
/>
<div className="text-xs z-10 self-center ml-1">
{IsPaused && (
<BsFillPlayFill
onClick={() => {
playCommand(session, "Unpause");
}}
className="inline-block w-4 h-4 cursor-pointer -mt-[1px] mr-1 opacity-80"
/>
)}
{!IsPaused && (
<BsPauseFill
onClick={() => {
playCommand(session, "Pause");
}}
className="inline-block w-4 h-4 cursor-pointer -mt-[1px] mr-1 opacity-80"
/>
)}
</div>
<div className="grow text-xs z-10 self-center relative w-full h-4">
<div className="absolute w-full whitespace-nowrap text-ellipsis overflow-hidden">
{Name}
{SeriesName && ` - ${SeriesName}`}
</div>
</div>
<div className="self-center text-xs flex justify-end mr-1 z-10">{IsMuted && <BsVolumeMuteFill />}</div>
<div className="self-center text-xs flex justify-end mr-1 z-10">{ticksToString(PositionTicks)}</div>
<div className="self-center items-center text-xs flex justify-end mr-1.5 pl-1 z-10">
{IsVideoDirect && <MdOutlineSmartDisplay className="opacity-50" />}
{!IsVideoDirect && (!VideoDecoderIsHardware || !VideoEncoderIsHardware) && <BsCpu className="opacity-50" />}
{!IsVideoDirect && VideoDecoderIsHardware && VideoEncoderIsHardware && <BsFillCpuFill className="opacity-50" />}
</div>
</div>
);
}
export default function Component({ service }) {
const { t } = useTranslation();
const config = service.widget;
const {
data: sessionsData,
error: sessionsError,
mutate: sessionMutate,
} = useSWR(formatProxyUrl(config, "Sessions"), {
refreshInterval: 5000,
});
async function handlePlayCommand(session, command) {
const url = formatProxyUrlWithSegments(config, "PlayControl", {
sessionId: session.Id,
command
});
await fetch(url).then(() => {
sessionMutate();
});
}
if (sessionsError) {
return <Widget error={t("widget.api_error")} />;
}
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>
</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>
);
}
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 (
<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>
);
}
if (playing.length === 1) {
const session = playing[0];
return (
<div className="flex flex-col pb-1 mx-1">
<SingleSessionEntry
playCommand={(currentSession, command) => handlePlayCommand(currentSession, command)}
session={session}
/>
</div>
);
}
return (
<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>
);
}

19
src/widgets/emby/widget.js
Unescape View File

@ -0,0 +1,19 @@
import genericProxyHandler from "utils/proxies/generic";
const widget = {
api: "{url}/emby/{endpoint}?api_key={key}",
proxyHandler: genericProxyHandler,
mappings: {
"Sessions": {
endpoint: "Sessions",
},
"PlayControl": {
method: "POST",
enpoint: "Sessions/{sessionId}/Playing/{command}",
segments: ["sessionId", "command"]
}
},
};
export default widget;

28
src/widgets/gotify/component.jsx
Unescape View File

@ -0,0 +1,28 @@
import useSWR from "swr";
import { useTranslation } from "next-i18next";
import Widget from "components/services/widgets/widget";
import Block from "components/services/widgets/block";
import { formatProxyUrl } from "utils/api-helpers";
export default function Component({ service }) {
const { t } = useTranslation();
const config = service.widget;
const { data: appsData, error: appsError } = useSWR(formatProxyUrl(config, `application`));
const { data: messagesData, error: messagesError } = useSWR(formatProxyUrl(config, `message`));
const { data: clientsData, error: clientsError } = useSWR(formatProxyUrl(config, `client`));
if (appsError || messagesError || clientsError) {
return <Widget error={t("widget.api_error")} />;
}
return (
<Widget>
<Block label={t("gotify.apps")} value={appsData?.length} />
<Block label={t("gotify.clients")} value={clientsData?.length} />
<Block label={t("gotify.messages")} value={messagesData?.messages?.length} />
</Widget>
);
}

20
src/widgets/gotify/widget.js
Unescape View File

@ -0,0 +1,20 @@
import credentialedProxyHandler from "utils/proxies/credentialed";
const widget = {
api: "{url}/{endpoint}",
proxyHandler: credentialedProxyHandler,
mappings: {
"application": {
endpoint: "application"
},
"client": {
endpoint: "client"
},
"message": {
endpoint: "message"
},
},
};
export default widget;

36
src/widgets/jackett/component.jsx
Unescape View File

@ -0,0 +1,36 @@
import useSWR from "swr";
import { useTranslation } from "next-i18next";
import Widget from "components/services/widgets/widget";
import Block from "components/services/widgets/block";
import { formatProxyUrl } from "utils/api-helpers";
export default function Component({ service }) {
const { t } = useTranslation();
const config = service.widget;
const { data: indexersData, error: indexersError } = useSWR(formatProxyUrl(config, "indexers"));
if (indexersError) {
return <Widget error={t("widget.api_error")} />;
}
if (!indexersData) {
return (
<Widget>
<Block label={t("jackett.configured")} />
<Block label={t("jackett.errored")} />
</Widget>
);
}
const errored = indexersData.filter((indexer) => indexer.last_error);
return (
<Widget>
<Block label={t("jackett.configured")} value={t("common.number", { value: indexersData.length })} />
<Block label={t("jackett.errored")} value={t("common.number", { value: errored.length })} />
</Widget>
);
}

14
src/widgets/jackett/widget.js
Unescape View File

@ -0,0 +1,14 @@
import genericProxyHandler from "utils/proxies/generic";
const widget = {
api: "{url}/api/v2.0/{endpoint}?apikey={key}&configured=true",
proxyHandler: genericProxyHandler,
mappings: {
"indexers": {
endpoint: "indexers"
},
},
};
export default widget;

36
src/widgets/jellyseerr/component.jsx
Unescape View File

@ -0,0 +1,36 @@
import useSWR from "swr";
import { useTranslation } from "next-i18next";
import Widget from "components/services/widgets/widget";
import Block from "components/services/widgets/block";
import { formatProxyUrl } from "utils/api-helpers";
export default function Component({ service }) {
const { t } = useTranslation();
const config = service.widget;
const { data: statsData, error: statsError } = useSWR(formatProxyUrl(config, `request/count`));
if (statsError) {
return <Widget error={t("widget.api_error")} />;
}
if (!statsData) {
return (
<Widget>
<Block label={t("jellyseerr.pending")} />
<Block label={t("jellyseerr.approved")} />
<Block label={t("jellyseerr.available")} />
</Widget>
);
}
return (
<Widget>
<Block label={t("jellyseerr.pending")} value={statsData.pending} />
<Block label={t("jellyseerr.approved")} value={statsData.approved} />
<Block label={t("jellyseerr.available")} value={statsData.available} />
</Widget>
);
}

14
src/widgets/jellyseerr/widget.js
Unescape View File

@ -0,0 +1,14 @@
import credentialedProxyHandler from "utils/proxies/credentialed";
const widget = {
api: "{url}/api/v1/{endpoint}",
proxyHandler: credentialedProxyHandler,
mappings: {
"request/count": {
endpoint: "request/count"
},
},
};
export default widget;

9
src/widgets/widgets.js
Unescape View File

@ -1,6 +1,10 @@
import adguard from "./adguard/widget";
import bazarr from "./bazarr/widget";
import coinmarketcap from "./coinmarketcap/widget";
import emby from "./emby/widget";
import gotify from "./gotify/widget";
import jackett from "./jackett/widget";
import jellyseerr from "./jellyseerr/widget";
import overseerr from "./overseerr/widget";
import portainer from "./portainer/widget";
import prowlarr from "./prowlarr/widget";
@ -20,6 +24,11 @@ const widgets = {
adguard,
bazarr,
coinmarketcap,
emby,
gotify,
jackett,
jellyfin: emby,
jellyseerr,
overseerr,
portainer,
prowlarr,

Write Preview
Loading…
Cancel
Save