Add src/hooks/useAuth.ts

Merge version_5 into main

src/app/dashboard/page.tsx

@@ -1,75 +1,38 @@
 "use client";
 
-import ReactLenis from "lenis/react";
-import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
-import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import HeroBillboardDashboard from "@/components/sections/hero/HeroBillboardDashboard";
-import { BarChart3, Package, Users, Settings, Bell, PlusCircle, ArrowUpCircle, TrendingUp, CheckCircle, XCircle } from "lucide-react";
-import AuthGuard from "../AuthGuard";
+import { useEffect } from 'react';
+import { useRouter } from 'next/navigation';
+import { useAuth } from '@/hooks/useAuth';
 
 export default function DashboardPage() {
-    const navItems = [
-        { name: "Özellikler", id: "features" },
-        { name: "Fiyatlandırma", id: "pricing" },
-        { name: "İzlenebilirlik", id: "traceability" },
-        { name: "Günlükler", id: "/logs" },
-        { name: "Hareketler", id: "/movements" },
-        { name: "Raporlar", id: "/reports" },
-        { name: "Hakkımızda", id: "about" },
-        { name: "Varyasyonlar", id: "/product-variations" },
-        { name: "Üretim", id: "/production" },
-        { name: "Reçeteler", id: "/recipes" },
-        { name: "Yönetim Paneli", id: "/superadmin" },
-        { name: "Giriş Yap", id: "/login" },
-        { name: "Gösterge Paneli", id: "/dashboard" },
-        { name: "İletişim", id: "contact" }
-    ];
+  const { isAuthenticated, isLoading, logout } = useAuth();
+  const router = useRouter();
 
-    return (
-        <ThemeProvider defaultButtonVariant="hover-bubble" defaultTextAnimation="entrance-slide" borderRadius="pill" contentWidth="medium" sizing="medium" background="none" cardStyle="gradient-bordered" primaryButtonStyle="primary-glow" secondaryButtonStyle="layered" headingFontWeight="medium">
-            <AuthGuard>
-                <ReactLenis root>
-                    <NavbarLayoutFloatingInline
-                        navItems={navItems}
-                        brandName="Stokify"
-                        button={{ text: "Hemen Başla", href: "#contact" }}
-                    />
-                    <HeroBillboardDashboard
-                        title="Stok Yönetim Paneli"
-                        description="Stokify ile envanterinizi gerçek zamanlı olarak takip edin ve yönetin."
-                        background={{ variant: "animated-grid" }}
-                        dashboard={{
-                            title: "Genel Bakış",                            stats: [
-                                { title: "Toplam Ürün", values: [1200, 1250, 1300], description: "Depodaki toplam ürün sayısı" },
-                                { title: "Stok Değeri", values: [250000, 260000, 275000], valuePrefix: "₺", description: "Mevcut stokun tahmini değeri" },
-                                { title: "Bekleyen Siparişler", values: [15, 12, 10], description: "Gönderilmeyi bekleyen sipariş sayısı" },
-                            ],
-                            logoIcon: Package,
-                            sidebarItems: [
-                                { icon: BarChart3, active: true },
-                                { icon: Package },
-                                { icon: Users },
-                                { icon: Settings },
-                                { icon: Bell },
-                            ],
-                            searchPlaceholder: "Ürün veya sipariş ara...",                            buttons: [
-                                { text: "Yeni Ürün Ekle", onClick: () => console.log("Add new product") },
-                                { text: "Rapor Oluştur", onClick: () => console.log("Generate report") },
-                            ],
-                            chartTitle: "Son 7 Günlük Stok Hareketi",                            chartData: [
-                                { value: 120 }, { value: 150 }, { value: 130 }, { value: 170 }, { value: 140 }, { value: 190 }, { value: 160 }
-                            ],
-                            listItems: [
-                                { icon: ArrowUpCircle, title: "Yeni Giriş: Ürün X", status: "Tamamlandı" },
-                                { icon: TrendingUp, title: "Stok Azaldı: Ürün Y", status: "Beklemede" },
-                                { icon: CheckCircle, title: "Sipariş #1234", status: "Gönderildi" },
-                                { icon: XCircle, title: "İade: Ürün Z", status: "Sorunlu" },
-                            ],
-                            listTitle: "Son Hareketler",                            imageSrc: "https://images.unsplash.com/photo-1579547612702-fe1e4889c565?q=80&w=2670&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D",                            imageAlt: "Dashboard Background"
-                        }}
-                    />
-                </ReactLenis>
-            </AuthGuard>
-        </ThemeProvider>
-    );
-}
+  useEffect(() => {
+    if (!isLoading && !isAuthenticated) {
+      router.push('/login');
+    }
+  }, [isAuthenticated, isLoading, router]);
+
+  if (isLoading) {
+    return <div className="flex items-center justify-center min-h-screen text-xl">Yükleniyor...</div>;
+  }
+
+  if (!isAuthenticated) {
+    return null; // Or a loading spinner, as the redirect will happen soon
+  }
+
+  return (
+    <div className="flex flex-col items-center justify-center min-h-screen p-4 bg-background-accent text-foreground">
+      <h1 className="text-5xl font-extrabold mb-4">Gösterge Paneli</h1>
+      <p className="text-xl text-center mb-8">Hoş geldiniz! Burası size özel gösterge paneliniz.</p>
+      <button
+        onClick={logout}
+        className="px-6 py-3 bg-secondary-cta text-white rounded-full text-lg font-semibold shadow-lg hover:bg-opacity-90 transition-all duration-300"
+      >
+        Çıkış Yap
+      </button>
+      <p className="text-md text-gray-400 mt-4">Yalnızca yetkili kullanıcılar erişebilir.</p>
+    </div>
+  );
+}

