fix: unblock query cache mutations in demo mode and add cache buster (#6176)

apps/nextjs/src/app/[locale]/_client-providers/trpc.tsx

@@ -24,6 +24,7 @@ import type { AppRouter } from "@homarr/api";
 import { clientApi } from "@homarr/api/client";
 import {
   isPersistableWidgetQueryKey,
+  queryCacheBuster,
   queryCacheDefaultGcTimeMs,
   queryCacheDefaultRefetchIntervalMs,
   queryCacheDefaultStaleTimeMs,
@@ -136,6 +137,7 @@ export function TRPCReactProvider(props: PropsWithChildren) {
         client={queryClient}
         persistOptions={{
           persister,
+          buster: queryCacheBuster,
           maxAge: queryCacheDefaultGcTimeMs,
           dehydrateOptions: {
             shouldDehydrateQuery: (query) =>

apps/nextjs/src/app/[locale]/boards/(content)/_creator.tsx

@@ -7,6 +7,8 @@ import "~/styles/gridstack.scss";
 
 import { dehydrate, HydrationBoundary } from "@tanstack/react-query";
 import type { PersistedClient } from "@tanstack/react-query-persist-client";
+import superjson from "superjson";
+import { queryCacheBuster } from "@homarr/api/query-cache";
 import { getQueryClient } from "@homarr/api/server";
 import { IntegrationProvider } from "@homarr/auth/client";
 import { auth } from "@homarr/auth/next";
@@ -121,7 +123,8 @@ async function QueryCacheHydration({ userId, boardId }: { userId: string; boardI
     const serialized = await getQueryCacheAsync(userId, boardId);
     if (!serialized) return null;
 
-    const persisted = JSON.parse(serialized) as PersistedClient;
+    const persisted = superjson.parse<PersistedClient>(serialized);
+    if (persisted.buster !== queryCacheBuster) return null;
     if (!persisted?.clientState?.queries?.length) return null;
 
     return <HydrationBoundary state={persisted.clientState} />;