import Image from 'next/image';
import warning from '@/assets/warning.svg';

export type ErrorStateProps = {
    title: string;
    message?: string;
    action?: React.ReactNode;
};

export function ErrorState(props: ErrorStateProps) {
    return (
        <div className="flex flex-col items-center justify-center gap-2.5 px-11 py-24">
            <Image src={warning} alt="" height={48} width={48} />
            <h4 className="whitespace-pre text-center">{props.title}</h4>
            {props.message && <span>{props.message}</span>}
            {props.action}
        </div>
    );
}
