feat: Prevent simultaneous updates in AutodraftSettings and disable controls during updates

This commit is contained in:
Chris Parsons 2025-10-26 22:09:22 -07:00
parent 609c4e7b2c
commit be8cabeac7

View file

@ -22,6 +22,7 @@ export function AutodraftSettings({
}: AutodraftSettingsProps) {
const [localEnabled, setLocalEnabled] = useState(isEnabled);
const [localMode, setLocalMode] = useState<"next_pick" | "while_on">(mode);
const [isUpdating, setIsUpdating] = useState(false);
// Sync local state with props when they change (from socket events)
useEffect(() => {
@ -33,7 +34,10 @@ export function AutodraftSettings({
}, [mode]);
const handleToggle = async (checked: boolean) => {
if (isUpdating) return; // Prevent multiple simultaneous updates
setLocalEnabled(checked);
setIsUpdating(true);
try {
const formData = new FormData();
@ -58,11 +62,17 @@ export function AutodraftSettings({
// Revert on error
setLocalEnabled(!checked);
console.error("Error updating autodraft settings:", error);
} finally {
setIsUpdating(false);
}
};
const handleModeChange = async (newMode: "next_pick" | "while_on") => {
if (isUpdating) return; // Prevent multiple simultaneous updates
const previousMode = localMode;
setLocalMode(newMode);
setIsUpdating(true);
try {
const formData = new FormData();
@ -80,13 +90,15 @@ export function AutodraftSettings({
onUpdate(localEnabled, newMode);
} else {
// Revert on error
setLocalMode(localMode);
setLocalMode(previousMode);
console.error("Failed to update autodraft mode");
}
} catch (error) {
// Revert on error
setLocalMode(localMode);
setLocalMode(previousMode);
console.error("Error updating autodraft mode:", error);
} finally {
setIsUpdating(false);
}
};
@ -100,7 +112,7 @@ export function AutodraftSettings({
id="autodraft-switch"
checked={localEnabled}
onCheckedChange={handleToggle}
disabled={isMyTurn}
disabled={isMyTurn || isUpdating}
/>
</div>
@ -108,23 +120,23 @@ export function AutodraftSettings({
<RadioGroup
value={localMode}
onValueChange={(value) => handleModeChange(value as "next_pick" | "while_on")}
disabled={isMyTurn}
disabled={isMyTurn || isUpdating}
className="space-y-2"
>
<div className="flex items-center space-x-2">
<RadioGroupItem value="next_pick" id="next_pick" disabled={isMyTurn} />
<RadioGroupItem value="next_pick" id="next_pick" disabled={isMyTurn || isUpdating} />
<Label
htmlFor="next_pick"
className={`text-sm ${isMyTurn ? "text-muted-foreground" : "cursor-pointer"}`}
className={`text-sm ${isMyTurn || isUpdating ? "text-muted-foreground" : "cursor-pointer"}`}
>
Next Pick
</Label>
</div>
<div className="flex items-center space-x-2">
<RadioGroupItem value="while_on" id="while_on" disabled={isMyTurn} />
<RadioGroupItem value="while_on" id="while_on" disabled={isMyTurn || isUpdating} />
<Label
htmlFor="while_on"
className={`text-sm ${isMyTurn ? "text-muted-foreground" : "cursor-pointer"}`}
className={`text-sm ${isMyTurn || isUpdating ? "text-muted-foreground" : "cursor-pointer"}`}
>
While On
</Label>