Skip to content

Commit

Permalink
Merge branch 'feature/admin'
Browse files Browse the repository at this point in the history
  • Loading branch information
@ad956
ad956 committed Jul 27, 2024
2 parents 92f2ebb + 5ddfd84 commit 1389a59
Show file tree
Hide file tree
Showing 22 changed files with 594 additions and 167 deletions.
17 changes: 16 additions & 1 deletion app/(pages)/(auth)/admin-login/page.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -97,6 +97,15 @@ export default function AdminLoginPage() {
}
}

async function handleForgetPassword() {
if (!email) {
toast.error("Please enter a valid email address to continue.", {
position: "bottom-center",
duration: 2000,
});
}
}

if (!isDesktop) {
return (
<div className="min-h-screen flex items-center justify-center bg-gray-100 p-4">
Expand Down Expand Up @@ -146,6 +155,7 @@ export default function AdminLoginPage() {
isInvalid={!!formValidator.getError("email")}
errorMessage={formValidator.getError("email")}
/>
<input name="role" type="hidden" value="admin" />
<Input
name="password"
label="Password"
Expand Down Expand Up @@ -173,7 +183,12 @@ export default function AdminLoginPage() {
isInvalid={!!formValidator.getError("password")}
errorMessage={formValidator.getError("password")}
/>
<Link href="#" size="sm" className="text-sm text-right block">
<Link
href="#"
size="sm"
className="text-sm text-right block"
onClick={handleForgetPassword}
>
Forgot password?
</Link>
{showOtp && <OtpSection userData={userData} />}
Expand Down
207 changes: 207 additions & 0 deletions app/(pages)/admin/add-admin/page.tsx
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,207 @@
"use client";

import React from "react";
import { Input, Button, Card, CardBody, CardHeader } from "@nextui-org/react";
import { motion } from "framer-motion";

export default function AddAdmin() {
const handleSubmit = (e: any) => {
e.preventDefault();
console.log("Form submitted");
};

return (
<div className="min-h-screen bg-gradient-to-br from-blue-50 via-white to-purple-50 flex justify-center px-4 sm:px-6 lg:px-8 relative overflow-hidden">
{/* Subtle animated background shapes */}
<motion.div
className="absolute top-0 left-0 w-64 h-64 bg-blue-100 rounded-full mix-blend-multiply filter blur-xl opacity-70"
animate={{
scale: [1, 1.1, 1],
rotate: [0, 180, 0],
}}
transition={{
duration: 20,
ease: "easeInOut",
times: [0, 0.5, 1],
repeat: Infinity,
repeatType: "reverse",
}}
/>
<motion.div
className="absolute bottom-0 right-0 w-64 h-64 bg-purple-100 rounded-full mix-blend-multiply filter blur-xl opacity-70"
animate={{
scale: [1, 1.2, 1],
rotate: [0, -180, 0],
}}
transition={{
duration: 25,
ease: "easeInOut",
times: [0, 0.5, 1],
repeat: Infinity,
repeatType: "reverse",
}}
/>

<Card className="w-full max-w-4xl shadow-lg mt-8 h-4/5">
<CardHeader className="bg-white border-b border-gray-200 p-6">
<h1 className="text-2xl font-semibold text-gray-800">
Create New Admin
</h1>
</CardHeader>
<CardBody className="p-8 flex flex-col md:flex-row gap-8">
{/* Left side - Form */}
<div className="flex-1">
<form onSubmit={handleSubmit} className="space-y-6">
<div className="space-y-2">
<label className="text-sm font-medium text-gray-700">
Full Name
</label>
<Input
placeholder="John Doe"
variant="bordered"
startContent={
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
strokeWidth={1.5}
stroke="currentColor"
className="w-5 h-5 text-gray-400"
>
<path
strokeLinecap="round"
strokeLinejoin="round"
d="M15.75 6a3.75 3.75 0 11-7.5 0 3.75 3.75 0 017.5 0zM4.501 20.118a7.5 7.5 0 0114.998 0A17.933 17.933 0 0112 21.75c-2.676 0-5.216-.584-7.499-1.632z"
/>
</svg>
}
/>
</div>
<div className="space-y-2">
<label className="text-sm font-medium text-gray-700">
Email Address
</label>
<Input
type="email"
placeholder="[email protected]"
variant="bordered"
startContent={
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
strokeWidth={1.5}
stroke="currentColor"
className="w-5 h-5 text-gray-400"
>
<path
strokeLinecap="round"
strokeLinejoin="round"
d="M21.75 6.75v10.5a2.25 2.25 0 01-2.25 2.25h-15a2.25 2.25 0 01-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0019.5 4.5h-15a2.25 2.25 0 00-2.25 2.25m19.5 0v.243a2.25 2.25 0 01-1.07 1.916l-7.5 4.615a2.25 2.25 0 01-2.36 0L3.32 8.91a2.25 2.25 0 01-1.07-1.916V6.75"
/>
</svg>
}
/>
</div>
<div className="space-y-2">
<label className="text-sm font-medium text-gray-700">
Password
</label>
<Input
type="password"
placeholder="••••••••"
variant="bordered"
startContent={
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
strokeWidth={1.5}
stroke="currentColor"
className="w-5 h-5 text-gray-400"
>
<path
strokeLinecap="round"
strokeLinejoin="round"
d="M16.5 10.5V6.75a4.5 4.5 0 10-9 0v3.75m-.75 11.25h10.5a2.25 2.25 0 002.25-2.25v-6.75a2.25 2.25 0 00-2.25-2.25H6.75a2.25 2.25 0 00-2.25 2.25v6.75a2.25 2.25 0 002.25 2.25z"
/>
</svg>
}
/>
</div>
<div className="space-y-2">
<label className="text-sm font-medium text-gray-700">
Confirm Password
</label>
<Input
type="password"
placeholder="••••••••"
variant="bordered"
startContent={
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
strokeWidth={1.5}
stroke="currentColor"
className="w-5 h-5 text-gray-400"
>
<path
strokeLinecap="round"
strokeLinejoin="round"
d="M16.5 10.5V6.75a4.5 4.5 0 10-9 0v3.75m-.75 11.25h10.5a2.25 2.25 0 002.25-2.25v-6.75a2.25 2.25 0 00-2.25-2.25H6.75a2.25 2.25 0 00-2.25 2.25v6.75a2.25 2.25 0 002.25 2.25z"
/>
</svg>
}
/>
</div>
<Button
type="submit"
className="w-full bg-blue-600 text-white hover:bg-blue-700 transition-colors"
>
Create Admin Account
</Button>
</form>
</div>

{/* Right side - Decorative content */}
<div className="flex-1 flex flex-col justify-center items-center">
<motion.div
className="w-48 h-48 bg-gradient-to-br from-blue-100 to-purple-100 rounded-full flex items-center justify-center"
animate={{
scale: [1, 1.05, 1],
}}
transition={{
duration: 4,
ease: "easeInOut",
times: [0, 0.5, 1],
repeat: Infinity,
}}
>
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
strokeWidth={1.5}
stroke="currentColor"
className="w-24 h-24 text-blue-500"
>
<path
strokeLinecap="round"
strokeLinejoin="round"
d="M15 19.128a9.38 9.38 0 002.625.372 9.337 9.337 0 004.121-.952 4.125 4.125 0 00-7.533-2.493M15 19.128v-.003c0-1.113-.285-2.16-.786-3.07M15 19.128v.106A12.318 12.318 0 018.624 21c-2.331 0-4.512-.645-6.374-1.766l-.001-.109a6.375 6.375 0 0111.964-3.07M12 6.375a3.375 3.375 0 11-6.75 0 3.375 3.375 0 016.75 0zm8.25 2.25a2.625 2.625 0 11-5.25 0 2.625 2.625 0 015.25 0z"
/>
</svg>
</motion.div>
<h2 className="mt-6 text-xl font-semibold text-gray-800">
Welcome to the Admin Team
</h2>
<p className="mt-2 text-gray-600 text-center">
Join us in managing and improving our platform.
</p>
</div>
</CardBody>
</Card>
</div>
);
}
5 changes: 5 additions & 0 deletions app/(pages)/admin/billing/page.tsx
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
import React from "react";

export default function Billing() {
return <div>Overview of financial transactions</div>;
}
133 changes: 69 additions & 64 deletions app/(pages)/admin/components/Header/index.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,77 +1,82 @@
"use client";

import { logoutAction } from "@lib/actions";
import { Divider, User, Button, Image } from "@nextui-org/react";
import Notifications from "@components/Notifications";
import Link from "next/link";
import Notifications from "@components/Notifications";
import { logoutAction } from "@lib/actions";
import { Admin } from "@types";
import { CiLogin } from "react-icons/ci";

const Header = ({ isMenuOpen, setIsMenuOpen }: any) => (
<div className="bg-white p-4 flex flex-row justify-between items-center shadow-sm">
<div className="flex gap-3 items-center">
<div className="flex items-center justify-between bg-warning-100 rounded-full px-4 py-2 shadow-md hover:shadow-lg transition-shadow duration-300">
<div className="flex items-center">
<span
className="text-2xl mr-2 animate-[wave_2.5s_infinite]"
role="img"
aria-label="wave"
>
👋
</span>
<p className="text-lg font-semibold text-gray-800 tracking-wider">
Welcome,{" "}
<span className="ml-1 bg-gradient-to-r from-blue-500 to-purple-600 text-transparent bg-clip-text font-bold">
Anand
</span>
<span className="bg-gradient-to-r from-blue-500 to-purple-600 text-transparent bg-clip-text animate-pulse">
!
interface HeaderProps {
admin: Admin;
}

export default function Header({ admin }: HeaderProps) {
return (
<div className="bg-white p-4 flex flex-row justify-between items-center shadow-sm">
<div className="flex gap-3 items-center">
<div className="flex items-center justify-between bg-warning-100 rounded-full px-4 py-2 shadow-md hover:shadow-lg transition-shadow duration-300">
<div className="flex items-center">
<span
className="text-2xl mr-2 animate-[wave_2.5s_infinite]"
role="img"
aria-label="wave"
>
👋
</span>
</p>
</div>
<div className="ml-4 text-sm text-gray-600 hidden sm:block">
{new Date().toLocaleDateString("en-US", {
weekday: "long",
year: "numeric",
month: "long",
day: "numeric",
})}
<p className="text-lg font-semibold text-gray-800 tracking-wider">
Welcome,{" "}
<span className="ml-1 bg-gradient-to-r from-blue-500 to-purple-600 text-transparent bg-clip-text font-bold">
{admin.firstname}
</span>
<span className="bg-gradient-to-r from-blue-500 to-purple-600 text-transparent bg-clip-text animate-pulse">
!
</span>
</p>
</div>
<div className="ml-4 text-sm text-gray-600 hidden sm:block">
{new Date().toLocaleDateString("en-US", {
weekday: "long",
year: "numeric",
month: "long",
day: "numeric",
})}
</div>
</div>
</div>
</div>

<div className="flex items-center gap-4">
<Notifications userId={"user._id"} />
<Divider orientation="vertical" className="h-8 bg-gray-300" />
<div className="flex items-center gap-4">
<Notifications userId={"user._id"} />
<Divider orientation="vertical" className="h-8 bg-gray-300" />

<User
name="Admin Kumar"
avatarProps={{
src: "https://avatarfiles.alphacoders.com/375/375112.png",
className: "border-2 border-gray-200",
}}
description={
<Link
href={`/admin/settings`}
className="text-xs text-blue-600 hover:underline"
>
@ad956
</Link>
}
/>
<Divider orientation="vertical" className="h-8 bg-gray-300" />
<User
name="Admin Kumar"
avatarProps={{
src: `${admin.profile}`,
className: "border-2 border-gray-200",
}}
description={
<Link
href={`/admin/settings`}
className="text-xs text-blue-600 hover:underline"
>
@{admin.username}
</Link>
}
/>
<Divider orientation="vertical" className="h-8 bg-gray-300" />

<form action={logoutAction}>
<Button
size="sm"
type="submit"
isIconOnly
className="bg-gray-100 hover:bg-gray-200 text-gray-600"
>
<CiLogin size={25} />
</Button>
</form>
<form action={logoutAction}>
<Button
size="sm"
type="submit"
isIconOnly
className="bg-gray-100 hover:bg-gray-200 text-gray-600"
>
<CiLogin size={25} />
</Button>
</form>
</div>
</div>
</div>
);

export default Header;
);
}
Loading

0 comments on commit 1389a59

Please sign in to comment.