From 8a2e8fd1058b8a142444122cbdae94a5ad988c51 Mon Sep 17 00:00:00 2001 From: Manuel Raimann Date: Tue, 11 Feb 2025 11:58:31 +0100 Subject: [PATCH] Implement versioning --- ...widgets.$region.$accountId.$widgetType.tsx | 21 ++++++++++++++++++- 1 file changed, 20 insertions(+), 1 deletion(-) diff --git a/app/routes/widgets.$region.$accountId.$widgetType.tsx b/app/routes/widgets.$region.$accountId.$widgetType.tsx index 68c92f0..8909923 100644 --- a/app/routes/widgets.$region.$accountId.$widgetType.tsx +++ b/app/routes/widgets.$region.$accountId.$widgetType.tsx @@ -1,6 +1,7 @@ import type { MetaFunction } from "@remix-run/node"; import { useParams, useSearchParams } from "@remix-run/react"; -import { useEffect } from "react"; +import { useQuery } from "@tanstack/react-query"; +import { useEffect, useState } from "react"; import { BoxWidget } from "~/components/widgets/box"; import { snakeToPretty } from "~/lib/utils"; import type { Region, Theme } from "~/types/widget"; @@ -11,8 +12,26 @@ export const meta: MetaFunction = () => { export default function Widget() { const { region, accountId, widgetType } = useParams(); + const [version, setVersion] = useState(null); const [searchParams] = useSearchParams(); + const { data: fetchedVersion, error: versionError } = useQuery({ + queryKey: ["version", widgetType], + queryFn: () => + fetch("https://data.deadlock-api.com/v1/commands/widget-versions") + .then((res) => res.json()) + .then((data) => (widgetType ? data[widgetType] : data)), + staleTime: (5 * 60 - 10) * 1000, + refetchInterval: 5 * 60 * 1000, + refetchIntervalInBackground: true, + }); + + useEffect(() => { + if (!fetchedVersion) return; + if (version === null) setVersion(fetchedVersion); + else if (fetchedVersion > version) window.location.reload(); + }, [fetchedVersion, version]); + useEffect(() => { document.body.style.backgroundColor = "transparent"; document.documentElement.style.backgroundColor = "transparent";