src/app/login/page.tsx

@@ -1,57 +1,34 @@
 "use client";
 
-import React from "react";
-import ReactLenis from "lenis/react";
-import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
-import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import { useAuth } from '@/hooks/useAuth';
+import { useEffect } from 'react';
 import { useRouter } from 'next/navigation';
 
 export default function LoginPage() {
-    const router = useRouter();
-    const navItems = [
-        { name: "Özellikler", id: "features" },
-        { name: "Fiyatlandırma", id: "pricing" },
-        { name: "İzlenebilirlik", id: "traceability" },
-        { name: "Günlükler", id: "/logs" },
-        { name: "Hareketler", id: "/movements" },
-        { name: "Raporlar", id: "/reports" },
-        { name: "Hakkımızda", id: "about" },
-        { name: "Varyasyonlar", id: "/product-variations" },
-        { name: "Üretim", id: "/production" },
-        { name: "Reçeteler", id: "/recipes" },
-        { name: "Yönetim Paneli", id: "/superadmin" },
-        { name: "Giriş Yap", id: "/login" },
-        { name: "Gösterge Paneli", id: "/dashboard" },
-        { name: "İletişim", id: "contact" }
-    ];
+  const { isAuthenticated, isLoading, login } = useAuth();
+  const router = useRouter();
 
-    const handleLogin = () => {
-        // Simulate successful login
-        localStorage.setItem('isAuthenticated', 'true');
-        router.push('/dashboard');
-    };
+  useEffect(() => {
+    if (!isLoading && isAuthenticated) {
+      router.push('/dashboard'); // Redirect if already authenticated
+    }
+  }, [isAuthenticated, isLoading, router]);
 
-    return (
-        <ThemeProvider defaultButtonVariant="hover-bubble" defaultTextAnimation="entrance-slide" borderRadius="pill" contentWidth="medium" sizing="medium" background="none" cardStyle="gradient-bordered" primaryButtonStyle="primary-glow" secondaryButtonStyle="layered" headingFontWeight="medium">
-            <ReactLenis root>
-                <NavbarLayoutFloatingInline
-                    navItems={navItems}
-                    brandName="Stokify"
-                    button={{ text: "Hemen Başla", href: "#contact" }}
-                />
-                <div id="login" data-section="login" className="flex items-center justify-center min-h-screen py-16 px-4">
-                    <div className="bg-card p-8 rounded-lg shadow-lg max-w-md w-full text-center">
-                        <h1 className="text-3xl font-bold mb-4 text-foreground">Hesabınıza Giriş Yapın</h1>
-                        <p className="text-foreground/80 mb-6">Stokify yönetim paneline erişmek için giriş yapın.</p>
-                        <button
-                            onClick={handleLogin}
-                            className="w-full bg-primary-cta text-primary-cta-text py-3 px-6 rounded-md font-semibold text-lg hover:opacity-90 transition-opacity"
-                        >
-                            Giriş Yap (Simüle)
-                        </button>
-                    </div>
-                </div>
-            </ReactLenis>
-        </ThemeProvider>
-    );
-}
+  if (isLoading) {
+    return <div className="flex items-center justify-center min-h-screen text-xl">Yükleniyor...</div>;
+  }
+
+  return (
+    <div className="flex flex-col items-center justify-center min-h-screen p-4">
+      <h1 className="text-4xl font-bold mb-6">Giriş Yap</h1>
+      <p className="text-lg text-center mb-8">Panel sayfalarına erişmek için lütfen giriş yapın.</p>
+      <button
+        onClick={login}
+        className="px-8 py-4 bg-primary-cta text-white rounded-full text-lg font-semibold shadow-lg hover:bg-opacity-90 transition-all duration-300"
+      >
+        Giriş Yap (Demo)
+      </button>
+      <p className="mt-4 text-sm text-gray-500">Bu demo için basit bir giriş simülasyonudur.</p>
+    </div>
+  );
+}

src/app/logs/page.tsx

@@ -1,44 +1,32 @@
 "use client";
 
