KOOHAWN/AI_PDF_TOOLKIt

1import { cn } from '../../lib/utils';2import { APP_NAVIGATION_ITEMS, type AppTab } from '../../app/navigation';3 4type GlobalNavigationProps = {5  activeTab: AppTab;6  onTabChange: (tab: AppTab) => void;7};8 9export function GlobalNavigation({ activeTab, onTabChange }: GlobalNavigationProps) {10  return (11    <nav aria-label="기능 메뉴" className="flex min-w-0 items-center justify-end gap-2 overflow-x-auto">12      {APP_NAVIGATION_ITEMS.map(({ tab, label, icon: NavIcon, beta }) => {13        const active = activeTab === tab;14 15        return (16          <button17            key={tab}18            type="button"19            onClick={() => onTabChange(tab)}20            aria-current={active ? 'page' : undefined}21            aria-label={`${label}${beta ? ' 베타' : ''}`}22            className={cn(23              'group flex h-9 flex-shrink-0 items-center justify-center gap-1.5 rounded-control px-3 text-xs font-bold leading-none transition-colors',24              active25                ? 'bg-selected text-primary'26                : 'text-muted hover:bg-subtle hover:text-primary'27            )}28            title={label}29          >30            <NavIcon className="h-3.5 w-3.5" aria-hidden="true" />31            <span>{label}</span>32            {beta && (33              <span className="rounded-md bg-gif-subtle px-1.5 py-0.5 text-[9px] font-extrabold tracking-wide text-gif">34                BETA35              </span>36            )}37          </button>38        );39      })}40    </nav>41  );42}43