+
);
diff --git a/surfsense_web/app/dashboard/[search_space_id]/user-settings/purchases/page.tsx b/surfsense_web/app/dashboard/[search_space_id]/user-settings/purchases/page.tsx
index b7468349b..55647fe29 100644
--- a/surfsense_web/app/dashboard/[search_space_id]/user-settings/purchases/page.tsx
+++ b/surfsense_web/app/dashboard/[search_space_id]/user-settings/purchases/page.tsx
@@ -1,4 +1,4 @@
-import { AutoReloadSettings } from "../components/AutoReloadSettings";
+import { AutoReloadSettings } from "@/components/settings/auto-reload-settings";
import { PurchaseHistoryContent } from "../components/PurchaseHistoryContent";
export default function Page() {
diff --git a/surfsense_web/app/dashboard/[search_space_id]/user-settings/components/AutoReloadSettings.tsx b/surfsense_web/components/settings/auto-reload-settings.tsx
similarity index 94%
rename from surfsense_web/app/dashboard/[search_space_id]/user-settings/components/AutoReloadSettings.tsx
rename to surfsense_web/components/settings/auto-reload-settings.tsx
index 9411b06d1..fbb7cbfb9 100644
--- a/surfsense_web/app/dashboard/[search_space_id]/user-settings/components/AutoReloadSettings.tsx
+++ b/surfsense_web/components/settings/auto-reload-settings.tsx
@@ -3,7 +3,7 @@
import { useQuery as useZeroQuery } from "@rocicorp/zero/react";
import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
import { AlertTriangle, CreditCard, RefreshCw } from "lucide-react";
-import { useParams, useRouter, useSearchParams } from "next/navigation";
+import { useParams, usePathname, useRouter, useSearchParams } from "next/navigation";
import { useEffect, useRef, useState } from "react";
import { toast } from "sonner";
import { Alert, AlertDescription, AlertTitle } from "@/components/ui/alert";
@@ -35,6 +35,7 @@ const formatUsd = (micros: number) => `$${(Math.max(0, micros) / 1_000_000).toFi
export function AutoReloadSettings() {
const params = useParams();
const router = useRouter();
+ const pathname = usePathname();
const searchParams = useSearchParams();
const queryClient = useQueryClient();
const searchSpaceId = Number(params?.search_space_id);
@@ -73,8 +74,8 @@ export function AutoReloadSettings() {
toast.info("Card setup canceled.");
}
// Strip the query param so refreshes don't re-toast.
- router.replace(`/dashboard/${searchSpaceId}/user-settings/purchases`);
- }, [searchParams, router, searchSpaceId, queryClient]);
+ router.replace(pathname);
+ }, [searchParams, router, pathname, queryClient]);
const setupMutation = useMutation({
mutationFn: () =>
@@ -102,16 +103,10 @@ export function AutoReloadSettings() {
},
});
- if (isLoading || !settings) {
- return (
-
-
-
- );
- }
-
- // Server-side feature flag: hide the whole card when auto-reload is off.
- if (!settings.feature_enabled) {
+ // Render nothing while loading (avoids a spinner flash on pages where the
+ // feature flag turns out to be off) and when auto-reload is disabled
+ // server-side.
+ if (isLoading || !settings || !settings.feature_enabled) {
return null;
}