-import React from "react";
-import ReactLenis from "lenis/react";
-import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
-import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import AuthGuard from "../AuthGuard";
+import { useEffect } from 'react';
+import { useRouter } from 'next/navigation';
+import { useAuth } from '@/hooks/useAuth';
 
 export default function LogsPage() {
-    const navItems = [
-        { name: "Özellikler", id: "features" },
-        { name: "Fiyatlandırma", id: "pricing" },
-        { name: "İzlenebilirlik", id: "traceability" },
-        { name: "Günlükler", id: "/logs" },
-        { name: "Hareketler", id: "/movements" },
-        { name: "Raporlar", id: "/reports" },
-        { name: "Hakkımızda", id: "about" },
-        { name: "Varyasyonlar", id: "/product-variations" },
-        { name: "Üretim", id: "/production" },
-        { name: "Reçeteler", id: "/recipes" },
-        { name: "Yönetim Paneli", id: "/superadmin" },
-        { name: "Giriş Yap", id: "/login" },
-        { name: "Gösterge Paneli", id: "/dashboard" },
-        { name: "İletişim", id: "contact" }
-    ];
+  const { isAuthenticated, isLoading } = useAuth();
+  const router = useRouter();
 
-    return (
-        <ThemeProvider defaultButtonVariant="hover-bubble" defaultTextAnimation="entrance-slide" borderRadius="pill" contentWidth="medium" sizing="medium" background="none" cardStyle="gradient-bordered" primaryButtonStyle="primary-glow" secondaryButtonStyle="layered" headingFontWeight="medium">
-            <AuthGuard>
-                <ReactLenis root>
-                    <NavbarLayoutFloatingInline
-                        navItems={navItems}
-                        brandName="Stokify"
-                        button={{ text: "Hemen Başla", href: "#contact" }}
-                    />
-                    <main className="container mx-auto px-4 py-16 min-h-[calc(100vh-100px)] flex flex-col items-center justify-center text-center">
-                        <h1 className="text-4xl font-bold mb-4">Sistem Günlükleri</h1>
-                        <p className="text-lg text-gray-600">Tüm sistem hareketlerinin detaylı günlükleri burada gösterilecektir.</p>
-                    </main>
-                </ReactLenis>
-            </AuthGuard>
-        </ThemeProvider>
-    );
-}
+  useEffect(() => {
+    if (!isLoading && !isAuthenticated) {
+      router.push('/login');
+    }
+  }, [isAuthenticated, isLoading, router]);
+
+  if (isLoading) {
+    return <div className="flex items-center justify-center min-h-screen text-xl">Yükleniyor...</div>;
+  }
+
+  if (!isAuthenticated) {
+    return null; // Or a loading spinner, as the redirect will happen soon
+  }
+
+  return (
+    <div className="flex flex-col items-center justify-center min-h-screen p-4 bg-background-accent text-foreground">
+      <h1 className="text-5xl font-extrabold mb-4">Günlükler Paneli</h1>
+      <p className="text-xl text-center mb-8">Burada tüm sistem günlüklerini görüntüleyebilirsiniz.</p>
+      <p className="text-md text-gray-400">Yalnızca yetkili kullanıcılar erişebilir.</p>
+    </div>
+  );
+}

src/app/movements/page.tsx

@@ -1,44 +1,32 @@
 "use client";
 
-import React from "react";
-import ReactLenis from "lenis/react";
-import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
-import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import AuthGuard from "../AuthGuard";
+import { useEffect } from 'react';
+import { useRouter } from 'next/navigation';
+import { useAuth } from '@/hooks/useAuth';
 
 export default function MovementsPage() {
-    const navItems = [
-        { name: "Özellikler", id: "features" },
-        { name: "Fiyatlandırma", id: "pricing" },
-        { name: "İzlenebilirlik", id: "traceability" },
-        { name: "Günlükler", id: "/logs" },
-        { name: "Hareketler", id: "/movements" },
-        { name: "Raporlar", id: "/reports" },
-        { name: "Hakkımızda", id: "about" },
-        { name: "Varyasyonlar", id: "/product-variations" },
-        { name: "Üretim", id: "/production" },
-        { name: "Reçeteler", id: "/recipes" },
-        { name: "Yönetim Paneli", id: "/superadmin" },
-        { name: "Giriş Yap", id: "/login" },
-        { name: "Gösterge Paneli", id: "/dashboard" },
-        { name: "İletişim", id: "contact" }
-    ];
+  const { isAuthenticated, isLoading } = useAuth();
+  const router = useRouter();
 
-    return (
-        <ThemeProvider defaultButtonVariant="hover-bubble" defaultTextAnimation="entrance-slide" borderRadius="pill" contentWidth="medium" sizing="medium" background="none" cardStyle="gradient-bordered" primaryButtonStyle="primary-glow" secondaryButtonStyle="layered" headingFontWeight="medium">
-            <AuthGuard>
-                <ReactLenis root>
-                    <NavbarLayoutFloatingInline
-                        navItems={navItems}
-                        brandName="Stokify"
-                        button={{ text: "Hemen Başla", href: "#contact" }}
-                    />
-                    <main className="container mx-auto px-4 py-16 min-h-[calc(100vh-100px)] flex flex-col items-center justify-center text-center">
-                        <h1 className="text-4xl font-bold mb-4">Stok Hareketleri</h1>
-                        <p className="text-lg text-gray-600">Ürünlerin giriş ve çıkış hareketleri bu sayfada görüntülenecektir.</p>
-                    </main>
-                </ReactLenis>
-            </AuthGuard>
-        </ThemeProvider>
-    );
-}
+  useEffect(() => {
+    if (!isLoading && !isAuthenticated) {
+      router.push('/login');
+    }
+  }, [isAuthenticated, isLoading, router]);
+
+  if (isLoading) {
+    return <div className="flex items-center justify-center min-h-screen text-xl">Yükleniyor...</div>;
+  }
+
+  if (!isAuthenticated) {
+    return null; // Or a loading spinner, as the redirect will happen soon
+  }
+
+  return (
+    <div className="flex flex-col items-center justify-center min-h-screen p-4 bg-background-accent text-foreground">
+      <h1 className="text-5xl font-extrabold mb-4">Hareketler Paneli</h1>
+      <p className="text-xl text-center mb-8">Ürünlerin tüm hareket geçmişini buradan takip edebilirsiniz.</p>
+      <p className="text-md text-gray-400">Yalnızca yetkili kullanıcılar erişebilir.</p>
+    </div>
+  );
+}

src/app/page.tsx

@@ -18,16 +18,7 @@ export default function SaasTemplatePage() {
         { name: "Özellikler", id: "features" },
         { name: "Fiyatlandırma", id: "pricing" },
         { name: "İzlenebilirlik", id: "traceability" },
-        { name: "Günlükler", id: "/logs" },
-        { name: "Hareketler", id: "/movements" },
-        { name: "Raporlar", id: "/reports" },
         { name: "Hakkımızda", id: "about" },
-        { name: "Varyasyonlar", id: "/product-variations" },
-        { name: "Üretim", id: "/production" },
-        { name: "Reçeteler", id: "/recipes" },
-        { name: "Yönetim Paneli", id: "/superadmin" },
-        { name: "Giriş Yap", id: "/login" },
-        { name: "Gösterge Paneli", id: "/dashboard" },
         { name: "İletişim", id: "contact" }
     ];
 
