refactor: replace inline notification rendering with Notification component in LockersRegistration
This commit is contained in:
parent
b4b193a9fe
commit
f4b7027708
@ -5,10 +5,9 @@ import FormBox from "../components/FormBox";
|
|||||||
import Button from "../components/Button";
|
import Button from "../components/Button";
|
||||||
import { useToast } from "../hooks/useToast";
|
import { useToast } from "../hooks/useToast";
|
||||||
import { lockerService } from "../services/locker.service";
|
import { lockerService } from "../services/locker.service";
|
||||||
import { Copy } from "lucide-react";
|
|
||||||
import { AnimatePresence } from "motion/react";
|
import { AnimatePresence } from "motion/react";
|
||||||
import { motion } from "motion/react";
|
|
||||||
import { useLoading } from "../hooks/useLoading";
|
import { useLoading } from "../hooks/useLoading";
|
||||||
|
import Notification from "../components/Notification";
|
||||||
|
|
||||||
function LockersRegistration() {
|
function LockersRegistration() {
|
||||||
const location = useLocation();
|
const location = useLocation();
|
||||||
@ -208,36 +207,7 @@ function LockersRegistration() {
|
|||||||
return (
|
return (
|
||||||
<div>
|
<div>
|
||||||
<AnimatePresence>
|
<AnimatePresence>
|
||||||
{notification.visible && (
|
{notification.visible && <Notification notification={notification} />}
|
||||||
<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>
|
|
||||||
)}
|
|
||||||
</AnimatePresence>
|
</AnimatePresence>
|
||||||
<div className="relative">
|
<div className="relative">
|
||||||
{notification.type === "success" && (
|
{notification.type === "success" && (
|
||||||
|
Loading…
x
Reference in New Issue
Block a user