"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import FooterSimple from '@/components/sections/footer/FooterSimple';
import { useState } from "react";

export default function AdminDashboard() {
  const [isAuthenticated, setIsAuthenticated] = useState(false);

  if (!isAuthenticated) {
    return (
      <ThemeProvider
        defaultButtonVariant="shift-hover"
        defaultTextAnimation="background-highlight"
        borderRadius="soft"
        contentWidth="medium"
        sizing="largeSmallSizeLargeTitles"
        background="circleGradient"
        cardStyle="layered-gradient"
        primaryButtonStyle="double-inset"
        secondaryButtonStyle="glass"
        headingFontWeight="bold"
      >
        <div className="min-h-screen flex items-center justify-center p-6">
          <div className="max-w-md w-full p-8 border rounded-lg">
            <h1 className="text-2xl font-bold mb-6">Admin Login</h1>
            <button 
              onClick={() => setIsAuthenticated(true)}
              className="w-full py-3 bg-primary text-white rounded"
            >
              Login as Administrator
            </button>
          </div>
        </div>
      </ThemeProvider>
    );
  }

  return (
    <ThemeProvider
        defaultButtonVariant="shift-hover"
        defaultTextAnimation="background-highlight"
        borderRadius="soft"
        contentWidth="medium"
        sizing="largeSmallSizeLargeTitles"
        background="circleGradient"
        cardStyle="layered-gradient"
        primaryButtonStyle="double-inset"
        secondaryButtonStyle="glass"
        headingFontWeight="bold"
    >
      <ReactLenis root>
        <NavbarStyleCentered
          navItems={[{ name: "Home", id: "/" }, { name: "Logout", id: "#" }]}
          brandName="StudyFlow Admin"
        />
        <main className="container mx-auto p-8 pt-32">
          <h1 className="text-4xl font-bold mb-8">User Management</h1>
          <div className="grid gap-6">
            <div className="p-6 border rounded-lg">
              <h2 className="text-xl font-semibold mb-4">System Overview</h2>
              <p>Active Users: 12,450</p>
              <p>Total Revenue: $142,000</p>
            </div>
            <div className="p-6 border rounded-lg">
              <h2 className="text-xl font-semibold mb-4">Recent User Actions</h2>
              <ul className="space-y-2">
                <li>User #4521 - Upgraded to Plus</li>
                <li>User #9822 - Password Change</li>
                <li>User #1102 - Registered</li>
              </ul>
            </div>
          </div>
        </main>
        <FooterSimple 
          columns={[]} 
          bottomLeftText="© 2025 StudyFlow"
          bottomRightText="© 2025 Osama ElBetnigy. All rights reserved."
        />
      </ReactLenis>
    </ThemeProvider>
  );
}