Satyam
96f93d0c93
- Animations: Added global page transitions and smooth sidebar toggle - Loaders: Implemented branded Loader component and page loading states - Fixes: Resolved hook order violations in Maps/Dashboard; fixed Layout import - Docs: Updated README with correct demo credentials and feature list
24 lines
813 B
React
24 lines
813 B
React
import React, { useEffect, useState } from 'react';
|
|
import { useLocation } from 'react-router-dom';
|
|
|
|
const PageTransition = ({ children }) => {
|
|
const location = useLocation();
|
|
const [displayLocation, setDisplayLocation] = useState(location);
|
|
const [transitionStage, setTransitionStage] = useState('fadeIn');
|
|
|
|
// Simple Fade In animation on mount/route change
|
|
// Note: For complex exit animations, we'd need a more robust library like framer-motion.
|
|
// Given the constraints and desire for "speed", a quick fade-in is often best.
|
|
|
|
return (
|
|
<div
|
|
key={location.pathname}
|
|
className="animate-in fade-in slide-in-from-bottom-4 duration-500 ease-out fill-mode-forwards"
|
|
>
|
|
{children}
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default PageTransition;
|