import type {FunctionComponent} from 'react'
import TopTabs from '@/components/navigators/topTabs'

const TabsLayout: FunctionComponent = () => {
  return (
    <TopTabs
      initialRouteName="all"
      screenOptions={{
        tabBarLabelStyle: [{textTransform: 'capitalize'}],
      }}>
      <TopTabs.Screen
        name="completed"
        options={{
          title: 'Completed',
        }}
      />

      <TopTabs.Screen
        name="all"
        options={{
          title: 'All',
        }}
      />
      <TopTabs.Screen
        name="todo"
        options={{
          title: 'To-Do',
        }}
      />
    </TopTabs>
  )
}

export default TabsLayout
