feat: add AnimatePresence page transitions between views

This commit is contained in:
Your Name
2026-02-15 20:58:01 +02:00
parent af529a2d99
commit 0c5a23ad9b

View File

@@ -1,5 +1,7 @@
import { useState, useEffect, useCallback } from "react";
import { getCurrentWindow } from "@tauri-apps/api/window";
import { AnimatePresence, motion } from "framer-motion";
import { springs, fadeSlideLeft, fadeSlideRight } from "@/lib/motion";
import { useAppStore } from "@/stores/app-store";
import { useBoardStore } from "@/stores/board-store";
import { AppShell } from "@/components/layout/AppShell";
@@ -73,7 +75,33 @@ export default function App() {
return (
<>
<AppShell>
{view.type === "board-list" ? <BoardList /> : <BoardView />}
<AnimatePresence mode="wait">
{view.type === "board-list" ? (
<motion.div
key="board-list"
className="h-full"
variants={fadeSlideRight}
initial="hidden"
animate="visible"
exit="exit"
transition={springs.gentle}
>
<BoardList />
</motion.div>
) : (
<motion.div
key={`board-${view.boardId}`}
className="h-full"
variants={fadeSlideLeft}
initial="hidden"
animate="visible"
exit="exit"
transition={springs.gentle}
>
<BoardView />
</motion.div>
)}
</AnimatePresence>
</AppShell>
<CommandPalette onOpenSettings={handleOpenSettings} />
<SettingsDialog open={settingsOpen} onOpenChange={setSettingsOpen} />