RH-Lieferscheine/components/BranchButton.js

// components/BranchButton.js
"use client";

import { Button } from "@nextui-org/react";
import { useRouter, usePathname } from "next/navigation";

export default function BranchButton({ branchName }) {
	const router = useRouter();
	const pathname = usePathname();

	const handleNavigation = () => {
		router.push(`/admin-view/${branchName}`);
	};

	// Überprüfe, ob der aktuelle Pfad aktiv ist oder mit dem Branch-Namen beginnt
	const isActive = pathname.startsWith(`/admin-view/${branchName}`);

	return (
		<Button
			variant="flat"
			color="primary"
			onClick={handleNavigation}
			className={`hover:bg-orange-500 hover:text-white ${
				isActive ? "bg-orange-500 text-white" : ""
			}`}
		>
			{branchName}
		</Button>
	);
}