import { FontAwesome, FontAwesome5 } from '@expo/vector-icons';
import { useNavigation } from '@react-navigation/native';
import React from 'react';
import { View } from 'react-native';

import MenuList from '../../components/List/MenuList';
import { NavProps } from '../../components/Routes/Routes';

const Search = () => {
  const navigation = useNavigation<NavProps>();
  return (
    <View className="m-4 flex-1 justify-start bg-primary-bg">
      <MenuList
        classNames="mb-4"
        items={[
          {
            title: 'Osoby',
            icon: <FontAwesome5 name="users" size={24} />,
            onPress: () => navigation.navigate('SearchPerson'),
          },
        ]}
      />

      <MenuList
        classNames="mb-4"
        items={[
          {
            title: 'Jednotky',
            icon: <FontAwesome name="file-text" size={24} />,
            onPress: () => navigation.navigate('SearchUnit'),
          },
        ]}
      />

      <MenuList
        items={[
          {
            title: 'Vzdělávací akce',
            icon: <FontAwesome5 name="route" size={24} />,
            onPress: () => navigation.navigate('SearchEducation'),
          },
        ]}
      />
    </View>
  );
};

export default Search;
