⚡️ feat: Refactor API client to support server-side and client-side configurations

fix: Update post fetching logic to use dynamic ID instead of hardcoded value

feat: Enhance layout with animated transitions using framer-motion

refactor: Remove old post and user page implementations, introduce new structure

feat: Implement sidebar components for blog home with dynamic content

feat: Create blog post component with wave header and metadata display

feat: Add responsive sidebar menu for navigation on mobile devices

chore: Introduce reusable sheet component for modal-like functionality

web/src/app/(main)/layout.tsx

@@ -1,18 +1,35 @@
-import { Navbar } from "@/components/navbar";
+"use client";
 
+import { Navbar } from "@/components/navbar";
+import { AnimatePresence, motion } from "framer-motion";
+import { usePathname } from "next/navigation";
 export default function RootLayout({
   children,
 }: Readonly<{
   children: React.ReactNode;
 }>) {
+  const pathname = usePathname();
   return (
     <>
-      <header className="flex justify-center">
+      <header className="fixed top-0 left-0 w-full z-50 bg-white/80 dark:bg-slate-900/80 backdrop-blur flex justify-center border-b border-slate-200 dark:border-slate-800">
         <Navbar />
       </header>
-      <main>
-        {children}
-      </main>
+      <AnimatePresence mode="wait">
+        <motion.main
+          key={pathname}
+          initial={{ opacity: 0, y: 16 }}
+          animate={{ opacity: 1, y: 0 }}
+          exit={{ opacity: 0, y: 16 }}
+          transition={{
+        type: "tween",
+        ease: "easeOut",
+        duration: 0.18
+          }}
+          className="pt-16"
+        >
+          {children}
+        </motion.main>
+      </AnimatePresence>
     </>
   );
 }

web/src/app/(main)/p/[id]/page.tsx

@@ -0,0 +1,13 @@
+import { getPostById } from "@/api/post";
+import BlogPost from "@/components/blog-post";
+
+interface Props {
+  params: Promise<{ id: string }>
+}
+
+export default async function PostPage({ params }: Props) {
+  const { id } = await params;
+  const post = await getPostById(id);
+  if (!post) return <div>文章不存在</div>;
+  return <BlogPost post={post} />;
+}

web/src/app/(main)/u/[id]/page.tsx

@@ -0,0 +1,8 @@
+export default function Page() {
+    return (
+        <div>
+            <h1>Page Title</h1>
+            <p>This is the User content.</p>
+        </div>
+    )
+}