@@ -87,15 +78,17 @@ export default function SaasTemplatePage() {
                         { type: "text-icon", text: "Otomatik Raporlama", icon: BarChart3 },
                     ]}
                 />
-                <FeatureBento
-                    features={features}
-                    animationType="none"
-                    tag="Temel Özellikler"
-                    title="Stok Yönetiminde İhtiyacınız Olan Her Şey"
-                    description="Stokify, işletmenizin envanterini kolayca yönetmenizi ve operasyonel verimliliği artırmanızı sağlar."
-                    textboxLayout="default"
-                    useInvertedBackground={false}
-                />
+                <div id="about" data-section="about">
+                    <FeatureBento
+                        features={features}
+                        animationType="none"
+                        tag="Temel Özellikler"
+                        title="Stok Yönetiminde İhtiyacınız Olan Her Şey"
+                        description="Stokify, işletmenizin envanterini kolayca yönetmenizi ve operasyonel verimliliği artırmanızı sağlar."
+                        textboxLayout="default"
+                        useInvertedBackground={false}
+                    />
+                </div>
                 <FeatureBorderGlow
                     tag="Neden Stokify?"
                     tagIcon={HelpCircle}
@@ -222,33 +215,20 @@ export default function SaasTemplatePage() {
                             title: "Ürün",                            items: [
                                 { label: "Özellikler", href: "/#features" },
                                 { label: "Fiyatlandırma", href: "/#pricing" },
-                                { label: "İzlenebilirlik", href: "/#traceability" },
-                                { label: "Entegrasyonlar", href: "#" },
-                                { label: "Referanslar", href: "#" },
+                                { label: "İzlenebilirlik", href: "/#traceability" }
                             ],
                         },
                         {
                             title: "Şirket",                            items: [
                                 { label: "Hakkımızda", href: "/#about" },
-                                { label: "Blog", href: "#" },
-                                { label: "Kariyer", href: "#" },
-                                { label: "İletişim", href: "/#contact" },
+                                { label: "İletişim", href: "/#contact" }
                             ],
                         },
                         {
-                            title: "Kaynaklar",                            items: [
-                                { label: "Dokümantasyon", href: "#" },
-                                { label: "Yardım Merkezi", href: "#" },
-                                { label: "Topluluk", href: "#" },
-                                { label: "Destek", href: "#" },
-                            ],
+                            title: "Kaynaklar",                            items: []
                         },
                         {
-                            title: "Yasal",                            items: [
-                                { label: "Gizlilik Politikası", href: "#" },
-                                { label: "Kullanım Koşulları", href: "#" },
-                                { label: "Çerez Politikası", href: "#" },
-                            ],
+                            title: "Yasal",                            items: []
                         },
                     ]}
                     copyrightText="2024 Stokify. Tüm hakları saklıdır."

src/app/product-variations/page.tsx

@@ -1,74 +1,32 @@
 "use client";
 
-import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import ReactLenis from "lenis/react";
-import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
-import TextBox from "@/components/Textbox";
-import FooterBaseReveal from "@/components/sections/footer/FooterBaseReveal";
+import { useEffect } from 'react';
+import { useRouter } from 'next/navigation';
+import { useAuth } from '@/hooks/useAuth';
 
 export default function ProductVariationsPage() {
-    const navItems = [
-        { name: "Özellikler", id: "features" },
-        { name: "Fiyatlandırma", id: "pricing" },
-        { name: "Hakkımızda", id: "about" },
-        { name: "İletişim", id: "contact" },
-        { name: "Varyasyonlar", id: "/product-variations" }
-    ];
+  const { isAuthenticated, isLoading } = useAuth();
+  const router = useRouter();
 
-    return (
-        <ThemeProvider defaultButtonVariant="hover-bubble" defaultTextAnimation="entrance-slide" borderRadius="pill" contentWidth="medium" sizing="medium" background="none" cardStyle="gradient-bordered" primaryButtonStyle="primary-glow" secondaryButtonStyle="layered" headingFontWeight="medium">
-            <ReactLenis root>
-                <NavbarLayoutFloatingInline
-                    navItems={navItems}
-                    brandName="Stokify"
-                    button={{ text: "Hemen Başla", href: "#contact" }}
-                />
-                <div className="min-h-screen flex flex-col justify-center items-center py-20 px-4 sm:px-6 lg:px-8">
-                    <TextBox
-                        title="Ürün Varyasyonları Yönetimi"
-                        description="Bu sayfa, ürünlerinizin alt varyasyonlarını, varyant kombinasyonlarını ve varyantlara özel envanter takibini yönetmek için altyapıyı sunar. Renk, boyut, malzeme gibi özelliklere göre varyasyonlar oluşturabilir, stok seviyelerini belirleyebilir ve ürün setlerini yapılandırabilirsiniz."
-                        textboxLayout="default"
-                        center={true}
-                    />
-                </div>
-                <FooterBaseReveal
-                    logoText="Stokify"
-                    columns={[
-                        {
-                            title: "Ürün",                            items: [
-                                { label: "Özellikler", href: "#features" },
-                                { label: "Fiyatlandırma", href: "#pricing" },
-                                { label: "Entegrasyonlar", href: "#" },
-                                { label: "Referanslar", href: "#" },
-                            ],
-                        },
-                        {
-                            title: "Şirket",                            items: [
-                                { label: "Hakkımızda", href: "#about" },
-                                { label: "Blog", href: "#" },
-                                { label: "Kariyer", href: "#" },
-                                { label: "İletişim", href: "#contact" },
-                            ],
-                        },
-                        {
-                            title: "Kaynaklar",                            items: [
-                                { label: "Dokümantasyon", href: "#" },
-                                { label: "Yardım Merkezi", href: "#" },
-                                { label: "Topluluk", href: "#" },
-                                { label: "Destek", href: "#" },
-                            ],
-                        },
-                        {
-                            title: "Yasal",                            items: [
-                                { label: "Gizlilik Politikası", href: "#" },
-                                { label: "Kullanım Koşulları", href: "#" },
-                                { label: "Çerez Politikası", href: "#" },
-                            ],
-                        },
-                    ]}
-                    copyrightText="2024 Stokify. Tüm hakları saklıdır."
-                />
-            </ReactLenis>
-        </ThemeProvider>
-    );
-}
+  useEffect(() => {
+    if (!isLoading && !isAuthenticated) {
+      router.push('/login');
+    }
+  }, [isAuthenticated, isLoading, router]);
+
+  if (isLoading) {
+    return <div className="flex items-center justify-center min-h-screen text-xl">Yükleniyor...</div>;
+  }
+
+  if (!isAuthenticated) {
+    return null; // Or a loading spinner, as the redirect will happen soon
+  }
+
+  return (
+    <div className="flex flex-col items-center justify-center min-h-screen p-4 bg-background-accent text-foreground">
+      <h1 className="text-5xl font-extrabold mb-4">Varyasyonlar Paneli</h1>
+      <p className="text-xl text-center mb-8">Ürün varyasyonlarınızı buradan yönetin.</p>
+      <p className="text-md text-gray-400">Yalnızca yetkili kullanıcılar erişebilir.</p>
+    </div>
+  );
+}

