40 lines
885 B
TypeScript
40 lines
885 B
TypeScript
"use client"
|
|
|
|
import { useCallback, useEffect } from "react"
|
|
|
|
import { useStepsStore } from "@/stores/steps"
|
|
|
|
export default function HistoryStateManager() {
|
|
const setCurrentStep = useStepsStore((state) => state.setStep)
|
|
const currentStep = useStepsStore((state) => state.currentStep)
|
|
|
|
const handleBackButton = useCallback(
|
|
(event: PopStateEvent) => {
|
|
if (event.state.step) {
|
|
setCurrentStep(event.state.step)
|
|
}
|
|
},
|
|
[setCurrentStep]
|
|
)
|
|
|
|
useEffect(() => {
|
|
window.addEventListener("popstate", handleBackButton)
|
|
|
|
return () => {
|
|
window.removeEventListener("popstate", handleBackButton)
|
|
}
|
|
}, [handleBackButton])
|
|
|
|
useEffect(() => {
|
|
if (!window.history.state.step) {
|
|
window.history.replaceState(
|
|
{ step: currentStep },
|
|
"",
|
|
document.location.href
|
|
)
|
|
}
|
|
}, [currentStep])
|
|
|
|
return null
|
|
}
|