loader

src/app/page.tsx

@@ -1,4 +1,5 @@
 "use client";
+import { useEffect, useState } from 'react';
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
@@ -12,6 +13,15 @@ import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis'
 import { CheckCircle, Flower2, Leaf, Palette, Sparkles } from "lucide-react";
 
 export default function LandingPage() {
+    const timer = setTimeout(() => {
+      setIsLoading(false);
+    }, 5000);
+    return () => clearTimeout(timer);
+  }, []);
+  useEffect(() => {
+    setIsLoading(true);
+  }, []);
+  const [isLoading, setIsLoading] = useState(false);
   return (
     <ThemeProvider
       defaultButtonVariant="directional-hover"
@@ -25,6 +35,12 @@ export default function LandingPage() {
       secondaryButtonStyle="glass"
       headingFontWeight="extrabold"
     >
+if (isLoading) {
+  return <div>Loading...</div>;
+}
+if (isLoading) {
+  return <div>Loading...</div>;
+}
       <div id="nav" data-section="nav">
         <NavbarStyleApple
           brandName="MossArt"