From f4b702770841caba8e68dccb3cf765b24eb0ac2e Mon Sep 17 00:00:00 2001
From: Md Asif <md.asif5@tcs.com>
Date: Mon, 23 Dec 2024 23:57:52 +0530
Subject: [PATCH] refactor: replace inline notification rendering with
 Notification component in LockersRegistration

---
 src/pages/LockersRegistration.jsx | 34 ++-----------------------------
 1 file changed, 2 insertions(+), 32 deletions(-)

diff --git a/src/pages/LockersRegistration.jsx b/src/pages/LockersRegistration.jsx
index 703c423..afc274d 100644
--- a/src/pages/LockersRegistration.jsx
+++ b/src/pages/LockersRegistration.jsx
@@ -5,10 +5,9 @@ import FormBox from "../components/FormBox";
 import Button from "../components/Button";
 import { useToast } from "../hooks/useToast";
 import { lockerService } from "../services/locker.service";
-import { Copy } from "lucide-react";
 import { AnimatePresence } from "motion/react";
-import { motion } from "motion/react";
 import { useLoading } from "../hooks/useLoading";
+import Notification from "../components/Notification";
 
 function LockersRegistration() {
   const location = useLocation();
@@ -208,36 +207,7 @@ function LockersRegistration() {
   return (
     <div>
       <AnimatePresence>
-        {notification.visible && (
-          <motion.div
-            initial={{ y: 15, opacity: 0 }}
-            animate={{ y: 0, opacity: 1 }}
-            exit={{ y: 15, opacity: 0 }}
-            className={clsx(
-              "p-4 mb-8 font-body text-center text-xl rounded-2xl flex items-center justify-center gap-2",
-              notification.type === "error"
-                ? "bg-error-surface text-error"
-                : "bg-success-surface text-success"
-            )}
-          >
-            {notification.type === "error" ? notification.message : notification.message.split(":").map((msg, index) => {
-              return index === 1 ? (
-                <span key={index} className="border-b border-dashed">
-                  {msg}
-                </span>
-              ) : (
-                <span key={index}>{msg}</span>
-              );
-            })}
-            <Copy
-              cursor={"pointer"}
-              size={15}
-              onClick={navigator.clipboard.writeText(
-                notification.message.split(":")[1].trim()
-              )}
-            />
-          </motion.div>
-        )}
+        {notification.visible && <Notification notification={notification} />}
       </AnimatePresence>
       <div className="relative">
         {notification.type === "success" && (