"use client";
import SiteBreadcrumb from "@/components/site-breadcrumb";
import ContentListTable from "./component/table";
import { useState } from "react";

import BannerListTable from "./component/banner-table";

export default function AdminBanner() {
  const [selectedTab, setSelectedTab] = useState("content");

  return (
    <div>
      <SiteBreadcrumb />
      <div className="w-full overflow-x-auto bg-white p-4 rounded-sm space-y-3">
        <div className="flex justify-between">
          {selectedTab === "content"
            ? "Daftar List Media"
            : "Table List Banner"}

          <div className="flex flex-row text-sm">
            <a
              onClick={() => setSelectedTab("content")}
              className={`px-3 py-2 cursor-pointer ${
                selectedTab === "content" ? "bg-primary text-white" : ""
              } `}
            >
              Kontent
            </a>
            <a
              onClick={() => setSelectedTab("banner")}
              className={`px-3 py-2 cursor-pointer ${
                selectedTab === "banner" ? "bg-primary text-white" : ""
              } `}
            >
              Banner
            </a>
          </div>
        </div>

        {selectedTab === "content" ? <ContentListTable /> : <BannerListTable />}
      </div>
    </div>
  );
}
