db connect

app/page.tsx

@@ -1,108 +1,18 @@
-'use client'
+import { prisma } from '@/lib/prisma'
+import HomePageClient from './HomePageClient'
 
-import { useState, useEffect } from 'react'
-import { motion, AnimatePresence } from 'framer-motion'
-import ProjectSlider from '@/components/ProjectSlider'
-import { projects } from '@/data/projects'
+export default async function Home() {
+  const projects = await prisma.project.findMany({
+    orderBy: { createdAt: 'desc' },
+    take: 10 // Limit for the slider
+  })
 
-export default function Home() {
-  const [isRevealed, setIsRevealed] = useState(false)
-  const [isAtCorners, setIsAtCorners] = useState(false)
+  // Serialize projects for the client
+  const serializedProjects = projects.map(p => ({
+    ...p,
+    createdAt: p.createdAt.toISOString(),
+    updatedAt: p.updatedAt.toISOString(),
+  }))
 
-  useEffect(() => {
-    const reveal = setTimeout(() => setIsRevealed(true), 500)
-    const move = setTimeout(() => setIsAtCorners(true), 2500)
-    
-    return () => {
-      clearTimeout(reveal)
-      clearTimeout(move)
-    }
-  }, [])
-
-  const transition = { duration: 1.8, ease: [0.76, 0, 0.24, 1] as const }
-
-  return (
-    <main className="relative h-screen w-full bg-white overflow-hidden">
-      
-      <div className="absolute inset-0 z-50 pointer-events-none">
-        <div className="relative w-full h-full">
-          
-          {/* Main Container for the dynamic text */}
-          <motion.div
-            animate={{
-              top: isAtCorners ? "100%" : "50%",
-              left: isAtCorners ? "0%" : "50%",
-              x: isAtCorners ? "0%" : "-50%",
-              y: isAtCorners ? "-100%" : "-100%",
-            }}
-            transition={transition}
-            className="absolute overflow-hidden"
-          >
-            {/* The Text Reveal & Cross-fade */}
-            <motion.div
-              initial={{ y: "100%" }}
-              animate={{ y: isRevealed ? "0%" : "100%" }}
-              transition={transition}
-              className="relative"
-            >
-              {/* AYÇA NUR TURHAN */}
-              <motion.h1
-                animate={{ opacity: isAtCorners ? 0 : 1 }}
-                transition={{ duration: 0.8, ease: "easeInOut" }}
-                className="text-[10vw] md:text-[8vw] font-bebas leading-[0.75] text-black tracking-tighter whitespace-nowrap"
-              >
-                AYÇA NUR TURHAN
-              </motion.h1>
-
-              {/* A.N.T (Cross-fading in) */}
-              <motion.h1
-                initial={{ opacity: 0 }}
-                animate={{ opacity: isAtCorners ? 1 : 0 }}
-                transition={{ duration: 0.8, ease: "easeInOut" }}
-                className="absolute inset-0 text-[10vw] md:text-[8vw] font-bebas leading-[0.75] text-black tracking-tighter whitespace-nowrap"
-              >
-                A.N.T
-              </motion.h1>
-            </motion.div>
-          </motion.div>
-
-          {/* ARCHITECTURE (Remains constant) */}
-          <motion.div
-            animate={{
-              top: isAtCorners ? "100%" : "50%",
-              left: isAtCorners ? "100%" : "50%",
-              x: isAtCorners ? "-100%" : "-50%",
-              y: isAtCorners ? "-100%" : "0%",
-            }}
-            transition={transition}
-            className="absolute overflow-hidden"
-          >
-            <motion.h1
-              initial={{ y: "100%" }}
-              animate={{ y: isRevealed ? "0%" : "100%" }}
-              transition={{ ...transition, delay: 0.1 }}
-              className="text-[10vw] md:text-[8vw] font-bebas leading-[0.75] text-black tracking-tighter whitespace-nowrap"
-            >
-              ARCHITECTURE
-            </motion.h1>
-          </motion.div>
-
-        </div>
-      </div>
-
-      <AnimatePresence>
-        {isAtCorners && (
-          <motion.div
-            initial={{ opacity: 0, scale: 0.95 }}
-            animate={{ opacity: 1, scale: 1 }}
-            transition={{ delay: 0.6, duration: 1.2, ease: "easeOut" }}
-            className="h-full flex flex-col justify-center z-10"
-          >
-            <ProjectSlider projects={projects} />
-          </motion.div>
-        )}
-      </AnimatePresence>
-
-    </main>
-  )
+  return <HomePageClient initialProjects={serializedProjects} />
 }