Drawer component for Home Navigator (Binding React Navigation 5 to Eva Design System)

drawer-home.component.tsx

import React from 'react';
import { Drawer, DrawerElement, MenuItemType } from 'react-native-ui-kitten';
import { InfoIcon, LogoutIcon } from '@app-assets/icons';
import { AppRoute } from '@app-navigation/app-routes';
import { SafeAreaLayout, SaveAreaInset} from '@app-components/safe-area-layout.component';

const drawerData: MenuItemType[] = [
  { icon: InfoIcon, title: 'About' },
  { icon: LogoutIcon, title: 'Log Out' },
];

export const DrawerHomeScreen = (props): DrawerElement => {

  const onMenuItemSelect = (index: number): void => {
    const { [index]: selectedItem } = drawerData;

    switch (selectedItem.title) {
      case 'Log Out':
        props.navigation.navigate(AppRoute.AUTH);
        break;
      default:
        props.navigation.navigate(selectedItem.title);
        break;
    }

    props.navigation.closeDrawer();
  };

  return (
    <SafeAreaLayout insets={SaveAreaInset.TOP}>
      <Drawer data={drawerData} onSelect={onMenuItemSelect} />
    </SafeAreaLayout>
  );
};