You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

WelcomePageTabs.js 1.7KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263
  1. // @flow
  2. import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
  3. import React, { useCallback } from 'react';
  4. import { useSelector } from 'react-redux';
  5. import { CalendarList, isCalendarEnabled } from '../../calendar-sync';
  6. import { screen } from '../../conference/components/native/routes';
  7. import { RecentList } from '../../recent-list';
  8. import {
  9. calendarListTabBarOptions,
  10. recentListTabBarOptions,
  11. tabBarOptions
  12. } from '../constants';
  13. const WelcomePage = createBottomTabNavigator();
  14. /**
  15. * The type of the React {@code Component} props of {@link WelcomePageTabs}.
  16. */
  17. type Props = {
  18. /**
  19. * Renders the lists disabled.
  20. */
  21. disabled: boolean
  22. };
  23. const WelcomePageTabs = ({ disabled }: Props) => {
  24. const RecentListScreen = useCallback(() =>
  25. <RecentList disabled = { disabled } />
  26. );
  27. const calendarEnabled = useSelector(isCalendarEnabled);
  28. const CalendarListScreen = useCallback(() =>
  29. <CalendarList disabled = { disabled } />
  30. );
  31. return (
  32. <WelcomePage.Navigator
  33. screenOptions = {{
  34. headerShown: false,
  35. ...tabBarOptions
  36. }}>
  37. <WelcomePage.Screen
  38. name = { screen.welcome.tabs.recent }
  39. options = { recentListTabBarOptions }>
  40. { RecentListScreen }
  41. </WelcomePage.Screen>
  42. {
  43. calendarEnabled
  44. && <WelcomePage.Screen
  45. name = { screen.welcome.tabs.calendar }
  46. options = { calendarListTabBarOptions }>
  47. { CalendarListScreen }
  48. </WelcomePage.Screen>
  49. }
  50. </WelcomePage.Navigator>
  51. );
  52. };
  53. export default WelcomePageTabs;