Page Menu
Home
Phorge
Search
Configure Global Search
Log In
Files
F33037241
D4603.1768410532.diff
No One
Temporary
Actions
View File
Edit File
Delete File
View Transforms
Subscribe
Flag For Later
Award Token
Size
12 KB
Referenced Files
None
Subscribers
None
D4603.1768410532.diff
View Options
diff --git a/native/calendar/calendar.react.js b/native/calendar/calendar.react.js
--- a/native/calendar/calendar.react.js
+++ b/native/calendar/calendar.react.js
@@ -53,7 +53,6 @@
addKeyboardDismissListener,
removeKeyboardListener,
} from '../keyboard/keyboard';
-import type { TabNavigationProp } from '../navigation/app-navigator.react';
import DisconnectedBar from '../navigation/disconnected-bar.react';
import {
createIsForegroundSelector,
@@ -65,6 +64,7 @@
ThreadPickerModalRouteName,
} from '../navigation/route-names';
import type { NavigationRoute } from '../navigation/route-names';
+import type { TabNavigationProp } from '../navigation/tab-navigator.react';
import { useSelector } from '../redux/redux-utils';
import { calendarListData } from '../selectors/calendar-selectors';
import type {
diff --git a/native/calendar/entry.react.js b/native/calendar/entry.react.js
--- a/native/calendar/entry.react.js
+++ b/native/calendar/entry.react.js
@@ -63,13 +63,13 @@
import TextInput from '../components/text-input.react';
import Markdown from '../markdown/markdown.react';
import { inlineMarkdownRules } from '../markdown/rules.react';
-import type { TabNavigationProp } from '../navigation/app-navigator.react';
import {
createIsForegroundSelector,
nonThreadCalendarQuery,
} from '../navigation/nav-selectors';
import { NavContext } from '../navigation/navigation-context';
import { ThreadPickerModalRouteName } from '../navigation/route-names';
+import type { TabNavigationProp } from '../navigation/tab-navigator.react';
import { useSelector } from '../redux/redux-utils';
import { colors, useStyles } from '../themes/colors';
import type { LayoutEvent } from '../types/react-native';
diff --git a/native/chat/chat-list.react.js b/native/chat/chat-list.react.js
--- a/native/chat/chat-list.react.js
+++ b/native/chat/chat-list.react.js
@@ -18,7 +18,7 @@
type KeyboardState,
KeyboardContext,
} from '../keyboard/keyboard-state';
-import type { TabNavigationProp } from '../navigation/app-navigator.react';
+import type { TabNavigationProp } from '../navigation/tab-navigator.react';
import { useSelector } from '../redux/redux-utils';
import type { ChatMessageItemWithHeight } from '../types/chat-types';
import type { ScrollEvent } from '../types/react-native';
diff --git a/native/chat/chat-thread-list.react.js b/native/chat/chat-thread-list.react.js
--- a/native/chat/chat-thread-list.react.js
+++ b/native/chat/chat-thread-list.react.js
@@ -36,13 +36,13 @@
import Button from '../components/button.react';
import Search from '../components/search.react';
-import type { TabNavigationProp } from '../navigation/app-navigator.react';
import {
SidebarListModalRouteName,
HomeChatThreadListRouteName,
BackgroundChatThreadListRouteName,
type NavigationRoute,
} from '../navigation/route-names';
+import type { TabNavigationProp } from '../navigation/tab-navigator.react';
import { useSelector } from '../redux/redux-utils';
import {
type IndicatorStyle,
diff --git a/native/chat/settings/thread-settings.react.js b/native/chat/settings/thread-settings.react.js
--- a/native/chat/settings/thread-settings.react.js
+++ b/native/chat/settings/thread-settings.react.js
@@ -41,7 +41,6 @@
type KeyboardState,
KeyboardContext,
} from '../../keyboard/keyboard-state';
-import type { TabNavigationProp } from '../../navigation/app-navigator.react';
import { defaultStackScreenOptions } from '../../navigation/options';
import {
OverlayContext,
@@ -52,6 +51,7 @@
AddUsersModalRouteName,
ComposeSubchannelModalRouteName,
} from '../../navigation/route-names';
+import type { TabNavigationProp } from '../../navigation/tab-navigator.react';
import { useSelector } from '../../redux/redux-utils';
import type { AppState } from '../../redux/state-types';
import {
diff --git a/native/navigation/app-navigator.react.js b/native/navigation/app-navigator.react.js
--- a/native/navigation/app-navigator.react.js
+++ b/native/navigation/app-navigator.react.js
@@ -1,31 +1,21 @@
// @flow
-import type { BottomTabNavigationProp } from '@react-navigation/bottom-tabs';
-import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
import * as SplashScreen from 'expo-splash-screen';
import * as React from 'react';
import { PersistGate } from 'redux-persist/integration/react';
-import { unreadCount } from 'lib/selectors/thread-selectors';
-
-import AppsDirectory from '../apps/apps-directory.react';
-import Calendar from '../calendar/calendar.react';
-import Chat from '../chat/chat.react';
import { MultimediaMessageTooltipModal } from '../chat/multimedia-message-tooltip-modal.react';
import { RobotextMessageTooltipModal } from '../chat/robotext-message-tooltip-modal.react';
import ThreadSettingsMemberTooltipModal from '../chat/settings/thread-settings-member-tooltip-modal.react';
import { TextMessageTooltipModal } from '../chat/text-message-tooltip-modal.react';
-import SWMansionIcon from '../components/swmansion-icon.react';
import { type SQLiteContextType, SQLiteContext } from '../data/sqlite-context';
import KeyboardStateContainer from '../keyboard/keyboard-state-container.react';
import CameraModal from '../media/camera-modal.react';
import ImageModal from '../media/image-modal.react';
import VideoPlaybackModal from '../media/video-playback-modal.react';
-import Profile from '../profile/profile.react';
import RelationshipListItemTooltipModal from '../profile/relationship-list-item-tooltip-modal.react';
import PushHandler from '../push/push-handler.react';
import { getPersistor } from '../redux/persist';
-import { useSelector } from '../redux/redux-utils';
import { RootContext } from '../root-context';
import { waitForInteractions } from '../utils/timers';
import ActionResultModal from './action-result-modal.react';
@@ -33,9 +23,6 @@
import type { OverlayRouterNavigationProp } from './overlay-router';
import type { RootNavigationProp } from './root-navigator.react';
import {
- CalendarRouteName,
- ChatRouteName,
- ProfileRouteName,
TabNavigatorRouteName,
ImageModalRouteName,
MultimediaMessageTooltipModalRouteName,
@@ -46,105 +33,13 @@
RobotextMessageTooltipModalRouteName,
CameraModalRouteName,
VideoPlaybackModalRouteName,
- AppsRouteName,
type ScreenParamList,
- type TabParamList,
type OverlayParamList,
} from './route-names';
-import { tabBar } from './tab-bar.react';
+import TabNavigator from './tab-navigator.react';
let splashScreenHasHidden = false;
-const calendarTabOptions = {
- tabBarLabel: 'Calendar',
- // eslint-disable-next-line react/display-name
- tabBarIcon: ({ color }) => (
- <SWMansionIcon name="calendar" style={[styles.icon, { color }]} />
- ),
-};
-const getChatTabOptions = (badge: number) => ({
- tabBarLabel: 'Inbox',
- // eslint-disable-next-line react/display-name
- tabBarIcon: ({ color }) => (
- <SWMansionIcon name="message-square" style={[styles.icon, { color }]} />
- ),
- tabBarBadge: badge ? badge : undefined,
-});
-const profileTabOptions = {
- tabBarLabel: 'Profile',
- // eslint-disable-next-line react/display-name
- tabBarIcon: ({ color }) => (
- <SWMansionIcon name="user-circle" style={[styles.icon, { color }]} />
- ),
-};
-const appsTabOptions = {
- tabBarLabel: 'Apps',
- // eslint-disable-next-line react/display-name
- tabBarIcon: ({ color }) => (
- <SWMansionIcon name="globe-1" style={[styles.icon, { color }]} />
- ),
-};
-
-export type TabNavigationProp<
- RouteName: $Keys<TabParamList> = $Keys<TabParamList>,
-> = BottomTabNavigationProp<ScreenParamList, RouteName>;
-
-const Tab = createBottomTabNavigator<
- ScreenParamList,
- TabParamList,
- TabNavigationProp<>,
->();
-const tabBarOptions = {
- keyboardHidesTabBar: false,
- activeTintColor: '#AE94DB',
- style: {
- backgroundColor: '#0A0A0A',
- borderTopWidth: 1,
- },
-};
-function TabNavigator() {
- const chatBadge = useSelector(unreadCount);
- const isCalendarEnabled = useSelector(state => state.enabledApps.calendar);
-
- let calendarTab;
- if (isCalendarEnabled) {
- calendarTab = (
- <Tab.Screen
- name={CalendarRouteName}
- component={Calendar}
- options={calendarTabOptions}
- />
- );
- }
-
- return (
- <Tab.Navigator
- initialRouteName={ChatRouteName}
- lazy={false}
- tabBar={tabBar}
- backBehavior="none"
- tabBarOptions={tabBarOptions}
- >
- {calendarTab}
- <Tab.Screen
- name={ChatRouteName}
- component={Chat}
- options={getChatTabOptions(chatBadge)}
- />
- <Tab.Screen
- name={ProfileRouteName}
- component={Profile}
- options={profileTabOptions}
- />
- <Tab.Screen
- name={AppsRouteName}
- component={AppsDirectory}
- options={appsTabOptions}
- />
- </Tab.Navigator>
- );
-}
-
export type AppNavigationProp<
RouteName: $Keys<OverlayParamList> = $Keys<OverlayParamList>,
> = OverlayRouterNavigationProp<ScreenParamList, RouteName>;
@@ -243,10 +138,4 @@
);
}
-const styles = {
- icon: {
- fontSize: 28,
- },
-};
-
export default AppNavigator;
diff --git a/native/navigation/tab-navigator.react.js b/native/navigation/tab-navigator.react.js
new file mode 100644
--- /dev/null
+++ b/native/navigation/tab-navigator.react.js
@@ -0,0 +1,129 @@
+// @flow
+
+import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
+import type { BottomTabNavigationProp } from '@react-navigation/bottom-tabs';
+import * as React from 'react';
+
+import { unreadCount } from 'lib/selectors/thread-selectors';
+
+import AppsDirectory from '../apps/apps-directory.react';
+import Calendar from '../calendar/calendar.react';
+import Chat from '../chat/chat.react';
+import SWMansionIcon from '../components/swmansion-icon.react';
+import Profile from '../profile/profile.react';
+import { useSelector } from '../redux/redux-utils';
+import type { RootNavigationProp } from './root-navigator.react';
+import {
+ CalendarRouteName,
+ ChatRouteName,
+ ProfileRouteName,
+ AppsRouteName,
+ type ScreenParamList,
+ type TabParamList,
+} from './route-names';
+import { tabBar } from './tab-bar.react';
+
+const calendarTabOptions = {
+ tabBarLabel: 'Calendar',
+ // eslint-disable-next-line react/display-name
+ tabBarIcon: ({ color }) => (
+ <SWMansionIcon name="calendar" style={[styles.icon, { color }]} />
+ ),
+};
+const getChatTabOptions = (badge: number) => ({
+ tabBarLabel: 'Inbox',
+ // eslint-disable-next-line react/display-name
+ tabBarIcon: ({ color }) => (
+ <SWMansionIcon name="message-square" style={[styles.icon, { color }]} />
+ ),
+ tabBarBadge: badge ? badge : undefined,
+});
+const profileTabOptions = {
+ tabBarLabel: 'Profile',
+ // eslint-disable-next-line react/display-name
+ tabBarIcon: ({ color }) => (
+ <SWMansionIcon name="user-circle" style={[styles.icon, { color }]} />
+ ),
+};
+const appsTabOptions = {
+ tabBarLabel: 'Apps',
+ // eslint-disable-next-line react/display-name
+ tabBarIcon: ({ color }) => (
+ <SWMansionIcon name="globe-1" style={[styles.icon, { color }]} />
+ ),
+};
+
+export type TabNavigationProp<
+ RouteName: $Keys<TabParamList> = $Keys<TabParamList>,
+> = BottomTabNavigationProp<ScreenParamList, RouteName>;
+
+type TabNavigationProps = {
+ navigation: RootNavigationProp<'TabNavigator'>,
+ ...
+};
+const Tab = createBottomTabNavigator<
+ ScreenParamList,
+ TabParamList,
+ TabNavigationProp<>,
+>();
+
+const tabBarOptions = {
+ keyboardHidesTabBar: false,
+ activeTintColor: '#AE94DB',
+ style: {
+ backgroundColor: '#0A0A0A',
+ borderTopWidth: 1,
+ },
+};
+
+// eslint-disable-next-line no-unused-vars
+function TabNavigator(props: TabNavigationProps): React.Node {
+ const chatBadge = useSelector(unreadCount);
+ const isCalendarEnabled = useSelector(state => state.enabledApps.calendar);
+
+ let calendarTab;
+ if (isCalendarEnabled) {
+ calendarTab = (
+ <Tab.Screen
+ name={CalendarRouteName}
+ component={Calendar}
+ options={calendarTabOptions}
+ />
+ );
+ }
+
+ return (
+ <Tab.Navigator
+ initialRouteName={ChatRouteName}
+ lazy={false}
+ tabBar={tabBar}
+ backBehavior="none"
+ tabBarOptions={tabBarOptions}
+ >
+ {calendarTab}
+ <Tab.Screen
+ name={ChatRouteName}
+ component={Chat}
+ options={getChatTabOptions(chatBadge)}
+ />
+ <Tab.Screen
+ name={ProfileRouteName}
+ component={Profile}
+ options={profileTabOptions}
+ />
+ <Tab.Screen
+ name={AppsRouteName}
+ component={AppsDirectory}
+ options={appsTabOptions}
+ />
+ </Tab.Navigator>
+ );
+}
+
+const styles = {
+ icon: {
+ fontSize: 28,
+ },
+};
+
+export default TabNavigator;
File Metadata
Details
Attached
Mime Type
text/plain
Expires
Wed, Jan 14, 5:08 PM (1 h, 25 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
5933040
Default Alt Text
D4603.1768410532.diff (12 KB)
Attached To
Mode
D4603: [native] extract tab navigator from app navigator
Attached
Detach File
Event Timeline
Log In to Comment