Tabs

() => {
  const DEFAULT_TAB = '1'
  const [activeTab, setActiveTab] = useState(DEFAULT_TAB)
  const onClick = (event, key) => setActiveTab(key)
  const List = ({ onClick }) => (
    <WrapperHorizontal>
      {[0, 1, 2].map(key => (
        <Text element="strong" key={key} onClick={e => onClick(e, `${key}`)}>
          {`Tab ${key}`}
        </Text>
      ))}
    </WrapperHorizontal>
  )
  return (
    <Tabs activeKey={activeTab} onClick={onClick} List={List}>
      <Title level={5} key="0">{`Tab content 0️⃣`}</Title>
      <Title level={5} key="1">{`Tab content 1️⃣`}</Title>
      <Title level={5} key="2">{`Tab content 2️⃣`}</Title>
    </Tabs>
  )
}