adilallo
82 lines
2.1 KiB
TypeScript
82 lines
2.1 KiB
TypeScript
"use client";
|
|
|
|
import { usePathname, useRouter } from "next/navigation";
|
|
import { useCallback } from "react";
|
|
import type { CreateFlowStep } from "../types";
|
|
import { getNextStep, getPreviousStep, isValidStep } from "../utils/flowSteps";
|
|
|
|
/**
|
|
* Options passed to navigation handlers (e.g. for blur before navigate)
|
|
*/
|
|
const blurActiveElement = (): void => {
|
|
if (
|
|
typeof document !== "undefined" &&
|
|
document.activeElement instanceof HTMLElement
|
|
) {
|
|
document.activeElement.blur();
|
|
}
|
|
};
|
|
|
|
/**
|
|
* Hook for Create Rule Flow navigation.
|
|
*
|
|
* Must be used within the create flow (pathname like /create/[step]).
|
|
* Uses the current step from the URL and provides type-safe navigation.
|
|
*/
|
|
export function useCreateFlowNavigation(): {
|
|
currentStep: CreateFlowStep | null;
|
|
goToNextStep: () => void;
|
|
goToPreviousStep: () => void;
|
|
goToStep: (_step: CreateFlowStep) => void;
|
|
canGoNext: () => boolean;
|
|
canGoBack: () => boolean;
|
|
nextStep: CreateFlowStep | null;
|
|
previousStep: CreateFlowStep | null;
|
|
} {
|
|
const pathname = usePathname();
|
|
const router = useRouter();
|
|
|
|
const currentStep = (pathname?.split("/").pop() ??
|
|
null) as CreateFlowStep | null;
|
|
const validStep = isValidStep(currentStep) ? currentStep : null;
|
|
|
|
const nextStep = getNextStep(validStep);
|
|
const previousStep = getPreviousStep(validStep);
|
|
|
|
const goToNextStep = useCallback(() => {
|
|
blurActiveElement();
|
|
if (nextStep) {
|
|
router.push(`/create/${nextStep}`);
|
|
}
|
|
}, [router, nextStep]);
|
|
|
|
const goToPreviousStep = useCallback(() => {
|
|
blurActiveElement();
|
|
if (previousStep) {
|
|
router.push(`/create/${previousStep}`);
|
|
}
|
|
}, [router, previousStep]);
|
|
|
|
const goToStep = useCallback(
|
|
(step: CreateFlowStep) => {
|
|
blurActiveElement();
|
|
router.push(`/create/${step}`);
|
|
},
|
|
[router],
|
|
);
|
|
|
|
const canGoNext = useCallback(() => nextStep !== null, [nextStep]);
|
|
const canGoBack = useCallback(() => previousStep !== null, [previousStep]);
|
|
|
|
return {
|
|
currentStep: validStep,
|
|
goToNextStep,
|
|
goToPreviousStep,
|
|
goToStep,
|
|
canGoNext,
|
|
canGoBack,
|
|
nextStep,
|
|
previousStep,
|
|
};
|
|
}
|