From cf2f55b4ae5ac9821450adaca3e3c36c465b21e7 Mon Sep 17 00:00:00 2001
From: Taras Perun <terry.perun@gmail.com>
Date: Wed, 9 Aug 2023 18:36:50 +0200
Subject: [PATCH 1/6] fix saving empty status

---
 src/pages/settings/Profile/CustomStatus/StatusPage.js | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/pages/settings/Profile/CustomStatus/StatusPage.js b/src/pages/settings/Profile/CustomStatus/StatusPage.js
index 9767825820cd..c6f41467413c 100644
--- a/src/pages/settings/Profile/CustomStatus/StatusPage.js
+++ b/src/pages/settings/Profile/CustomStatus/StatusPage.js
@@ -33,8 +33,8 @@ function StatusPage({draftStatus, currentUserPersonalDetails}) {
     const draftText = lodashGet(draftStatus, 'text');
 
     const defaultEmoji = draftEmojiCode || currentUserEmojiCode;
-    const defaultText = draftText || currentUserStatusText;
-    const customStatus = defaultEmoji ? `${defaultEmoji} ${defaultText}` : '';
+    const defaultText = draftEmojiCode ? draftText : currentUserStatusText;
+    const customStatus = draftEmojiCode ? `${draftEmojiCode} ${draftText}` : `${currentUserEmojiCode || ''} ${currentUserStatusText || ''}` ;
     const hasDraftStatus = !!draftEmojiCode || !!draftText;
 
     const updateStatus = useCallback(() => {
@@ -42,7 +42,7 @@ function StatusPage({draftStatus, currentUserPersonalDetails}) {
         User.updateCustomStatus({text: defaultText, emojiCode: defaultEmoji, clearAfter: endOfDay.toISOString()});
 
         User.clearDraftCustomStatus();
-        Navigation.goBack(ROUTES.SETTINGS);
+        Navigation.goBack(ROUTES.SETTINGS_PROFILE);
     }, [defaultText, defaultEmoji]);
 
     const clearStatus = () => {

From fe48a9b92ad3e351b9d811c28ddb81df0a5c4fd7 Mon Sep 17 00:00:00 2001
From: Taras Perun <terry.perun@gmail.com>
Date: Wed, 9 Aug 2023 18:38:21 +0200
Subject: [PATCH 2/6] add status line

---
 src/pages/ProfilePage.js | 17 +++++++++++++++++
 1 file changed, 17 insertions(+)

diff --git a/src/pages/ProfilePage.js b/src/pages/ProfilePage.js
index 6500eef0548f..16e9fd996da1 100755
--- a/src/pages/ProfilePage.js
+++ b/src/pages/ProfilePage.js
@@ -133,6 +133,11 @@ function ProfilePage(props) {
     // If the API returns an error for some reason there won't be any details and isLoading will get set to false, so we want to show a blocking screen
     const shouldShowBlockingView = !hasMinimumDetails && !isLoading;
 
+    const statusEmojiCode = lodashGet(details, 'status.emojiCode', '');
+    const statusText = lodashGet(details, 'status.text', '');
+    const hasStatus = !!statusEmojiCode;
+    const statusContent = `${statusEmojiCode}  ${statusText}`;
+
     return (
         <ScreenWrapper>
             <HeaderWithBackButton
@@ -178,6 +183,18 @@ function ProfilePage(props) {
                                     {displayName}
                                 </Text>
                             )}
+                            {hasStatus ? (
+                                <View style={[styles.mb6, styles.detailsPageSectionContainer, styles.w100]}>
+                                    <Text
+                                        style={[styles.textLabelSupporting, styles.mb1]}
+                                        numberOfLines={1}
+                                    >
+                                        {props.translate('statusPage.status')}
+                                    </Text>
+                                    <Text numberOfLines={1}>{statusContent}</Text>
+                                </View>
+                            ) : null}
+
                             {login ? (
                                 <View style={[styles.mb6, styles.detailsPageSectionContainer, styles.w100]}>
                                     <Text

From 5eb0e866254f6d1786d8ffae211b1045d628db85 Mon Sep 17 00:00:00 2001
From: Taras Perun <terry.perun@gmail.com>
Date: Wed, 9 Aug 2023 18:38:57 +0200
Subject: [PATCH 3/6] add tooltip for status

---
 src/pages/ProfilePage.js | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/src/pages/ProfilePage.js b/src/pages/ProfilePage.js
index 16e9fd996da1..f73b7d537f0b 100755
--- a/src/pages/ProfilePage.js
+++ b/src/pages/ProfilePage.js
@@ -36,6 +36,7 @@ import * as Illustrations from '../components/Icon/Illustrations';
 import variables from '../styles/variables';
 import ROUTES from '../ROUTES';
 import * as ValidationUtils from '../libs/ValidationUtils';
+import Tooltip from '../components/Tooltip';
 
 const matchType = PropTypes.shape({
     params: PropTypes.shape({
@@ -191,7 +192,9 @@ function ProfilePage(props) {
                                     >
                                         {props.translate('statusPage.status')}
                                     </Text>
-                                    <Text numberOfLines={1}>{statusContent}</Text>
+                                    <Tooltip text={statusContent}>
+                                      <Text numberOfLines={1}>{statusContent}</Text>
+                                    </Tooltip>
                                 </View>
                             ) : null}
 

From 72c1ef0ddc820ba7a6098e81eea56c527880863a Mon Sep 17 00:00:00 2001
From: Taras Perun <terry.perun@gmail.com>
Date: Wed, 9 Aug 2023 18:56:42 +0200
Subject: [PATCH 4/6] center the position of the tooltip

---
 src/pages/ProfilePage.js                              | 4 ++--
 src/pages/settings/Profile/CustomStatus/StatusPage.js | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/pages/ProfilePage.js b/src/pages/ProfilePage.js
index f73b7d537f0b..325067bdfee4 100755
--- a/src/pages/ProfilePage.js
+++ b/src/pages/ProfilePage.js
@@ -185,7 +185,7 @@ function ProfilePage(props) {
                                 </Text>
                             )}
                             {hasStatus ? (
-                                <View style={[styles.mb6, styles.detailsPageSectionContainer, styles.w100]}>
+                                <View style={[styles.mb6, styles.detailsPageSectionContainer, styles.mw100]}>
                                     <Text
                                         style={[styles.textLabelSupporting, styles.mb1]}
                                         numberOfLines={1}
@@ -193,7 +193,7 @@ function ProfilePage(props) {
                                         {props.translate('statusPage.status')}
                                     </Text>
                                     <Tooltip text={statusContent}>
-                                      <Text numberOfLines={1}>{statusContent}</Text>
+                                        <Text numberOfLines={1}>{statusContent}</Text>
                                     </Tooltip>
                                 </View>
                             ) : null}
diff --git a/src/pages/settings/Profile/CustomStatus/StatusPage.js b/src/pages/settings/Profile/CustomStatus/StatusPage.js
index c6f41467413c..afaba4bff07b 100644
--- a/src/pages/settings/Profile/CustomStatus/StatusPage.js
+++ b/src/pages/settings/Profile/CustomStatus/StatusPage.js
@@ -34,7 +34,7 @@ function StatusPage({draftStatus, currentUserPersonalDetails}) {
 
     const defaultEmoji = draftEmojiCode || currentUserEmojiCode;
     const defaultText = draftEmojiCode ? draftText : currentUserStatusText;
-    const customStatus = draftEmojiCode ? `${draftEmojiCode} ${draftText}` : `${currentUserEmojiCode || ''} ${currentUserStatusText || ''}` ;
+    const customStatus = draftEmojiCode ? `${draftEmojiCode} ${draftText}` : `${currentUserEmojiCode || ''} ${currentUserStatusText || ''}`;
     const hasDraftStatus = !!draftEmojiCode || !!draftText;
 
     const updateStatus = useCallback(() => {

From a722da7c8426b35755ba17caa759278fe177944d Mon Sep 17 00:00:00 2001
From: Taras Perun <terry.perun@gmail.com>
Date: Wed, 9 Aug 2023 19:59:22 +0200
Subject: [PATCH 5/6] refactor conditional rendering from ternary to logical
 AND

---
 src/pages/ProfilePage.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/pages/ProfilePage.js b/src/pages/ProfilePage.js
index 325067bdfee4..59632067df32 100755
--- a/src/pages/ProfilePage.js
+++ b/src/pages/ProfilePage.js
@@ -184,7 +184,7 @@ function ProfilePage(props) {
                                     {displayName}
                                 </Text>
                             )}
-                            {hasStatus ? (
+                            {hasStatus && (
                                 <View style={[styles.mb6, styles.detailsPageSectionContainer, styles.mw100]}>
                                     <Text
                                         style={[styles.textLabelSupporting, styles.mb1]}
@@ -196,7 +196,7 @@ function ProfilePage(props) {
                                         <Text numberOfLines={1}>{statusContent}</Text>
                                     </Tooltip>
                                 </View>
-                            ) : null}
+                            )}
 
                             {login ? (
                                 <View style={[styles.mb6, styles.detailsPageSectionContainer, styles.w100]}>

From 5fb31e7dc1312cdeb33dd92a11c1951ee514d975 Mon Sep 17 00:00:00 2001
From: Taras Perun <terry.perun@gmail.com>
Date: Thu, 10 Aug 2023 10:46:42 +0200
Subject: [PATCH 6/6] add translations and use betas flag

---
 src/CONST.js                                          |  1 +
 src/pages/ProfilePage.js                              | 11 ++++++-----
 src/pages/settings/Profile/CustomStatus/StatusPage.js |  2 +-
 .../settings/Profile/CustomStatus/StatusSetPage.js    |  6 +++---
 4 files changed, 11 insertions(+), 9 deletions(-)

diff --git a/src/CONST.js b/src/CONST.js
index dc0d35129a02..8895bb0f3f3a 100755
--- a/src/CONST.js
+++ b/src/CONST.js
@@ -2532,6 +2532,7 @@ const CONST = {
         SCAN: 'scan',
         DISTANCE: 'distance',
     },
+    STATUS_TEXT_MAX_LENGTH: 100,
 };
 
 export default CONST;
diff --git a/src/pages/ProfilePage.js b/src/pages/ProfilePage.js
index 59632067df32..11e006c8d8fa 100755
--- a/src/pages/ProfilePage.js
+++ b/src/pages/ProfilePage.js
@@ -36,7 +36,7 @@ import * as Illustrations from '../components/Icon/Illustrations';
 import variables from '../styles/variables';
 import ROUTES from '../ROUTES';
 import * as ValidationUtils from '../libs/ValidationUtils';
-import Tooltip from '../components/Tooltip';
+import Permissions from '../libs/Permissions';
 
 const matchType = PropTypes.shape({
     params: PropTypes.shape({
@@ -136,7 +136,7 @@ function ProfilePage(props) {
 
     const statusEmojiCode = lodashGet(details, 'status.emojiCode', '');
     const statusText = lodashGet(details, 'status.text', '');
-    const hasStatus = !!statusEmojiCode;
+    const hasStatus = !!statusEmojiCode && Permissions.canUseCustomStatus(props.betas);
     const statusContent = `${statusEmojiCode}  ${statusText}`;
 
     return (
@@ -192,9 +192,7 @@ function ProfilePage(props) {
                                     >
                                         {props.translate('statusPage.status')}
                                     </Text>
-                                    <Tooltip text={statusContent}>
-                                        <Text numberOfLines={1}>{statusContent}</Text>
-                                    </Tooltip>
+                                    <Text>{statusContent}</Text>
                                 </View>
                             )}
 
@@ -268,5 +266,8 @@ export default compose(
         isLoadingReportData: {
             key: ONYXKEYS.IS_LOADING_REPORT_DATA,
         },
+        betas: {
+            key: ONYXKEYS.BETAS,
+        },
     }),
 )(ProfilePage);
diff --git a/src/pages/settings/Profile/CustomStatus/StatusPage.js b/src/pages/settings/Profile/CustomStatus/StatusPage.js
index afaba4bff07b..c239f9e45f2d 100644
--- a/src/pages/settings/Profile/CustomStatus/StatusPage.js
+++ b/src/pages/settings/Profile/CustomStatus/StatusPage.js
@@ -78,7 +78,7 @@ function StatusPage({draftStatus, currentUserPersonalDetails}) {
             </View>
             <MenuItemWithTopDescription
                 title={customStatus}
-                description="Status"
+                description={localize.translate('statusPage.status')}
                 shouldShowRightIcon
                 inputID="test"
                 onPress={() => Navigation.navigate(ROUTES.SETTINGS_STATUS_SET)}
diff --git a/src/pages/settings/Profile/CustomStatus/StatusSetPage.js b/src/pages/settings/Profile/CustomStatus/StatusSetPage.js
index a3c4aae83bb1..7074ce45a7bb 100644
--- a/src/pages/settings/Profile/CustomStatus/StatusSetPage.js
+++ b/src/pages/settings/Profile/CustomStatus/StatusSetPage.js
@@ -42,7 +42,7 @@ function StatusSetPage({draftStatus, currentUserPersonalDetails}) {
     const defaultText = lodashGet(draftStatus, 'text') || lodashGet(currentUserPersonalDetails, 'status.text', '');
 
     const onSubmit = (value) => {
-        User.updateDraftCustomStatus({text: value.statusText, emojiCode: value.emojiCode});
+        User.updateDraftCustomStatus({text: value.statusText.trim(), emojiCode: value.emojiCode});
         Navigation.goBack(ROUTES.SETTINGS_STATUS);
     };
 
@@ -55,7 +55,7 @@ function StatusSetPage({draftStatus, currentUserPersonalDetails}) {
             <Form
                 formID={ONYXKEYS.FORMS.SETTINGS_STATUS_SET_FORM}
                 style={[styles.flexGrow1, styles.ph5]}
-                submitButtonText="Save"
+                submitButtonText={translate('statusPage.save')}
                 onSubmit={onSubmit}
                 enabledWhenOffline
             >
@@ -74,7 +74,7 @@ function StatusSetPage({draftStatus, currentUserPersonalDetails}) {
                             accessibilityLabel={INPUT_IDS.STATUS_TEXT}
                             accessibilityRole={CONST.ACCESSIBILITY_ROLE.TEXT}
                             defaultValue={defaultText}
-                            maxLength={100}
+                            maxLength={CONST.STATUS_TEXT_MAX_LENGTH}
                             autoFocus
                             shouldDelayFocus
                         />
