import { HomeTabBadges } from "./HomeTabBadges";
import { SegmentTabs } from "./SegmentTabs";
import { loadWalkingBadges, loadCurrentDid } from "../data/queries";
import { loadDraftsBadges } from "@/data/drafts/queries";

export async function HomeTabs() {
  const showPublishedTab = false;
  const [walkingBadges, draftBadges] = await Promise.all([
    loadWalkingBadges(),
    loadCurrentDid().then((did) => (did ? loadDraftsBadges() : [])),
  ]);
  return (
    <SegmentTabs
      segments={[
        { segment: "(index)", title: "trails", href: "/" },
        {
          segment: "walking",
          title: "walking",
          children: <HomeTabBadges items={walkingBadges} />,
        },
        {
          segment: "drafts",
          title: "drafts",
          children: <HomeTabBadges items={draftBadges} />,
        },
        ...(showPublishedTab ? [{ segment: "published", title: "published" }] : []),
      ]}
    />
  );
}