src/app/production/page.tsx

@@ -1,57 +1,32 @@
 "use client";
 
-import ReactLenis from "lenis/react";
-import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
-import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import HeroCentered from "@/components/sections/hero/HeroCentered";
-import { Wrench, BookOpen, Factory, ShoppingCart, Clock, DollarSign, ListChecks, Database, FlaskConical } from "lucide-react";
+import { useEffect } from 'react';
+import { useRouter } from 'next/navigation';
+import { useAuth } from '@/hooks/useAuth';
 
 export default function ProductionPage() {
-    const navItems = [
-        { name: "Özellikler", id: "features" },
-        { name: "Üretim", id: "/production" },
-        { name: "Reçeteler", id: "/recipes" },
-        { name: "Fiyatlandırma", id: "pricing" },
-        { name: "Hakkımızda", id: "about" },
-        { name: "İletişim", id: "contact" }
-    ];
+  const { isAuthenticated, isLoading } = useAuth();
+  const router = useRouter();
 
-    const avatars = [
-        { src: "http://img.b2bpic.net/free-photo/cheerful-middle-aged-businesswoman_1262-21005.jpg", alt: "İşletme Sahibi 1" },
-        { src: "http://img.b2bpic.net/free-photo/smiling-man-his-work-time-office-job_23-2149571041.jpg", alt: "İşletme Sahibi 2" },
-        { src: "http://img.b2bpic.net/free-photo/medium-shot-woman-working-as-lawyer_23-2151202451.jpg", alt: "İşletme Sahibi 3" },
-        { src: "http://img.b2bpic.net/free-photo/happy-afroamerican-employee-portrait_23-2148508904.jpg", alt: "İşletme Sahibi 4" },
-    ];
+  useEffect(() => {
+    if (!isLoading && !isAuthenticated) {
+      router.push('/login');
+    }
+  }, [isAuthenticated, isLoading, router]);
 
-    return (
-        <ThemeProvider defaultButtonVariant="hover-bubble" defaultTextAnimation="entrance-slide" borderRadius="pill" contentWidth="medium" sizing="medium" background="none" cardStyle="gradient-bordered" primaryButtonStyle="primary-glow" secondaryButtonStyle="layered" headingFontWeight="medium">
-            <ReactLenis root>
-                <NavbarLayoutFloatingInline
-                    navItems={navItems}
-                    brandName="Stokify"
-                    button={{ text: "Hemen Başla", href: "/#contact" }}
-                />
-                <HeroCentered
-                    background={{ variant: "rotated-rays-animated-grid" }}
-                    avatars={avatars}
-                    avatarText="Üretiminizi Otomatikleştirin"
-                    title="Üretim ve Reçete Yönetimi ile Verimliliği Artırın"
-                    description="Stokify'ın üretim motoru ile hammadde takibinden üretim siparişlerine kadar tüm süreçleri yönetin."
-                    buttons={[
-                        {
-                            text: "Detayları Keşfet",                            href: "#"},
-                        {
-                            text: "Reçeteleri Yönet",                            href: "/recipes"},
-                    ]}
-                    marqueeItems={[
-                        { type: "text-icon", text: "Üretim Takibi", icon: Factory },
-                        { type: "text-icon", text: "Reçete Oluşturma", icon: BookOpen },
-                        { type: "text-icon", text: "Hammadde Dedu", icon: Wrench },
-                        { type: "text-icon", text: "Sipariş Yönetimi", icon: ShoppingCart },
-                        { type: "text-icon", text: "Gerçek Zamanlı", icon: Clock },
-                    ]}
-                />
-            </ReactLenis>
-        </ThemeProvider>
-    );
-}
+  if (isLoading) {
+    return <div className="flex items-center justify-center min-h-screen text-xl">Yükleniyor...</div>;
+  }
+
+  if (!isAuthenticated) {
+    return null; // Or a loading spinner, as the redirect will happen soon
+  }
+
+  return (
+    <div className="flex flex-col items-center justify-center min-h-screen p-4 bg-background-accent text-foreground">
+      <h1 className="text-5xl font-extrabold mb-4">Üretim Paneli</h1>
+      <p className="text-xl text-center mb-8">Üretim süreçlerinizi ve operasyonlarınızı buradan yönetebilirsiniz.</p>
+      <p className="text-md text-gray-400">Yalnızca yetkili kullanıcılar erişebilir.</p>
+    </div>
+  );
+}

