Paths

Table of Contentst

-
native/
-
chat/
-
chat-router.js
-
chat.react.js
-
flow-typed/npm/@react-navigation/
-
npm/
-
@react-navigation/
-
bottom-tabs_v5.x.x.js
-
devtools_v5.x.x.js
-
material-top-tabs_v5.x.x.js
-
native_v5.x.x.js
-
stack_v5.x.x.js
-
navigation/
-
app-navigator.react.js
-
overlay-navigator.react.js
-
overlay-router.js
-
root-navigator.react.js
-
root-router.js
-
profile/
-
profile.react.js

[native] [9/34] ReactNav6: separate StackNavigationProp from StackNavigationHelpers
ClosedPublic
Actions

Authored by ashoat on Oct 20 2022, 6:12 AM.

Details

Reviewers

atul
tomek
bartek

Commits

rCOMMfdbe8fd2d6dd: [native] [9/34] ReactNav6: separate StackNavigationProp from…

Summary

We want to type setParams correctly for both the specific-screen and any-screen-on-a-navigator case. As a result, the type of setParams is incompatible between the two.

Note that I have left off setParams from NavigationHelpers in this diff. That's because I need to make some changes to our codebase before I can do that without leading to Flow errors... otherwise the two setParams will collide. I will reintroduce setParams to NavigationHelpers in a later diff in the stack.

Depends on D5401

Test Plan

Flow + ran the app on my phone and played around with it

Diff Detail

Repository

rCOMM Comm

Lint

No Lint Coverage

Unit

No Test Coverage

Event Timeline

ashoat created this revision.Oct 20 2022, 6:12 AM

Herald added a subscriber: • abosh. · View Herald TranscriptOct 20 2022, 6:12 AM

ashoat added a child revision: D5403: [native] [10/34] ReactNav6: separate TabNavigationProp from TabNavigationHelpers.Oct 20 2022, 6:13 AM

ashoat mentioned this in D5406: [native] [13/34] ReactNav6: add setParams to NavigationHelpers.

Harbormaster completed remote builds in B12889: Diff 17680.Oct 20 2022, 6:34 AM

ashoat requested review of this revision.Oct 20 2022, 6:34 AM

atul accepted this revision.Oct 20 2022, 9:53 AM

This revision is now accepted and ready to land.Oct 20 2022, 9:53 AM

Closed by commit rCOMMfdbe8fd2d6dd: [native] [9/34] ReactNav6: separate StackNavigationProp from… (authored by ashoat). · Explain WhyOct 20 2022, 1:47 PM

This revision was automatically updated to reflect the committed changes.

ashoat added a commit: rCOMMfdbe8fd2d6dd: [native] [9/34] ReactNav6: separate StackNavigationProp from….

ashoat mentioned this in rCOMMb1015ced52d0: [native] [13/34] ReactNav6: add setParams to NavigationHelpers.

Revision Contents
Changeset List

Path

Size

native/

chat/

chat-router.js

8 lines

chat.react.js

21 lines

flow-typed/

npm/

@react-navigation/

bottom-tabs_v5.x.x.js

63 lines

devtools_v5.x.x.js

63 lines

material-top-tabs_v5.x.x.js

63 lines

native_v5.x.x.js

63 lines

stack_v5.x.x.js

65 lines

navigation/

app-navigator.react.js

9 lines

overlay-navigator.react.js

25 lines

overlay-router.js

8 lines

root-navigator.react.js

32 lines

root-router.js

8 lines

profile/

profile.react.js

3 lines

Diff 17680

View Options

