fix: move network sync form population out of queryFn into useEffect
Side effects inside queryFn caused the enabled toggle and other fields to reset on refetch because SyncStatus shares the same query key with a different queryFn, making formLoaded unreliable. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -1,4 +1,4 @@
|
||||
import { useState } from "react";
|
||||
import { useState, useEffect } from "react";
|
||||
import { useMutation, useQuery } from "@tanstack/react-query";
|
||||
import { Button } from "@/components/ui/button";
|
||||
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
|
||||
@@ -53,22 +53,24 @@ export function NetworkBackupManager() {
|
||||
},
|
||||
});
|
||||
|
||||
useQuery({
|
||||
const { data: syncConfig } = useQuery({
|
||||
queryKey: ["/db/network-sync-config"],
|
||||
queryFn: async () => {
|
||||
const res = await apiRequest("GET", "/api/database-management/network-sync-config");
|
||||
const data = await res.json();
|
||||
if (!formLoaded) {
|
||||
setEnabled(data.enabled ?? false);
|
||||
setSyncHour(data.syncHour ?? 0);
|
||||
setSourceUrl(data.sourceUrl ?? "");
|
||||
setReceiverApiKey(data.apiKey ?? "");
|
||||
setFormLoaded(true);
|
||||
}
|
||||
return data;
|
||||
return res.json();
|
||||
},
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
if (syncConfig && !formLoaded) {
|
||||
setEnabled(syncConfig.enabled ?? false);
|
||||
setSyncHour(syncConfig.syncHour ?? 0);
|
||||
setSourceUrl(syncConfig.sourceUrl ?? "");
|
||||
setReceiverApiKey(syncConfig.apiKey ?? "");
|
||||
setFormLoaded(true);
|
||||
}
|
||||
}, [syncConfig, formLoaded]);
|
||||
|
||||
// ==============================
|
||||
// Mutations
|
||||
// ==============================
|
||||
|
||||
Reference in New Issue
Block a user