src/app/recipes/page.tsx

@@ -1,57 +1,32 @@
 "use client";
 
-import ReactLenis from "lenis/react";
-import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
-import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import HeroCentered from "@/components/sections/hero/HeroCentered";
-import { FlaskConical, ListChecks, Database, DollarSign, Clock, Wrench, BookOpen, Factory, ShoppingCart } from "lucide-react";
+import { useEffect } from 'react';
+import { useRouter } from 'next/navigation';
+import { useAuth } from '@/hooks/useAuth';
 
 export default function RecipesPage() {
-    const navItems = [
-        { name: "Özellikler", id: "features" },
-        { name: "Üretim", id: "/production" },
-        { name: "Reçeteler", id: "/recipes" },
-        { name: "Fiyatlandırma", id: "pricing" },
-        { name: "Hakkımızda", id: "about" },
-        { name: "İletişim", id: "contact" }
-    ];
+  const { isAuthenticated, isLoading } = useAuth();
+  const router = useRouter();
 
-    const avatars = [
-        { src: "http://img.b2bpic.net/free-photo/cheerful-middle-aged-businesswoman_1262-21005.jpg", alt: "İşletme Sahibi 1" },
-        { src: "http://img.b2bpic.net/free-photo/smiling-man-his-work-time-office-job_23-2149571041.jpg", alt: "İşletme Sahibi 2" },
-        { src: "http://img.b2bpic.net/free-photo/medium-shot-woman-working-as-lawyer_23-2151202451.jpg", alt: "İşletme Sahibi 3" },
-        { src: "http://img.b2bpic.net/free-photo/happy-afroamerican-employee-portrait_23-2148508904.jpg", alt: "İşletme Sahibi 4" },
-    ];
+  useEffect(() => {
+    if (!isLoading && !isAuthenticated) {
+      router.push('/login');
+    }
+  }, [isAuthenticated, isLoading, router]);
 
-    return (
-        <ThemeProvider defaultButtonVariant="hover-bubble" defaultTextAnimation="entrance-slide" borderRadius="pill" contentWidth="medium" sizing="medium" background="none" cardStyle="gradient-bordered" primaryButtonStyle="primary-glow" secondaryButtonStyle="layered" headingFontWeight="medium">
-            <ReactLenis root>
-                <NavbarLayoutFloatingInline
-                    navItems={navItems}
-                    brandName="Stokify"
-                    button={{ text: "Hemen Başla", href: "/#contact" }}
-                />
-                <HeroCentered
-                    background={{ variant: "rotated-rays-animated-grid" }}
-                    avatars={avatars}
-                    avatarText="Reçetelerinizi Kolayca Oluşturun"
-                    title="Detaylı Reçete Yönetimi ve BOM Oluşturma"
-                    description="Ürünlerinizin tüm bileşenlerini, maliyetlerini ve üretim adımlarını kolayca tanımlayın ve yönetin."
-                    buttons={[
-                        {
-                            text: "Yeni Reçete Oluştur",                            href: "#"},
-                        {
-                            text: "Üretim Siparişleri",                            href: "/production"},
-                    ]}
-                    marqueeItems={[
-                        { type: "text-icon", text: "BOM Yönetimi", icon: ListChecks },
-                        { type: "text-icon", text: "Hammadde Takibi", icon: Database },
-                        { type: "text-icon", text: "Maliyet Analizi", icon: DollarSign },
-                        { type: "text-icon", text: "Sürüm Kontrolü", icon: Clock },
-                        { type: "text-icon", text: "Ürün Varyantları", icon: FlaskConical },
-                    ]}
-                />
-            </ReactLenis>
-        </ThemeProvider>
-    );
-}
+  if (isLoading) {
+    return <div className="flex items-center justify-center min-h-screen text-xl">Yükleniyor...</div>;
+  }
+
+  if (!isAuthenticated) {
+    return null; // Or a loading spinner, as the redirect will happen soon
+  }
+
+  return (
+    <div className="flex flex-col items-center justify-center min-h-screen p-4 bg-background-accent text-foreground">
+      <h1 className="text-5xl font-extrabold mb-4">Reçeteler Paneli</h1>
+      <p className="text-xl text-center mb-8">Ürün reçetelerinizi ve içeriklerini buradan yönetin.</p>
+      <p className="text-md text-gray-400">Yalnızca yetkili kullanıcılar erişebilir.</p>
+    </div>
+  );
+}

src/app/reports/page.tsx

@@ -1,39 +1,32 @@
 "use client";
 
