Compare commits
2
Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
8b089c0c06 | ||
|
|
a253dcb7d8 |
No files matched your search
@@ -2,6 +2,7 @@
|
||||
|
||||
import type { PropsWithChildren } from "react";
|
||||
import { useState } from "react";
|
||||
import type { QueryKey } from "@tanstack/react-query";
|
||||
import { QueryClient } from "@tanstack/react-query";
|
||||
import { ReactQueryDevtools } from "@tanstack/react-query-devtools";
|
||||
import { ReactQueryStreamedHydration } from "@tanstack/react-query-next-experimental";
|
||||
@@ -33,6 +34,7 @@ import {
|
||||
import { createHeadersCallbackForSource, getTrpcUrl } from "@homarr/api/shared";
|
||||
import { env } from "@homarr/common/env";
|
||||
import { showWarningNotification } from "@homarr/notifications";
|
||||
import { widgetImports } from "@homarr/widgets";
|
||||
|
||||
import { createWidgetQueryPersister } from "./query-cache-persister";
|
||||
|
||||
@@ -90,6 +92,13 @@ export function TRPCReactProvider(props: PropsWithChildren) {
|
||||
},
|
||||
});
|
||||
client.setQueryDefaults([["widget"]], { refetchInterval: queryCacheDefaultRefetchIntervalMs });
|
||||
for (const { definition } of Object.values(widgetImports)) {
|
||||
const def = definition as { refetchInterval?: number | false; queryKey?: QueryKey; kind: string };
|
||||
if (def.refetchInterval === undefined) continue;
|
||||
const key = def.queryKey ?? [["widget", def.kind]];
|
||||
const interval = def.refetchInterval === false ? false : def.refetchInterval * 1000;
|
||||
client.setQueryDefaults(key, { refetchInterval: interval });
|
||||
}
|
||||
return client;
|
||||
});
|
||||
|
||||
|
||||
@@ -67,9 +67,17 @@ export const createWidgetDefinition = <TKind extends WidgetKind, TDefinition ext
|
||||
withDynamicImport: createWithDynamicImport(kind, definition),
|
||||
});
|
||||
|
||||
export const widgetRefetchInterval = {
|
||||
fiveSeconds: 5,
|
||||
never: false,
|
||||
} as const;
|
||||
|
||||
export type WidgetRefetchInterval = (typeof widgetRefetchInterval)[keyof typeof widgetRefetchInterval];
|
||||
|
||||
export interface WidgetDefinition {
|
||||
icon: TablerIcon;
|
||||
queryKey?: QueryKey;
|
||||
refetchInterval?: WidgetRefetchInterval;
|
||||
supportedIntegrations?: IntegrationKind[];
|
||||
integrationsRequired?: boolean;
|
||||
maxIntegrations?: number;
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import { widgetRefetchInterval } from "../../definition";
|
||||
import { IconDeviceGamepad, IconServerOff } from "@tabler/icons-react";
|
||||
|
||||
import { getIntegrationKindsByCategory } from "@homarr/definitions";
|
||||
@@ -9,6 +10,8 @@ export const widgetKind = "dnsHoleControls";
|
||||
|
||||
export const { definition, componentLoader } = createWidgetDefinition(widgetKind, {
|
||||
icon: IconDeviceGamepad,
|
||||
queryKey: [["widget", "dnsHole"]],
|
||||
refetchInterval: widgetRefetchInterval.fiveSeconds,
|
||||
createOptions() {
|
||||
return optionsBuilder.from((factory) => ({
|
||||
showToggleAllButtons: factory.switch({
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import { widgetRefetchInterval } from "../../definition";
|
||||
import { IconAd, IconServerOff } from "@tabler/icons-react";
|
||||
|
||||
import { getIntegrationKindsByCategory } from "@homarr/definitions";
|
||||
@@ -9,6 +10,8 @@ export const widgetKind = "dnsHoleSummary";
|
||||
|
||||
export const { definition, componentLoader } = createWidgetDefinition(widgetKind, {
|
||||
icon: IconAd,
|
||||
queryKey: [["widget", "dnsHole"]],
|
||||
refetchInterval: widgetRefetchInterval.fiveSeconds,
|
||||
createOptions() {
|
||||
return optionsBuilder.from((factory) => ({
|
||||
usePiHoleColors: factory.switch({
|
||||
|
||||
@@ -184,13 +184,7 @@ export default function DockerWidget({ options, width, isEditMode }: WidgetCompo
|
||||
const t = useScopedI18n("docker");
|
||||
const isTiny = width <= 256;
|
||||
|
||||
const {
|
||||
data,
|
||||
refetch,
|
||||
isFetching,
|
||||
} = clientApi.docker.getContainers.useQuery(undefined, {
|
||||
refetchInterval: 30_000,
|
||||
});
|
||||
const { data, refetch, isFetching } = clientApi.docker.getContainers.useQuery();
|
||||
const containers = data?.containers ?? [];
|
||||
const timestamp = useMemo(() => data?.timestamp ?? new Date(), [data?.timestamp]);
|
||||
const relativeTime = useTimeAgo(timestamp);
|
||||
@@ -304,9 +298,7 @@ export default function DockerWidget({ options, width, isEditMode }: WidgetCompo
|
||||
{t("table.totalMemory", { memory: formatBytes(totals.memory) })}
|
||||
</Text>
|
||||
|
||||
<Tooltip
|
||||
label={t("table.refresh.lastUpdated", { when: relativeTime })}
|
||||
>
|
||||
<Tooltip label={t("table.refresh.lastUpdated", { when: relativeTime })}>
|
||||
<ActionIcon
|
||||
size="sm"
|
||||
variant="transparent"
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import { widgetRefetchInterval } from "../definition";
|
||||
import { IconDownload } from "@tabler/icons-react";
|
||||
import { z } from "zod/v4";
|
||||
|
||||
@@ -33,6 +34,7 @@ const columnsSort = columnsList.filter((column) =>
|
||||
|
||||
export const { definition, componentLoader } = createWidgetDefinition("downloads", {
|
||||
icon: IconDownload,
|
||||
refetchInterval: widgetRefetchInterval.fiveSeconds,
|
||||
createOptions() {
|
||||
return optionsBuilder.from(
|
||||
(factory) => ({
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import { widgetRefetchInterval } from "../definition";
|
||||
import { IconWall, IconWallOff } from "@tabler/icons-react";
|
||||
|
||||
import { getIntegrationKindsByCategory } from "@homarr/definitions";
|
||||
@@ -7,6 +8,7 @@ import { optionsBuilder } from "../options";
|
||||
|
||||
export const { definition, componentLoader } = createWidgetDefinition("firewall", {
|
||||
icon: IconWall,
|
||||
refetchInterval: widgetRefetchInterval.fiveSeconds,
|
||||
createOptions() {
|
||||
return optionsBuilder.from(() => ({}));
|
||||
},
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import { widgetRefetchInterval } from "../definition";
|
||||
import { IconHeartRateMonitor, IconServerOff } from "@tabler/icons-react";
|
||||
|
||||
import { getIntegrationKindsByCategory } from "@homarr/definitions";
|
||||
@@ -8,6 +9,7 @@ import { createStorageVolumeMultiSelectOptions } from "../storage-volume-options
|
||||
|
||||
export const { definition, componentLoader } = createWidgetDefinition("healthMonitoring", {
|
||||
icon: IconHeartRateMonitor,
|
||||
refetchInterval: widgetRefetchInterval.fiveSeconds,
|
||||
createOptions() {
|
||||
return optionsBuilder.from(
|
||||
(factory) => ({
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import { widgetRefetchInterval } from "../../definition";
|
||||
import { IconPhoto } from "@tabler/icons-react";
|
||||
import z from "zod";
|
||||
|
||||
@@ -8,6 +9,8 @@ import { optionsBuilder } from "../../options";
|
||||
|
||||
export const { definition, componentLoader } = createWidgetDefinition("immich-albumCarousel", {
|
||||
icon: IconPhoto,
|
||||
queryKey: [["widget", "immich"]],
|
||||
refetchInterval: widgetRefetchInterval.never,
|
||||
supportedIntegrations: ["immich"],
|
||||
integrationsRequired: true,
|
||||
createOptions() {
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import { widgetRefetchInterval } from "../../definition";
|
||||
import { IconGraphFilled } from "@tabler/icons-react";
|
||||
|
||||
import { createWidgetDefinition } from "../../definition";
|
||||
@@ -5,6 +6,8 @@ import { optionsBuilder } from "../../options";
|
||||
|
||||
export const { definition, componentLoader } = createWidgetDefinition("immich-serverStats", {
|
||||
icon: IconGraphFilled,
|
||||
queryKey: [["widget", "immich"]],
|
||||
refetchInterval: widgetRefetchInterval.never,
|
||||
supportedIntegrations: ["immich"],
|
||||
integrationsRequired: true,
|
||||
createOptions() {
|
||||
|
||||
@@ -70,7 +70,9 @@ export type {
|
||||
WidgetContextMenuAction,
|
||||
WidgetContextActionProps,
|
||||
WidgetOptionsSettings,
|
||||
WidgetRefetchInterval,
|
||||
} from "./definition";
|
||||
export { widgetRefetchInterval } from "./definition";
|
||||
export type { WidgetComponentProps };
|
||||
export type { WidgetOptionDefinition, WidgetOptionType } from "./options";
|
||||
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import { widgetRefetchInterval } from "../definition";
|
||||
import { IconReportSearch, IconServerOff } from "@tabler/icons-react";
|
||||
|
||||
import { getIntegrationKindsByCategory } from "@homarr/definitions";
|
||||
@@ -7,6 +8,7 @@ import { optionsBuilder } from "../options";
|
||||
|
||||
export const { definition, componentLoader } = createWidgetDefinition("indexerManager", {
|
||||
icon: IconReportSearch,
|
||||
refetchInterval: widgetRefetchInterval.never,
|
||||
createOptions() {
|
||||
return optionsBuilder.from((factory) => ({
|
||||
openIndexerSiteInNewTab: factory.switch({
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import { widgetRefetchInterval } from "../definition";
|
||||
import { IconTicket } from "@tabler/icons-react";
|
||||
|
||||
import { createWidgetDefinition } from "../definition";
|
||||
@@ -5,6 +6,8 @@ import { optionsBuilder } from "../options";
|
||||
|
||||
export const { definition, componentLoader } = createWidgetDefinition("mediaReleases", {
|
||||
icon: IconTicket,
|
||||
queryKey: [["widget", "mediaRelease"]],
|
||||
refetchInterval: widgetRefetchInterval.never,
|
||||
createOptions() {
|
||||
return optionsBuilder.from((factory) => ({
|
||||
layout: factory.select({
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import { widgetRefetchInterval } from "../definition";
|
||||
import { IconVideo } from "@tabler/icons-react";
|
||||
|
||||
import { getIntegrationKindsByCategory } from "@homarr/definitions";
|
||||
@@ -7,6 +8,7 @@ import { optionsBuilder } from "../options";
|
||||
|
||||
export const { componentLoader, definition } = createWidgetDefinition("mediaServer", {
|
||||
icon: IconVideo,
|
||||
refetchInterval: widgetRefetchInterval.fiveSeconds,
|
||||
createOptions() {
|
||||
return optionsBuilder.from((factory) => ({
|
||||
showOnlyPlaying: factory.switch({ defaultValue: true, withDescription: true }),
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import { widgetRefetchInterval } from "../definition";
|
||||
import { IconTransform } from "@tabler/icons-react";
|
||||
import { z } from "zod/v4";
|
||||
|
||||
@@ -11,6 +12,7 @@ export const views = ["workers", "queue", "statistics"] as const;
|
||||
|
||||
export const { componentLoader, definition } = createWidgetDefinition("mediaTranscoding", {
|
||||
icon: IconTransform,
|
||||
refetchInterval: widgetRefetchInterval.never,
|
||||
createOptions() {
|
||||
return optionsBuilder.from((factory) => ({
|
||||
defaultView: factory.select({
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import { widgetRefetchInterval } from "../../definition";
|
||||
import { IconBrandMinecraft } from "@tabler/icons-react";
|
||||
import { z } from "zod/v4";
|
||||
|
||||
@@ -6,6 +7,8 @@ import { optionsBuilder } from "../../options";
|
||||
|
||||
export const { componentLoader, definition } = createWidgetDefinition("minecraftServerStatus", {
|
||||
icon: IconBrandMinecraft,
|
||||
queryKey: [["widget", "minecraft"]],
|
||||
refetchInterval: widgetRefetchInterval.never,
|
||||
createOptions() {
|
||||
return optionsBuilder.from((factory) => ({
|
||||
title: factory.text({ defaultValue: "" }),
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import { widgetRefetchInterval } from "../../definition";
|
||||
import { IconServerOff, IconTopologyFull } from "@tabler/icons-react";
|
||||
|
||||
import { getIntegrationKindsByCategory } from "@homarr/definitions";
|
||||
@@ -7,6 +8,8 @@ import { optionsBuilder } from "../../options";
|
||||
|
||||
export const { definition, componentLoader } = createWidgetDefinition("networkControllerStatus", {
|
||||
icon: IconTopologyFull,
|
||||
queryKey: [["widget", "networkController"]],
|
||||
refetchInterval: widgetRefetchInterval.never,
|
||||
createOptions() {
|
||||
return optionsBuilder.from((factory) => ({
|
||||
content: factory.select({
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import { widgetRefetchInterval } from "../../definition";
|
||||
import { IconServerOff, IconTopologyFull } from "@tabler/icons-react";
|
||||
|
||||
import { getIntegrationKindsByCategory } from "@homarr/definitions";
|
||||
@@ -7,6 +8,8 @@ import { optionsBuilder } from "../../options";
|
||||
|
||||
export const { definition, componentLoader } = createWidgetDefinition("networkControllerSummary", {
|
||||
icon: IconTopologyFull,
|
||||
queryKey: [["widget", "networkController"]],
|
||||
refetchInterval: widgetRefetchInterval.never,
|
||||
createOptions() {
|
||||
return optionsBuilder.from(() => ({}));
|
||||
},
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import { widgetRefetchInterval } from "../definition";
|
||||
import { IconMessage } from "@tabler/icons-react";
|
||||
|
||||
import { getIntegrationKindsByCategory } from "@homarr/definitions";
|
||||
@@ -7,6 +8,7 @@ import { optionsBuilder } from "../options";
|
||||
|
||||
export const { componentLoader, definition } = createWidgetDefinition("notifications", {
|
||||
icon: IconMessage,
|
||||
refetchInterval: widgetRefetchInterval.never,
|
||||
createOptions() {
|
||||
return optionsBuilder.from((factory) => ({
|
||||
hideLogos: factory.switch({ defaultValue: false }),
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import { widgetRefetchInterval } from "../definition";
|
||||
import { IconFileText, IconServerOff } from "@tabler/icons-react";
|
||||
|
||||
import { createWidgetDefinition } from "../definition";
|
||||
@@ -5,6 +6,7 @@ import { optionsBuilder } from "../options";
|
||||
|
||||
export const { definition, componentLoader } = createWidgetDefinition("paperlessNgx", {
|
||||
icon: IconFileText,
|
||||
refetchInterval: widgetRefetchInterval.never,
|
||||
supportedIntegrations: ["paperlessNgx"],
|
||||
integrationsRequired: true,
|
||||
createOptions() {
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import { widgetRefetchInterval } from "../definition";
|
||||
import { IconRocket } from "@tabler/icons-react";
|
||||
import { z } from "zod/v4";
|
||||
|
||||
@@ -14,6 +15,7 @@ const relativeDateSchema = z
|
||||
|
||||
export const { definition, componentLoader } = createWidgetDefinition("releases", {
|
||||
icon: IconRocket,
|
||||
refetchInterval: widgetRefetchInterval.never,
|
||||
createOptions() {
|
||||
return optionsBuilder.from((factory) => ({
|
||||
newReleaseWithin: factory.text({
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import { widgetRefetchInterval } from "../definition";
|
||||
import { IconRss } from "@tabler/icons-react";
|
||||
import { z } from "zod/v4";
|
||||
|
||||
@@ -12,6 +13,7 @@ import { optionsBuilder } from "../options";
|
||||
*/
|
||||
export const { definition, componentLoader } = createWidgetDefinition("rssFeed", {
|
||||
icon: IconRss,
|
||||
refetchInterval: widgetRefetchInterval.never,
|
||||
createOptions() {
|
||||
return optionsBuilder.from((factory) => ({
|
||||
feedUrls: factory.multiText({
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import { widgetRefetchInterval } from "../definition";
|
||||
import { IconServerOff, IconSpeedboat } from "@tabler/icons-react";
|
||||
|
||||
import { createWidgetDefinition } from "../definition";
|
||||
@@ -5,6 +6,7 @@ import { optionsBuilder } from "../options";
|
||||
|
||||
export const { definition, componentLoader } = createWidgetDefinition("speedtestTracker", {
|
||||
icon: IconSpeedboat,
|
||||
refetchInterval: widgetRefetchInterval.never,
|
||||
createOptions() {
|
||||
return optionsBuilder.from(
|
||||
(factory) => ({
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import { widgetRefetchInterval } from "../definition";
|
||||
import { IconBuildingBank } from "@tabler/icons-react";
|
||||
|
||||
import { createWidgetDefinition } from "../definition";
|
||||
@@ -13,6 +14,7 @@ const timeIntervalOptions = stockPriceTimeFrames.interval;
|
||||
|
||||
export const { definition, componentLoader } = createWidgetDefinition("stockPrice", {
|
||||
icon: IconBuildingBank,
|
||||
refetchInterval: widgetRefetchInterval.never,
|
||||
createOptions() {
|
||||
return optionsBuilder.from((factory) => ({
|
||||
stock: factory.text({
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import { widgetRefetchInterval } from "../definition";
|
||||
import { IconServer2 } from "@tabler/icons-react";
|
||||
|
||||
import { createWidgetDefinition } from "../definition";
|
||||
@@ -6,6 +7,8 @@ import { createStorageVolumeMultiSelectOptions } from "../storage-volume-options
|
||||
|
||||
export const { definition, componentLoader } = createWidgetDefinition("systemDisks", {
|
||||
icon: IconServer2,
|
||||
queryKey: [["widget", "healthMonitoring"]],
|
||||
refetchInterval: widgetRefetchInterval.fiveSeconds,
|
||||
supportedIntegrations: ["dashDot", "openmediavault", "truenas", "unraid", "synology"],
|
||||
createOptions() {
|
||||
return optionsBuilder.from(
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import { widgetRefetchInterval } from "../definition";
|
||||
import { IconAlignLeft, IconEyeOff, IconGraphFilled, IconListDetails, IconPhoto } from "@tabler/icons-react";
|
||||
|
||||
import { objectEntries } from "@homarr/common";
|
||||
@@ -14,6 +15,8 @@ const labelDisplayModeOptions = {
|
||||
|
||||
export const { definition, componentLoader } = createWidgetDefinition("systemResources", {
|
||||
icon: IconGraphFilled,
|
||||
queryKey: [["widget", "healthMonitoring"]],
|
||||
refetchInterval: widgetRefetchInterval.fiveSeconds,
|
||||
supportedIntegrations: ["dashDot", "openmediavault", "truenas", "unraid", "glances", "synology"],
|
||||
createOptions() {
|
||||
return optionsBuilder.from((factory) => ({
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import { widgetRefetchInterval } from "../definition";
|
||||
import { IconActivityHeartbeat, IconServerOff } from "@tabler/icons-react";
|
||||
|
||||
import { createWidgetDefinition } from "../definition";
|
||||
@@ -5,6 +6,7 @@ import { optionsBuilder } from "../options";
|
||||
|
||||
export const { definition, componentLoader } = createWidgetDefinition("tracearr", {
|
||||
icon: IconActivityHeartbeat,
|
||||
refetchInterval: widgetRefetchInterval.fiveSeconds,
|
||||
createOptions() {
|
||||
return optionsBuilder.from((factory) => ({
|
||||
showStreams: factory.switch({
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import { widgetRefetchInterval } from "../definition";
|
||||
import { IconChartBar, IconServerOff } from "@tabler/icons-react";
|
||||
import { z } from "zod/v4";
|
||||
|
||||
@@ -8,6 +9,7 @@ export const timeFrameValues = ["today", "24h", "7d", "30d", "month", "lastMonth
|
||||
|
||||
export const { definition, componentLoader } = createWidgetDefinition("umami", {
|
||||
icon: IconChartBar,
|
||||
refetchInterval: widgetRefetchInterval.never,
|
||||
supportedIntegrations: ["umami"],
|
||||
createOptions() {
|
||||
return optionsBuilder.from(
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import { widgetRefetchInterval } from "../definition";
|
||||
import { IconShieldLock } from "@tabler/icons-react";
|
||||
|
||||
import { getIntegrationKindsByCategory } from "@homarr/definitions";
|
||||
@@ -7,6 +8,7 @@ import { optionsBuilder } from "../options";
|
||||
|
||||
export const { componentLoader, definition } = createWidgetDefinition("vpn", {
|
||||
icon: IconShieldLock,
|
||||
refetchInterval: widgetRefetchInterval.never,
|
||||
createOptions() {
|
||||
return optionsBuilder.from(() => ({}));
|
||||
},
|
||||
|
||||
Reference in new issue
Block a user