import styles from "./SuccessToast.module.scss";

import Image from "next/image";
import React from "react";
import { useTranslation } from "next-i18next";

import successToast from "../../../public/icons/success-toast.svg";

interface Props {
  text1: string;
}

const SuccessToast = ({ text1 }: Props) => {
  const { t } = useTranslation("common");

  return (
    <div className={styles.successToast}>
      <div className="flex h-full">
        <div className="success-icon flex justify-center items-center">
          <div className="icon relative">
            <Image src={successToast} alt="" fill />
          </div>
        </div>

        <div className="color-1"></div>

        <div className="color-2 flex items-center">
          <div>
            <div className="title">{t("Well done!")}</div>
            <div className="sub-title">{text1}</div>
            {/* <p className="oops text-green-3">{text2}</p> */}
          </div>
        </div>
      </div>
    </div>
  );
};

export default SuccessToast;
