md.asif5/osaka
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: handle optional state properties and improve animation transitions in LockersRegistration component

Browse Source
This commit is contained in:
Md Asif 2024-12-23 20:47:19 +05:30
parent 48b9b70c4a
commit 9d33cb5372
1 changed files with 6 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
src/pages/LockersRegistration.jsx
View File

@ -14,7 +14,8 @@ function LockersRegistration() {
const location = useLocation(); const location = useLocation();
const showToast = useToast(); const showToast = useToast();
const { setIsLoading } = useLoading(); const { setIsLoading } = useLoading();
const { noOfLockers, cabinetId } = location.state; const noOfLockers = location.state?.noOfLockers;
const cabinetId = location.state?.cabinetId;
const [submitting, setSubmitting] = useState(false); const [submitting, setSubmitting] = useState(false);
const [notification, setNotification] = useState({ const [notification, setNotification] = useState({
visible: false, visible: false,
@ -22,7 +23,7 @@ function LockersRegistration() {
type: "", type: "",
}); });
const initLockers = Array(parseInt(noOfLockers)) const initLockers = Array(noOfLockers ? parseInt(noOfLockers) : 0)
.fill() .fill()
.map(() => ({ .map(() => ({
id: "", id: "",
@ -209,9 +210,9 @@ function LockersRegistration() {
<AnimatePresence> <AnimatePresence>
{notification.visible && ( {notification.visible && (
<motion.div <motion.div
initial={{ opacity: 0 }} initial={{ y: 15, opacity: 0 }}
animate={{ opacity: 1 }} animate={{ y: 0, opacity: 1 }}
exit={{ opacity: 0 }} exit={{ y: 15, opacity: 0 }}
className={clsx( className={clsx(
"p-4 mb-8 font-body text-center text-xl rounded-2xl flex items-center justify-center gap-2", "p-4 mb-8 font-body text-center text-xl rounded-2xl flex items-center justify-center gap-2",
notification.type === "error" notification.type === "error"