36 lines
1.0 KiB
TypeScript
Executable File
36 lines
1.0 KiB
TypeScript
Executable File
import type { MainTab } from '../../types/navigation';
|
|
import { useSubMenu } from '../../hooks/useSubMenu';
|
|
|
|
interface SubMenuBarProps {
|
|
activeMainTab: MainTab;
|
|
}
|
|
|
|
export function SubMenuBar({ activeMainTab }: SubMenuBarProps) {
|
|
const { activeSubTab, setActiveSubTab, subMenuConfig } = useSubMenu(activeMainTab);
|
|
|
|
// 서브 메뉴가 없는 탭은 표시하지 않음
|
|
if (!subMenuConfig || subMenuConfig.length === 0) {
|
|
return null;
|
|
}
|
|
|
|
return (
|
|
<div className="border-b border-stroke bg-bg-surface shrink-0">
|
|
<div className="flex px-5">
|
|
{subMenuConfig.map((item) => (
|
|
<button
|
|
key={item.id}
|
|
onClick={() => setActiveSubTab(item.id)}
|
|
className={`
|
|
px-4 py-2.5 text-title-5 font-medium transition-all duration-200
|
|
font-korean tracking-navigation
|
|
${activeSubTab === item.id ? 'text-color-accent' : 'text-fg-sub hover:text-fg'}
|
|
`}
|
|
>
|
|
{item.label}
|
|
</button>
|
|
))}
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|