From 6cb2ef240bf0bd27abd8eb4590d6fd1db8b60680 Mon Sep 17 00:00:00 2001
From: Jakub Kosmydel <104823336+kosmydel@users.noreply.github.com>
Date: Wed, 15 May 2024 10:07:58 +0200
Subject: [PATCH] feat: promoted actions in ProfilePage

---
 src/components/PromotedActionsBar.tsx | 16 ++++++++--------
 src/pages/ProfilePage.tsx             | 24 ++++++++++++++----------
 2 files changed, 22 insertions(+), 18 deletions(-)

diff --git a/src/components/PromotedActionsBar.tsx b/src/components/PromotedActionsBar.tsx
index 1da6b479882e..d4acfdfcb245 100644
--- a/src/components/PromotedActionsBar.tsx
+++ b/src/components/PromotedActionsBar.tsx
@@ -5,6 +5,7 @@ import useLocalize from '@hooks/useLocalize';
 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';
@@ -20,7 +21,7 @@ type ReportPromotedAction = (report: OnyxReport) => PromotedAction;
 
 type PromotedActionsType = {
     pin: ReportPromotedAction;
-    // message: (accountID: number) => PromotedAction;
+    message: (accountID: number) => PromotedAction;
     // join: ReportPromotedAction;
     // share: ReportPromotedAction;
     // hold: () => PromotedAction;
@@ -31,13 +32,12 @@ const PromotedActions = {
         key: 'pin',
         ...HeaderUtils.getPinMenuItem(report),
     }),
-    // TODO: Uncomment the following lines when the corresponding features are implemented
-    // message: (accountID) => ({
-    //     key: 'message',
-    //     icon: Expensicons.CommentBubbles,
-    //     text: Localize.translateLocal('common.message'),
-    //     onSelected: () => ReportActions.navigateToAndOpenReportWithAccountIDs([accountID]),
-    // }),
+    message: (accountID) => ({
+        key: 'message',
+        icon: Expensicons.CommentBubbles,
+        text: Localize.translateLocal('common.message'),
+        onSelected: () => ReportActions.navigateToAndOpenReportWithAccountIDs([accountID]),
+    }),
     // join: (report) => ({
     //     key: 'join',
     //     icon: Expensicons.CommentBubbles,
diff --git a/src/pages/ProfilePage.tsx b/src/pages/ProfilePage.tsx
index d5e556b25dd0..2c01e7ac9f6f 100755
--- a/src/pages/ProfilePage.tsx
+++ b/src/pages/ProfilePage.tsx
@@ -15,6 +15,7 @@ import MenuItem from '@components/MenuItem';
 import MenuItemWithTopDescription from '@components/MenuItemWithTopDescription';
 import OfflineWithFeedback from '@components/OfflineWithFeedback';
 import PressableWithoutFocus from '@components/Pressable/PressableWithoutFocus';
+import PromotedActionsBar, {PromotedAction, PromotedActions} from '@components/PromotedActionsBar';
 import ScreenWrapper from '@components/ScreenWrapper';
 import ScrollView from '@components/ScrollView';
 import Text from '@components/Text';
@@ -143,6 +144,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 (
         <ScreenWrapper testID={ProfilePage.displayName}>
             <FullPageNotFoundView shouldShow={shouldShowBlockingView || CONST.RESTRICTED_ACCOUNT_IDS.includes(accountID)}>
@@ -178,6 +191,7 @@ function ProfilePage({route}: ProfilePageProps) {
                                         {displayName}
                                     </Text>
                                 )}
+                                <PromotedActionsBar promotedActions={promotedActions} />
                                 {hasStatus && (
                                     <View style={[styles.mb6, styles.detailsPageSectionContainer, styles.mw100]}>
                                         <Text
@@ -228,16 +242,6 @@ function ProfilePage({route}: ProfilePageProps) {
                                     wrapperStyle={[styles.mtn6, styles.mb5]}
                                 />
                             )}
-                            {!isCurrentUser && !SessionActions.isAnonymousUser() && (
-                                <MenuItem
-                                    title={`${translate('common.message')}${displayName}`}
-                                    titleStyle={styles.flex1}
-                                    icon={Expensicons.ChatBubble}
-                                    onPress={() => ReportActions.navigateToAndOpenReportWithAccountIDs([accountID])}
-                                    wrapperStyle={styles.breakAll}
-                                    shouldShowRightIcon
-                                />
-                            )}
                             {!isEmptyObject(report) && report.reportID && !isCurrentUser && (
                                 <MenuItem
                                     title={`${translate('privateNotes.title')}`}