import {Bug, CircleAlert, CircleCheckBig, CircleHelp, MessageSquareText, Minus, OctagonX, Plus} from "lucide-react";
import React from "react";


export enum toastType {
	info = "info",
	warn = "warn",
	error = "error",
	refused= "refused",
	success = "success",
	add = "add",
	del = "del",
	message = "message"
}

export function ToastBox({title, message, type}: {title?: string, message: string, type: toastType}) {
	let icon: any;
	let bgColor: string;
	switch (type) {
		case toastType.message :
			icon = <MessageSquareText />
			bgColor = 'bg-accent'
			break
		case toastType.add:
			icon = <Plus />
			bgColor = 'bg-accent'
			break
		case toastType.del:
			icon = <Minus />
			bgColor = 'bg-accent'
			break
		case toastType.info:
			icon = <CircleHelp />
			bgColor = 'bg-accent'
			break
		case toastType.warn:
			icon = <CircleAlert />
			bgColor = 'bg-orange-500'
			break
		case toastType.error:
			icon = <Bug />
			bgColor = 'bg-red-500'
			break
		case toastType.success:
			icon = <CircleCheckBig />
			bgColor = 'bg-green-500'
			break
		case toastType.refused:
			icon = <OctagonX />
			bgColor = 'bg-red-700'
			break
	}

	return (
		<div className={`flex flex-row items-center gap-2 scale-90 md:scale-100 p-2 rounded border ${bgColor}`}>
			{icon}
			<div className={"flex flex-col justify-center items-start"}>
				{title && <h3 className={"text-nowrap font-bold text-xl"}>{title}</h3>}
				<p className={"text-wrap"}>{message}</p>
			</div>
		</div>
	)
}