From 0630f5a8a30bd1176c08fa17688394ada40ce39f Mon Sep 17 00:00:00 2001
From: real-zephex <zephex-1@outlook.com>
Date: Mon, 24 Jun 2024 00:53:29 +0530
Subject: =?UTF-8?q?=E2=9C=A8=20style:=20minor=20UI=20enhancements?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/components/header/header.jsx | 46 ++++++++++++++++++++++++++++++++----
 src/app/web-series/[id]/page.jsx     |  2 +-
 2 files changed, 43 insertions(+), 5 deletions(-)

diff --git a/src/app/components/header/header.jsx b/src/app/components/header/header.jsx
index e6efc7d..6bb362a 100644
--- a/src/app/components/header/header.jsx
+++ b/src/app/components/header/header.jsx
@@ -1,3 +1,5 @@
+"use client";
+
 import Link from "next/link";
 import { ThemeSwitcher } from "../themeSwitcher";
 import {
@@ -6,10 +8,17 @@ import {
 	NavbarContent,
 	NavbarItem,
 	Button,
+	Dropdown,
+	DropdownTrigger,
+	DropdownMenu,
+	DropdownSection,
+	DropdownItem,
 } from "@nextui-org/react";
+import { useState } from "react";
 
-export default async function Header() {
-	const sections = ["anime", "kdrama", "manga", "movies", "web-series"];
+export default function Header() {
+	const sections = ["anime", "kdrama", "movies", "web-series", "manga"];
+	const [currentPage, setCurrentPage] = useState("Homepage");
 
 	return (
 		<Navbar isBordered>
@@ -19,10 +28,39 @@ export default async function Header() {
 				</p>
 			</NavbarBrand>
 			<NavbarContent className="hidden sm:flex gap-4" justify="center">
+				<Dropdown>
+					<DropdownTrigger>
+						<Button variant="bordered" size="sm">
+							{currentPage}
+						</Button>
+					</DropdownTrigger>
+					<DropdownMenu aria-label="Static Actions">
+						{sections &&
+							sections.slice(0, 4).map((item, index) => (
+								<DropdownItem
+									as={Link}
+									href={`/${item}`}
+									key={index}
+									onClick={() => setCurrentPage(item)}
+								>
+									{item}
+								</DropdownItem>
+							))}
+					</DropdownMenu>
+				</Dropdown>
 				{sections &&
-					sections.map((item, index) => (
+					sections.slice(-1).map((item, index) => (
 						<NavbarItem key={index}>
-							<Link href={`/${item}`}>{item}</Link>
+							<Button
+								as={Link}
+								href={`/${item}`}
+								size="sm"
+								color="success"
+								variant="faded"
+								onClick={() => setCurrentPage(item)}
+							>
+								{item}
+							</Button>
 						</NavbarItem>
 					))}
 			</NavbarContent>
diff --git a/src/app/web-series/[id]/page.jsx b/src/app/web-series/[id]/page.jsx
index c947f5a..28802b3 100644
--- a/src/app/web-series/[id]/page.jsx
+++ b/src/app/web-series/[id]/page.jsx
@@ -16,7 +16,7 @@ const SeriesInfoPage = async ({ params }) => {
 			<div className="flex items-center">
 				<Image
 					isBlurred
-					shadow="md"
+					shadow="sm"
 					src={`https://sup-proxy.zephex0-f6c.workers.dev/api-content?url=https://image.tmdb.org/t/p/original${data.poster_path}`}
 					width={180}
 					height={300}
-- 
cgit v1.2.3