-
Notifications
You must be signed in to change notification settings - Fork 0
/
client.tsx
40 lines (37 loc) · 1.06 KB
/
client.tsx
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
"use client";
import { motion, AnimatePresence } from "framer-motion";
import ThemeRegistry from "./ThemeRegistry";
import { PropsWithChildren } from "react";
import { useSelectedLayoutSegment } from "next/navigation";
import FrozenRouter from "@/components/FrozenRouter";
// Client wraps any client/rsc components with AnimatePresence
export default function Client({ children }: PropsWithChildren) {
const segment = useSelectedLayoutSegment();
return (
<AnimatePresence
initial
mode="wait"
onExitComplete={() => console.log("triggered")}
>
<ThemeRegistry options={{ key: "mui" }} key={segment}>
<motion.main
initial={{
opacity: 0,
y: -100,
}}
animate={{
opacity: 1,
y: 0,
}}
exit={{
opacity: 0,
y: 100,
}}
transition={{ duration: 0.6, ease: "easeInOut" }}
>
<FrozenRouter>{children}</FrozenRouter>
</motion.main>
</ThemeRegistry>
</AnimatePresence>
);
}