사용자 삭제 기능 추가

- 헤더 오른쪽 버튼 시스템 구현
  - ContextType에 setOnRightClick 추가
  - useSetOnRightClick 훅 추가
  - HeaderNavigationProps에 onRightClick 추가
  - HeaderType.LeftArrow에 오른쪽 삭제 버튼 렌더링

- 사용자 삭제 API 및 타입 추가
  - UserDeleteParams, UserDeleteResponse 인터페이스 추가
  - use-user-delete-mutation 훅 생성
  - API_URL_USER.deleteUser() 엔드포인트 사용

- 사용자 설정 페이지에서 삭제 기능 구현
  - 현재 로그인한 사용자가 아닐 경우에만 삭제 버튼 표시
  - showConfirm 다이얼로그로 삭제 확인
  - 삭제 성공 시 토스트 메시지 표시 및 목록 페이지로 이동
  - 목록 페이지에서 refresh 상태로 자동 갱신

- showConfirm 위젯 추가
  - Promise 기반의 확인 다이얼로그
  - 취소/확인 버튼 지원
  - 다국어 지원 (common.cancel, common.confirm)

🤖 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:22:22 +09:00
parent c6d22e9856
commit f7db3236e8
9 changed files with 188 additions and 13 deletions

View File

@@ -1,4 +1,4 @@
import { useState } from 'react';
import { useState, useEffect } from 'react';
import { useLocation } from 'react-router-dom';
import { useTranslation } from 'react-i18next';
import { PATHS } from '@/shared/constants/paths';
@@ -11,16 +11,41 @@ import {
useSetHeaderTitle,
useSetHeaderType,
useSetFooterMode,
useSetOnBack
useSetOnBack,
useSetOnRightClick
} from '@/widgets/sub-layout/use-sub-layout';
import { useStore } from '@/shared/model/store';
import { useUserDeleteMutation } from '@/entities/user/api/use-user-delete-mutation';
import { showConfirm } from '@/widgets/show-confirm';
import { snackBar } from '@/shared/lib';
export const UserLoginAuthInfoPage = () => {
const { t } = useTranslation();
const location = useLocation();
const { mid, usrid, idCL, status } = location.state || {};
const { navigate } = useNavigate();
const { mutateAsync: userDelete } = useUserDeleteMutation();
const currentUsrid = useStore.getState().UserStore.userInfo.usrid;
const [activeTab, ] = useState<AccountUserTabKeys>(AccountUserTabKeys.LoginAuthInfo);
const handleDeleteUser = async () => {
const confirmed = await showConfirm(t('account.deleteUserConfirm', '사용자를 삭제하시겠습니까?'));
if (!confirmed) return;
try {
const result = await userDelete({ mid, usrid });
if (result.status) {
snackBar(t('account.deleteUserSuccess', '사용자 삭제를 성공했습니다.'));
navigate(PATHS.account.user.manage, { state: { refresh: true } });
} else {
snackBar(result.error?.message || t('account.deleteUserFailed', '사용자 삭제를 실패했습니다.'));
}
} catch (error: any) {
snackBar(error.message || t('account.deleteUserFailed', '사용자 삭제를 실패했습니다.'));
}
};
useSetHeaderTitle(t('account.userSettings'));
useSetHeaderType(HeaderType.LeftArrow);
useSetFooterMode(false);
@@ -28,6 +53,13 @@ export const UserLoginAuthInfoPage = () => {
navigate(PATHS.account.user.manage);
});
// 현재 로그인한 사용자가 아닌 경우에만 삭제 버튼 표시
useEffect(() => {
if (usrid && currentUsrid && usrid !== currentUsrid) {
useSetOnRightClick(() => handleDeleteUser);
}
}, [usrid, currentUsrid]);
return (
<>
<main>