native/chat/chat-router.js

	// @flow			// @flow

	import * as React from 'react';			import * as React from 'react';
	import { View } from 'react-native';			import { View } from 'react-native';

	import type { ThreadInfo, SidebarInfo } from 'lib/types/thread-types';			import type {
				ThreadInfo,
				ThreadInfoWithLastUpdatedTimeAndNonLocalMessage,
				} from 'lib/types/thread-types';

	import ExtendedArrow from '../components/arrow-extended.react';			import ExtendedArrow from '../components/arrow-extended.react';
	import Arrow from '../components/arrow.react';			import Arrow from '../components/arrow.react';
	import Button from '../components/button.react';			import Button from '../components/button.react';
	import UnreadDot from '../components/unread-dot.react';			import UnreadDot from '../components/unread-dot.react';
	import { useColors, useStyles } from '../themes/colors';			import { useColors, useStyles } from '../themes/colors';
	import { SidebarItem, sidebarHeight } from './sidebar-item.react';			import { SidebarItem, sidebarHeight } from './sidebar-item.react';
	import SwipeableThread from './swipeable-thread.react';			import SwipeableThread from './swipeable-thread.react';

	type Props = {			type Props = {
	+sidebarInfo: SidebarInfo,			+sidebarInfo: ThreadInfoWithLastUpdatedTimeAndNonLocalMessage,
	+onPressItem: (threadInfo: ThreadInfo) => void,			+onPressItem: (threadInfo: ThreadInfo) => void,
	+onSwipeableWillOpen: (threadInfo: ThreadInfo) => void,			+onSwipeableWillOpen: (threadInfo: ThreadInfo) => void,
	+currentlyOpenedSwipeableId: string,			+currentlyOpenedSwipeableId: string,
	+extendArrow: boolean,			+extendArrow: boolean,
	};			};
	function ChatThreadListSidebar(props: Props): React.Node {			function ChatThreadListSidebar(props: Props): React.Node {
	const colors = useColors();			const colors = useColors();
	const styles = useStyles(unboundStyles);			const styles = useStyles(unboundStyles);
	▲ Show 20 Lines • Show All 92 Lines • Show Last 20 Lines

View Options

native/chat/chat.react.js

	// @flow			// @flow

	import * as React from 'react';			import * as React from 'react';
	import { View } from 'react-native';			import { View } from 'react-native';

	import type { ThreadInfo, SidebarInfo } from 'lib/types/thread-types';			import type {
				ThreadInfo,
				ThreadInfoWithLastUpdatedTimeAndNonLocalMessage,
				} from 'lib/types/thread-types';

	import ExtendedArrow from '../components/arrow-extended.react';			import ExtendedArrow from '../components/arrow-extended.react';
	import Arrow from '../components/arrow.react';			import Arrow from '../components/arrow.react';
	import Button from '../components/button.react';			import Button from '../components/button.react';
	import UnreadDot from '../components/unread-dot.react';			import UnreadDot from '../components/unread-dot.react';
	import { useColors, useStyles } from '../themes/colors';			import { useColors, useStyles } from '../themes/colors';
	import { SidebarItem, sidebarHeight } from './sidebar-item.react';			import { SidebarItem, sidebarHeight } from './sidebar-item.react';
	import SwipeableThread from './swipeable-thread.react';			import SwipeableThread from './swipeable-thread.react';

	type Props = {			type Props = {
	+sidebarInfo: SidebarInfo,			+sidebarInfo: ThreadInfoWithLastUpdatedTimeAndNonLocalMessage,
	+onPressItem: (threadInfo: ThreadInfo) => void,			+onPressItem: (threadInfo: ThreadInfo) => void,
	+onSwipeableWillOpen: (threadInfo: ThreadInfo) => void,			+onSwipeableWillOpen: (threadInfo: ThreadInfo) => void,
	+currentlyOpenedSwipeableId: string,			+currentlyOpenedSwipeableId: string,
	+extendArrow: boolean,			+extendArrow: boolean,
	};			};
	function ChatThreadListSidebar(props: Props): React.Node {			function ChatThreadListSidebar(props: Props): React.Node {
	const colors = useColors();			const colors = useColors();
	const styles = useStyles(unboundStyles);			const styles = useStyles(unboundStyles);
	▲ Show 20 Lines • Show All 92 Lines • Show Last 20 Lines

View Options

native/flow-typed/npm/@react-navigation/bottom-tabs_v5.x.x.js

	// @flow			// @flow

	import * as React from 'react';			import * as React from 'react';
	import { View } from 'react-native';			import { View } from 'react-native';

	import type { ThreadInfo, SidebarInfo } from 'lib/types/thread-types';			import type {
				ThreadInfo,
				ThreadInfoWithLastUpdatedTimeAndNonLocalMessage,
				} from 'lib/types/thread-types';

	import ExtendedArrow from '../components/arrow-extended.react';			import ExtendedArrow from '../components/arrow-extended.react';
	import Arrow from '../components/arrow.react';			import Arrow from '../components/arrow.react';
	import Button from '../components/button.react';			import Button from '../components/button.react';
	import UnreadDot from '../components/unread-dot.react';			import UnreadDot from '../components/unread-dot.react';
	import { useColors, useStyles } from '../themes/colors';			import { useColors, useStyles } from '../themes/colors';
	import { SidebarItem, sidebarHeight } from './sidebar-item.react';			import { SidebarItem, sidebarHeight } from './sidebar-item.react';
	import SwipeableThread from './swipeable-thread.react';			import SwipeableThread from './swipeable-thread.react';

	type Props = {			type Props = {
	+sidebarInfo: SidebarInfo,			+sidebarInfo: ThreadInfoWithLastUpdatedTimeAndNonLocalMessage,
	+onPressItem: (threadInfo: ThreadInfo) => void,			+onPressItem: (threadInfo: ThreadInfo) => void,
	+onSwipeableWillOpen: (threadInfo: ThreadInfo) => void,			+onSwipeableWillOpen: (threadInfo: ThreadInfo) => void,
	+currentlyOpenedSwipeableId: string,			+currentlyOpenedSwipeableId: string,
	+extendArrow: boolean,			+extendArrow: boolean,
	};			};
	function ChatThreadListSidebar(props: Props): React.Node {			function ChatThreadListSidebar(props: Props): React.Node {
	const colors = useColors();			const colors = useColors();
	const styles = useStyles(unboundStyles);			const styles = useStyles(unboundStyles);
	▲ Show 20 Lines • Show All 92 Lines • Show Last 20 Lines

View Options

native/flow-typed/npm/@react-navigation/devtools_v5.x.x.js

	// @flow			// @flow

	import * as React from 'react';			import * as React from 'react';
	import { View } from 'react-native';			import { View } from 'react-native';

	import type { ThreadInfo, SidebarInfo } from 'lib/types/thread-types';			import type {
				ThreadInfo,
				ThreadInfoWithLastUpdatedTimeAndNonLocalMessage,
				} from 'lib/types/thread-types';

	import ExtendedArrow from '../components/arrow-extended.react';			import ExtendedArrow from '../components/arrow-extended.react';
	import Arrow from '../components/arrow.react';			import Arrow from '../components/arrow.react';
	import Button from '../components/button.react';			import Button from '../components/button.react';
	import UnreadDot from '../components/unread-dot.react';			import UnreadDot from '../components/unread-dot.react';
	import { useColors, useStyles } from '../themes/colors';			import { useColors, useStyles } from '../themes/colors';
	import { SidebarItem, sidebarHeight } from './sidebar-item.react';			import { SidebarItem, sidebarHeight } from './sidebar-item.react';
	import SwipeableThread from './swipeable-thread.react';			import SwipeableThread from './swipeable-thread.react';

	type Props = {			type Props = {
	+sidebarInfo: SidebarInfo,			+sidebarInfo: ThreadInfoWithLastUpdatedTimeAndNonLocalMessage,
	+onPressItem: (threadInfo: ThreadInfo) => void,			+onPressItem: (threadInfo: ThreadInfo) => void,
	+onSwipeableWillOpen: (threadInfo: ThreadInfo) => void,			+onSwipeableWillOpen: (threadInfo: ThreadInfo) => void,
	+currentlyOpenedSwipeableId: string,			+currentlyOpenedSwipeableId: string,
	+extendArrow: boolean,			+extendArrow: boolean,
	};			};
	function ChatThreadListSidebar(props: Props): React.Node {			function ChatThreadListSidebar(props: Props): React.Node {
	const colors = useColors();			const colors = useColors();
	const styles = useStyles(unboundStyles);			const styles = useStyles(unboundStyles);
	▲ Show 20 Lines • Show All 92 Lines • Show Last 20 Lines

View Options

native/flow-typed/npm/@react-navigation/material-top-tabs_v5.x.x.js

	// @flow			// @flow

	import * as React from 'react';			import * as React from 'react';
	import { View } from 'react-native';			import { View } from 'react-native';

	import type { ThreadInfo, SidebarInfo } from 'lib/types/thread-types';			import type {
				ThreadInfo,
				ThreadInfoWithLastUpdatedTimeAndNonLocalMessage,
				} from 'lib/types/thread-types';

	import ExtendedArrow from '../components/arrow-extended.react';			import ExtendedArrow from '../components/arrow-extended.react';
	import Arrow from '../components/arrow.react';			import Arrow from '../components/arrow.react';
	import Button from '../components/button.react';			import Button from '../components/button.react';
	import UnreadDot from '../components/unread-dot.react';			import UnreadDot from '../components/unread-dot.react';
	import { useColors, useStyles } from '../themes/colors';			import { useColors, useStyles } from '../themes/colors';
	import { SidebarItem, sidebarHeight } from './sidebar-item.react';			import { SidebarItem, sidebarHeight } from './sidebar-item.react';
	import SwipeableThread from './swipeable-thread.react';			import SwipeableThread from './swipeable-thread.react';

	type Props = {			type Props = {
	+sidebarInfo: SidebarInfo,			+sidebarInfo: ThreadInfoWithLastUpdatedTimeAndNonLocalMessage,
	+onPressItem: (threadInfo: ThreadInfo) => void,			+onPressItem: (threadInfo: ThreadInfo) => void,
	+onSwipeableWillOpen: (threadInfo: ThreadInfo) => void,			+onSwipeableWillOpen: (threadInfo: ThreadInfo) => void,
	+currentlyOpenedSwipeableId: string,			+currentlyOpenedSwipeableId: string,
	+extendArrow: boolean,			+extendArrow: boolean,
	};			};
	function ChatThreadListSidebar(props: Props): React.Node {			function ChatThreadListSidebar(props: Props): React.Node {
	const colors = useColors();			const colors = useColors();
	const styles = useStyles(unboundStyles);			const styles = useStyles(unboundStyles);
	▲ Show 20 Lines • Show All 92 Lines • Show Last 20 Lines

View Options

native/flow-typed/npm/@react-navigation/native_v5.x.x.js

	// @flow			// @flow

	import * as React from 'react';			import * as React from 'react';
	import { View } from 'react-native';			import { View } from 'react-native';

	import type { ThreadInfo, SidebarInfo } from 'lib/types/thread-types';			import type {
				ThreadInfo,
				ThreadInfoWithLastUpdatedTimeAndNonLocalMessage,
				} from 'lib/types/thread-types';

	import ExtendedArrow from '../components/arrow-extended.react';			import ExtendedArrow from '../components/arrow-extended.react';
	import Arrow from '../components/arrow.react';			import Arrow from '../components/arrow.react';
	import Button from '../components/button.react';			import Button from '../components/button.react';
	import UnreadDot from '../components/unread-dot.react';			import UnreadDot from '../components/unread-dot.react';
	import { useColors, useStyles } from '../themes/colors';			import { useColors, useStyles } from '../themes/colors';
	import { SidebarItem, sidebarHeight } from './sidebar-item.react';			import { SidebarItem, sidebarHeight } from './sidebar-item.react';
	import SwipeableThread from './swipeable-thread.react';			import SwipeableThread from './swipeable-thread.react';

	type Props = {			type Props = {
	+sidebarInfo: SidebarInfo,			+sidebarInfo: ThreadInfoWithLastUpdatedTimeAndNonLocalMessage,
	+onPressItem: (threadInfo: ThreadInfo) => void,			+onPressItem: (threadInfo: ThreadInfo) => void,
	+onSwipeableWillOpen: (threadInfo: ThreadInfo) => void,			+onSwipeableWillOpen: (threadInfo: ThreadInfo) => void,
	+currentlyOpenedSwipeableId: string,			+currentlyOpenedSwipeableId: string,
	+extendArrow: boolean,			+extendArrow: boolean,
	};			};
	function ChatThreadListSidebar(props: Props): React.Node {			function ChatThreadListSidebar(props: Props): React.Node {
	const colors = useColors();			const colors = useColors();
	const styles = useStyles(unboundStyles);			const styles = useStyles(unboundStyles);
	▲ Show 20 Lines • Show All 92 Lines • Show Last 20 Lines

View Options

native/flow-typed/npm/@react-navigation/stack_v5.x.x.js

	// @flow			// @flow

	import * as React from 'react';			import * as React from 'react';
	import { View } from 'react-native';			import { View } from 'react-native';

	import type { ThreadInfo, SidebarInfo } from 'lib/types/thread-types';			import type {
				ThreadInfo,
				ThreadInfoWithLastUpdatedTimeAndNonLocalMessage,
				} from 'lib/types/thread-types';

	import ExtendedArrow from '../components/arrow-extended.react';			import ExtendedArrow from '../components/arrow-extended.react';
	import Arrow from '../components/arrow.react';			import Arrow from '../components/arrow.react';
	import Button from '../components/button.react';			import Button from '../components/button.react';
	import UnreadDot from '../components/unread-dot.react';			import UnreadDot from '../components/unread-dot.react';
	import { useColors, useStyles } from '../themes/colors';			import { useColors, useStyles } from '../themes/colors';
	import { SidebarItem, sidebarHeight } from './sidebar-item.react';			import { SidebarItem, sidebarHeight } from './sidebar-item.react';
	import SwipeableThread from './swipeable-thread.react';			import SwipeableThread from './swipeable-thread.react';

	type Props = {			type Props = {
	+sidebarInfo: SidebarInfo,			+sidebarInfo: ThreadInfoWithLastUpdatedTimeAndNonLocalMessage,
	+onPressItem: (threadInfo: ThreadInfo) => void,			+onPressItem: (threadInfo: ThreadInfo) => void,
	+onSwipeableWillOpen: (threadInfo: ThreadInfo) => void,			+onSwipeableWillOpen: (threadInfo: ThreadInfo) => void,
	+currentlyOpenedSwipeableId: string,			+currentlyOpenedSwipeableId: string,
	+extendArrow: boolean,			+extendArrow: boolean,
	};			};
	function ChatThreadListSidebar(props: Props): React.Node {			function ChatThreadListSidebar(props: Props): React.Node {
	const colors = useColors();			const colors = useColors();
	const styles = useStyles(unboundStyles);			const styles = useStyles(unboundStyles);
	▲ Show 20 Lines • Show All 92 Lines • Show Last 20 Lines