diff --git a/native/components/nux-tips-context.react.js b/native/components/nux-tips-context.react.js --- a/native/components/nux-tips-context.react.js +++ b/native/components/nux-tips-context.react.js @@ -5,6 +5,7 @@ import { values } from 'lib/utils/objects.js'; import type { NUXTipRouteNames } from '../navigation/route-names.js'; +import { MutedTabTipRouteName } from '../navigation/route-names.js'; const nuxTip = Object.freeze({ COMMUNITY_DRAWER: 'community_drawer', @@ -24,7 +25,7 @@ [nuxTip.COMMUNITY_DRAWER]: { nextTip: nuxTip.MUTED, tooltipLocation: 'below', - nextRouteName: undefined, //TODO: update to the next screens name + nextRouteName: MutedTabTipRouteName, }, [nuxTip.MUTED]: { nextTip: undefined, 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 @@ -7,13 +7,17 @@ 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 MutedTabTip from './muted-tab-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 { + CommunityDrawerTipRouteName, + MutedTabTipRouteName, +} from './route-names.js'; import { UserAvatarCameraModalRouteName, ThreadAvatarCameraModalRouteName, @@ -159,6 +163,7 @@ name={CommunityDrawerTipRouteName} component={CommunityDrawerTip} /> + {pushHandler} diff --git a/native/navigation/muted-tab-tip.react.js b/native/navigation/muted-tab-tip.react.js new file mode 100644 --- /dev/null +++ b/native/navigation/muted-tab-tip.react.js @@ -0,0 +1,25 @@ +// @flow + +import * as React from 'react'; + +import ChatTabBarButton from '../chat/chat-tab-bar-button.react.js'; +import { backgroundChatThreadListOptions } from '../chat/chat.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."; + +function WrappedChatTabBarButton(): React.Node { + const { title, tabBarIcon } = backgroundChatThreadListOptions; + return ; +} + +const MutedTabTip: React.ComponentType> = + createNUXTipsOverlay(WrappedChatTabBarButton, communityDrawerText); + +export default MutedTabTip; diff --git a/native/navigation/route-names.js b/native/navigation/route-names.js --- a/native/navigation/route-names.js +++ b/native/navigation/route-names.js @@ -168,6 +168,7 @@ export const ThreadSettingsNotificationsRouteName = 'ThreadSettingsNotifications'; export const CommunityDrawerTipRouteName = 'CommunityDrawerTip'; +export const MutedTabTipRouteName = 'MutedTabTip'; export type RootParamList = { +LoggedOutModal: void, @@ -197,7 +198,9 @@ +RestoreSIWEBackup: RestoreSIWEBackupParams, }; -export type NUXTipRouteNames = typeof CommunityDrawerTipRouteName; +export type NUXTipRouteNames = + | typeof CommunityDrawerTipRouteName + | typeof MutedTabTipRouteName; export type MessageTooltipRouteNames = | typeof RobotextMessageTooltipModalRouteName @@ -227,6 +230,7 @@ +VideoPlaybackModal: VideoPlaybackModalParams, +TogglePinModal: TogglePinModalParams, +CommunityDrawerTip: NUXTipsOverlayParams, + +MutedTabTip: NUXTipsOverlayParams, ...TooltipModalParamList, };