Update src/app/admin/page.tsx

Merge version_1 into main

src/app/admin/page.tsx

@@ -0,0 +1,71 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
+import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
+import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
+
+export default function AdminDashboardPage() {
+  return (
+    <ThemeProvider
+        defaultButtonVariant="elastic-effect"
+        defaultTextAnimation="background-highlight"
+        borderRadius="pill"
+        contentWidth="medium"
+        sizing="medium"
+        background="floatingGradient"
+        cardStyle="subtle-shadow"
+        primaryButtonStyle="gradient"
+        secondaryButtonStyle="layered"
+        headingFontWeight="medium"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+            <NavbarLayoutFloatingInline
+              navItems={[
+                { name: "Home", id: "/" },
+                { name: "Dashboard", id: "/admin" },
+              ]}
+              brandName="Super Admin"
+              button={{ text: "Logout", href: "/" }}
+            />
+        </div>
+
+        <main style={{ marginTop: '100px', padding: '0 2rem' }}>
+          <div id="metrics" data-section="metrics">
+              <MetricCardSeven
+                title="Panel Kontrol Super Admin"
+                tag="Sistem Internal"
+                description="Data ringkasan sistem internal untuk pemantauan performa real-time."
+                metrics={[
+                    { id: "u1", value: "1,240", title: "Total User Terdaftar", items: [] },
+                    { id: "u2", value: "58", title: "Laporan Pending", items: [] },
+                    { id: "u3", value: "99.9%", title: "Status Kesehatan Server", items: [] },
+                ]}
+                animationType="slide-up"
+                textboxLayout="default"
+                useInvertedBackground={false}
+              />
+          </div>
+          <div style={{ padding: '4rem 0' }}>
+            <h2>Manajemen Data</h2>
+            <div style={{ background: 'white', padding: '2rem', borderRadius: '1rem', marginTop: '2rem', border: '1px solid #eaeaea' }}>
+                <p>Tabel Data Pengguna, Unit, dan Log Audit akan ditampilkan di sini.</p>
+            </div>
+          </div>
+        </main>
+
+        <div id="footer" data-section="footer">
+            <FooterBaseCard
+              logoText="KSDAE"
+              columns={[
+                { title: "Admin", items: [{ label: "Pengaturan", href: "#" }, { label: "Audit Log", href: "#" }] },
+              ]}
+              copyrightText="© 2025 Kementrian Kehutanan"
+            />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}

src/app/balai-dashboard/page.tsx

@@ -0,0 +1,68 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
+import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
+import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
+
+export default function BalaiDashboardPage() {
+  return (
+    <ThemeProvider
+        defaultButtonVariant="elastic-effect"
+        defaultTextAnimation="background-highlight"
+        borderRadius="pill"
+        contentWidth="medium"
+        sizing="medium"
+        background="floatingGradient"
+        cardStyle="subtle-shadow"
+        primaryButtonStyle="gradient"
+        secondaryButtonStyle="layered"
+        headingFontWeight="medium"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+          <NavbarLayoutFloatingInline
+            navItems={[
+              { name: "Home", id: "/" },
+              { name: "Dashboard", id: "/#metrics" },
+              { name: "Balai Unit", id: "/balai-dashboard" },
+              { name: "Units", id: "/#features" },
+              { name: "Contact", id: "/#contact" },
+            ]}
+            brandName="Portal KSDAE"
+            button={{ text: "Kembali ke Home", href: "/" }}
+          />
+        </div>
+
+        <div id="balai-metrics" data-section="balai-metrics" className="pt-32 pb-16">
+          <MetricCardTwo
+            title="Dashboard Balai Unit"
+            description="Manajemen operasional dan data khusus unit regional."
+            gridVariant="bento-grid"
+            animationType="slide-up"
+            textboxLayout="default"
+            useInvertedBackground={false}
+            metrics={[
+              { id: "1", value: "85%", description: "Target Penyerapan Anggaran" },
+              { id: "2", value: "12", description: "Laporan Pending" },
+              { id: "3", value: "48", description: "Total Aset Terdata" },
+              { id: "4", value: "105", description: "Kegiatan Lapangan" },
+            ]}
+          />
+        </div>
+
+        <div id="footer" data-section="footer">
+          <FooterBaseCard
+            logoText="KSDAE"
+            columns={[
+              { title: "Portal", items: [{ label: "Dashboard", href: "/" }, { label: "Laporan", href: "#" }] },
+              { title: "Layanan", items: [{ label: "Helpdesk", href: "#" }, { label: "Dokumentasi", href: "#" }] },
+            ]}
+            copyrightText="© 2025 Kementrian Kehutanan"
+          />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}

src/app/page.tsx

@@ -6,11 +6,12 @@ import ContactCTA from '@/components/sections/contact/ContactCTA';
 import FaqDouble from '@/components/sections/faq/FaqDouble';
 import FeatureCardTwentyThree from '@/components/sections/feature/FeatureCardTwentyThree';
 import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
-import HeroCentered from '@/components/sections/hero/HeroCentered';
+import HeroBillboardDashboard from '@/components/sections/hero/HeroBillboardDashboard';
 import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
 import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
 import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
 import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
+import { LayoutDashboard, Users, FileText, Settings, Search } from 'lucide-react';
 
 export default function LandingPage() {
   return (
@@ -41,30 +42,31 @@ export default function LandingPage() {
   </div>
 
   <div id="hero" data-section="hero">
-      <HeroCentered
+      <HeroBillboardDashboard
-      background={{
+      title="Dashboard Manajemen Taman Nasional"
-        variant: "sparkles-gradient"}}
+      description="Kelola data kunjungan, status pelestarian, dan operasional taman nasional secara terpusat."
-      title="Portal Integrasi Konservasi KSDAE"
+      background={{ variant: "sparkles-gradient" }}
-      description="Platform terpusat untuk monitoring, pelaporan, dan pengelolaan data kehutanan bagi Super Admin, Balai Unit, dan Taman Nasional Indonesia."
+      dashboard={{
-      avatars={[
+        title: "TN Komodo Management",        stats: [
-        { src: "http://img.b2bpic.net/free-photo/mesmerizing-scenery-beautiful-bright-dense-forest_181624-24219.jpg", alt: "User Group" },
+          { title: "Total Pengunjung", values: [12450, 2300, 500], description: "Peningkatan 12% bulan ini" },
-        { src: "http://img.b2bpic.net/free-photo/3d-fantasy-scene_23-2151127967.jpg", alt: "User Group" },
+          { title: "Area Konservasi", values: [603, 100, 20], description: "Status Terjaga" },
-        { src: "http://img.b2bpic.net/free-photo/high-angle-shot-muddy-river-green-mountains-bright-sunny-day_181624-5255.jpg", alt: "User Group" },
+          { title: "Pelaporan", values: [88, 12, 5], description: "Data Harian Valid" }
-        { src: "http://img.b2bpic.net/free-photo/aerial-view-vibrant-green-trees-forest_181624-49828.jpg", alt: "Aerial view of the vibrant green trees in the forest" },
+        ],
-        { src: "http://img.b2bpic.net/free-photo/minimalist-landscape-from_23-2151600036.jpg", alt: "Minimalist landscape from above" },
+        logoIcon: LayoutDashboard,
-      ]}
+        sidebarItems: [
-      avatarText="Dipercaya oleh seluruh unit KSDAE"
+            { icon: LayoutDashboard, active: true },
-      buttons={[
+            { icon: Users },
-        { text: "Masuk ke Dashboard", href: "#" },
+            { icon: FileText },
-        { text: "Pelajari Sistem", href: "#metrics" },
+            { icon: Settings }
-      ]}
+        ],
-      marqueeItems={[
+        searchPlaceholder: "Cari data taman nasional...",        buttons: [{ text: "Export Data", onClick: () => console.log("Export") }],
-        { type: "text", text: "Monitoring Real-time" },
+        listItems: [
-        { type: "text", text: "Data Terintegrasi" },
+            { icon: FileText, title: "Laporan Harian TNK", status: "Selesai" },
-        { type: "text", text: "Sistem Pelaporan" },
+            { icon: Users, title: "Update Data Pengunjung", status: "Pending" },
-        { type: "text", text: "Keamanan Data" },
+            { icon: Settings, title: "Perawatan Fasilitas", status: "Dalam Proses" }
-        { type: "text", text: "Transparansi Publik" },
+        ],
-      ]}
+        imageSrc: "https://img.b2bpic.net/free-photo/aerial-view-vibrant-green-trees-forest_181624-49828.jpg",        imageAlt: "Dashboard Preview"
+      }}
     />
   </div>
 
@@ -137,7 +139,7 @@ export default function LandingPage() {
       textboxLayout="default"
       useInvertedBackground={true}
       names={[
-        "Balai TN Komodo",        "TN Lorentz",        "TN Gunung Leuser",        "TN Bunaken",        "Balai KSDA Aceh",        "Balai KSDA Jateng",        "TN Bukit Barisan"]}
+        "Balai TN Komodo", "TN Lorentz", "TN Gunung Leuser", "TN Bunaken", "Balai KSDA Aceh", "Balai KSDA Jateng", "TN Bukit Barisan"]}
       title="Unit Terhubung"
       description="Beberapa unit yang telah menggunakan sistem."
     />
@@ -167,4 +169,4 @@ export default function LandingPage() {
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}