무한 루프 완전 수정 - useSetOnRightClick 의존성 제거

문제:
- useSetOnRightClick의 의존성 배열에 fn이 포함되어 무한 루프 발생
- fn이 변경될 때마다 useEffect 재실행 → setState → 리렌더 → fn 재생성 → 무한 반복

해결:
- useSetOnBack 패턴과 동일하게 의존성에서 fn 제거
- useCallback도 제거하여 코드 단순화
- 페이지 마운트 시 한 번만 설정되므로 안정적

참고:
- isDeleteAllowed는 usrid가 변경되지 않는 한 고정값
- 대부분의 경우 페이지 생명주기 동안 변경되지 않음

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Jay Sheen
2025-11-14 18:30:09 +09:00
parent f16428ff47
commit 4434877670
2 changed files with 5 additions and 9 deletions

View File

@@ -1,4 +1,4 @@
import { useState, useCallback } from 'react';
import { useState } from 'react';
import { useLocation } from 'react-router-dom';
import { useTranslation } from 'react-i18next';
import { PATHS } from '@/shared/constants/paths';
@@ -29,7 +29,7 @@ export const UserLoginAuthInfoPage = () => {
const [activeTab, ] = useState<AccountUserTabKeys>(AccountUserTabKeys.LoginAuthInfo);
const handleDeleteUser = useCallback(async () => {
const handleDeleteUser = async () => {
const confirmed = await showConfirm(t('account.deleteUserConfirm', '사용자를 삭제하시겠습니까?'));
if (!confirmed) return;
@@ -44,7 +44,7 @@ export const UserLoginAuthInfoPage = () => {
} catch (error: any) {
snackBar(error.message || t('account.deleteUserFailed', '사용자 삭제를 실패했습니다.'));
}
}, [mid, usrid, userDelete, navigate, t]);
};
useSetHeaderTitle(t('account.userSettings'));
useSetHeaderType(HeaderType.LeftArrow);

View File

@@ -22,15 +22,11 @@ export const useSetOnBack = (fn: any) => {
export const useSetOnRightClick = (fn: any) => {
const { setOnRightClick } = useSubLayoutContext();
useEffect(() => {
if (fn) {
setOnRightClick(() => fn);
} else {
setOnRightClick(() => undefined);
}
return () => {
setOnRightClick(() => undefined);
};
}, [fn, setOnRightClick]);
}, [setOnRightClick]);
return { setOnRightClick };
};