Fix: Resolve TS errors in TransactionEditDialog
This commit addresses TypeScript errors in TransactionEditDialog.tsx by: - Modifying the useTransactionEdit hook to return the form and handleDelete properties. - Adjusting the arguments passed to the useTransactionEdit hook to match the expected parameters. - Ensuring the onSubmit prop in TransactionEditForm expects the correct type.
This commit is contained in:
@@ -27,16 +27,15 @@ const TransactionEditDialog: React.FC<TransactionEditDialogProps> = ({
|
||||
transaction,
|
||||
open,
|
||||
onOpenChange,
|
||||
onSave,
|
||||
onDelete
|
||||
}) => {
|
||||
const isMobile = useIsMobile();
|
||||
const closeDialog = () => onOpenChange(false);
|
||||
|
||||
// useTransactionEdit 훅 사용 - 인자를 2개만 전달
|
||||
const { form, isSubmitting, handleSubmit, handleDelete } = useTransactionEdit(
|
||||
transaction,
|
||||
open,
|
||||
onOpenChange,
|
||||
onSave,
|
||||
onDelete
|
||||
closeDialog
|
||||
);
|
||||
|
||||
return (
|
||||
|
||||
@@ -1,21 +1,46 @@
|
||||
|
||||
import { useState } from 'react';
|
||||
import { useForm } from 'react-hook-form';
|
||||
import { Transaction } from '@/contexts/budget/types';
|
||||
import { useBudget } from '@/contexts/budget/BudgetContext';
|
||||
import { toast } from '@/hooks/useToast.wrapper';
|
||||
import { manageTitleSuggestions } from '@/utils/userTitlePreferences'; // 새로운 제목 관리 가져오기
|
||||
import { manageTitleSuggestions } from '@/utils/userTitlePreferences';
|
||||
import { TransactionFormValues } from './TransactionFormFields';
|
||||
|
||||
export const useTransactionEdit = (
|
||||
transaction: Transaction,
|
||||
onClose: () => void
|
||||
) => {
|
||||
const [isSubmitting, setIsSubmitting] = useState(false);
|
||||
const { updateTransaction } = useBudget();
|
||||
const { updateTransaction, deleteTransaction } = useBudget();
|
||||
|
||||
const handleSubmit = (updatedTransaction: Transaction) => {
|
||||
// React Hook Form 설정
|
||||
const form = useForm<TransactionFormValues>({
|
||||
defaultValues: {
|
||||
title: transaction.title,
|
||||
amount: transaction.amount.toString(),
|
||||
category: transaction.category,
|
||||
paymentMethod: transaction.paymentMethod || '신용카드'
|
||||
}
|
||||
});
|
||||
|
||||
// 트랜잭션 업데이트 처리
|
||||
const handleSubmit = (values: TransactionFormValues) => {
|
||||
try {
|
||||
setIsSubmitting(true);
|
||||
|
||||
// 폼 값에서 숫자 값 추출 (콤마 제거)
|
||||
const numericAmount = values.amount.replace(/,/g, '');
|
||||
|
||||
// 업데이트된 트랜잭션 객체 생성
|
||||
const updatedTransaction: Transaction = {
|
||||
...transaction,
|
||||
title: values.title,
|
||||
amount: parseInt(numericAmount),
|
||||
category: values.category,
|
||||
paymentMethod: values.paymentMethod
|
||||
};
|
||||
|
||||
// 트랜잭션 업데이트
|
||||
updateTransaction(updatedTransaction);
|
||||
|
||||
@@ -49,8 +74,45 @@ export const useTransactionEdit = (
|
||||
}
|
||||
};
|
||||
|
||||
// 트랜잭션 삭제 처리
|
||||
const handleDelete = async (): Promise<boolean> => {
|
||||
try {
|
||||
setIsSubmitting(true);
|
||||
|
||||
// 트랜잭션 삭제
|
||||
deleteTransaction(transaction.id);
|
||||
|
||||
// 성공 메시지 표시
|
||||
toast({
|
||||
title: "거래 내역이 삭제되었습니다",
|
||||
description: `${transaction.title} 항목이 삭제되었습니다.`,
|
||||
});
|
||||
|
||||
// 이벤트 발생 처리
|
||||
window.dispatchEvent(new CustomEvent('transactionChanged', {
|
||||
detail: { type: 'delete', transaction }
|
||||
}));
|
||||
|
||||
// 다이얼로그 닫기
|
||||
onClose();
|
||||
return true;
|
||||
} catch (error) {
|
||||
console.error('거래 내역 삭제 중 오류 발생:', error);
|
||||
toast({
|
||||
title: "거래 내역 삭제 실패",
|
||||
description: "내역을 삭제하는 도중 오류가 발생했습니다.",
|
||||
variant: "destructive"
|
||||
});
|
||||
return false;
|
||||
} finally {
|
||||
setIsSubmitting(false);
|
||||
}
|
||||
};
|
||||
|
||||
return {
|
||||
form,
|
||||
isSubmitting,
|
||||
handleSubmit
|
||||
handleSubmit,
|
||||
handleDelete
|
||||
};
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user