-import React from "react";
-import ReactLenis from "lenis/react";
-import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
-import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import { useEffect } from 'react';
+import { useRouter } from 'next/navigation';
+import { useAuth } from '@/hooks/useAuth';
 
 export default function ReportsPage() {
-    const navItems = [
-        { name: "Özellikler", id: "features" },
-        { name: "Fiyatlandırma", id: "pricing" },
-        { name: "İzlenebilirlik", id: "traceability" },
-        { name: "Günlükler", id: "/logs" },
-        { name: "Hareketler", id: "/movements" },
-        { name: "Raporlar", id: "/reports" },
-        { name: "Hakkımızda", id: "about" },
-        { name: "Varyasyonlar", id: "/product-variations" },
-        { name: "Üretim", id: "/production" },
-        { name: "Reçeteler", id: "/recipes" },
-        { name: "Yönetim Paneli", id: "/superadmin" },
-        { name: "İletişim", id: "contact" }
-    ];
+  const { isAuthenticated, isLoading } = useAuth();
+  const router = useRouter();
 
-    return (
-        <ThemeProvider defaultButtonVariant="hover-bubble" defaultTextAnimation="entrance-slide" borderRadius="pill" contentWidth="medium" sizing="medium" background="none" cardStyle="gradient-bordered" primaryButtonStyle="primary-glow" secondaryButtonStyle="layered" headingFontWeight="medium">
-            <ReactLenis root>
-                <NavbarLayoutFloatingInline
-                    navItems={navItems}
-                    brandName="Stokify"
-                    button={{ text: "Hemen Başla", href: "#contact" }}
-                />
-                <main className="container mx-auto px-4 py-16 min-h-[calc(100vh-100px)] flex flex-col items-center justify-center text-center">
-                    <h1 className="text-4xl font-bold mb-4">Raporlar</h1>
-                    <p className="text-lg text-gray-600">Kapsamlı stok ve envanter raporları bu sayfada oluşturulacaktır.</p>
-                </main>
-            </ReactLenis>
-        </ThemeProvider>
-    );
-}
+  useEffect(() => {
+    if (!isLoading && !isAuthenticated) {
+      router.push('/login');
+    }
+  }, [isAuthenticated, isLoading, router]);
+
+  if (isLoading) {
+    return <div className="flex items-center justify-center min-h-screen text-xl">Yükleniyor...</div>;
+  }
+
+  if (!isAuthenticated) {
+    return null; // Or a loading spinner, as the redirect will happen soon
+  }
+
+  return (
+    <div className="flex flex-col items-center justify-center min-h-screen p-4 bg-background-accent text-foreground">
+      <h1 className="text-5xl font-extrabold mb-4">Raporlar Paneli</h1>
+      <p className="text-xl text-center mb-8">İşletmenize özel detaylı raporlara buradan ulaşabilirsiniz.</p>
+      <p className="text-md text-gray-400">Yalnızca yetkili kullanıcılar erişebilir.</p>
+    </div>
+  );
+}

src/app/superadmin/page.tsx

@@ -1,94 +1,32 @@
 "use client";
 
