Files
frontend/apps/sn/app/components/ui/toast.tsx
T
swcho 4c256d69a3 feat:
- toast.tsx 추가
- 침입수 분석, RDII 분석 버튼 실행 시 시간 소요 안내 toast 기능 구현
2025-08-06 16:59:38 +09:00

55 lines
1.6 KiB
TypeScript

import { Button } from "@common/components/ui";
import toast from "react-hot-toast";
export const confirmToast = (content: string, saveFunc: () => void, contentClass?:string) => {
toast(
(t) => (
<span className="flex flex-col items-center">
<div className={`mb-6 ${contentClass}`} >{content}</div>
<div className="flex flex-row space-x-2">
<Button
size={"sm"}
onClick={() => {
saveFunc();
toast.dismiss(t.id);
}}
>
확인
</Button>
<Button size={"sm"} onClick={() => toast.dismiss(t.id)}>
취소
</Button>
</div>
</span>
),
{
id: "global-confirm-toast", // 중복 토스트 방지
duration: Infinity, // 자동 사라짐 방지
}
);
};
export const showConfirmToast = (message: string) => {
toast.custom(
(t) => (
<div
className={`w-[500px] min-h-[140px] bg-white shadow-lg rounded-xl p-6 border border-gray-200
${t.visible ? "animate-enter" : "animate-leave"}`}
>
<div className="text-3xl font-extrabold text-red-600 bg-yellow-100 px-4 py-2 rounded-md shadow-md">
{message}
</div>{" "}
<div className="flex justify-end gap-2">
<Button
size={"sm"}
className="px-4 py-1.5 rounded bg-gray-200 text-sm hover:bg-gray-300"
onClick={() => toast.dismiss(t.id)}
>
확인완료
</Button>
</div>
</div>
),
{ duration: Infinity }
); // 수동 닫기
};