front-hub/src/components/Tabs.tsx

import { Tabs as MuiTabs } from "@mui/material"
import { CustomTab } from "@root/components/CustomTab"

type TabsProps = {
  items: string[];
  selectedItem: number;
  setSelectedItem: (num: number) => void;
};

export const Tabs = ({ items, selectedItem, setSelectedItem }: TabsProps) => (
	<MuiTabs
		TabIndicatorProps={{ sx: { display: "none" } }}
		value={selectedItem}
		onChange={(event, newValue: number) => setSelectedItem(newValue)}
		variant="scrollable"
		scrollButtons={false}
	>
		{items.map((item, index) => (
			<CustomTab key={item + index} value={index} label={item} />
		))}
	</MuiTabs>
)