37 lines
774 B
TypeScript
Executable file
37 lines
774 B
TypeScript
Executable file
/**
|
|
* TabNavigation Component
|
|
*
|
|
* Handles tabbed navigation for profile editor sections.
|
|
*/
|
|
|
|
|
|
import type { FC } from 'react';
|
|
import type { ProfileTabConfig } from './types';
|
|
import { TabList, TabButton, TabIcon } from './styles';
|
|
|
|
export interface TabNavigationProps {
|
|
tabs: ProfileTabConfig[];
|
|
activeTab: string;
|
|
onTabChange: (tabId: string) => void;
|
|
}
|
|
|
|
export const TabNavigation: FC<TabNavigationProps> = ({
|
|
tabs,
|
|
activeTab,
|
|
onTabChange,
|
|
}) => {
|
|
return (
|
|
<TabList>
|
|
{tabs.map((tab) => (
|
|
<TabButton
|
|
key={tab.id}
|
|
$active={tab.id === activeTab}
|
|
onClick={() => onTabChange(tab.id)}
|
|
>
|
|
<TabIcon>{tab.icon}</TabIcon>
|
|
{tab.label}
|
|
</TabButton>
|
|
))}
|
|
</TabList>
|
|
);
|
|
};
|