"use client";

import { useSearchParams } from "next/navigation";
import { getRegionLabel } from "@/lib/regions";

export function AdminSidebarBrand({ scopes }: { scopes: string[] }) {
  const searchParams = useSearchParams();
  const selectedScopeRaw = (searchParams.get("scope") ?? "").trim().toUpperCase();
  const activeScope = scopes.includes(selectedScopeRaw) ? selectedScopeRaw : "";

  const heading = activeScope ? `${activeScope} VAE Dashboard` : "ALL VAE Dashboards";
  const hideSubHeading = activeScope === "OPEL";
  const subHeading = activeScope ? getRegionLabel(activeScope) : "Global Otsuka VEEVA Performance";

  return (
    <>
      <h1 className="mt-3 text-5xl font-black leading-[0.95] tracking-tight text-white">
        {heading}
      </h1>
      {hideSubHeading ? null : (
        <p className="mt-2 text-sm font-semibold uppercase tracking-[0.14em] text-[#F7993A]">
          {subHeading}
        </p>
      )}
    </>
  );
}
