72 lines
2.6 KiB
TypeScript
72 lines
2.6 KiB
TypeScript
"use client";
|
|
|
|
import { useState } from "react";
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
|
|
import MetricCardThree from "@/components/sections/metrics/MetricCardThree";
|
|
import { BarChart3, TrendingUp, Users, DollarSign } from "lucide-react";
|
|
|
|
export default function AdminPage() {
|
|
const [isAuthenticated, setIsAuthenticated] = useState(false);
|
|
const [password, setPassword] = useState("");
|
|
|
|
if (!isAuthenticated) {
|
|
return (
|
|
<div className="flex min-h-screen items-center justify-center bg-gray-50">
|
|
<div className="w-full max-w-sm rounded-xl bg-white p-8 shadow-lg">
|
|
<h2 className="mb-6 text-center text-xl font-semibold">Admin Authentication</h2>
|
|
<input
|
|
type="password"
|
|
className="mb-4 w-full rounded border p-2"
|
|
placeholder="Enter Password"
|
|
value={password}
|
|
onChange={(e) => setPassword(e.target.value)}
|
|
/>
|
|
<button
|
|
className="w-full rounded bg-black py-2 text-white"
|
|
onClick={() => password === "24244" && setIsAuthenticated(true)}
|
|
>
|
|
Login
|
|
</button>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="text-stagger"
|
|
defaultTextAnimation="entrance-slide"
|
|
borderRadius="rounded"
|
|
contentWidth="medium"
|
|
sizing="medium"
|
|
background="circleGradient"
|
|
cardStyle="glass-elevated"
|
|
primaryButtonStyle="gradient"
|
|
secondaryButtonStyle="glass"
|
|
headingFontWeight="normal"
|
|
>
|
|
<NavbarLayoutFloatingOverlay
|
|
navItems={[{ name: "Dashboard", id: "dashboard" }]}
|
|
brandName="Admin Panel"
|
|
/>
|
|
<main className="pt-24">
|
|
<div id="dashboard" className="container mx-auto px-4">
|
|
<MetricCardThree
|
|
title="Performance Dashboard"
|
|
description="Real-time sales and growth analytics."
|
|
animationType="slide-up"
|
|
metrics={[
|
|
{ id: "s1", title: "Total Sales", value: "$45,231", icon: DollarSign },
|
|
{ id: "s2", title: "New Users", value: "1,240", icon: Users },
|
|
{ id: "s3", title: "Growth Rate", value: "12.5%", icon: TrendingUp },
|
|
{ id: "s4", title: "Conversion", value: "3.2%", icon: BarChart3 }
|
|
]}
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
</main>
|
|
</ThemeProvider>
|
|
);
|
|
} |