client/src/components/AlertToast/AlertToast.jsx


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24

import React, { useEffect } from "react";
import styles from "./AlertToast.module.css";

const AlertToast = ({ openAlertToast, setOpenAlertToast }) => {
  useEffect(() => {
    const timer = setTimeout(() => {
      setOpenAlertToast(false);
    }, 3000);

    return () => clearTimeout(timer);
  }, [openAlertToast, setOpenAlertToast]);

  return (
    <div
      className={`${styles.background} ${openAlertToast ? styles.active : ""}`}
    >
      <div className={styles.container}>
        <p className={styles.container__title}>Please enter some text!</p>
      </div>
    </div>
  );
};

export default AlertToast;