42 lines
1017 B
TypeScript

import { useState } from 'react';
import { type ExpenseListItem, useDeleteExpenseItem } from '@/entity/expenses/item';
import type { MouseEventHandler } from 'react';
type UseDeleteExpenseItemButtonArgs = {
item: ExpenseListItem;
onClick?: MouseEventHandler<HTMLButtonElement>;
};
export const useDeleteExpenseItemButton = (args: UseDeleteExpenseItemButtonArgs) => {
const { item, onClick } = args;
const [isOpen, setIsOpen] = useState(false);
const onCloseModalHandler = () => {
setIsOpen(false);
};
const onClickHandler: MouseEventHandler<HTMLButtonElement> = (event) => {
setIsOpen(true);
onClick?.(event);
};
const { mutateAsync: deleteExpenseItemMutation, isPending } = useDeleteExpenseItem({
listId: item.expenseListId,
id: item.id,
});
const onFormSubmitHandler = async () => {
await deleteExpenseItemMutation();
setIsOpen(false);
};
return {
isOpen,
onCloseModalHandler,
onClickHandler,
isPending,
onFormSubmitHandler,
};
};