import React, {useCallback, useContext} from "react";
import {classes} from "../../Utils";
import {NotificationContext, NotificationsContext} from "./Notifications";

/**
 * Notifications types enumeration.
 */
export enum NotificationType
{
	NONE = "none",
	INFO = "info",
	SUCCESS = "success",
	WARNING = "warning",
	ERROR = "error",
}

/**
 * Notification component.
 */
export function Notification({type, children}: React.PropsWithChildren<{
	type?: NotificationType;
}>)
{
	// Default type is NONE.
	type = type ?? NotificationType.NONE;

	// Get notifications context.
	const {close} = useContext(NotificationsContext);

	// Get current notification UUID.
	const {uuid, closed} = useContext(NotificationContext);

	// Initialize close notification function.
	const closeNotification = useCallback(() => { close(uuid); }, [uuid]);

	return (
		<li className={classes("notification", type, closed ? "closed" : undefined)} onMouseDown={closeNotification}>
			{children}
		</li>
	);
}
