mirror of
https://github.com/MODSetter/SurfSense.git
synced 2026-05-17 18:35:19 +02:00
refactor: use functional setState in useCallback for stable callbacks in onboarding tour and sidebar
This commit is contained in:
parent
3724a1530c
commit
1705e881ec
2 changed files with 32 additions and 20 deletions
|
|
@ -37,8 +37,14 @@ export function useSidebarState(defaultCollapsed = false): UseSidebarStateReturn
|
||||||
}, []);
|
}, []);
|
||||||
|
|
||||||
const toggleCollapsed = useCallback(() => {
|
const toggleCollapsed = useCallback(() => {
|
||||||
setIsCollapsed(!isCollapsed);
|
setIsCollapsedState(prev => {
|
||||||
}, [isCollapsed, setIsCollapsed]);
|
const next = !prev;
|
||||||
|
try {
|
||||||
|
document.cookie = `${SIDEBAR_COOKIE_NAME}=${next}; path=/; max-age=${SIDEBAR_COOKIE_MAX_AGE}`;
|
||||||
|
} catch {}
|
||||||
|
return next;
|
||||||
|
});
|
||||||
|
}, []);
|
||||||
|
|
||||||
// Keyboard shortcut: Cmd/Ctrl + \
|
// Keyboard shortcut: Cmd/Ctrl + \
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
|
|
|
||||||
|
|
@ -666,27 +666,33 @@ export function OnboardingTour() {
|
||||||
}, [targetEl, isActive]);
|
}, [targetEl, isActive]);
|
||||||
|
|
||||||
const handleNext = useCallback(() => {
|
const handleNext = useCallback(() => {
|
||||||
if (stepIndex < TOUR_STEPS.length - 1) {
|
retryCountRef.current = 0;
|
||||||
retryCountRef.current = 0;
|
setShouldAnimate(true);
|
||||||
setShouldAnimate(true);
|
setStepIndex(prev => {
|
||||||
setStepIndex(stepIndex + 1);
|
if (prev < TOUR_STEPS.length - 1) {
|
||||||
} else {
|
return prev + 1;
|
||||||
// Tour completed - save to localStorage
|
} else {
|
||||||
if (user?.id) {
|
// Tour completed - save to localStorage
|
||||||
const tourKey = `surfsense-tour-${user.id}`;
|
if (user?.id) {
|
||||||
localStorage.setItem(tourKey, "true");
|
const tourKey = `surfsense-tour-${user.id}`;
|
||||||
|
localStorage.setItem(tourKey, "true");
|
||||||
|
}
|
||||||
|
setIsActive(false);
|
||||||
|
return prev;
|
||||||
}
|
}
|
||||||
setIsActive(false);
|
});
|
||||||
}
|
}, [user?.id]);
|
||||||
}, [stepIndex, user?.id]);
|
|
||||||
|
|
||||||
const handlePrev = useCallback(() => {
|
const handlePrev = useCallback(() => {
|
||||||
if (stepIndex > 0) {
|
retryCountRef.current = 0;
|
||||||
retryCountRef.current = 0;
|
setShouldAnimate(true);
|
||||||
setShouldAnimate(true);
|
setStepIndex(prev => {
|
||||||
setStepIndex(stepIndex - 1);
|
if (prev > 0) {
|
||||||
}
|
return prev - 1;
|
||||||
}, [stepIndex]);
|
}
|
||||||
|
return prev;
|
||||||
|
});
|
||||||
|
}, []);
|
||||||
|
|
||||||
const handleSkip = useCallback(() => {
|
const handleSkip = useCallback(() => {
|
||||||
// Tour skipped - save to localStorage
|
// Tour skipped - save to localStorage
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue