chrisp/brackt
1
1
Fork 0
Code Issues 42 Pull requests Projects Releases Packages Wiki Activity Actions

fix: prevent useBlocker from intercepting same-route form submissions

Browse source 
useBlocker was receiving a boolean, which caused it to block the settings
form's own POST submission before the onSubmit state-clear could propagate.
Switching to a BlockerFunction that checks nextLocation.pathname lets
same-URL form posts through, so the "leave without saving?" dialog only
fires on genuine navigation away from the settings page.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Chris Parsons 2026-05-17 23:58:06 -07:00
parent c71eb69648
commit 85fc3e0bfe
1 changed files with 9 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
app/routes/leagues/$leagueId.settings.tsx
View file

@ -1,5 +1,5 @@
import { useState, useEffect } from "react";
import { Form, useBeforeUnload, useBlocker, useNavigation } from "react-router";
import { useState, useEffect, useCallback } from "react";
import { Form, useBeforeUnload, useBlocker, useLocation, useNavigation, type BlockerFunction } from "react-router";
import { format } from "date-fns";
import {
AlertTriangle,
@ -119,6 +119,7 @@ export default function LeagueSettings({ loaderData, actionData }: Route.Compone
} = loaderData;
const navigation = useNavigation();
const location = useLocation();
const [isDeleteDialogOpen, setIsDeleteDialogOpen] = useState(false);
const [mobileView, setMobileView] = useState<"grid" | "section">("grid");
const [activeSection, setActiveSection] = useState<SettingsSectionId>("league-basics");
@ -202,7 +203,12 @@ export default function LeagueSettings({ loaderData, actionData }: Route.Compone
const isSubmittingSettings = navigation.state === "submitting" && updateIntent === "update";
const isSubmittingDraftOrder = navigation.state === "submitting" && updateIntent === "set-draft-order";
const shouldWarnUnsaved = (hasUnsavedSettingsChanges || hasDraftOrderChanges) && !isSubmittingSettings && !isSubmittingDraftOrder;
const blocker = useBlocker(shouldWarnUnsaved);
const blocker = useBlocker(
useCallback<BlockerFunction>(
({ nextLocation }) => shouldWarnUnsaved && nextLocation.pathname !== location.pathname,
[shouldWarnUnsaved, location.pathname]
)
);
const inviteUrl = season?.inviteCode
? `${typeof window !== "undefined" ? window.location.origin : ""}/i/${season.inviteCode}`
: "";