made report message

src/features/ReportMessage/ReportMessage.tsx

@@ -0,0 +1,54 @@
+import { Link, useRouter } from "@/shared/config/navigation";
+import "./ReportMessage.scss";
+import Image from "next/image";
+import close from "./icons/close.svg";
+import check from "./icons/check.svg";
+import { useEffect } from "react";
+
+interface IReportMessageProps {
+  setShowMessage: (value: boolean) => void;
+  showMessage: boolean;
+}
+
+const ReportMessage: React.FC<IReportMessageProps> = ({
+  setShowMessage,
+  showMessage,
+}: IReportMessageProps) => {
+  const router = useRouter();
+  useEffect(() => {
+    if (showMessage) {
+      setTimeout(() => {
+        setShowMessage(false);
+        router.push("/");
+      }, 5000);
+    }
+  }, [showMessage]);
+  return (
+    <div
+      onClick={() => setShowMessage(false)}
+      className="report-message"
+    >
+      <div
+        onClick={(e) => e.stopPropagation()}
+        className="report-message__wrapper"
+      >
+        <div className="report-message__header">
+          <Image src={check} alt="Check Icon" />
+          <button onClick={() => setShowMessage(false)} type="button">
+            <Image src={close} alt="Close Icon" />
+          </button>
+        </div>
+        <div className="report-message__text">
+          <h4>Ваше обращение отправлено</h4>
+          <p>
+            Спасибо за ваше обращение. На данный момент оно в
+            модерации.
+          </p>
+        </div>
+        <Link href="/profile/my-reports">Смотреть мои обращения</Link>
+      </div>
+    </div>
+  );
+};
+
+export default ReportMessage;