diff --git a/src/app/edit/layout.tsx b/src/app/edit/layout.tsx index 8633247..7218c30 100644 --- a/src/app/edit/layout.tsx +++ b/src/app/edit/layout.tsx @@ -1,6 +1,6 @@ 'use client'; -import React, { useRef } from 'react'; +import React, { useRef, useEffect } from 'react'; import Link from 'next/link'; import { usePathname } from 'next/navigation'; import { PanelGroup, Panel } from 'react-resizable-panels'; @@ -8,6 +8,7 @@ import { DndContext } from '@dnd-kit/core'; import { FaFileAlt, FaSearch, FaPlug, FaCog, FaQuestionCircle } from 'react-icons/fa'; import { PiOpenAiLogo } from 'react-icons/pi'; import { editor } from 'monaco-editor'; +import { motion, useAnimation } from 'framer-motion'; import ResizeHandle from '@/components/resize-handle'; import { PATHS } from '@/utils'; @@ -56,6 +57,17 @@ const Page: React.FC<{ children: React.ReactNode }> = ({ children }) => { const pathname = usePathname(); const { splitState } = useSplitStore(); + const controls = useAnimation(); + + useEffect(() => { + controls.start({ + y: 0, + opacity: 1, + scale: 1, + transition: { ease: 'easeInOut', duration: 1 }, + }); + }, [pathname, controls]); + // const { editors } = useEditorStore(); const { models, setModels } = useModelsStore(); @@ -141,7 +153,14 @@ const Page: React.FC<{ children: React.ReactNode }> = ({ children }) => { handleFileDrop(e)}> - {children} + + {children} +