From d98eacd8e72da39f76c41ee755b04dbddc56d79b Mon Sep 17 00:00:00 2001 From: Alberto Date: Tue, 19 Mar 2024 15:18:50 +0100 Subject: [PATCH 01/46] Retrieve quick action --- src/ONYXKEYS.ts | 11 +++++------ .../SidebarScreen/FloatingActionButtonAndPopover.js | 12 ++++++++++++ 2 files changed, 17 insertions(+), 6 deletions(-) diff --git a/src/ONYXKEYS.ts b/src/ONYXKEYS.ts index e91b4d491423..e0771cd53552 100755 --- a/src/ONYXKEYS.ts +++ b/src/ONYXKEYS.ts @@ -131,6 +131,9 @@ const ONYXKEYS = { /** The NVP with the last distance rate used per policy */ NVP_LAST_SELECTED_DISTANCE_RATES: 'lastSelectedDistanceRates', + /** The NVP with the last action taken (for the Quick Action Button) */ + NVP_QUICK_ACTION_GLOBAL_CREATE: 'nvp_quickActionGlobalCreate', + /** Does this user have push notifications enabled for this device? */ PUSH_NOTIFICATIONS_ENABLED: 'pushNotificationsEnabled', @@ -330,8 +333,8 @@ const ONYXKEYS = { ADD_DEBIT_CARD_FORM: 'addDebitCardForm', ADD_DEBIT_CARD_FORM_DRAFT: 'addDebitCardFormDraft', WORKSPACE_SETTINGS_FORM: 'workspaceSettingsForm', - WORKSPACE_CATEGORY_FORM: 'workspaceCategoryForm', - WORKSPACE_CATEGORY_FORM_DRAFT: 'workspaceCategoryFormDraft', + WORKSPACE_CATEGORY_CREATE_FORM: 'workspaceCategoryCreate', + WORKSPACE_CATEGORY_CREATE_FORM_DRAFT: 'workspaceCategoryCreateDraft', WORKSPACE_TAG_CREATE_FORM: 'workspaceTagCreate', WORKSPACE_TAG_CREATE_FORM_DRAFT: 'workspaceTagCreateDraft', WORKSPACE_SETTINGS_FORM_DRAFT: 'workspaceSettingsFormDraft', @@ -339,10 +342,6 @@ const ONYXKEYS = { WORKSPACE_DESCRIPTION_FORM_DRAFT: 'workspaceDescriptionFormDraft', WORKSPACE_RATE_AND_UNIT_FORM: 'workspaceRateAndUnitForm', WORKSPACE_RATE_AND_UNIT_FORM_DRAFT: 'workspaceRateAndUnitFormDraft', - WORKSPACE_TAX_CUSTOM_NAME: 'workspaceTaxCustomName', - WORKSPACE_TAX_CUSTOM_NAME_DRAFT: 'workspaceTaxCustomNameDraft', - POLICY_CREATE_DISTANCE_RATE_FORM: 'policyCreateDistanceRateForm', - POLICY_CREATE_DISTANCE_RATE_FORM_DRAFT: 'policyCreateDistanceRateFormDraft', CLOSE_ACCOUNT_FORM: 'closeAccount', CLOSE_ACCOUNT_FORM_DRAFT: 'closeAccountDraft', PROFILE_SETTINGS_FORM: 'profileSettingsForm', diff --git a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js index ec27112ab4b7..5678c0f93842 100644 --- a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js +++ b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js @@ -55,6 +55,9 @@ const propTypes = { /** Forwarded ref to FloatingActionButtonAndPopover */ innerRef: PropTypes.oneOfType([PropTypes.func, PropTypes.object]), + + /** Information on the last taken action to display as Quick Action */ + quickAction: PropTypes.object, }; const defaultProps = { onHideCreateMenu: () => {}, @@ -62,6 +65,7 @@ const defaultProps = { allPolicies: {}, isLoading: false, innerRef: null, + quickAction: null, }; /** @@ -78,6 +82,11 @@ function FloatingActionButtonAndPopover(props) { const prevIsFocused = usePrevious(props.isFocused); + if (props.quickAction) { + const quickActionReportID = props.quickAction.chatReportID; + const quickActionReport = ReportUtils.getReport(quickActionReportID); + } + /** * Check if LHN status changed from active to inactive. * Used to close already opened FAB menu when open any other pages (i.e. Press Command + K on web). @@ -254,5 +263,8 @@ export default compose( isLoading: { key: ONYXKEYS.IS_LOADING_APP, }, + quickAction: { + key: ONYXKEYS.NVP_QUICK_ACTION_GLOBAL_CREATE, + }, }), )(FloatingActionButtonAndPopoverWithRef); From a38a1b2c388fb65af24ea12149da70730f830f12 Mon Sep 17 00:00:00 2001 From: Alberto Date: Tue, 19 Mar 2024 16:05:13 +0100 Subject: [PATCH 02/46] add helper functions --- .../FloatingActionButtonAndPopover.js | 58 ++++++++++++++++++- 1 file changed, 57 insertions(+), 1 deletion(-) diff --git a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js index 5678c0f93842..1aedbd9182ce 100644 --- a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js +++ b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js @@ -1,7 +1,7 @@ import PropTypes from 'prop-types'; import React, {forwardRef, useCallback, useEffect, useImperativeHandle, useRef, useState} from 'react'; import {View} from 'react-native'; -import {withOnyx} from 'react-native-onyx'; +import {OnyxEntry, withOnyx} from 'react-native-onyx'; import FloatingActionButton from '@components/FloatingActionButton'; import * as Expensicons from '@components/Icon/Expensicons'; import PopoverMenu from '@components/PopoverMenu'; @@ -22,6 +22,8 @@ import * as Task from '@userActions/Task'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; +import * as OnyxTypes from "@src/types/onyx"; +import personalDetailsPropType from "@pages/personalDetailsPropType"; /** * @param {Object} [policy] @@ -35,6 +37,50 @@ const policySelector = (policy) => pendingAction: policy.pendingAction, }; +const getQuickActionIcon = (action) => { + switch (action) { + case CONST.QUICK_ACTIONS.REQUEST_MANUAL: + return Expensicons.MoneyCircle; + case CONST.QUICK_ACTIONS.REQUEST_SCAN: + return Expensicons.MoneyCircle; + case CONST.QUICK_ACTIONS.REQUEST_DISTANCE: + return Expensicons.Car; + case CONST.QUICK_ACTIONS.SPLIT_MANUAL: + case CONST.QUICK_ACTIONS.SPLIT_SCAN: + case CONST.QUICK_ACTIONS.SPLIT_DISTANCE: + return Expensicons.Transfer; + case CONST.QUICK_ACTIONS.SEND_MONEY: + return Expensicons.Send; + case CONST.QUICK_ACTIONS.ASSIGN_TASK: + return Expensicons.Task; + default: + return Expensicons.MoneyCircle; + } +}; + +const getQuickActionTitle = (action) => { + switch (action) { + case CONST.QUICK_ACTIONS.REQUEST_MANUAL: + return Expensicons.MoneyCircle; + case CONST.QUICK_ACTIONS.REQUEST_SCAN: + return Expensicons.MoneyCircle; + case CONST.QUICK_ACTIONS.REQUEST_DISTANCE: + return Expensicons.Car; + case CONST.QUICK_ACTIONS.SPLIT_MANUAL: + case CONST.QUICK_ACTIONS.SPLIT_SCAN: + case CONST.QUICK_ACTIONS.SPLIT_DISTANCE: + return Expensicons.Transfer; + case CONST.QUICK_ACTIONS.SEND_MONEY: + return Expensicons.Send; + case CONST.QUICK_ACTIONS.ASSIGN_TASK: + return Expensicons.Task; + default: + return Expensicons.MoneyCircle; + } +}; + + + const propTypes = { ...windowDimensionsPropTypes, @@ -58,6 +104,9 @@ const propTypes = { /** Information on the last taken action to display as Quick Action */ quickAction: PropTypes.object, + + /** Personal details of all the users */ + personalDetails: personalDetailsPropType, }; const defaultProps = { onHideCreateMenu: () => {}, @@ -66,6 +115,7 @@ const defaultProps = { isLoading: false, innerRef: null, quickAction: null, + personalDetails: {}, }; /** @@ -85,6 +135,9 @@ function FloatingActionButtonAndPopover(props) { if (props.quickAction) { const quickActionReportID = props.quickAction.chatReportID; const quickActionReport = ReportUtils.getReport(quickActionReportID); + if (quickActionReport) { + const avatars = ReportUtils.getIcons(quickActionReport, props.personalDetails); + } } /** @@ -266,5 +319,8 @@ export default compose( quickAction: { key: ONYXKEYS.NVP_QUICK_ACTION_GLOBAL_CREATE, }, + personalDetails: { + key: ONYXKEYS.PERSONAL_DETAILS_LIST, + }, }), )(FloatingActionButtonAndPopoverWithRef); From 9ae46bb92d180bc6d634efd328d1f881faaf3dde Mon Sep 17 00:00:00 2001 From: Alberto Date: Tue, 19 Mar 2024 16:07:53 +0100 Subject: [PATCH 03/46] add titles --- src/languages/en.ts | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/src/languages/en.ts b/src/languages/en.ts index 42794ce73646..bb9aa3259642 100755 --- a/src/languages/en.ts +++ b/src/languages/en.ts @@ -578,6 +578,16 @@ export default { deleteConfirmation: 'Are you sure you want to delete this receipt?', addReceipt: 'Add receipt', }, + quickAction: { + scanReceipt: 'Scan Receipt', + recordDistance: 'Record Distance', + requestMoney: 'Request Money', + splitBill: 'Split Bill', + splitReceipt: 'Split Receipt', + splitDistance: 'Split Distance', + sendMoney: 'Send Money', + assignTask: 'Assign Task' + }, iou: { amount: 'Amount', taxAmount: 'Tax amount', From 3bc4a5a4a2cb61ccc8102f55ed45cf957d92ed19 Mon Sep 17 00:00:00 2001 From: Alberto Date: Tue, 19 Mar 2024 16:11:33 +0100 Subject: [PATCH 04/46] Set titles --- .../FloatingActionButtonAndPopover.js | 17 ++++++++++------- 1 file changed, 10 insertions(+), 7 deletions(-) diff --git a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js index 1aedbd9182ce..bf052c008bec 100644 --- a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js +++ b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js @@ -61,21 +61,23 @@ const getQuickActionIcon = (action) => { const getQuickActionTitle = (action) => { switch (action) { case CONST.QUICK_ACTIONS.REQUEST_MANUAL: - return Expensicons.MoneyCircle; + return 'quickAction.requestMoney'; case CONST.QUICK_ACTIONS.REQUEST_SCAN: - return Expensicons.MoneyCircle; + return 'quickAction.scanReceipt'; case CONST.QUICK_ACTIONS.REQUEST_DISTANCE: - return Expensicons.Car; + return 'quickAction.recordDistance'; case CONST.QUICK_ACTIONS.SPLIT_MANUAL: + return 'quickAction.splitBill'; case CONST.QUICK_ACTIONS.SPLIT_SCAN: + return 'quickAction.splitReceipt'; case CONST.QUICK_ACTIONS.SPLIT_DISTANCE: - return Expensicons.Transfer; + return 'quickAction.splitScan'; case CONST.QUICK_ACTIONS.SEND_MONEY: - return Expensicons.Send; + return 'quickAction.sendMoney'; case CONST.QUICK_ACTIONS.ASSIGN_TASK: - return Expensicons.Task; + return 'quickAction.assignTask'; default: - return Expensicons.MoneyCircle; + return ''; } }; @@ -133,6 +135,7 @@ function FloatingActionButtonAndPopover(props) { const prevIsFocused = usePrevious(props.isFocused); if (props.quickAction) { + const quickAction = props.quickAction.action; const quickActionReportID = props.quickAction.chatReportID; const quickActionReport = ReportUtils.getReport(quickActionReportID); if (quickActionReport) { From d724d363cb0dfd962af88445cf1ec968fe883920 Mon Sep 17 00:00:00 2001 From: Alberto Date: Tue, 19 Mar 2024 16:16:42 +0100 Subject: [PATCH 05/46] add button --- .../FloatingActionButtonAndPopover.js | 15 +++++++++++++-- 1 file changed, 13 insertions(+), 2 deletions(-) diff --git a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js index bf052c008bec..c821eea6a375 100644 --- a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js +++ b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js @@ -134,12 +134,14 @@ function FloatingActionButtonAndPopover(props) { const prevIsFocused = usePrevious(props.isFocused); + let quickAction; + let avatars; if (props.quickAction) { - const quickAction = props.quickAction.action; + quickAction = props.quickAction.action; const quickActionReportID = props.quickAction.chatReportID; const quickActionReport = ReportUtils.getReport(quickActionReportID); if (quickActionReport) { - const avatars = ReportUtils.getIcons(quickActionReport, props.personalDetails); + avatars = ReportUtils.getIcons(quickActionReport, props.personalDetails); } } @@ -278,6 +280,15 @@ function FloatingActionButtonAndPopover(props) { }, ] : []), + ...(props.quickAction + ? [ + { + icon: getQuickActionIcon(quickAction), + text: translate(getQuickActionTitle(quickAction)), + description: translate('workspace.new.getTheExpensifyCardAndMore'), + }, + ] + : []), ]} withoutOverlay anchorRef={fabRef} From 583a3973b81a5a0c18cee092a8abcc9cdecd8623 Mon Sep 17 00:00:00 2001 From: Alberto Date: Wed, 20 Mar 2024 11:15:17 +0100 Subject: [PATCH 06/46] Pss and display right avatar --- src/components/PopoverMenu.tsx | 1 + .../SidebarScreen/FloatingActionButtonAndPopover.js | 11 ++++++++++- 2 files changed, 11 insertions(+), 1 deletion(-) diff --git a/src/components/PopoverMenu.tsx b/src/components/PopoverMenu.tsx index e0c2b7f9c938..2101c3a83331 100644 --- a/src/components/PopoverMenu.tsx +++ b/src/components/PopoverMenu.tsx @@ -207,6 +207,7 @@ function PopoverMenu({ shouldPutLeftPaddingWhenNoIcon={item.shouldPutLeftPaddingWhenNoIcon} label={item.label} floatRightAvatars={item.floatRightAvatars} + floatRightAvatarSize={item.floatRightAvatarSize} /> ))} diff --git a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js index 604627e0eed9..92fc0838681a 100644 --- a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js +++ b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js @@ -109,6 +109,11 @@ const propTypes = { /** Personal details of all the users */ personalDetails: personalDetailsPropType, + + session: PropTypes.shape({ + /** Currently logged in user accountID */ + accountID: PropTypes.number, + }).isRequired, }; const defaultProps = { onHideCreateMenu: () => {}, @@ -141,7 +146,7 @@ function FloatingActionButtonAndPopover(props) { const quickActionReportID = props.quickAction.chatReportID; const quickActionReport = ReportUtils.getReport(quickActionReportID); if (quickActionReport) { - avatars = ReportUtils.getIcons(quickActionReport, props.personalDetails); + avatars = _.filter(ReportUtils.getIcons(quickActionReport, props.personalDetails), avatar => avatar.id !== props.session.accountID); } } @@ -287,6 +292,7 @@ function FloatingActionButtonAndPopover(props) { text: translate(getQuickActionTitle(quickAction)), label: 'Shortcut', floatRightAvatars: avatars, + floatRightAvatarSize: CONST.AVATAR_SIZE.SMALLER, description: translate('workspace.new.getTheExpensifyCardAndMore'), }, ] @@ -338,5 +344,8 @@ export default compose( personalDetails: { key: ONYXKEYS.PERSONAL_DETAILS_LIST, }, + session: { + key: ONYXKEYS.SESSION, + }, }), )(FloatingActionButtonAndPopoverWithRef); From 9913831675bab06f983c19973b2854e07f56a46f Mon Sep 17 00:00:00 2001 From: Alberto Date: Wed, 20 Mar 2024 11:25:02 +0100 Subject: [PATCH 07/46] place avatar correctly verticlly --- src/components/MenuItem.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/MenuItem.tsx b/src/components/MenuItem.tsx index 6835bcf3f5fc..9d8c55dd36e5 100644 --- a/src/components/MenuItem.tsx +++ b/src/components/MenuItem.tsx @@ -590,7 +590,7 @@ function MenuItem( )} {floatRightAvatars?.length > 0 && ( - + Date: Wed, 20 Mar 2024 12:59:22 +0100 Subject: [PATCH 08/46] Display report title and add function --- src/languages/en.ts | 3 +- .../FloatingActionButtonAndPopover.js | 35 ++++++++++++++++--- 2 files changed, 32 insertions(+), 6 deletions(-) diff --git a/src/languages/en.ts b/src/languages/en.ts index 7cbc0a9e88f4..9bdaa73289db 100755 --- a/src/languages/en.ts +++ b/src/languages/en.ts @@ -586,7 +586,8 @@ export default { splitReceipt: 'Split Receipt', splitDistance: 'Split Distance', sendMoney: 'Send Money', - assignTask: 'Assign Task' + assignTask: 'Assign Task', + shortcut: 'Shortcut', }, iou: { amount: 'Amount', diff --git a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js index 92fc0838681a..dab1d207c1fd 100644 --- a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js +++ b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js @@ -24,6 +24,7 @@ import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; import * as OnyxTypes from "@src/types/onyx"; import personalDetailsPropType from "@pages/personalDetailsPropType"; +import lodashGet from "lodash/get"; /** * @param {Object} [policy] @@ -141,15 +142,39 @@ function FloatingActionButtonAndPopover(props) { let quickAction; let avatars; + let quickActionReport; if (props.quickAction) { quickAction = props.quickAction.action; const quickActionReportID = props.quickAction.chatReportID; - const quickActionReport = ReportUtils.getReport(quickActionReportID); + quickActionReport = ReportUtils.getReport(quickActionReportID); if (quickActionReport) { avatars = _.filter(ReportUtils.getIcons(quickActionReport, props.personalDetails), avatar => avatar.id !== props.session.accountID); } } + const navigateToQuickAction = () => { + switch (props.quickAction.action) { + case CONST.QUICK_ACTIONS.REQUEST_MANUAL: + case CONST.QUICK_ACTIONS.REQUEST_SCAN: + case CONST.QUICK_ACTIONS.REQUEST_DISTANCE: + IOU.startMoneyRequest(CONST.IOU.TYPE.REQUEST, props.quickAction.chatReportID, props.quickAction.action); + return; + case CONST.QUICK_ACTIONS.SPLIT_MANUAL: + case CONST.QUICK_ACTIONS.SPLIT_SCAN: + case CONST.QUICK_ACTIONS.SPLIT_DISTANCE: + IOU.startMoneyRequest(CONST.IOU.TYPE.SPLIT, props.quickAction.chatReportID, props.quickAction.action); + return; + case CONST.QUICK_ACTIONS.SEND_MONEY: + IOU.startMoneyRequest(CONST.IOU.TYPE.SEND, props.quickAction.chatReportID); + return; + case CONST.QUICK_ACTIONS.ASSIGN_TASK: + Task.clearOutTaskInfoAndNavigate(props.quickAction.chatReportID, lodashGet(props.quickAction, 'targetAccountID', '')) + return; + default: + return ''; + } + }; + /** * Check if LHN status changed from active to inactive. * Used to close already opened FAB menu when open any other pages (i.e. Press Command + K on web). @@ -288,12 +313,12 @@ function FloatingActionButtonAndPopover(props) { ...(props.quickAction ? [ { - icon: getQuickActionIcon(quickAction), - text: translate(getQuickActionTitle(quickAction)), - label: 'Shortcut', + icon: getQuickActionIcon(quickAction.action), + text: translate(getQuickActionTitle(quickAction.action)), + label: translate('quickAction.shortcut'), floatRightAvatars: avatars, floatRightAvatarSize: CONST.AVATAR_SIZE.SMALLER, - description: translate('workspace.new.getTheExpensifyCardAndMore'), + description: ReportUtils.getReportName(quickActionReport), }, ] : []), From cf56da1fec3c60f6947ed9c198cb7fc46edcb070 Mon Sep 17 00:00:00 2001 From: Alberto Date: Wed, 20 Mar 2024 13:03:35 +0100 Subject: [PATCH 09/46] new params --- src/libs/actions/IOU.ts | 2 +- src/libs/actions/Task.ts | 2 +- .../SidebarScreen/FloatingActionButtonAndPopover.js | 12 ++++++++++-- 3 files changed, 12 insertions(+), 4 deletions(-) diff --git a/src/libs/actions/IOU.ts b/src/libs/actions/IOU.ts index 91a74c593926..41e39e4a70ef 100644 --- a/src/libs/actions/IOU.ts +++ b/src/libs/actions/IOU.ts @@ -310,7 +310,7 @@ function updateMoneyRequestTypeParams(routes: StackNavigationState, reportID: string) { +function startMoneyRequest(iouType: ValueOf, reportID: string, requestType?: ValueOf) { clearMoneyRequest(CONST.IOU.OPTIMISTIC_TRANSACTION_ID); Navigation.navigate(ROUTES.MONEY_REQUEST_CREATE.getRoute(iouType, CONST.IOU.OPTIMISTIC_TRANSACTION_ID, reportID)); } diff --git a/src/libs/actions/Task.ts b/src/libs/actions/Task.ts index 681ed0ec383f..a1235bea551e 100644 --- a/src/libs/actions/Task.ts +++ b/src/libs/actions/Task.ts @@ -706,7 +706,7 @@ function setParentReportID(parentReportID: string) { /** * Clears out the task info from the store and navigates to the NewTaskDetails page */ -function clearOutTaskInfoAndNavigate(reportID: string) { +function clearOutTaskInfoAndNavigate(reportID: string, accountID?: string) { clearOutTaskInfo(); if (reportID && reportID !== '0') { setParentReportID(reportID); diff --git a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js index dab1d207c1fd..1142b8e28b8d 100644 --- a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js +++ b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js @@ -155,14 +155,22 @@ function FloatingActionButtonAndPopover(props) { const navigateToQuickAction = () => { switch (props.quickAction.action) { case CONST.QUICK_ACTIONS.REQUEST_MANUAL: + IOU.startMoneyRequest(CONST.IOU.TYPE.REQUEST, props.quickAction.chatReportID, CONST.IOU.REQUEST_TYPE.MANUAL); + return; case CONST.QUICK_ACTIONS.REQUEST_SCAN: + IOU.startMoneyRequest(CONST.IOU.TYPE.REQUEST, props.quickAction.chatReportID, CONST.IOU.REQUEST_TYPE.SCAN); + return; case CONST.QUICK_ACTIONS.REQUEST_DISTANCE: - IOU.startMoneyRequest(CONST.IOU.TYPE.REQUEST, props.quickAction.chatReportID, props.quickAction.action); + IOU.startMoneyRequest(CONST.IOU.TYPE.REQUEST, props.quickAction.chatReportID, CONST.IOU.REQUEST_TYPE.DISTANCE); return; case CONST.QUICK_ACTIONS.SPLIT_MANUAL: + IOU.startMoneyRequest(CONST.IOU.TYPE.SPLIT, props.quickAction.chatReportID, CONST.IOU.REQUEST_TYPE.MANUAL); + return; case CONST.QUICK_ACTIONS.SPLIT_SCAN: + IOU.startMoneyRequest(CONST.IOU.TYPE.SPLIT, props.quickAction.chatReportID, CONST.IOU.REQUEST_TYPE.SCAN); + return; case CONST.QUICK_ACTIONS.SPLIT_DISTANCE: - IOU.startMoneyRequest(CONST.IOU.TYPE.SPLIT, props.quickAction.chatReportID, props.quickAction.action); + IOU.startMoneyRequest(CONST.IOU.TYPE.SPLIT, props.quickAction.chatReportID, CONST.IOU.REQUEST_TYPE.DISTANCE); return; case CONST.QUICK_ACTIONS.SEND_MONEY: IOU.startMoneyRequest(CONST.IOU.TYPE.SEND, props.quickAction.chatReportID); From bee853a96ad70bf0853b1c833405f8c262caf5fb Mon Sep 17 00:00:00 2001 From: Alberto Date: Wed, 20 Mar 2024 13:16:34 +0100 Subject: [PATCH 10/46] call correct routes --- src/libs/actions/IOU.ts | 15 ++++++++++++++- 1 file changed, 14 insertions(+), 1 deletion(-) diff --git a/src/libs/actions/IOU.ts b/src/libs/actions/IOU.ts index 41e39e4a70ef..bf40dbc4f523 100644 --- a/src/libs/actions/IOU.ts +++ b/src/libs/actions/IOU.ts @@ -312,7 +312,20 @@ function updateMoneyRequestTypeParams(routes: StackNavigationState, reportID: string, requestType?: ValueOf) { clearMoneyRequest(CONST.IOU.OPTIMISTIC_TRANSACTION_ID); - Navigation.navigate(ROUTES.MONEY_REQUEST_CREATE.getRoute(iouType, CONST.IOU.OPTIMISTIC_TRANSACTION_ID, reportID)); + switch (requestType) { + case CONST.IOU.REQUEST_TYPE.MANUAL: + Navigation.navigate(ROUTES.MONEY_REQUEST_CREATE_TAB_MANUAL.getRoute(iouType, CONST.IOU.OPTIMISTIC_TRANSACTION_ID, reportID)); + return; + case CONST.IOU.REQUEST_TYPE.SCAN: + Navigation.navigate(ROUTES.MONEY_REQUEST_CREATE_TAB_SCAN.getRoute(iouType, CONST.IOU.OPTIMISTIC_TRANSACTION_ID, reportID)); + return; + case CONST.IOU.REQUEST_TYPE.DISTANCE: + Navigation.navigate(ROUTES.MONEY_REQUEST_CREATE_TAB_DISTANCE.getRoute(iouType, CONST.IOU.OPTIMISTIC_TRANSACTION_ID, reportID)); + return; + default: + Navigation.navigate(ROUTES.MONEY_REQUEST_CREATE.getRoute(iouType, CONST.IOU.OPTIMISTIC_TRANSACTION_ID, reportID)); + } + } // eslint-disable-next-line @typescript-eslint/naming-convention From c95240cd8329a199335e0fc7681867e9f5a42ec7 Mon Sep 17 00:00:00 2001 From: Alberto Date: Wed, 20 Mar 2024 13:40:37 +0100 Subject: [PATCH 11/46] spanish --- src/languages/es.ts | 11 +++++++++++ 1 file changed, 11 insertions(+) diff --git a/src/languages/es.ts b/src/languages/es.ts index 3a50e332fd57..8e891e004e23 100644 --- a/src/languages/es.ts +++ b/src/languages/es.ts @@ -570,6 +570,17 @@ export default { deleteConfirmation: '¿Estás seguro de que quieres borrar este recibo?', addReceipt: 'Añadir recibo', }, + quickAction: { + scanReceipt: 'Scan Receipt', + recordDistance: 'Record Distance', + requestMoney: 'Request Money', + splitBill: 'Split Bill', + splitReceipt: 'Split Receipt', + splitDistance: 'Split Distance', + sendMoney: 'Send Money', + assignTask: 'Assign Task', + shortcut: 'Shortcut', + }, iou: { amount: 'Importe', taxAmount: 'Importe del impuesto', From 7dd132d06a134bd8be549eb6396c79b52b3cf0fb Mon Sep 17 00:00:00 2001 From: Alberto Date: Wed, 20 Mar 2024 13:40:51 +0100 Subject: [PATCH 12/46] use correct object key --- src/libs/actions/IOU.ts | 8 ++++---- src/libs/actions/Task.ts | 2 +- .../SidebarScreen/FloatingActionButtonAndPopover.js | 9 +++++---- src/types/onyx/QuickAction.ts | 2 +- 4 files changed, 11 insertions(+), 10 deletions(-) diff --git a/src/libs/actions/IOU.ts b/src/libs/actions/IOU.ts index 23fb4198e7a6..19c7c8fdd811 100644 --- a/src/libs/actions/IOU.ts +++ b/src/libs/actions/IOU.ts @@ -583,7 +583,7 @@ function buildOnyxDataForMoneyRequest( key: ONYXKEYS.NVP_QUICK_ACTION_GLOBAL_CREATE, value: { action: newQuickAction, - reportID: chatReport?.reportID, + chatReportID: chatReport?.reportID, isFirstQuickAction: isEmptyObject(quickAction), }, }); @@ -1731,7 +1731,7 @@ function createSplitsAndOnyxData( key: ONYXKEYS.NVP_QUICK_ACTION_GLOBAL_CREATE, value: { action: iouRequestType === CONST.IOU.REQUEST_TYPE.DISTANCE ? CONST.QUICK_ACTIONS.SPLIT_DISTANCE : CONST.QUICK_ACTIONS.SPLIT_MANUAL, - reportID: splitChatReport.reportID, + chatReportID: splitChatReport.reportID, isFirstQuickAction: isEmptyObject(quickAction), }, }, @@ -2217,7 +2217,7 @@ function startSplitBill( key: ONYXKEYS.NVP_QUICK_ACTION_GLOBAL_CREATE, value: { action: CONST.QUICK_ACTIONS.SPLIT_SCAN, - reportID: splitChatReport.reportID, + chatReportID: splitChatReport.reportID, isFirstQuickAction: isEmptyObject(quickAction), }, }, @@ -3338,7 +3338,7 @@ function getSendMoneyParams( key: ONYXKEYS.NVP_QUICK_ACTION_GLOBAL_CREATE, value: { action: CONST.QUICK_ACTIONS.SEND_MONEY, - reportID: chatReport.reportID, + chatReportID: chatReport.reportID, isFirstQuickAction: isEmptyObject(quickAction), }, }; diff --git a/src/libs/actions/Task.ts b/src/libs/actions/Task.ts index a1235bea551e..4e8f296f22f2 100644 --- a/src/libs/actions/Task.ts +++ b/src/libs/actions/Task.ts @@ -241,7 +241,7 @@ function createTaskAndNavigate( key: ONYXKEYS.NVP_QUICK_ACTION_GLOBAL_CREATE, value: { action: CONST.QUICK_ACTIONS.ASSIGN_TASK, - reportID: parentReportID, + chatReportID: parentReportID, isFirstQuickAction: isEmptyObject(quickAction), targetAccountID: assigneeAccountID, }, diff --git a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js index 1142b8e28b8d..f0442c0b53ae 100644 --- a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js +++ b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js @@ -140,13 +140,13 @@ function FloatingActionButtonAndPopover(props) { const prevIsFocused = usePrevious(props.isFocused); - let quickAction; let avatars; let quickActionReport; if (props.quickAction) { - quickAction = props.quickAction.action; const quickActionReportID = props.quickAction.chatReportID; quickActionReport = ReportUtils.getReport(quickActionReportID); + console.log(quickActionReportID); + console.log(quickActionReport); if (quickActionReport) { avatars = _.filter(ReportUtils.getIcons(quickActionReport, props.personalDetails), avatar => avatar.id !== props.session.accountID); } @@ -321,12 +321,13 @@ function FloatingActionButtonAndPopover(props) { ...(props.quickAction ? [ { - icon: getQuickActionIcon(quickAction.action), - text: translate(getQuickActionTitle(quickAction.action)), + icon: getQuickActionIcon(props.quickAction.action), + text: translate(getQuickActionTitle(props.quickAction.action)), label: translate('quickAction.shortcut'), floatRightAvatars: avatars, floatRightAvatarSize: CONST.AVATAR_SIZE.SMALLER, description: ReportUtils.getReportName(quickActionReport), + onSelected: () => interceptAnonymousUser(() => navigateToQuickAction()), }, ] : []), diff --git a/src/types/onyx/QuickAction.ts b/src/types/onyx/QuickAction.ts index 6cf1af929a5c..0731d711afaa 100644 --- a/src/types/onyx/QuickAction.ts +++ b/src/types/onyx/QuickAction.ts @@ -6,7 +6,7 @@ type QuickAction = { action?: ValueOf; /** ID of the report */ - reportID?: string; + chatReportID?: string; /** ID of the target account for task actions */ targetAccountID?: number; From 56f0aafa1b7682593c64dcb8f171d3ebf243d969 Mon Sep 17 00:00:00 2001 From: Alberto Date: Wed, 20 Mar 2024 16:01:03 +0100 Subject: [PATCH 13/46] lint --- .../sidebar/SidebarScreen/FloatingActionButtonAndPopover.js | 6 ++---- 1 file changed, 2 insertions(+), 4 deletions(-) diff --git a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js index f0442c0b53ae..cc6befd395a2 100644 --- a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js +++ b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js @@ -1,7 +1,8 @@ import PropTypes from 'prop-types'; import React, {forwardRef, useCallback, useEffect, useImperativeHandle, useRef, useState} from 'react'; +import _ from 'underscore'; import {View} from 'react-native'; -import {OnyxEntry, withOnyx} from 'react-native-onyx'; +import {withOnyx} from 'react-native-onyx'; import FloatingActionButton from '@components/FloatingActionButton'; import * as Expensicons from '@components/Icon/Expensicons'; import PopoverMenu from '@components/PopoverMenu'; @@ -22,7 +23,6 @@ import * as Task from '@userActions/Task'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; -import * as OnyxTypes from "@src/types/onyx"; import personalDetailsPropType from "@pages/personalDetailsPropType"; import lodashGet from "lodash/get"; @@ -145,8 +145,6 @@ function FloatingActionButtonAndPopover(props) { if (props.quickAction) { const quickActionReportID = props.quickAction.chatReportID; quickActionReport = ReportUtils.getReport(quickActionReportID); - console.log(quickActionReportID); - console.log(quickActionReport); if (quickActionReport) { avatars = _.filter(ReportUtils.getIcons(quickActionReport, props.personalDetails), avatar => avatar.id !== props.session.accountID); } From 2eb7a4d49d95c593ea4ec667e65db8a454e66dfe Mon Sep 17 00:00:00 2001 From: Alberto Date: Wed, 20 Mar 2024 16:21:32 +0100 Subject: [PATCH 14/46] fix tasks --- src/libs/actions/Task.ts | 6 +++++- .../sidebar/SidebarScreen/FloatingActionButtonAndPopover.js | 3 +-- 2 files changed, 6 insertions(+), 3 deletions(-) diff --git a/src/libs/actions/Task.ts b/src/libs/actions/Task.ts index 4e8f296f22f2..3a7e29be09a3 100644 --- a/src/libs/actions/Task.ts +++ b/src/libs/actions/Task.ts @@ -706,11 +706,15 @@ function setParentReportID(parentReportID: string) { /** * Clears out the task info from the store and navigates to the NewTaskDetails page */ -function clearOutTaskInfoAndNavigate(reportID: string, accountID?: string) { +function clearOutTaskInfoAndNavigate(reportID: string, accountID = 0) { clearOutTaskInfo(); if (reportID && reportID !== '0') { setParentReportID(reportID); } + if (accountID > 0) { + const accountLogin = allPersonalDetails?.[accountID]?.login ?? ''; + setAssigneeValue(accountLogin, accountID, reportID); + } Navigation.navigate(ROUTES.NEW_TASK_DETAILS); } diff --git a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js index cc6befd395a2..c8cfe895d3b3 100644 --- a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js +++ b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js @@ -24,7 +24,6 @@ import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; import personalDetailsPropType from "@pages/personalDetailsPropType"; -import lodashGet from "lodash/get"; /** * @param {Object} [policy] @@ -174,7 +173,7 @@ function FloatingActionButtonAndPopover(props) { IOU.startMoneyRequest(CONST.IOU.TYPE.SEND, props.quickAction.chatReportID); return; case CONST.QUICK_ACTIONS.ASSIGN_TASK: - Task.clearOutTaskInfoAndNavigate(props.quickAction.chatReportID, lodashGet(props.quickAction, 'targetAccountID', '')) + Task.clearOutTaskInfoAndNavigate(props.quickAction.chatReportID, _.get(props.quickAction, 'targetAccountID', 0)); return; default: return ''; From 62fc68f312d207ebb36339d9f3d5e4fa2b352746 Mon Sep 17 00:00:00 2001 From: Alberto Date: Wed, 20 Mar 2024 16:26:37 +0100 Subject: [PATCH 15/46] use receipt icon --- .../sidebar/SidebarScreen/FloatingActionButtonAndPopover.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js index c8cfe895d3b3..209de6810ef9 100644 --- a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js +++ b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js @@ -42,7 +42,7 @@ const getQuickActionIcon = (action) => { case CONST.QUICK_ACTIONS.REQUEST_MANUAL: return Expensicons.MoneyCircle; case CONST.QUICK_ACTIONS.REQUEST_SCAN: - return Expensicons.MoneyCircle; + return Expensicons.Receipt; case CONST.QUICK_ACTIONS.REQUEST_DISTANCE: return Expensicons.Car; case CONST.QUICK_ACTIONS.SPLIT_MANUAL: From e438fdb9a42ac754e1a31733acaaa581310c6bb2 Mon Sep 17 00:00:00 2001 From: Alberto Date: Wed, 20 Mar 2024 16:31:54 +0100 Subject: [PATCH 16/46] typescript --- src/ONYXKEYS.ts | 4 ++++ .../SidebarScreen/FloatingActionButtonAndPopover.js | 7 ++++++- 2 files changed, 10 insertions(+), 1 deletion(-) diff --git a/src/ONYXKEYS.ts b/src/ONYXKEYS.ts index 25fd5bf0afbf..99973935b20a 100755 --- a/src/ONYXKEYS.ts +++ b/src/ONYXKEYS.ts @@ -342,6 +342,10 @@ const ONYXKEYS = { WORKSPACE_DESCRIPTION_FORM_DRAFT: 'workspaceDescriptionFormDraft', WORKSPACE_RATE_AND_UNIT_FORM: 'workspaceRateAndUnitForm', WORKSPACE_RATE_AND_UNIT_FORM_DRAFT: 'workspaceRateAndUnitFormDraft', + WORKSPACE_TAX_CUSTOM_NAME: 'workspaceTaxCustomName', + WORKSPACE_TAX_CUSTOM_NAME_DRAFT: 'workspaceTaxCustomNameDraft', + POLICY_CREATE_DISTANCE_RATE_FORM: 'policyCreateDistanceRateForm', + POLICY_CREATE_DISTANCE_RATE_FORM_DRAFT: 'policyCreateDistanceRateFormDraft', CLOSE_ACCOUNT_FORM: 'closeAccount', CLOSE_ACCOUNT_FORM_DRAFT: 'closeAccountDraft', PROFILE_SETTINGS_FORM: 'profileSettingsForm', diff --git a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js index 209de6810ef9..d560fcd1e901 100644 --- a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js +++ b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js @@ -105,7 +105,12 @@ const propTypes = { innerRef: PropTypes.oneOfType([PropTypes.func, PropTypes.object]), /** Information on the last taken action to display as Quick Action */ - quickAction: PropTypes.object, + quickAction: PropTypes.shape({ + action: PropTypes.string, + chatReportID: PropTypes.string, + targetAccountID: PropTypes.number, + isFirstQuickAction: PropTypes.bool, + }) /** Personal details of all the users */ personalDetails: personalDetailsPropType, From 5bb163bbd54b623f19ec85b57900a21f3ca8c4c1 Mon Sep 17 00:00:00 2001 From: Alberto Date: Wed, 20 Mar 2024 16:40:45 +0100 Subject: [PATCH 17/46] typo --- .../sidebar/SidebarScreen/FloatingActionButtonAndPopover.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js index d560fcd1e901..bdb1faa799d1 100644 --- a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js +++ b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js @@ -110,7 +110,7 @@ const propTypes = { chatReportID: PropTypes.string, targetAccountID: PropTypes.number, isFirstQuickAction: PropTypes.bool, - }) + }), /** Personal details of all the users */ personalDetails: personalDetailsPropType, From d76ce0f5048c4abe65c24a0da9c7dedaf71eb8e7 Mon Sep 17 00:00:00 2001 From: Alberto Date: Wed, 20 Mar 2024 16:48:18 +0100 Subject: [PATCH 18/46] prettier --- src/libs/actions/IOU.ts | 1 - .../FloatingActionButtonAndPopover.js | 28 +++++++++---------- 2 files changed, 13 insertions(+), 16 deletions(-) diff --git a/src/libs/actions/IOU.ts b/src/libs/actions/IOU.ts index 19c7c8fdd811..bfed1946b4f9 100644 --- a/src/libs/actions/IOU.ts +++ b/src/libs/actions/IOU.ts @@ -325,7 +325,6 @@ function startMoneyRequest(iouType: ValueOf, reportID: st default: Navigation.navigate(ROUTES.MONEY_REQUEST_CREATE.getRoute(iouType, CONST.IOU.OPTIMISTIC_TRANSACTION_ID, reportID)); } - } // eslint-disable-next-line @typescript-eslint/naming-convention diff --git a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js index bdb1faa799d1..91478659e000 100644 --- a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js +++ b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js @@ -1,8 +1,8 @@ import PropTypes from 'prop-types'; import React, {forwardRef, useCallback, useEffect, useImperativeHandle, useRef, useState} from 'react'; -import _ from 'underscore'; import {View} from 'react-native'; import {withOnyx} from 'react-native-onyx'; +import _ from 'underscore'; import FloatingActionButton from '@components/FloatingActionButton'; import * as Expensicons from '@components/Icon/Expensicons'; import PopoverMenu from '@components/PopoverMenu'; @@ -16,6 +16,7 @@ import compose from '@libs/compose'; import interceptAnonymousUser from '@libs/interceptAnonymousUser'; import Navigation from '@libs/Navigation/Navigation'; import * as ReportUtils from '@libs/ReportUtils'; +import personalDetailsPropType from '@pages/personalDetailsPropType'; import * as App from '@userActions/App'; import * as IOU from '@userActions/IOU'; import * as Policy from '@userActions/Policy'; @@ -23,7 +24,6 @@ import * as Task from '@userActions/Task'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; -import personalDetailsPropType from "@pages/personalDetailsPropType"; /** * @param {Object} [policy] @@ -81,8 +81,6 @@ const getQuickActionTitle = (action) => { } }; - - const propTypes = { ...windowDimensionsPropTypes, @@ -150,7 +148,7 @@ function FloatingActionButtonAndPopover(props) { const quickActionReportID = props.quickAction.chatReportID; quickActionReport = ReportUtils.getReport(quickActionReportID); if (quickActionReport) { - avatars = _.filter(ReportUtils.getIcons(quickActionReport, props.personalDetails), avatar => avatar.id !== props.session.accountID); + avatars = _.filter(ReportUtils.getIcons(quickActionReport, props.personalDetails), (avatar) => avatar.id !== props.session.accountID); } } @@ -322,16 +320,16 @@ function FloatingActionButtonAndPopover(props) { : []), ...(props.quickAction ? [ - { - icon: getQuickActionIcon(props.quickAction.action), - text: translate(getQuickActionTitle(props.quickAction.action)), - label: translate('quickAction.shortcut'), - floatRightAvatars: avatars, - floatRightAvatarSize: CONST.AVATAR_SIZE.SMALLER, - description: ReportUtils.getReportName(quickActionReport), - onSelected: () => interceptAnonymousUser(() => navigateToQuickAction()), - }, - ] + { + icon: getQuickActionIcon(props.quickAction.action), + text: translate(getQuickActionTitle(props.quickAction.action)), + label: translate('quickAction.shortcut'), + floatRightAvatars: avatars, + floatRightAvatarSize: CONST.AVATAR_SIZE.SMALLER, + description: ReportUtils.getReportName(quickActionReport), + onSelected: () => interceptAnonymousUser(() => navigateToQuickAction()), + }, + ] : []), ]} withoutOverlay From bc00787164a1d455e1f7069421f33ec6edfd8e25 Mon Sep 17 00:00:00 2001 From: Alberto Date: Wed, 20 Mar 2024 17:40:12 +0100 Subject: [PATCH 19/46] spanish --- src/languages/es.ts | 18 +++++++++--------- 1 file changed, 9 insertions(+), 9 deletions(-) diff --git a/src/languages/es.ts b/src/languages/es.ts index 8e891e004e23..2923ba8a98d8 100644 --- a/src/languages/es.ts +++ b/src/languages/es.ts @@ -571,15 +571,15 @@ export default { addReceipt: 'Añadir recibo', }, quickAction: { - scanReceipt: 'Scan Receipt', - recordDistance: 'Record Distance', - requestMoney: 'Request Money', - splitBill: 'Split Bill', - splitReceipt: 'Split Receipt', - splitDistance: 'Split Distance', - sendMoney: 'Send Money', - assignTask: 'Assign Task', - shortcut: 'Shortcut', + scanReceipt: 'Escanear Recibo', + recordDistance: 'Grabar Distancia', + requestMoney: 'Solicitar Dinero', + splitBill: 'Dividir Cuenta', + splitReceipt: 'Dividir Recibo', + splitDistance: 'Dividir Distancia', + sendMoney: 'Enviar Dinero', + assignTask: 'Assignar Tarea', + shortcut: 'Acceso Directo', }, iou: { amount: 'Importe', From 98e838507b61c2727ae0585165908ae5187c346c Mon Sep 17 00:00:00 2001 From: Alberto Date: Wed, 20 Mar 2024 20:03:19 +0100 Subject: [PATCH 20/46] do not remove own avatar if it is the only one --- .../sidebar/SidebarScreen/FloatingActionButtonAndPopover.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js index 91478659e000..85e1082a1036 100644 --- a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js +++ b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js @@ -148,7 +148,10 @@ function FloatingActionButtonAndPopover(props) { const quickActionReportID = props.quickAction.chatReportID; quickActionReport = ReportUtils.getReport(quickActionReportID); if (quickActionReport) { - avatars = _.filter(ReportUtils.getIcons(quickActionReport, props.personalDetails), (avatar) => avatar.id !== props.session.accountID); + avatars = ReportUtils.getIcons(quickActionReport, props.personalDetails); + + // Remove the user's own avatar if there are others + avatars = _.filter(avatars, (avatar) => avatar.id !== props.session.accountID); } } From e95214a60989306140c592a1da3e47ebd42f287f Mon Sep 17 00:00:00 2001 From: Alberto Date: Wed, 20 Mar 2024 20:03:33 +0100 Subject: [PATCH 21/46] correct avatar size --- .../sidebar/SidebarScreen/FloatingActionButtonAndPopover.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js index 85e1082a1036..ca5d69276770 100644 --- a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js +++ b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js @@ -328,7 +328,7 @@ function FloatingActionButtonAndPopover(props) { text: translate(getQuickActionTitle(props.quickAction.action)), label: translate('quickAction.shortcut'), floatRightAvatars: avatars, - floatRightAvatarSize: CONST.AVATAR_SIZE.SMALLER, + floatRightAvatarSize: avatars.length > 1 ? CONST.AVATAR_SIZE.SMALLER : CONST.AVATAR_SIZE.SMALL, description: ReportUtils.getReportName(quickActionReport), onSelected: () => interceptAnonymousUser(() => navigateToQuickAction()), }, From a8419b267926847537a05e64179407a6db56464d Mon Sep 17 00:00:00 2001 From: Alberto Date: Wed, 20 Mar 2024 20:09:54 +0100 Subject: [PATCH 22/46] reduce description to single line --- src/components/MenuItem.tsx | 8 ++++++-- src/components/PopoverMenu.tsx | 1 + .../SidebarScreen/FloatingActionButtonAndPopover.js | 1 + 3 files changed, 8 insertions(+), 2 deletions(-) diff --git a/src/components/MenuItem.tsx b/src/components/MenuItem.tsx index 9d8c55dd36e5..94d34ac256ea 100644 --- a/src/components/MenuItem.tsx +++ b/src/components/MenuItem.tsx @@ -190,6 +190,9 @@ type MenuItemBaseProps = { /** Used to truncate the text with an ellipsis after computing the text layout */ numberOfLinesTitle?: number; + /** Used to truncate the description with an ellipsis after computing the text layout */ + numberOfLinesDescription?: number; + /** Whether we should use small avatar subscript sizing the for menu item */ isSmallAvatarSubscriptMenu?: boolean; @@ -255,6 +258,7 @@ function MenuItem( badgeStyle, viewMode = CONST.OPTION_MODE.DEFAULT, numberOfLinesTitle = 1, + numberOfLinesDescription = 2, icon, iconFill, secondaryIcon, @@ -506,7 +510,7 @@ function MenuItem( {!!description && shouldShowDescriptionOnTop && ( {description} @@ -538,7 +542,7 @@ function MenuItem( {!!description && !shouldShowDescriptionOnTop && ( {description} diff --git a/src/components/PopoverMenu.tsx b/src/components/PopoverMenu.tsx index 2101c3a83331..5cfb8e818745 100644 --- a/src/components/PopoverMenu.tsx +++ b/src/components/PopoverMenu.tsx @@ -200,6 +200,7 @@ function PopoverMenu({ title={item.text} shouldCheckActionAllowedOnPress={false} description={item.description} + numberOfLinesDescription={item.numberOfLinesDescription} onPress={() => selectItem(menuIndex)} focused={focusedIndex === menuIndex} displayInDefaultIconColor={item.displayInDefaultIconColor} diff --git a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js index ca5d69276770..902f2be42b6e 100644 --- a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js +++ b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js @@ -330,6 +330,7 @@ function FloatingActionButtonAndPopover(props) { floatRightAvatars: avatars, floatRightAvatarSize: avatars.length > 1 ? CONST.AVATAR_SIZE.SMALLER : CONST.AVATAR_SIZE.SMALL, description: ReportUtils.getReportName(quickActionReport), + numberOfLinesDescription: 1, onSelected: () => interceptAnonymousUser(() => navigateToQuickAction()), }, ] From b73e1540d82c565682f830dea03f72f0e5a2ddca Mon Sep 17 00:00:00 2001 From: Alberto Date: Thu, 21 Mar 2024 10:53:38 +0100 Subject: [PATCH 23/46] Fix second avatar border --- src/components/MultipleAvatars.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/MultipleAvatars.tsx b/src/components/MultipleAvatars.tsx index 98bc47e41bbe..1a27dbdae3b2 100644 --- a/src/components/MultipleAvatars.tsx +++ b/src/components/MultipleAvatars.tsx @@ -102,7 +102,7 @@ function MultipleAvatars({ [styles], ); - const secondAvatarStyle = secondAvatarStyleProp ?? [StyleUtils.getBackgroundAndBorderStyle(theme.componentBG)]; + const secondAvatarStyle = secondAvatarStyleProp ?? [StyleUtils.getBackgroundAndBorderStyle(isHovered ? theme.hoverComponentBG : theme.componentBG)]; let avatarContainerStyles = StyleUtils.getContainerStyles(size, isInReportAction); const {singleAvatarStyle, secondAvatarStyles} = useMemo(() => avatarSizeToStylesMap[size as AvatarSizeToStyles] ?? avatarSizeToStylesMap.default, [size, avatarSizeToStylesMap]); From 184668ee9bace0a9a9bba09bbda696f45008f2df Mon Sep 17 00:00:00 2001 From: Alberto Date: Thu, 21 Mar 2024 11:32:45 +0100 Subject: [PATCH 24/46] make label hoverable --- src/components/MenuItem.tsx | 14 ++++++++++++-- 1 file changed, 12 insertions(+), 2 deletions(-) diff --git a/src/components/MenuItem.tsx b/src/components/MenuItem.tsx index 94d34ac256ea..0ffa8a0381e0 100644 --- a/src/components/MenuItem.tsx +++ b/src/components/MenuItem.tsx @@ -154,6 +154,8 @@ type MenuItemBaseProps = { /** Text that appears above the title */ label?: string; + isLabelHoverble?: boolean + /** Label to be displayed on the right */ rightLabel?: string; @@ -284,6 +286,7 @@ function MenuItem( subtitle, shouldShowBasicTitle, label, + isLabelHoverable = true, rightLabel, shouldShowSelectedState = false, isSelected = false, @@ -408,6 +411,12 @@ function MenuItem( }; return ( + + {(!!label && !isLabelHoverable) && ( + + {label} + + )} {(isHovered) => ( ( <> - {!!label && ( + {(!!label && isLabelHoverable) && ( {label} @@ -594,7 +603,7 @@ function MenuItem( )} {floatRightAvatars?.length > 0 && ( - + )} + ); } From dc736dee4f0492103d6acb2c11dddc563dbe70aa Mon Sep 17 00:00:00 2001 From: Alberto Date: Thu, 21 Mar 2024 11:33:44 +0100 Subject: [PATCH 25/46] non-hoverble --- src/components/PopoverMenu.tsx | 1 + .../home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js | 1 + 2 files changed, 2 insertions(+) diff --git a/src/components/PopoverMenu.tsx b/src/components/PopoverMenu.tsx index 5cfb8e818745..f24b45a434c2 100644 --- a/src/components/PopoverMenu.tsx +++ b/src/components/PopoverMenu.tsx @@ -207,6 +207,7 @@ function PopoverMenu({ shouldShowRightIcon={item.shouldShowRightIcon} shouldPutLeftPaddingWhenNoIcon={item.shouldPutLeftPaddingWhenNoIcon} label={item.label} + isLabelHoverble={item.isLabelHoverble} floatRightAvatars={item.floatRightAvatars} floatRightAvatarSize={item.floatRightAvatarSize} /> diff --git a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js index 902f2be42b6e..aa6603fc1058 100644 --- a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js +++ b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js @@ -327,6 +327,7 @@ function FloatingActionButtonAndPopover(props) { icon: getQuickActionIcon(props.quickAction.action), text: translate(getQuickActionTitle(props.quickAction.action)), label: translate('quickAction.shortcut'), + isLabelHoverble: false, floatRightAvatars: avatars, floatRightAvatarSize: avatars.length > 1 ? CONST.AVATAR_SIZE.SMALLER : CONST.AVATAR_SIZE.SMALL, description: ReportUtils.getReportName(quickActionReport), From 33735caa3b415ef304b6bf16d8e15c518fcaf54f Mon Sep 17 00:00:00 2001 From: Alberto Date: Thu, 21 Mar 2024 11:35:37 +0100 Subject: [PATCH 26/46] typo --- src/components/MenuItem.tsx | 2 +- src/components/PopoverMenu.tsx | 2 +- .../sidebar/SidebarScreen/FloatingActionButtonAndPopover.js | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/src/components/MenuItem.tsx b/src/components/MenuItem.tsx index 0ffa8a0381e0..15a083bb1c6a 100644 --- a/src/components/MenuItem.tsx +++ b/src/components/MenuItem.tsx @@ -154,7 +154,7 @@ type MenuItemBaseProps = { /** Text that appears above the title */ label?: string; - isLabelHoverble?: boolean + isLabelHoverable?: boolean /** Label to be displayed on the right */ rightLabel?: string; diff --git a/src/components/PopoverMenu.tsx b/src/components/PopoverMenu.tsx index f24b45a434c2..2cb09cc40be7 100644 --- a/src/components/PopoverMenu.tsx +++ b/src/components/PopoverMenu.tsx @@ -207,7 +207,7 @@ function PopoverMenu({ shouldShowRightIcon={item.shouldShowRightIcon} shouldPutLeftPaddingWhenNoIcon={item.shouldPutLeftPaddingWhenNoIcon} label={item.label} - isLabelHoverble={item.isLabelHoverble} + isLabelHoverable={item.isLabelHoverable} floatRightAvatars={item.floatRightAvatars} floatRightAvatarSize={item.floatRightAvatarSize} /> diff --git a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js index aa6603fc1058..24b7d27184cc 100644 --- a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js +++ b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js @@ -327,7 +327,7 @@ function FloatingActionButtonAndPopover(props) { icon: getQuickActionIcon(props.quickAction.action), text: translate(getQuickActionTitle(props.quickAction.action)), label: translate('quickAction.shortcut'), - isLabelHoverble: false, + isLabelHoverable: false, floatRightAvatars: avatars, floatRightAvatarSize: avatars.length > 1 ? CONST.AVATAR_SIZE.SMALLER : CONST.AVATAR_SIZE.SMALL, description: ReportUtils.getReportName(quickActionReport), From 37cd485afa210d914520bd0211508eb0bd82304c Mon Sep 17 00:00:00 2001 From: Alberto Date: Thu, 21 Mar 2024 12:09:17 +0100 Subject: [PATCH 27/46] use memo --- .../FloatingActionButtonAndPopover.js | 25 +++++++++---------- 1 file changed, 12 insertions(+), 13 deletions(-) diff --git a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js index 24b7d27184cc..6dd6bc7c1a91 100644 --- a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js +++ b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js @@ -1,5 +1,5 @@ import PropTypes from 'prop-types'; -import React, {forwardRef, useCallback, useEffect, useImperativeHandle, useRef, useState} from 'react'; +import React, {forwardRef, useCallback, useEffect, useImperativeHandle, useRef, useState, useMemo} from 'react'; import {View} from 'react-native'; import {withOnyx} from 'react-native-onyx'; import _ from 'underscore'; @@ -142,18 +142,17 @@ function FloatingActionButtonAndPopover(props) { const prevIsFocused = usePrevious(props.isFocused); - let avatars; - let quickActionReport; - if (props.quickAction) { - const quickActionReportID = props.quickAction.chatReportID; - quickActionReport = ReportUtils.getReport(quickActionReportID); - if (quickActionReport) { - avatars = ReportUtils.getIcons(quickActionReport, props.personalDetails); + const quickActionReport = useMemo(() => { + return props.quickAction ? ReportUtils.getReport(props.quickAction.chatReportID) : 0; + }, [props.quickAction]); - // Remove the user's own avatar if there are others - avatars = _.filter(avatars, (avatar) => avatar.id !== props.session.accountID); + const quickActionAvatars = useMemo(() => { + if (quickActionReport) { + const avatars = ReportUtils.getIcons(quickActionReport, props.personalDetails); + return avatars.length <=1 ? avatars : _.filter(avatars, (avatar) => avatar.id !== props.session.accountID); } - } + return []; + }, [quickActionReport]); const navigateToQuickAction = () => { switch (props.quickAction.action) { @@ -328,8 +327,8 @@ function FloatingActionButtonAndPopover(props) { text: translate(getQuickActionTitle(props.quickAction.action)), label: translate('quickAction.shortcut'), isLabelHoverable: false, - floatRightAvatars: avatars, - floatRightAvatarSize: avatars.length > 1 ? CONST.AVATAR_SIZE.SMALLER : CONST.AVATAR_SIZE.SMALL, + floatRightAvatars: quickActionAvatars, + floatRightAvatarSize: quickActionAvatars.length > 1 ? CONST.AVATAR_SIZE.SMALLER : CONST.AVATAR_SIZE.SMALL, description: ReportUtils.getReportName(quickActionReport), numberOfLinesDescription: 1, onSelected: () => interceptAnonymousUser(() => navigateToQuickAction()), From 8201e4c1ed6600189ab9f709e05162f452282e61 Mon Sep 17 00:00:00 2001 From: Alberto Date: Thu, 21 Mar 2024 12:21:51 +0100 Subject: [PATCH 28/46] missing dependencies --- .../sidebar/SidebarScreen/FloatingActionButtonAndPopover.js | 6 ++---- 1 file changed, 2 insertions(+), 4 deletions(-) diff --git a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js index 6dd6bc7c1a91..a1bf1cd4d012 100644 --- a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js +++ b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js @@ -142,9 +142,7 @@ function FloatingActionButtonAndPopover(props) { const prevIsFocused = usePrevious(props.isFocused); - const quickActionReport = useMemo(() => { - return props.quickAction ? ReportUtils.getReport(props.quickAction.chatReportID) : 0; - }, [props.quickAction]); + const quickActionReport = useMemo(() => props.quickAction ? ReportUtils.getReport(props.quickAction.chatReportID) : 0, [props.quickAction]); const quickActionAvatars = useMemo(() => { if (quickActionReport) { @@ -152,7 +150,7 @@ function FloatingActionButtonAndPopover(props) { return avatars.length <=1 ? avatars : _.filter(avatars, (avatar) => avatar.id !== props.session.accountID); } return []; - }, [quickActionReport]); + }, [props.personalDetails, props.session.accountID, quickActionReport]); const navigateToQuickAction = () => { switch (props.quickAction.action) { From 9428a61477053b84a36484940759e65c86b55628 Mon Sep 17 00:00:00 2001 From: Alberto Date: Thu, 21 Mar 2024 12:30:57 +0100 Subject: [PATCH 29/46] prettier --- src/components/MenuItem.tsx | 434 +++++++++--------- .../FloatingActionButtonAndPopover.js | 6 +- 2 files changed, 222 insertions(+), 218 deletions(-) diff --git a/src/components/MenuItem.tsx b/src/components/MenuItem.tsx index 15a083bb1c6a..dc5eb9056e8d 100644 --- a/src/components/MenuItem.tsx +++ b/src/components/MenuItem.tsx @@ -154,7 +154,7 @@ type MenuItemBaseProps = { /** Text that appears above the title */ label?: string; - isLabelHoverable?: boolean + isLabelHoverable?: boolean; /** Label to be displayed on the right */ rightLabel?: string; @@ -412,245 +412,249 @@ function MenuItem( return ( - {(!!label && !isLabelHoverable) && ( + {!!label && !isLabelHoverable && ( {label} )} - - {(isHovered) => ( - shouldBlockSelection && isSmallScreenWidth && DeviceCapabilities.canUseTouchScreen() && ControlSelection.block()} - onPressOut={ControlSelection.unblock} - onSecondaryInteraction={onSecondaryInteraction} - style={({pressed}) => - [ - containerStyle, - errorText ? styles.pb5 : {}, - combinedStyle, - !interactive && styles.cursorDefault, - StyleUtils.getButtonBackgroundColorStyle(getButtonState(focused || isHovered, pressed, success, disabled, interactive), true), - !focused && (isHovered || pressed) && hoverAndPressStyle, - ...(Array.isArray(wrapperStyle) ? wrapperStyle : [wrapperStyle]), - shouldGreyOutWhenDisabled && disabled && styles.buttonOpacityDisabled, - ] as StyleProp - } - disabledStyle={shouldUseDefaultCursorWhenDisabled && [styles.cursorDefault]} - disabled={disabled || isExecuting} - ref={ref} - role={CONST.ROLE.MENUITEM} - accessibilityLabel={title ? title.toString() : ''} - accessible - > - {({pressed}) => ( - <> - - {(!!label && isLabelHoverable) && ( - - {label} - - )} - - {!!icon && Array.isArray(icon) && ( - + + {(isHovered) => ( + shouldBlockSelection && isSmallScreenWidth && DeviceCapabilities.canUseTouchScreen() && ControlSelection.block()} + onPressOut={ControlSelection.unblock} + onSecondaryInteraction={onSecondaryInteraction} + style={({pressed}) => + [ + containerStyle, + errorText ? styles.pb5 : {}, + combinedStyle, + !interactive && styles.cursorDefault, + StyleUtils.getButtonBackgroundColorStyle(getButtonState(focused || isHovered, pressed, success, disabled, interactive), true), + !focused && (isHovered || pressed) && hoverAndPressStyle, + ...(Array.isArray(wrapperStyle) ? wrapperStyle : [wrapperStyle]), + shouldGreyOutWhenDisabled && disabled && styles.buttonOpacityDisabled, + ] as StyleProp + } + disabledStyle={shouldUseDefaultCursorWhenDisabled && [styles.cursorDefault]} + disabled={disabled || isExecuting} + ref={ref} + role={CONST.ROLE.MENUITEM} + accessibilityLabel={title ? title.toString() : ''} + accessible + > + {({pressed}) => ( + <> + + {!!label && isLabelHoverable && ( + + + {label} + + )} - {!icon && shouldPutLeftPaddingWhenNoIcon && } - {icon && !Array.isArray(icon) && ( - - {typeof icon !== 'string' && iconType === CONST.ICON_TYPE_ICON && ( + + {!!icon && Array.isArray(icon) && ( + + )} + {!icon && shouldPutLeftPaddingWhenNoIcon && } + {icon && !Array.isArray(icon) && ( + + {typeof icon !== 'string' && iconType === CONST.ICON_TYPE_ICON && ( + + )} + {icon && iconType === CONST.ICON_TYPE_WORKSPACE && ( + + )} + {iconType === CONST.ICON_TYPE_AVATAR && ( + + )} + + )} + {secondaryIcon && ( + - )} - {icon && iconType === CONST.ICON_TYPE_WORKSPACE && ( - - )} - {iconType === CONST.ICON_TYPE_AVATAR && ( - - )} - - )} - {secondaryIcon && ( - - - - )} - - {!!description && shouldShowDescriptionOnTop && ( - - {description} - + )} - - {!!title && (shouldRenderAsHTML || (shouldParseTitle && !!html.length)) && ( - - - - )} - {!shouldRenderAsHTML && !shouldParseTitle && !!title && ( + + {!!description && shouldShowDescriptionOnTop && ( - {renderTitleContent()} + {description} )} - {shouldShowTitleIcon && titleIcon && ( - - - - )} - - {!!description && !shouldShowDescriptionOnTop && ( - - {description} - - )} - {!!error && ( - - {error} - - )} - {!!furtherDetails && ( - - {!!furtherDetailsIcon && ( - + + {!!title && (shouldRenderAsHTML || (shouldParseTitle && !!html.length)) && ( + + + + )} + {!shouldRenderAsHTML && !shouldParseTitle && !!title && ( + + {renderTitleContent()} + )} + {shouldShowTitleIcon && titleIcon && ( + + + + )} + + {!!description && !shouldShowDescriptionOnTop && ( - {furtherDetails} + {description} - - )} + )} + {!!error && ( + + {error} + + )} + {!!furtherDetails && ( + + {!!furtherDetailsIcon && ( + + )} + + {furtherDetails} + + + )} + - - - {badgeText && ( - - )} - {/* Since subtitle can be of type number, we should allow 0 to be shown */} - {(subtitle === 0 || subtitle) && ( - - {subtitle} - - )} - {floatRightAvatars?.length > 0 && ( - - - - )} - {!!brickRoadIndicator && ( - - - - )} - {!title && !!rightLabel && ( - - {rightLabel} - - )} - {shouldShowRightIcon && ( - - + {badgeText && ( + - + )} + {/* Since subtitle can be of type number, we should allow 0 to be shown */} + {(subtitle === 0 || subtitle) && ( + + {subtitle} + + )} + {floatRightAvatars?.length > 0 && ( + + + + )} + {!!brickRoadIndicator && ( + + + + )} + {!title && !!rightLabel && ( + + {rightLabel} + + )} + {shouldShowRightIcon && ( + + + + )} + {shouldShowRightComponent && rightComponent} + {shouldShowSelectedState && } + + {!!errorText && ( + )} - {shouldShowRightComponent && rightComponent} - {shouldShowSelectedState && } - - {!!errorText && ( - - )} - - )} - - )} - + + )} + + )} + ); } diff --git a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js index a1bf1cd4d012..02ccc675e4a9 100644 --- a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js +++ b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js @@ -1,5 +1,5 @@ import PropTypes from 'prop-types'; -import React, {forwardRef, useCallback, useEffect, useImperativeHandle, useRef, useState, useMemo} from 'react'; +import React, {forwardRef, useCallback, useEffect, useImperativeHandle, useMemo, useRef, useState} from 'react'; import {View} from 'react-native'; import {withOnyx} from 'react-native-onyx'; import _ from 'underscore'; @@ -142,12 +142,12 @@ function FloatingActionButtonAndPopover(props) { const prevIsFocused = usePrevious(props.isFocused); - const quickActionReport = useMemo(() => props.quickAction ? ReportUtils.getReport(props.quickAction.chatReportID) : 0, [props.quickAction]); + const quickActionReport = useMemo(() => (props.quickAction ? ReportUtils.getReport(props.quickAction.chatReportID) : 0), [props.quickAction]); const quickActionAvatars = useMemo(() => { if (quickActionReport) { const avatars = ReportUtils.getIcons(quickActionReport, props.personalDetails); - return avatars.length <=1 ? avatars : _.filter(avatars, (avatar) => avatar.id !== props.session.accountID); + return avatars.length <= 1 ? avatars : _.filter(avatars, (avatar) => avatar.id !== props.session.accountID); } return []; }, [props.personalDetails, props.session.accountID, quickActionReport]); From 844c4b8bf817938eb9c42d9e2f87e259f484dfdd Mon Sep 17 00:00:00 2001 From: Alberto Date: Thu, 21 Mar 2024 12:50:14 +0100 Subject: [PATCH 30/46] dependencies --- .../sidebar/SidebarScreen/FloatingActionButtonAndPopover.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js index 02ccc675e4a9..ab9044f49859 100644 --- a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js +++ b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js @@ -150,7 +150,7 @@ function FloatingActionButtonAndPopover(props) { return avatars.length <= 1 ? avatars : _.filter(avatars, (avatar) => avatar.id !== props.session.accountID); } return []; - }, [props.personalDetails, props.session.accountID, quickActionReport]); + }, [props.personalDetails, props.session.accountID, props.quickAction]); const navigateToQuickAction = () => { switch (props.quickAction.action) { From 5f5356b5b8c06036f9e1eb28712404877b258ff4 Mon Sep 17 00:00:00 2001 From: Alberto Date: Thu, 21 Mar 2024 13:13:19 +0100 Subject: [PATCH 31/46] merge main --- .../sidebar/SidebarScreen/FloatingActionButtonAndPopover.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js index eacaed6a7f61..cb8056d21a4a 100644 --- a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js +++ b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js @@ -152,7 +152,7 @@ function FloatingActionButtonAndPopover(props) { return avatars.length <= 1 ? avatars : _.filter(avatars, (avatar) => avatar.id !== props.session.accountID); } return []; - }, [props.personalDetails, props.session.accountID, props.quickAction]); + }, [props.personalDetails, props.session.accountID, quickActionReport]); const navigateToQuickAction = () => { switch (props.quickAction.action) { From 9da221aa3135974514294e09117b48e05bdf3136 Mon Sep 17 00:00:00 2001 From: Alberto Date: Thu, 21 Mar 2024 13:31:24 +0100 Subject: [PATCH 32/46] investigte performnce issue --- .../SidebarScreen/FloatingActionButtonAndPopover.js | 8 +------- 1 file changed, 1 insertion(+), 7 deletions(-) diff --git a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js index cb8056d21a4a..e4fbb4903fbe 100644 --- a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js +++ b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js @@ -146,13 +146,7 @@ function FloatingActionButtonAndPopover(props) { const quickActionReport = useMemo(() => (props.quickAction ? ReportUtils.getReport(props.quickAction.chatReportID) : 0), [props.quickAction]); - const quickActionAvatars = useMemo(() => { - if (quickActionReport) { - const avatars = ReportUtils.getIcons(quickActionReport, props.personalDetails); - return avatars.length <= 1 ? avatars : _.filter(avatars, (avatar) => avatar.id !== props.session.accountID); - } - return []; - }, [props.personalDetails, props.session.accountID, quickActionReport]); + const quickActionAvatars = useMemo(() => quickActionReport ? ReportUtils.getIcons(quickActionReport, props.personalDetails) : [], [props.personalDetails, props.session.accountID, quickActionReport]); const navigateToQuickAction = () => { switch (props.quickAction.action) { From 4db50be6894938fee4897d73e9e4831e43c20523 Mon Sep 17 00:00:00 2001 From: Alberto Date: Thu, 21 Mar 2024 13:44:04 +0100 Subject: [PATCH 33/46] more investigation --- .../sidebar/SidebarScreen/FloatingActionButtonAndPopover.js | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js index e4fbb4903fbe..5d677ad09b1c 100644 --- a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js +++ b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js @@ -144,9 +144,10 @@ function FloatingActionButtonAndPopover(props) { const prevIsFocused = usePrevious(props.isFocused); - const quickActionReport = useMemo(() => (props.quickAction ? ReportUtils.getReport(props.quickAction.chatReportID) : 0), [props.quickAction]); + const quickActionReport = props.quickAction ? ReportUtils.getReport(props.quickAction.chatReportID) : 0; - const quickActionAvatars = useMemo(() => quickActionReport ? ReportUtils.getIcons(quickActionReport, props.personalDetails) : [], [props.personalDetails, props.session.accountID, quickActionReport]); + const avatars = ReportUtils.getIcons(quickActionReport, props.personalDetails); + const quickActionAvatars = avatars.length <= 1 ? avatars : _.filter(avatars, (avatar) => avatar.id !== props.session.accountID); const navigateToQuickAction = () => { switch (props.quickAction.action) { From e557a48362b8ecab2f605a198af513b414171097 Mon Sep 17 00:00:00 2001 From: Alberto Date: Thu, 21 Mar 2024 13:55:13 +0100 Subject: [PATCH 34/46] back to riginal approach --- .../SidebarScreen/FloatingActionButtonAndPopover.js | 11 ++++++++--- 1 file changed, 8 insertions(+), 3 deletions(-) diff --git a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js index 5d677ad09b1c..eacaed6a7f61 100644 --- a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js +++ b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js @@ -144,10 +144,15 @@ function FloatingActionButtonAndPopover(props) { const prevIsFocused = usePrevious(props.isFocused); - const quickActionReport = props.quickAction ? ReportUtils.getReport(props.quickAction.chatReportID) : 0; + const quickActionReport = useMemo(() => (props.quickAction ? ReportUtils.getReport(props.quickAction.chatReportID) : 0), [props.quickAction]); - const avatars = ReportUtils.getIcons(quickActionReport, props.personalDetails); - const quickActionAvatars = avatars.length <= 1 ? avatars : _.filter(avatars, (avatar) => avatar.id !== props.session.accountID); + const quickActionAvatars = useMemo(() => { + if (quickActionReport) { + const avatars = ReportUtils.getIcons(quickActionReport, props.personalDetails); + return avatars.length <= 1 ? avatars : _.filter(avatars, (avatar) => avatar.id !== props.session.accountID); + } + return []; + }, [props.personalDetails, props.session.accountID, props.quickAction]); const navigateToQuickAction = () => { switch (props.quickAction.action) { From c17cba67e1fa9b0f70fb056de039fce59d251d21 Mon Sep 17 00:00:00 2001 From: Alberto Date: Thu, 21 Mar 2024 14:01:23 +0100 Subject: [PATCH 35/46] dependencies --- .../sidebar/SidebarScreen/FloatingActionButtonAndPopover.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js index eacaed6a7f61..cb8056d21a4a 100644 --- a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js +++ b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js @@ -152,7 +152,7 @@ function FloatingActionButtonAndPopover(props) { return avatars.length <= 1 ? avatars : _.filter(avatars, (avatar) => avatar.id !== props.session.accountID); } return []; - }, [props.personalDetails, props.session.accountID, props.quickAction]); + }, [props.personalDetails, props.session.accountID, quickActionReport]); const navigateToQuickAction = () => { switch (props.quickAction.action) { From d89fa9aa957bfb6777f41b5f2db376509589d522 Mon Sep 17 00:00:00 2001 From: Alberto Date: Thu, 21 Mar 2024 16:40:42 +0100 Subject: [PATCH 36/46] Fix border --- src/components/MultipleAvatars.tsx | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/components/MultipleAvatars.tsx b/src/components/MultipleAvatars.tsx index 1a27dbdae3b2..dedaba500a9c 100644 --- a/src/components/MultipleAvatars.tsx +++ b/src/components/MultipleAvatars.tsx @@ -101,8 +101,7 @@ function MultipleAvatars({ }), [styles], ); - - const secondAvatarStyle = secondAvatarStyleProp ?? [StyleUtils.getBackgroundAndBorderStyle(isHovered ? theme.hoverComponentBG : theme.componentBG)]; + const secondAvatarStyle = secondAvatarStyleProp ?? [StyleUtils.getBackgroundAndBorderStyle(isHovered ? theme.activeComponentBG : theme.componentBG)]; let avatarContainerStyles = StyleUtils.getContainerStyles(size, isInReportAction); const {singleAvatarStyle, secondAvatarStyles} = useMemo(() => avatarSizeToStylesMap[size as AvatarSizeToStyles] ?? avatarSizeToStylesMap.default, [size, avatarSizeToStylesMap]); From b4a221f6664361afbc43207910ceacffa2d798bf Mon Sep 17 00:00:00 2001 From: Alberto Date: Fri, 22 Mar 2024 00:19:41 +0100 Subject: [PATCH 37/46] Correct margins --- src/components/MenuItem.tsx | 3 ++- src/styles/utils/spacing.ts | 4 ++++ 2 files changed, 6 insertions(+), 1 deletion(-) diff --git a/src/components/MenuItem.tsx b/src/components/MenuItem.tsx index dc5eb9056e8d..6aa7ba7eb43e 100644 --- a/src/components/MenuItem.tsx +++ b/src/components/MenuItem.tsx @@ -326,6 +326,7 @@ function MenuItem( const isDeleted = style && Array.isArray(style) ? style.includes(styles.offlineFeedback.deleted) : false; const descriptionVerticalMargin = shouldShowDescriptionOnTop ? styles.mb1 : styles.mt1; + const floatRightAvatarsMargin = floatRightAvatars?.length > 1 ? [styles.mr2, styles.mb5] : [styles.mrn3]; const fallbackAvatarSize = viewMode === CONST.OPTION_MODE.COMPACT ? CONST.AVATAR_SIZE.SMALL : CONST.AVATAR_SIZE.DEFAULT; const combinedTitleTextStyle = StyleUtils.combineStyles( [ @@ -607,7 +608,7 @@ function MenuItem( )} {floatRightAvatars?.length > 0 && ( - + Date: Fri, 22 Mar 2024 01:20:13 +0100 Subject: [PATCH 38/46] better styling --- src/components/MenuItem.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/MenuItem.tsx b/src/components/MenuItem.tsx index 6aa7ba7eb43e..6d31b3013c54 100644 --- a/src/components/MenuItem.tsx +++ b/src/components/MenuItem.tsx @@ -326,7 +326,7 @@ function MenuItem( const isDeleted = style && Array.isArray(style) ? style.includes(styles.offlineFeedback.deleted) : false; const descriptionVerticalMargin = shouldShowDescriptionOnTop ? styles.mb1 : styles.mt1; - const floatRightAvatarsMargin = floatRightAvatars?.length > 1 ? [styles.mr2, styles.mb5] : [styles.mrn3]; + const floatRightAvatarsStyle = floatRightAvatars?.length > 1 ? [styles.mr2, styles.alignItemsCenter] : [styles.mrn3, styles.justifyContentCenter]; const fallbackAvatarSize = viewMode === CONST.OPTION_MODE.COMPACT ? CONST.AVATAR_SIZE.SMALL : CONST.AVATAR_SIZE.DEFAULT; const combinedTitleTextStyle = StyleUtils.combineStyles( [ @@ -608,7 +608,7 @@ function MenuItem( )} {floatRightAvatars?.length > 0 && ( - + Date: Fri, 22 Mar 2024 11:46:28 +0100 Subject: [PATCH 39/46] prettier --- src/libs/actions/IOU.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/libs/actions/IOU.ts b/src/libs/actions/IOU.ts index 7318302eb748..f659284435f7 100644 --- a/src/libs/actions/IOU.ts +++ b/src/libs/actions/IOU.ts @@ -336,7 +336,7 @@ function startMoneyRequest(iouType: ValueOf, reportID: st Navigation.navigate(ROUTES.MONEY_REQUEST_CREATE_TAB_DISTANCE.getRoute(CONST.IOU.ACTION.CREATE, iouType, CONST.IOU.OPTIMISTIC_TRANSACTION_ID, reportID)); return; default: - Navigation.navigate(ROUTES.MONEY_REQUEST_CREATE.getRoute(CONST.IOU.ACTION.CREATE, iouType, CONST.IOU.OPTIMISTIC_TRANSACTION_ID, reportID)) + Navigation.navigate(ROUTES.MONEY_REQUEST_CREATE.getRoute(CONST.IOU.ACTION.CREATE, iouType, CONST.IOU.OPTIMISTIC_TRANSACTION_ID, reportID)); } } From 8137d9f5b4abad640fe0e62a5ac4467211f41ec9 Mon Sep 17 00:00:00 2001 From: Alberto Date: Fri, 22 Mar 2024 20:55:34 +0100 Subject: [PATCH 40/46] rename margin --- src/components/MenuItem.tsx | 2 +- src/styles/utils/spacing.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/MenuItem.tsx b/src/components/MenuItem.tsx index 6d31b3013c54..6f157cb9b38a 100644 --- a/src/components/MenuItem.tsx +++ b/src/components/MenuItem.tsx @@ -326,7 +326,7 @@ function MenuItem( const isDeleted = style && Array.isArray(style) ? style.includes(styles.offlineFeedback.deleted) : false; const descriptionVerticalMargin = shouldShowDescriptionOnTop ? styles.mb1 : styles.mt1; - const floatRightAvatarsStyle = floatRightAvatars?.length > 1 ? [styles.mr2, styles.alignItemsCenter] : [styles.mrn3, styles.justifyContentCenter]; + const floatRightAvatarsStyle = floatRightAvatars?.length > 1 ? [styles.mr2, styles.alignItemsCenter] : [styles.mrn2, styles.justifyContentCenter]; const fallbackAvatarSize = viewMode === CONST.OPTION_MODE.COMPACT ? CONST.AVATAR_SIZE.SMALL : CONST.AVATAR_SIZE.DEFAULT; const combinedTitleTextStyle = StyleUtils.combineStyles( [ diff --git a/src/styles/utils/spacing.ts b/src/styles/utils/spacing.ts index ac4277ee9216..242d66a383f0 100644 --- a/src/styles/utils/spacing.ts +++ b/src/styles/utils/spacing.ts @@ -123,7 +123,7 @@ export default { marginRight: 32, }, - mrn3: { + mrn2: { marginRight: -8, }, From fe562500570dac7e646ef812ddbaa5c20f11f99a Mon Sep 17 00:00:00 2001 From: Alberto Date: Mon, 25 Mar 2024 16:20:09 +0100 Subject: [PATCH 41/46] use focus mode styles --- src/components/MenuItem.tsx | 4 ++-- .../sidebar/SidebarScreen/FloatingActionButtonAndPopover.js | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/src/components/MenuItem.tsx b/src/components/MenuItem.tsx index 6f157cb9b38a..165cab786a91 100644 --- a/src/components/MenuItem.tsx +++ b/src/components/MenuItem.tsx @@ -326,7 +326,6 @@ function MenuItem( const isDeleted = style && Array.isArray(style) ? style.includes(styles.offlineFeedback.deleted) : false; const descriptionVerticalMargin = shouldShowDescriptionOnTop ? styles.mb1 : styles.mt1; - const floatRightAvatarsStyle = floatRightAvatars?.length > 1 ? [styles.mr2, styles.alignItemsCenter] : [styles.mrn2, styles.justifyContentCenter]; const fallbackAvatarSize = viewMode === CONST.OPTION_MODE.COMPACT ? CONST.AVATAR_SIZE.SMALL : CONST.AVATAR_SIZE.DEFAULT; const combinedTitleTextStyle = StyleUtils.combineStyles( [ @@ -608,7 +607,7 @@ function MenuItem( )} {floatRightAvatars?.length > 0 && ( - + )} diff --git a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js index 6a13bf9ab3cb..28627d9d72ab 100644 --- a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js +++ b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js @@ -343,7 +343,7 @@ function FloatingActionButtonAndPopover(props) { label: translate('quickAction.shortcut'), isLabelHoverable: false, floatRightAvatars: quickActionAvatars, - floatRightAvatarSize: quickActionAvatars.length > 1 ? CONST.AVATAR_SIZE.SMALLER : CONST.AVATAR_SIZE.SMALL, + floatRightAvatarSize: CONST.AVATAR_SIZE.SMALL, description: ReportUtils.getReportName(quickActionReport), numberOfLinesDescription: 1, onSelected: () => interceptAnonymousUser(() => navigateToQuickAction()), From 399d95be8768fba50f450d20d817a055d41eddc8 Mon Sep 17 00:00:00 2001 From: Alberto Date: Mon, 25 Mar 2024 16:25:40 +0100 Subject: [PATCH 42/46] fix style --- src/components/MenuItem.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/MenuItem.tsx b/src/components/MenuItem.tsx index 165cab786a91..28a67df96f12 100644 --- a/src/components/MenuItem.tsx +++ b/src/components/MenuItem.tsx @@ -607,7 +607,7 @@ function MenuItem( )} {floatRightAvatars?.length > 0 && ( - + Date: Mon, 25 Mar 2024 16:38:48 +0100 Subject: [PATCH 43/46] style --- src/components/MenuItem.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/MenuItem.tsx b/src/components/MenuItem.tsx index 28a67df96f12..345856c88aef 100644 --- a/src/components/MenuItem.tsx +++ b/src/components/MenuItem.tsx @@ -615,7 +615,7 @@ function MenuItem( size={floatRightAvatarSize ?? fallbackAvatarSize} fallbackIcon={defaultWorkspaceAvatars.WorkspaceBuilding} shouldStackHorizontally={shouldStackHorizontally} - isFocusMode={true} + isFocusMode /> )} From f08a249504965089002c91df775e8fd110252b22 Mon Sep 17 00:00:00 2001 From: Alberto Date: Mon, 25 Mar 2024 17:33:42 +0100 Subject: [PATCH 44/46] use subscript for workspaces --- src/components/MenuItem.tsx | 33 ++++++++++++++----- src/components/PopoverMenu.tsx | 1 + .../FloatingActionButtonAndPopover.js | 3 +- 3 files changed, 27 insertions(+), 10 deletions(-) diff --git a/src/components/MenuItem.tsx b/src/components/MenuItem.tsx index 345856c88aef..a38efbb5f720 100644 --- a/src/components/MenuItem.tsx +++ b/src/components/MenuItem.tsx @@ -36,6 +36,7 @@ import PressableWithSecondaryInteraction from './PressableWithSecondaryInteracti import RenderHTML from './RenderHTML'; import SelectCircle from './SelectCircle'; import Text from './Text'; +import SubscriptAvatar from "@components/SubscriptAvatar"; type IconProps = { /** Flag to choose between avatar image or an icon */ @@ -186,6 +187,9 @@ type MenuItemBaseProps = { /** Prop to represent the size of the float right avatar images to be shown */ floatRightAvatarSize?: ValueOf; + /** Whether the secondary right avatar should show as a subscript */ + shouldShowSubscriptRightAvatar?: boolean; + /** Affects avatar size */ viewMode?: ValueOf; @@ -296,6 +300,7 @@ function MenuItem( rightComponent, floatRightAvatars = [], floatRightAvatarSize, + shouldShowSubscriptRightAvatar = false, avatarSize = CONST.AVATAR_SIZE.DEFAULT, isSmallAvatarSubscriptMenu = false, brickRoadIndicator, @@ -608,15 +613,25 @@ function MenuItem( )} {floatRightAvatars?.length > 0 && ( - + {shouldShowSubscriptRightAvatar ? ( + + ) : ( + + )} + )} {!!brickRoadIndicator && ( diff --git a/src/components/PopoverMenu.tsx b/src/components/PopoverMenu.tsx index a1020d22382b..1fd1c8ef5a3b 100644 --- a/src/components/PopoverMenu.tsx +++ b/src/components/PopoverMenu.tsx @@ -213,6 +213,7 @@ function PopoverMenu({ isLabelHoverable={item.isLabelHoverable} floatRightAvatars={item.floatRightAvatars} floatRightAvatarSize={item.floatRightAvatarSize} + shouldShowSubscriptRightAvatar={item.shouldShowSubscriptRightAvatar} disabled={item.disabled} /> ))} diff --git a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js index 28627d9d72ab..f501d2b9d3e6 100644 --- a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js +++ b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js @@ -149,7 +149,7 @@ function FloatingActionButtonAndPopover(props) { const quickActionAvatars = useMemo(() => { if (quickActionReport) { const avatars = ReportUtils.getIcons(quickActionReport, props.personalDetails); - return avatars.length <= 1 ? avatars : _.filter(avatars, (avatar) => avatar.id !== props.session.accountID); + return (avatars.length <= 1 || ReportUtils.isPolicyExpenseChat(quickActionReport)) ? avatars : _.filter(avatars, (avatar) => avatar.id !== props.session.accountID); } return []; }, [props.personalDetails, props.session.accountID, quickActionReport]); @@ -347,6 +347,7 @@ function FloatingActionButtonAndPopover(props) { description: ReportUtils.getReportName(quickActionReport), numberOfLinesDescription: 1, onSelected: () => interceptAnonymousUser(() => navigateToQuickAction()), + shouldShowSubscriptRightAvatar: true, }, ] : []), From 6b4a73eaef47542455dd78243c52af08129310d2 Mon Sep 17 00:00:00 2001 From: Alberto Date: Mon, 25 Mar 2024 17:35:48 +0100 Subject: [PATCH 45/46] pass correct value --- src/components/MenuItem.tsx | 2 +- .../sidebar/SidebarScreen/FloatingActionButtonAndPopover.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/MenuItem.tsx b/src/components/MenuItem.tsx index a38efbb5f720..a16d40df27e2 100644 --- a/src/components/MenuItem.tsx +++ b/src/components/MenuItem.tsx @@ -36,7 +36,7 @@ import PressableWithSecondaryInteraction from './PressableWithSecondaryInteracti import RenderHTML from './RenderHTML'; import SelectCircle from './SelectCircle'; import Text from './Text'; -import SubscriptAvatar from "@components/SubscriptAvatar"; +import SubscriptAvatar from "./SubscriptAvatar"; type IconProps = { /** Flag to choose between avatar image or an icon */ diff --git a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js index f501d2b9d3e6..bda5e534299a 100644 --- a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js +++ b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js @@ -347,7 +347,7 @@ function FloatingActionButtonAndPopover(props) { description: ReportUtils.getReportName(quickActionReport), numberOfLinesDescription: 1, onSelected: () => interceptAnonymousUser(() => navigateToQuickAction()), - shouldShowSubscriptRightAvatar: true, + shouldShowSubscriptRightAvatar: ReportUtils.isPolicyExpenseChat(quickActionReport), }, ] : []), From 97c8d0e9c78d6746e4d0dc7081ef2ef7afae9dc9 Mon Sep 17 00:00:00 2001 From: Alberto Date: Mon, 25 Mar 2024 17:36:23 +0100 Subject: [PATCH 46/46] prettier --- src/components/MenuItem.tsx | 3 +-- .../sidebar/SidebarScreen/FloatingActionButtonAndPopover.js | 2 +- 2 files changed, 2 insertions(+), 3 deletions(-) diff --git a/src/components/MenuItem.tsx b/src/components/MenuItem.tsx index a16d40df27e2..110256ba166b 100644 --- a/src/components/MenuItem.tsx +++ b/src/components/MenuItem.tsx @@ -35,8 +35,8 @@ import MultipleAvatars from './MultipleAvatars'; import PressableWithSecondaryInteraction from './PressableWithSecondaryInteraction'; import RenderHTML from './RenderHTML'; import SelectCircle from './SelectCircle'; +import SubscriptAvatar from './SubscriptAvatar'; import Text from './Text'; -import SubscriptAvatar from "./SubscriptAvatar"; type IconProps = { /** Flag to choose between avatar image or an icon */ @@ -631,7 +631,6 @@ function MenuItem( isFocusMode /> )} - )} {!!brickRoadIndicator && ( diff --git a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js index bda5e534299a..117083293b5d 100644 --- a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js +++ b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js @@ -149,7 +149,7 @@ function FloatingActionButtonAndPopover(props) { const quickActionAvatars = useMemo(() => { if (quickActionReport) { const avatars = ReportUtils.getIcons(quickActionReport, props.personalDetails); - return (avatars.length <= 1 || ReportUtils.isPolicyExpenseChat(quickActionReport)) ? avatars : _.filter(avatars, (avatar) => avatar.id !== props.session.accountID); + return avatars.length <= 1 || ReportUtils.isPolicyExpenseChat(quickActionReport) ? avatars : _.filter(avatars, (avatar) => avatar.id !== props.session.accountID); } return []; }, [props.personalDetails, props.session.accountID, quickActionReport]);