import styles from './PaneTabs.module.css';

export type SideTab = 'files' | 'members';

/** 桌面右栏的「文件 / 成员」切换 */
export function PaneTabs({ tab, memberCount, onTab }: { tab: SideTab; memberCount?: number; onTab: (tab: SideTab) => void }) {
  return <div className={styles.tabs} role="tablist" aria-label="右侧栏">
    <button type="button" role="tab" aria-selected={tab === 'files'} onClick={() => onTab('files')}>文件</button>
    <button type="button" role="tab" aria-selected={tab === 'members'} onClick={() => onTab('members')}>成员{memberCount ? <span>{memberCount}</span> : null}</button>
  </div>;
}