Created
December 7, 2022 14:33
-
-
Save jaredh159/50432f0e30db1b4e5b6b94aed6db9572 to your computer and use it in GitHub Desktop.
react strict mode use effect double request workaround
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
function useVerifySignup(reqState: RequestState['state'], token: string): void { | |
const dispatch = useDispatch(); | |
useEffect(() => { | |
// necessary because the API request is not idempotent, you can only verify once | |
// and react strict mode tries to force effects be idempotent for future versions | |
// https://github.com/facebook/react/issues/24502#issuecomment-1118846544 | |
let isStrictModeDevRemount = false; | |
async function verify(): Promise<void> { | |
if (reqState === `idle` && !isStrictModeDevRemount) { | |
const action = await verifySignupEmail(token); | |
if (!isStrictModeDevRemount) { | |
dispatch(action); | |
} | |
} | |
} | |
verify(); | |
return () => { | |
isStrictModeDevRemount = Current.env.isDev(); | |
}; | |
}, [reqState, token, dispatch]); | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment