Compare commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
8c87680078 |
@@ -6,7 +6,6 @@ import { DockerWidget } from "./docker/Widget";
|
||||
import { DatabaseWidget } from "./database/Widget";
|
||||
import { SystemWidget } from "./system/Widget";
|
||||
import { HttpWidget } from "./http/Widget";
|
||||
import { TraefikWidget } from "./traefik/Widget";
|
||||
import { ServiceWidget } from "./service/Widget";
|
||||
|
||||
type WidgetComponent<T extends Widget["type"]> = ComponentType<{
|
||||
@@ -21,6 +20,5 @@ export const widgetRegistry: { [K in Widget["type"]]: WidgetComponent<K> } = {
|
||||
database: DatabaseWidget,
|
||||
system: SystemWidget,
|
||||
http: HttpWidget,
|
||||
traefik: TraefikWidget,
|
||||
service: ServiceWidget,
|
||||
};
|
||||
|
||||
@@ -1,72 +0,0 @@
|
||||
"use client";
|
||||
|
||||
import type { Widget } from "@/lib/config/schema";
|
||||
import { useWidgetSubscription } from "@/lib/ws/client";
|
||||
import { SkeletonLines } from "@/components/widgets/Skeleton";
|
||||
import { WidgetCard } from "@/components/widgets/WidgetCard";
|
||||
import { StatusDot } from "@/components/widgets/StatusDot";
|
||||
import { BrandIcon } from "@/components/widgets/BrandIcon";
|
||||
|
||||
type TraefikWidget = Extract<Widget, { type: "traefik" }>;
|
||||
|
||||
export function TraefikWidget({ widget, widgetId }: { widget: TraefikWidget; widgetId: string }) {
|
||||
const result = useWidgetSubscription(widgetId);
|
||||
const data = result?.type === "traefik" ? result.data : null;
|
||||
const errorMessage = result?.type === "error" ? result.message : null;
|
||||
const enabledCount = data?.routers.filter((router) => router.status === "enabled").length ?? 0;
|
||||
|
||||
return (
|
||||
<WidgetCard span={4}>
|
||||
<div className="flex items-center justify-between gap-2">
|
||||
<div className="flex min-w-0 items-center gap-2">
|
||||
<BrandIcon slug={widget.icon} />
|
||||
{widget.href ? (
|
||||
<a
|
||||
href={widget.href}
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
className="truncate text-[15px] font-medium text-fg hover:text-accent"
|
||||
>
|
||||
{widget.name}
|
||||
</a>
|
||||
) : (
|
||||
<span className="truncate text-[15px] font-medium text-fg">{widget.name}</span>
|
||||
)}
|
||||
</div>
|
||||
<div className="flex items-center gap-2">
|
||||
{data && (
|
||||
<span className="font-mono text-[11px] tabular-nums text-fg-muted">
|
||||
{data.entrypoints.length} entrypoints
|
||||
</span>
|
||||
)}
|
||||
<StatusDot status={data ? "running" : undefined} />
|
||||
</div>
|
||||
</div>
|
||||
{errorMessage && <span className="text-xs text-status-down">{errorMessage}</span>}
|
||||
{!result && !errorMessage && <SkeletonLines count={3} />}
|
||||
{data && (
|
||||
<>
|
||||
<div className="flex items-start gap-4">
|
||||
<div className="flex flex-col gap-0.5">
|
||||
<span className="font-mono text-2xl leading-none font-semibold tabular-nums text-accent">
|
||||
{data.routers.length}
|
||||
</span>
|
||||
<span className="text-[10px] tracking-wide text-fg-muted uppercase">Routes</span>
|
||||
</div>
|
||||
{enabledCount !== data.routers.length && (
|
||||
<div className="flex flex-col gap-0.5 border-l border-border pl-4">
|
||||
<span className="font-mono text-2xl leading-none font-semibold tabular-nums text-status-degraded">
|
||||
{enabledCount}
|
||||
</span>
|
||||
<span className="text-[10px] tracking-wide text-fg-muted uppercase">Enabled</span>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
<span className="text-[11px] text-fg-muted">
|
||||
<span className="font-mono tabular-nums">{data.middlewaresCount}</span> middlewares
|
||||
</span>
|
||||
</>
|
||||
)}
|
||||
</WidgetCard>
|
||||
);
|
||||
}
|
||||
@@ -5,7 +5,6 @@ import { parseDuration } from "@/lib/config/duration";
|
||||
import { collectDockerContainer, dockerLimit } from "./docker";
|
||||
import { collectSystem } from "./system";
|
||||
import { collectHttp } from "./http";
|
||||
import { collectTraefik } from "./traefik";
|
||||
import { collectService } from "./service";
|
||||
import type { WidgetResult } from "@/lib/types/widget-result";
|
||||
|
||||
@@ -20,14 +19,7 @@ interface Job {
|
||||
consecutiveFailures: number;
|
||||
}
|
||||
|
||||
const COLLECTOR_TYPES = new Set<Widget["type"]>([
|
||||
"docker",
|
||||
"database",
|
||||
"system",
|
||||
"http",
|
||||
"traefik",
|
||||
"service",
|
||||
]);
|
||||
const COLLECTOR_TYPES = new Set<Widget["type"]>(["docker", "database", "system", "http", "service"]);
|
||||
|
||||
function isCollectorWidget(widget: Widget): boolean {
|
||||
return COLLECTOR_TYPES.has(widget.type);
|
||||
@@ -39,7 +31,6 @@ function getIntervalMs(widget: Widget): number {
|
||||
widget.type === "database" ||
|
||||
widget.type === "system" ||
|
||||
widget.type === "http" ||
|
||||
widget.type === "traefik" ||
|
||||
widget.type === "service"
|
||||
) {
|
||||
return parseDuration(widget.interval);
|
||||
@@ -60,9 +51,6 @@ function sameTarget(a: Widget, b: Widget): boolean {
|
||||
if (a.type === "http" && b.type === "http") {
|
||||
return a.url === b.url && a.method === b.method && a.expect.status === b.expect.status;
|
||||
}
|
||||
if (a.type === "traefik" && b.type === "traefik") {
|
||||
return a.apiUrl === b.apiUrl;
|
||||
}
|
||||
if (a.type === "service" && b.type === "service") {
|
||||
return a.containerName === b.containerName && a.service === b.service && a.showStats === b.showStats;
|
||||
}
|
||||
@@ -88,10 +76,6 @@ async function collect(widget: Widget): Promise<WidgetResult> {
|
||||
);
|
||||
return { type: "http", data: { ...data, consecutiveFailures: 0 } };
|
||||
}
|
||||
if (widget.type === "traefik") {
|
||||
const data = await collectTraefik(widget.apiUrl);
|
||||
return { type: "traefik", data };
|
||||
}
|
||||
if (widget.type === "service") {
|
||||
const data = await collectService(widget);
|
||||
return { type: "service", data };
|
||||
|
||||
@@ -7,6 +7,7 @@ import { collectImmich } from "./services/immich";
|
||||
import { collectN8n } from "./services/n8n";
|
||||
import { collectUmami } from "./services/umami";
|
||||
import { collectHeadscale } from "./services/headscale";
|
||||
import { collectTraefikStat } from "./services/traefik";
|
||||
|
||||
function collectServiceStat(widget: ServiceWidget): Promise<{ stats: ServiceStat[]; detail?: string[] }> {
|
||||
switch (widget.service) {
|
||||
@@ -22,6 +23,8 @@ function collectServiceStat(widget: ServiceWidget): Promise<{ stats: ServiceStat
|
||||
return collectUmami(widget);
|
||||
case "headscale":
|
||||
return collectHeadscale(widget);
|
||||
case "traefik":
|
||||
return collectTraefikStat(widget);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -7,6 +7,7 @@ const SERVICE_PORTS: Record<ServiceWidget["service"], number> = {
|
||||
n8n: 5678,
|
||||
umami: 3000,
|
||||
headscale: 8080,
|
||||
traefik: 8080,
|
||||
};
|
||||
|
||||
export function serviceBaseUrl(widget: ServiceWidget): string {
|
||||
|
||||
@@ -0,0 +1,17 @@
|
||||
import type { TraefikServiceWidget } from "@/lib/config/schema";
|
||||
import type { ServiceStat } from "@/lib/types/service-result";
|
||||
import { serviceBaseUrl } from "./base-url";
|
||||
|
||||
interface RawRouter {
|
||||
status: string;
|
||||
}
|
||||
|
||||
export async function collectTraefikStat(widget: TraefikServiceWidget): Promise<{ stats: ServiceStat[] }> {
|
||||
const base = serviceBaseUrl(widget);
|
||||
const response = await fetch(`${base}/api/http/routers`, { signal: AbortSignal.timeout(5_000) });
|
||||
if (!response.ok) {
|
||||
throw new Error(`Traefik API returned ${response.status}`);
|
||||
}
|
||||
const routers = (await response.json()) as RawRouter[];
|
||||
return { stats: [{ label: "Routes", value: String(routers.length) }] };
|
||||
}
|
||||
@@ -1,48 +0,0 @@
|
||||
import type { TraefikResult } from "@/lib/types/traefik-result";
|
||||
|
||||
interface RawRouter {
|
||||
name: string;
|
||||
rule: string;
|
||||
service: string;
|
||||
status: string;
|
||||
tls?: unknown;
|
||||
entryPoints?: string[];
|
||||
}
|
||||
|
||||
interface RawEntrypoint {
|
||||
name: string;
|
||||
address: string;
|
||||
}
|
||||
|
||||
async function fetchJson<T>(url: string): Promise<T | null> {
|
||||
const response = await fetch(url, { signal: AbortSignal.timeout(5_000) });
|
||||
if (!response.ok) return null;
|
||||
return (await response.json()) as T;
|
||||
}
|
||||
|
||||
export async function collectTraefik(apiUrl: string): Promise<TraefikResult> {
|
||||
const base = apiUrl.replace(/\/$/, "");
|
||||
|
||||
const [routers, entrypoints, middlewares] = await Promise.all([
|
||||
fetchJson<RawRouter[]>(`${base}/http/routers`),
|
||||
fetchJson<RawEntrypoint[]>(`${base}/entrypoints`),
|
||||
fetchJson<unknown[]>(`${base}/http/middlewares`),
|
||||
]);
|
||||
|
||||
if (routers === null) {
|
||||
throw new Error(`Traefik API at ${base}/http/routers is unreachable or returned an error`);
|
||||
}
|
||||
|
||||
return {
|
||||
routers: routers.map((router) => ({
|
||||
name: router.name,
|
||||
rule: router.rule,
|
||||
service: router.service,
|
||||
status: router.status,
|
||||
tls: Boolean(router.tls),
|
||||
entryPoints: router.entryPoints ?? [],
|
||||
})),
|
||||
entrypoints: (entrypoints ?? []).map((ep) => ({ name: ep.name, address: ep.address })),
|
||||
middlewaresCount: middlewares?.length ?? 0,
|
||||
};
|
||||
}
|
||||
+7
-10
@@ -58,15 +58,6 @@ export const httpWidgetSchema = z.object({
|
||||
.default({ status: 200 }),
|
||||
});
|
||||
|
||||
export const traefikWidgetSchema = z.object({
|
||||
type: z.literal("traefik"),
|
||||
name: z.string().default("Traefik"),
|
||||
apiUrl: z.string().url(),
|
||||
href: z.string().url().optional(),
|
||||
icon: z.string().optional(),
|
||||
interval: durationSchema.default("15s"),
|
||||
});
|
||||
|
||||
const serviceCommonFields = {
|
||||
type: z.literal("service") as z.ZodLiteral<"service">,
|
||||
name: z.string(),
|
||||
@@ -116,6 +107,11 @@ export const headscaleServiceWidgetSchema = z.object({
|
||||
apiToken: z.string(),
|
||||
});
|
||||
|
||||
export const traefikServiceWidgetSchema = z.object({
|
||||
...serviceCommonFields,
|
||||
service: z.literal("traefik"),
|
||||
});
|
||||
|
||||
export const serviceWidgetSchema = z.discriminatedUnion("service", [
|
||||
giteaServiceWidgetSchema,
|
||||
coolifyServiceWidgetSchema,
|
||||
@@ -123,6 +119,7 @@ export const serviceWidgetSchema = z.discriminatedUnion("service", [
|
||||
n8nServiceWidgetSchema,
|
||||
umamiServiceWidgetSchema,
|
||||
headscaleServiceWidgetSchema,
|
||||
traefikServiceWidgetSchema,
|
||||
]);
|
||||
|
||||
export const widgetSchema = z.discriminatedUnion("type", [
|
||||
@@ -132,7 +129,6 @@ export const widgetSchema = z.discriminatedUnion("type", [
|
||||
databaseWidgetSchema,
|
||||
systemWidgetSchema,
|
||||
httpWidgetSchema,
|
||||
traefikWidgetSchema,
|
||||
serviceWidgetSchema,
|
||||
]);
|
||||
|
||||
@@ -194,3 +190,4 @@ export type ImmichServiceWidget = z.infer<typeof immichServiceWidgetSchema>;
|
||||
export type N8nServiceWidget = z.infer<typeof n8nServiceWidgetSchema>;
|
||||
export type UmamiServiceWidget = z.infer<typeof umamiServiceWidgetSchema>;
|
||||
export type HeadscaleServiceWidget = z.infer<typeof headscaleServiceWidgetSchema>;
|
||||
export type TraefikServiceWidget = z.infer<typeof traefikServiceWidgetSchema>;
|
||||
|
||||
@@ -1,19 +0,0 @@
|
||||
export interface TraefikRouterInfo {
|
||||
name: string;
|
||||
rule: string;
|
||||
service: string;
|
||||
status: string;
|
||||
tls: boolean;
|
||||
entryPoints: string[];
|
||||
}
|
||||
|
||||
export interface TraefikEntrypointInfo {
|
||||
name: string;
|
||||
address: string;
|
||||
}
|
||||
|
||||
export interface TraefikResult {
|
||||
routers: TraefikRouterInfo[];
|
||||
entrypoints: TraefikEntrypointInfo[];
|
||||
middlewaresCount: number;
|
||||
}
|
||||
@@ -1,6 +1,5 @@
|
||||
import type { SystemResult } from "./system-result";
|
||||
import type { HttpCheckResult } from "./http-result";
|
||||
import type { TraefikResult } from "./traefik-result";
|
||||
import type { ServiceWidgetResult } from "./service-result";
|
||||
|
||||
export interface DockerContainerResult {
|
||||
@@ -20,6 +19,5 @@ export type WidgetResult =
|
||||
| { type: "database"; data: DockerContainerResult }
|
||||
| { type: "system"; data: SystemResult }
|
||||
| { type: "http"; data: HttpCheckResult }
|
||||
| { type: "traefik"; data: TraefikResult }
|
||||
| { type: "service"; data: ServiceWidgetResult }
|
||||
| { type: "error"; message: string };
|
||||
|
||||
Reference in New Issue
Block a user