import { ArrowLeftStartOnRectangleIcon, CheckIcon, ExclamationTriangleIcon, InformationCircleIcon, XMarkIcon } from "@heroicons/react/24/outline";
import React from "react";
import { toast, ToastContainer } from "react-toastify";

import BadgeIcon, { EBadgeColor } from "../BadgeIcon";
import IconButton from "../IconButton";
import Loader from "../Loader";
import classes from "./classes.module.scss";
import ToastContent from "./ToastContent";

import "react-toastify/dist/ReactToastify.css";

export default function Toaster() {
	return (
		<ToastContainer
			className={classes["root"]}
			toastClassName={classes["wrapper"]}
			bodyClassName={classes["body"]}
			progressClassName={classes["progress"]}
			closeButton={<IconButton icon={<XMarkIcon />} />}
		/>
	);
}

export class ToasterService {
	private static instance: ToasterService;
	private constructor() {}

	public static getInstance() {
		return (this.instance ??= new this());
	}

	public text({ title, description }: { title: string; description?: string }) {
		toast.info(<ToastContent title={title} description={description} />, {
			icon: false,
			progressStyle: { backgroundColor: "var(--primary-default-base)" },
		});
	}

	public info({ title, description }: { title: string; description?: string }) {
		toast.info(
			<ToastContent
				title={title}
				description={description}
				icon={<BadgeIcon icon={<InformationCircleIcon />} color={EBadgeColor.INFO} />}
			/>,
			{
				icon: false,
				progressStyle: { backgroundColor: "var(--info-default-base)" },
			},
		);
	}

	public success({ title, description }: { title: string; description?: string }) {
		toast.info(
			<ToastContent title={title} description={description} icon={<BadgeIcon icon={<CheckIcon />} color={EBadgeColor.SUCCESS} />} />,
			{
				icon: false,
				progressStyle: { backgroundColor: "var(--success-default-base)" },
			},
		);
	}

	public error({ title, description }: { title: string; description?: string }) {
		toast.info(
			<ToastContent title={title} description={description} icon={<BadgeIcon icon={<XMarkIcon />} color={EBadgeColor.ERROR} />} />,
			{
				icon: false,
				progressStyle: { backgroundColor: "var(--error-default-base)" },
			},
		);
	}

	public warning({ title, description }: { title: string; description?: string }) {
		toast.info(
			<ToastContent
				title={title}
				description={description}
				icon={<BadgeIcon icon={<ExclamationTriangleIcon />} color={EBadgeColor.WARNING} />}
			/>,
			{
				icon: false,
				progressStyle: { backgroundColor: "var(--warning-default-base)" },
			},
		);
	}

	public loading({ title, description }: { title: string; description?: string }) {
		toast.info(
			<ToastContent title={title} description={description} icon={<BadgeIcon icon={<Loader />} color={EBadgeColor.INFO} />} />,
			{
				icon: false,
				autoClose: false,
			},
		);
	}

	public loggedOut({ title, description }: { title: string; description?: string }) {
		toast.info(
			<ToastContent
				title={title}
				description={description}
				icon={<BadgeIcon icon={<ArrowLeftStartOnRectangleIcon />} color={EBadgeColor.NEUTRAL} />}
			/>,
			{
				icon: false,
				autoClose: false,
			},
		);
	}
}