diff --git a/src/components/PromotedActionsBar.tsx b/src/components/PromotedActionsBar.tsx index a5f52d3f7e99..9be236eb0ad7 100644 --- a/src/components/PromotedActionsBar.tsx +++ b/src/components/PromotedActionsBar.tsx @@ -4,15 +4,20 @@ import {View} from 'react-native'; import useTheme from '@hooks/useTheme'; import useThemeStyles from '@hooks/useThemeStyles'; import * as HeaderUtils from '@libs/HeaderUtils'; +import * as Localize from '@libs/Localize'; +import * as ReportActions from '@userActions/Report'; import type OnyxReport from '@src/types/onyx/Report'; import Button from './Button'; import type {ThreeDotsMenuItem} from './HeaderWithBackButton/types'; +import * as Expensicons from './Icon/Expensicons'; type PromotedAction = { key: string; } & ThreeDotsMenuItem; -type PromotedActionsType = Record<'pin' | 'share', (report: OnyxReport) => PromotedAction>; +type PromotedActionsType = Record<'pin' | 'share', (report: OnyxReport) => PromotedAction> & { + message: (accountID: number) => PromotedAction; +}; const PromotedActions = { pin: (report) => ({ @@ -23,6 +28,12 @@ const PromotedActions = { key: 'share', ...HeaderUtils.getShareMenuItem(report), }), + message: (accountID) => ({ + key: 'message', + icon: Expensicons.CommentBubbles, + text: Localize.translateLocal('common.message'), + onSelected: () => ReportActions.navigateToAndOpenReportWithAccountIDs([accountID]), + }), } satisfies PromotedActionsType; type PromotedActionsBarProps = { @@ -41,6 +52,10 @@ function PromotedActionsBar({promotedActions, containerStyle}: PromotedActionsBa return null; } + if (promotedActions.length === 0) { + return null; + } + return ( {promotedActions.map(({key, onSelected, ...props}) => ( diff --git a/src/pages/ProfilePage.tsx b/src/pages/ProfilePage.tsx index 58e8e7e2e45a..6d2e7f526b1e 100755 --- a/src/pages/ProfilePage.tsx +++ b/src/pages/ProfilePage.tsx @@ -15,6 +15,8 @@ import MenuItem from '@components/MenuItem'; import MenuItemWithTopDescription from '@components/MenuItemWithTopDescription'; import OfflineWithFeedback from '@components/OfflineWithFeedback'; import PressableWithoutFocus from '@components/Pressable/PressableWithoutFocus'; +import type {PromotedAction} from '@components/PromotedActionsBar'; +import PromotedActionsBar, {PromotedActions} from '@components/PromotedActionsBar'; import ScreenWrapper from '@components/ScreenWrapper'; import ScrollView from '@components/ScrollView'; import Text from '@components/Text'; @@ -139,6 +141,18 @@ function ProfilePage({route}: ProfilePageProps) { } }, [accountID]); + const promotedActions = useMemo(() => { + const result: PromotedAction[] = []; + if (report) { + result.push(PromotedActions.pin(report)); + } + + if (!isCurrentUser && !SessionActions.isAnonymousUser()) { + result.push(PromotedActions.message(accountID)); + } + return result; + }, [accountID, isCurrentUser, report]); + return ( @@ -148,9 +162,9 @@ function ProfilePage({route}: ProfilePageProps) { /> - + Navigation.navigate(ROUTES.PROFILE_AVATAR.getRoute(String(accountID)))} accessibilityLabel={translate('common.profile')} accessibilityRole={CONST.ACCESSIBILITY_ROLE.IMAGEBUTTON} @@ -158,7 +172,7 @@ function ProfilePage({route}: ProfilePageProps) { > {Boolean(displayName) && ( {displayName} )} + {hasStatus && ( Navigation.navigate(ROUTES.REPORT_SETTINGS_NOTIFICATION_PREFERENCES.getRoute(report.reportID))} - wrapperStyle={[styles.mtn6, styles.mb5]} - /> - )} - {!isCurrentUser && !SessionActions.isAnonymousUser() && ( - ReportActions.navigateToAndOpenReportWithAccountIDs([accountID])} - wrapperStyle={styles.breakAll} - shouldShowRightIcon /> )} {!isEmptyObject(report) && report.reportID && !isCurrentUser && (