Spaces:
Paused
Paused
File size: 1,110 Bytes
a0fda44 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 |
import React from "react";
import { AnimatePresence, motion } from "framer-motion";
import { useSelector } from "react-redux";
// Sets animation and styles for all sidebar pages
function ActivePage({ activePageName, children, className }) {
const activeSlidebarPage = useSelector(
(state) => state.sidebarReducer.activePage
);
let variant = {
hidden: {
x: activePageName === "chatList" ? 0 : "40rem",
},
visible: {
x: 0,
transition: {
duration: 0.2,
},
},
exit: {
x: activePageName === "chatList" ? "-40rem" : "40rem",
transition: {
delay: activePageName === "chatList" ? 0.1 : 0,
duration: 0.2,
},
},
};
return (
<AnimatePresence>
{activeSlidebarPage === activePageName && (
<motion.div
className={`absolute w-full h-full bg-primary ${className}`}
variants={variant}
initial="hidden"
animate="visible"
exit="exit"
>
{children}
</motion.div>
)}
</AnimatePresence>
);
}
export default ActivePage;
|