import { createStandaloneToast } from '@chakra-ui/react';

import { ToastV2 } from './ToastV2';

const Toast = ({
  content,
  success = undefined,
}: {
  content: string;
  success?: boolean;
}) => {
  return (
    <div
      className={`${success === undefined ? 'bg-primary text-dumbo-50' : success ? 'bg-green-700 text-white' : 'bg-red-700 text-white'} mr-4 h-auto w-auto rounded-lg p-4 font-sans text-lg`}
    >
      {content}
    </div>
  );
};

export const { ToastContainer, toast } = createStandaloneToast({
  colorMode: 'dark',
  defaultOptions: {
    position: 'bottom',
    duration: 5000,
    render: (props: any) => {
      return <ToastV2 {...props} />;
    },
  },
});

export default Toast;