openreplay/frontend/app/components/Session/Player/SharedComponents/Tab.tsx
2024-03-27 14:59:23 +01:00

31 lines
837 B
TypeScript

import React from 'react';
import cn from 'classnames';
interface Props {
i: number;
tab: string;
currentTab: string;
changeTab?: (tab: string) => void;
isLive?: boolean;
}
function Tab({ i, tab, currentTab, changeTab, isLive }: Props) {
return (
<div
key={tab}
style={{ marginBottom: '-2px' }}
onClick={() => changeTab?.(tab)}
className={cn(
'self-end py-1 px-4 text-sm',
changeTab && !isLive ? 'cursor-pointer' : 'cursor-default',
currentTab === tab
? 'border-gray-lighter border-t border-l border-r !border-b-white bg-white rounded-tl rounded-tr font-semibold'
: 'cursor-pointer border-gray-lighter !border-b !border-t-transparent !border-l-transparent !border-r-transparent'
)}
>
Tab {i + 1}
</div>
);
}
export default Tab;