hooks useNavigationPrompt.ts

70% Statements 7/10

75% Branches 3/4

100% Functions 4/4

70% Lines 7/10

Press n or j to go to the next uncovered block, b, p or k for the previous block.


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37  
 
 
 
 
 
 
 
 
 
 
 
 
 
531x
 
531x
500x
2x
 
 
 
 
 
2x
 
 
1x
 
 
1x
 
 
 
 
 
  import { useEffect } from "react";
import { useBlocker } from "react-router";
 
import { UserPrompt, userPrompt } from "@/components";
 
export function useNavigationPrompt({
  shouldBlock,
  prompt,
  shouldSkipBlockingRef,
}: {
  shouldBlock: boolean;
  prompt: Omit<UserPrompt, "onAccept">;
  shouldSkipBlockingRef?: React.MutableRefObject<boolean>;
}) {
  const blocker = useBlocker(shouldBlock);
 
  useEffect(() => {
    if (blocker?.state === "blocked") {
      Iif (shouldSkipBlockingRef?.current) {
        shouldSkipBlockingRef.current = false;
        blocker.proceed?.();
        return;
      }
 
      userPrompt({
        ...prompt,
        onAccept: () => {
          blocker.proceed?.();
        },
        onCancel: () => {
          blocker.reset?.();
        },
      });
    }
  }, [blocker?.state, blocker, prompt, shouldSkipBlockingRef]);
}