Page MenuHomePhabricator
Files F3499870

D13081.diff
No OneTemporary
Actions

D13081.diff
View Options

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
@@ -6,12 +6,14 @@
import ActionResultModal from './action-result-modal.react.js';
import { CommunityDrawerNavigator } from './community-drawer-navigator.react.js';
+import CommunityDrawerTip from './community-drawer-tip.react.js';
import { createOverlayNavigator } from './overlay-navigator.react.js';
import type {
OverlayNavigationProp,
OverlayNavigationHelpers,
} from './overlay-navigator.react.js';
import type { RootNavigationProp } from './root-navigator.react.js';
+import { CommunityDrawerTipRouteName } from './route-names.js';
import {
UserAvatarCameraModalRouteName,
ThreadAvatarCameraModalRouteName,
@@ -153,6 +155,10 @@
name={VideoPlaybackModalRouteName}
component={VideoPlaybackModal}
/>
+ <App.Screen
+ name={CommunityDrawerTipRouteName}
+ component={CommunityDrawerTip}
+ />
<App.Screen name={TogglePinModalRouteName} component={TogglePinModal} />
</App.Navigator>
{pushHandler}
diff --git a/native/navigation/community-drawer-button-icon.react.js b/native/navigation/community-drawer-button-icon.react.js
new file mode 100644
--- /dev/null
+++ b/native/navigation/community-drawer-button-icon.react.js
@@ -0,0 +1,19 @@
+// @flow
+
+import Icon from '@expo/vector-icons/Feather.js';
+import * as React from 'react';
+
+import { useStyles } from '../themes/colors.js';
+
+// eslint-disable-next-line no-unused-vars
+export default function CommunityDrawerButtonIcon(props: { ... }): React.Node {
+ const styles = useStyles(unboundStyles);
+ return <Icon name="menu" size={26} style={styles.drawerButton} />;
+}
+
+const unboundStyles = {
+ drawerButton: {
+ color: 'listForegroundSecondaryLabel',
+ marginLeft: 16,
+ },
+};
diff --git a/native/navigation/community-drawer-button.react.js b/native/navigation/community-drawer-button.react.js
--- a/native/navigation/community-drawer-button.react.js
+++ b/native/navigation/community-drawer-button.react.js
@@ -1,27 +1,29 @@
// @flow
-import Icon from '@expo/vector-icons/Feather.js';
import invariant from 'invariant';
import * as React from 'react';
import { TouchableOpacity } from 'react-native';
+import type { AppNavigationProp } from './app-navigator.react.js';
+import CommunityDrawerButtonIcon from './community-drawer-button-icon.react.js';
import type { CommunityDrawerNavigationProp } from './community-drawer-navigator.react.js';
+import type { NUXTipRouteNames } from './route-names.js';
import type { TabNavigationProp } from './tab-navigator.react.js';
import {
NUXTipsContext,
nuxTip,
} from '../components/nux-tips-context.react.js';
-import { useStyles } from '../themes/colors.js';
type Props = {
+navigation:
| TabNavigationProp<'Chat'>
| TabNavigationProp<'Profile'>
| TabNavigationProp<'Calendar'>
- | CommunityDrawerNavigationProp<'TabNavigator'>,
+ | CommunityDrawerNavigationProp<'TabNavigator'>
+ | AppNavigationProp<NUXTipRouteNames>,
+ ...
};
function CommunityDrawerButton(props: Props): React.Node {
- const styles = useStyles(unboundStyles);
const { navigation } = props;
const tipsContext = React.useContext(NUXTipsContext);
@@ -36,16 +38,9 @@
return (
<TouchableOpacity onPress={navigation.openDrawer}>
- <Icon name="menu" size={26} style={styles.drawerButton} />
+ <CommunityDrawerButtonIcon />
</TouchableOpacity>
);
}
-const unboundStyles = {
- drawerButton: {
- color: 'listForegroundSecondaryLabel',
- marginLeft: 16,
- },
-};
-
export default CommunityDrawerButton;
diff --git a/native/navigation/community-drawer-tip.react.js b/native/navigation/community-drawer-tip.react.js
new file mode 100644
--- /dev/null
+++ b/native/navigation/community-drawer-tip.react.js
@@ -0,0 +1,20 @@
+// @flow
+
+import * as React from 'react';
+
+import CommunityDrawerButtonIcon from './community-drawer-button-icon.react.js';
+import {
+ type NUXTipsOverlayProps,
+ createNUXTipsOverlay,
+} from '../tooltip/nux-tips-overlay.react.js';
+
+const communityDrawerText =
+ 'You can use this view to explore the tree of channels ' +
+ 'inside a community. This shows you all of the channels you can see, ' +
+ 'including ones you haven’t joined.';
+
+const CommunityDrawerTip: React.ComponentType<
+ NUXTipsOverlayProps<'CommunityDrawerTip'>,
+> = createNUXTipsOverlay(CommunityDrawerButtonIcon, communityDrawerText);
+
+export default CommunityDrawerTip;
diff --git a/native/tooltip/nux-tips-overlay.react.js b/native/tooltip/nux-tips-overlay.react.js
--- a/native/tooltip/nux-tips-overlay.react.js
+++ b/native/tooltip/nux-tips-overlay.react.js
@@ -121,7 +121,7 @@
}
function createNUXTipsOverlay<Route: NUXTipRouteNames>(
- ButtonComponent: React.ComponentType<NUXTipsOverlayProps<Route>>,
+ ButtonComponent: React.ComponentType<void | NUXTipsOverlayProps<Route>>,
tipText: string,
): React.ComponentType<NUXTipsOverlayProps<Route>> {
function NUXTipsOverlay(props: NUXTipsOverlayProps<Route>) {

File Metadata

Mime Type
text/plain
Expires
Sat, Dec 21, 12:19 AM (17 h, 47 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
2684113
Default Alt Text
D13081.diff (5 KB)

Event Timeline