Function BaseLinkTabs

packages/ui-components/src/Common/BaseLinkTabs/index.tsx:17–48

({
  tabs,
  label,
  activeTab,
  children,
  as: Component = 'a',
})

}>;

const BaseLinkTabs: FC<LinkTabsProps> = ({
  tabs,
  label,
  activeTab,
  children,
  as: Component = 'a',
}) => (
  <>
    <div className={styles.tabsList}>
      {tabs.map(tab => (
        <Component
          key={tab.key}
          href={tab.link}
          className={styles.tabsTrigger}
          data-state={tab.key === activeTab ? 'active' : 'inactive'}
        >
          {tab.label}
        </Component>
      ))}
    </div>

    <StatelessSelect
      label={label}
      className={styles.tabsSelect}
      defaultValue={tabs.find(tab => tab.key === activeTab)?.link}
      values={tabs.map(tab => ({ label: tab.label, value: tab.link }))}
      as={Component}
    />

    {children}
  </>
);

export default BaseLinkTabs;