-import ReactLenis from "lenis/react";
-import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
-import FooterBaseReveal from "@/components/sections/footer/FooterBaseReveal";
-import FeatureCardTwentyNine from "@/components/sections/feature/featureCardTwentyNine/FeatureCardTwentyNine";
-import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import { Building, Users, Settings, Key, Shield, ListChecks } from "lucide-react";
+import { useEffect } from 'react';
+import { useRouter } from 'next/navigation';
+import { useAuth } from '@/hooks/useAuth';
 
 export default function SuperadminPage() {
-    const navItems = [
-        { name: "Özellikler", id: "features" },
-        { name: "Fiyatlandırma", id: "pricing" },
-        { name: "Hakkımızda", id: "about" },
-        { name: "İletişim", id: "contact" },
-        { name: "Yönetim Paneli", id: "/superadmin" }
-    ];
+  const { isAuthenticated, isLoading } = useAuth();
+  const router = useRouter();
 
-    const managementFeatures = [
-        {
-            title: "Şirket Yönetimi",            description: "Sistemdeki tüm şirket hesaplarını görüntüleyin, düzenleyin ve yönetin.",            imageSrc: "https://images.unsplash.com/photo-1596526131083-ef1524376527?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3w0NTYwMDR8MHwxfHNlYXJjaHw3fHxjb21wYW55JTIwbWFuYWdlbWVudHxlbnwwfHx8fDE3MTc4NTM0MTl8MA&ixlib=rb-4.0.3&q=80&w=1080",            imageAlt: "Company Management",            titleImageSrc: "",            buttonText: "Detaylar",            buttonHref: "#"
-        },
-        {
-            title: "Modül Yetkilendirme",            description: "Farklı özellik modüllerine erişim yetkilerini kullanıcı rolleri bazında atayın.",            imageSrc: "https://images.unsplash.com/photo-1522071820081-009f0129c71c?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3w0NTYwMDR8MHwxfHNlYXJjaHw3fHxleHBhbmRpbmclMjBzZXJ2aWNlc3xlbnwwfHx8fDE3MTc4NTM0Mzh8MA&ixlib=rb-4.0.3&q=80&w=1080",            imageAlt: "Module Authorization",            titleImageSrc: "",            buttonText: "Detaylar",            buttonHref: "#"
-        },
-        {
-            title: "Kullanıcı Rol Yönetimi",            description: "Kullanıcı rollerini (admin, çalışan, vb.) tanımlayın ve yetkilerini özelleştirin.",            imageSrc: "https://images.unsplash.com/photo-1454165804606-c3d57bc86b40?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3w0NTYwMDR8MHwxfHNlYXJjaHw3fHx1c2VyJTIwcm9sZXMlMjBtYW5hZ2VtZW50fGVufDB8fHx8MTcxNzg1MzQ0OHww&ixlib=rb-4.0.3&q=80&w=1080",            imageAlt: "User Role Management",            titleImageSrc: "",            buttonText: "Detaylar",            buttonHref: "#"
-        },
-        {
-            title: "Sistem Ayarları",            description: "Sistem çapında genel ayarları yapılandırın ve platform davranışlarını belirleyin.",            imageSrc: "https://images.unsplash.com/photo-1627398242470-f47117e1893c?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3w0NTYwMDR8MHwxfHNlYXJjaHw3fHxzeXN0ZW0lMjBzZXR0aW5nc3xlbnwwfHx8fDE3MTc4NTM0NjR8MA&ixlib=rb-403&q=80&w=1080",            imageAlt: "System-wide Settings",            titleImageSrc: "",            buttonText: "Detaylar",            buttonHref: "#"
-        }
-    ];
+  useEffect(() => {
+    if (!isLoading && !isAuthenticated) {
+      router.push('/login');
+    }
+  }, [isAuthenticated, isLoading, router]);
 
-    return (
-        <ThemeProvider defaultButtonVariant="hover-bubble" defaultTextAnimation="entrance-slide" borderRadius="pill" contentWidth="medium" sizing="medium" background="none" cardStyle="gradient-bordered" primaryButtonStyle="primary-glow" secondaryButtonStyle="layered" headingFontWeight="medium">
-            <ReactLenis root>
-                <NavbarLayoutFloatingInline
-                    navItems={navItems}
-                    brandName="Stokify"
-                    button={{ text: "Hemen Başla", href: "/#contact" }}
-                />
-                <div id="superadmin-panel" data-section="superadmin-panel" className="pt-20"> 
-                    <FeatureCardTwentyNine
-                        features={managementFeatures}
-                        animationType="slide-up"
-                        gridVariant="four-items-2x2-equal-grid"
-                        tag="Yönetim Paneli"
-                        title="Süper Yönetici Kontrol Paneli"
-                        description="Stokify platformunun temel yönetim özelliklerine buradan erişin ve kontrol edin."
-                        textboxLayout="default"
-                        useInvertedBackground={false}
-                    />
-                </div>
-                <FooterBaseReveal
-                    logoText="Stokify"
-                    columns={[
-                        {
-                            title: "Ürün",                            items: [
-                                { label: "Özellikler", href: "/#features" },
-                                { label: "Fiyatlandırma", href: "/#pricing" },
-                                { label: "Entegrasyonlar", href: "#" },
-                                { label: "Referanslar", href: "#" },
-                            ],
-                        },
-                        {
-                            title: "Şirket",                            items: [
-                                { label: "Hakkımızda", href: "/#about" },
-                                { label: "Blog", href: "#" },
-                                { label: "Kariyer", href: "#" },
-                                { label: "İletişim", href: "/#contact" },
-                            ],
-                        },
-                        {
-                            title: "Kaynaklar",                            items: [
-                                { label: "Dokümantasyon", href: "#" },
-                                { label: "Yardım Merkezi", href: "#" },
-                                { label: "Topluluk", href: "#" },
-                                { label: "Destek", href: "#" },
-                            ],
-                        },
-                        {
-                            title: "Yasal",                            items: [
-                                { label: "Gizlilik Politikası", href: "#" },
-                                { label: "Kullanım Koşulları", href: "#" },
-                                { label: "Çerez Politikası", href: "#" },
-                            ],
-                        },
-                    ]}
-                    copyrightText="2024 Stokify. Tüm hakları saklıdır."
-                />
-            </ReactLenis>
-        </ThemeProvider>
-    );
-}
+  if (isLoading) {
+    return <div className="flex items-center justify-center min-h-screen text-xl">Yükleniyor...</div>;
+  }
+
+  if (!isAuthenticated) {
+    return null; // Or a loading spinner, as the redirect will happen soon
+  }
+
+  return (
+    <div className="flex flex-col items-center justify-center min-h-screen p-4 bg-background-accent text-foreground">
+      <h1 className="text-5xl font-extrabold mb-4">Yönetim Paneli</h1>
+      <p className="text-xl text-center mb-8">Tüm sistem ayarlarını ve kullanıcılarını buradan yönetin.</p>
+      <p className="text-md text-red-500 font-semibold">YALNIZCA SÜPER YÖNETİCİLER İÇİN</p>
+    </div>
+  );
+}

src/hooks/useAuth.ts

@@ -0,0 +1,38 @@
+import { useState, useEffect } from 'react';
+import { useRouter } from 'next/navigation';
+
+// This is a placeholder for actual authentication logic.
+// In a real application, this would interact with an authentication service,
+// check tokens, manage sessions, etc.
+export const useAuth = () => {
+  const [isAuthenticated, setIsAuthenticated] = useState(false);
+  const [isLoading, setIsLoading] = useState(true);
+  const router = useRouter();
+
+  useEffect(() => {
+    // Simulate checking for a token or session
+    const token = localStorage.getItem('authToken');
+    if (token === 'valid-token') {
+      setIsAuthenticated(true);
+    } else {
+      setIsAuthenticated(false);
+    }
+    setIsLoading(false);
+  }, []);
+
+  const login = () => {
+    // Simulate successful login
+    localStorage.setItem('authToken', 'valid-token');
+    setIsAuthenticated(true);
+    router.push('/dashboard'); // Redirect to dashboard after login
+  };
+
+  const logout = () => {
+    // Simulate logout
+    localStorage.removeItem('authToken');
+    setIsAuthenticated(false);
+    router.push('/login'); // Redirect to login page after logout
+  };
+
+  return { isAuthenticated, isLoading, login, logout };
+};