From e373048e657ca7e0f7d724f0ce9c2c0578b4a323 Mon Sep 17 00:00:00 2001 From: Blazej Kustra Date: Thu, 22 Aug 2024 11:42:27 +0200 Subject: [PATCH 01/12] Display empty state when the member list is empty --- .../WorkspaceWorkflowsApprovalsExpensesFromPage.tsx | 10 ++++++---- 1 file changed, 6 insertions(+), 4 deletions(-) diff --git a/src/pages/workspace/workflows/approvals/WorkspaceWorkflowsApprovalsExpensesFromPage.tsx b/src/pages/workspace/workflows/approvals/WorkspaceWorkflowsApprovalsExpensesFromPage.tsx index 413a8787ee34..10d09cd79dd4 100644 --- a/src/pages/workspace/workflows/approvals/WorkspaceWorkflowsApprovalsExpensesFromPage.tsx +++ b/src/pages/workspace/workflows/approvals/WorkspaceWorkflowsApprovalsExpensesFromPage.tsx @@ -168,7 +168,8 @@ function WorkspaceWorkflowsApprovalsExpensesFromPage({policy, isLoadingReportDat setSelectedMembers(isAlreadySelected ? selectedMembers.filter((selectedOption) => selectedOption.login !== member.login) : [...selectedMembers, {...member, isSelected: true}]); }; - const headerMessage = useMemo(() => (searchTerm && !sections[0].data.length ? translate('common.noResultsFound') : ''), [searchTerm, sections, translate]); + const isMembersListEmpty = !sections[0].data.length; + const headerMessage = useMemo(() => (searchTerm && isMembersListEmpty ? translate('common.noResultsFound') : ''), [searchTerm, isMembersListEmpty, translate]); return ( {approvalWorkflow?.action === CONST.APPROVAL_WORKFLOW.ACTION.CREATE && ( - {translate('workflowsExpensesFromPage.header')} + + {isMembersListEmpty ? 'Nice job! All workspace members belong to an approval workflow.' : translate('workflowsExpensesFromPage.header')} + )} From d7ecdfb53460d9a03c7deef60037faeac52d7bf8 Mon Sep 17 00:00:00 2001 From: Blazej Kustra Date: Thu, 22 Aug 2024 11:57:07 +0200 Subject: [PATCH 02/12] Fix lint --- .../approvals/WorkspaceWorkflowsApprovalsExpensesFromPage.tsx | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/src/pages/workspace/workflows/approvals/WorkspaceWorkflowsApprovalsExpensesFromPage.tsx b/src/pages/workspace/workflows/approvals/WorkspaceWorkflowsApprovalsExpensesFromPage.tsx index 10d09cd79dd4..2cfba6b94c6a 100644 --- a/src/pages/workspace/workflows/approvals/WorkspaceWorkflowsApprovalsExpensesFromPage.tsx +++ b/src/pages/workspace/workflows/approvals/WorkspaceWorkflowsApprovalsExpensesFromPage.tsx @@ -50,9 +50,8 @@ type WorkspaceWorkflowsApprovalsExpensesFromPageProps = WithPolicyAndFullscreenL function WorkspaceWorkflowsApprovalsExpensesFromPage({policy, isLoadingReportData = true, route}: WorkspaceWorkflowsApprovalsExpensesFromPageProps) { const styles = useThemeStyles(); const {translate} = useLocalize(); - const [didScreenTransitionEnd, setDidScreenTransitionEnd] = useState(false); const [searchTerm, debouncedSearchTerm, setSearchTerm] = useDebouncedState(''); - const [approvalWorkflow, approvalWorkflowMetadata] = useOnyx(ONYXKEYS.APPROVAL_WORKFLOW); + const [approvalWorkflow] = useOnyx(ONYXKEYS.APPROVAL_WORKFLOW); const [selectedMembers, setSelectedMembers] = useState([]); // eslint-disable-next-line rulesdir/no-negated-variables @@ -179,7 +178,6 @@ function WorkspaceWorkflowsApprovalsExpensesFromPage({policy, isLoadingReportDat setDidScreenTransitionEnd(true)} > Date: Thu, 22 Aug 2024 16:12:40 +0200 Subject: [PATCH 03/12] Clean the code --- src/languages/en.ts | 1 + src/languages/es.ts | 1 + .../approvals/WorkspaceWorkflowsApprovalsExpensesFromPage.tsx | 2 +- 3 files changed, 3 insertions(+), 1 deletion(-) diff --git a/src/languages/en.ts b/src/languages/en.ts index a378df670367..a7136dcc6e46 100755 --- a/src/languages/en.ts +++ b/src/languages/en.ts @@ -1356,6 +1356,7 @@ export default { workflowsExpensesFromPage: { title: 'Expenses from', header: 'When the following members submit expenses:', + emptyMembersList: 'Nice job! All workspace members belong to an approval workflow.', }, workflowsApproverPage: { genericErrorMessage: "The approver couldn't be changed. Please try again or contact support.", diff --git a/src/languages/es.ts b/src/languages/es.ts index a106666bf2ca..4cfeba6259de 100644 --- a/src/languages/es.ts +++ b/src/languages/es.ts @@ -1363,6 +1363,7 @@ export default { workflowsExpensesFromPage: { title: 'Gastos de', header: 'Cuando los siguientes miembros presenten gastos:', + emptyMembersList: '¡Buen trabajo! Todos los miembros del espacio de trabajo pertenecen a un flujo de trabajo de aprobación.', }, workflowsApproverPage: { genericErrorMessage: 'El aprobador no pudo ser cambiado. Por favor, inténtelo de nuevo o contacte al soporte.', diff --git a/src/pages/workspace/workflows/approvals/WorkspaceWorkflowsApprovalsExpensesFromPage.tsx b/src/pages/workspace/workflows/approvals/WorkspaceWorkflowsApprovalsExpensesFromPage.tsx index 2cfba6b94c6a..e7de43cebee2 100644 --- a/src/pages/workspace/workflows/approvals/WorkspaceWorkflowsApprovalsExpensesFromPage.tsx +++ b/src/pages/workspace/workflows/approvals/WorkspaceWorkflowsApprovalsExpensesFromPage.tsx @@ -191,7 +191,7 @@ function WorkspaceWorkflowsApprovalsExpensesFromPage({policy, isLoadingReportDat /> {approvalWorkflow?.action === CONST.APPROVAL_WORKFLOW.ACTION.CREATE && ( - {isMembersListEmpty ? 'Nice job! All workspace members belong to an approval workflow.' : translate('workflowsExpensesFromPage.header')} + {translate(isMembersListEmpty ? 'workflowsExpensesFromPage.emptyMembersList' : 'workflowsExpensesFromPage.header')} )} Date: Thu, 22 Aug 2024 16:33:13 +0200 Subject: [PATCH 04/12] Update translation --- src/languages/es.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/languages/es.ts b/src/languages/es.ts index 4cfeba6259de..6d2688c964e0 100644 --- a/src/languages/es.ts +++ b/src/languages/es.ts @@ -1363,7 +1363,7 @@ export default { workflowsExpensesFromPage: { title: 'Gastos de', header: 'Cuando los siguientes miembros presenten gastos:', - emptyMembersList: '¡Buen trabajo! Todos los miembros del espacio de trabajo pertenecen a un flujo de trabajo de aprobación.', + emptyMembersList: '¡Buen trabajo! Todos los miembros del espacio de trabajo pertenecen a un flujo de aprobación.', }, workflowsApproverPage: { genericErrorMessage: 'El aprobador no pudo ser cambiado. Por favor, inténtelo de nuevo o contacte al soporte.', From 465bab00096321cb2c339d640b6fab84cd3b161b Mon Sep 17 00:00:00 2001 From: Blazej Kustra Date: Mon, 26 Aug 2024 19:09:30 +0200 Subject: [PATCH 05/12] Improve empty state --- .../approvals/WorkspaceWorkflowsApprovalsApproverPage.tsx | 4 ++-- .../WorkspaceWorkflowsApprovalsExpensesFromPage.tsx | 6 +++--- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/src/pages/workspace/workflows/approvals/WorkspaceWorkflowsApprovalsApproverPage.tsx b/src/pages/workspace/workflows/approvals/WorkspaceWorkflowsApprovalsApproverPage.tsx index 545c09f75313..8459b8c2ee84 100644 --- a/src/pages/workspace/workflows/approvals/WorkspaceWorkflowsApprovalsApproverPage.tsx +++ b/src/pages/workspace/workflows/approvals/WorkspaceWorkflowsApprovalsApproverPage.tsx @@ -220,7 +220,7 @@ function WorkspaceWorkflowsApprovalsApproverPageBeta({policy, personalDetails, i setSelectedApproverEmail(approver.login); }; - const headerMessage = useMemo(() => (searchTerm && !sections[0].data.length ? translate('common.noResultsFound') : ''), [searchTerm, sections, translate]); + const isApproversListEmpty = !sections[0].data.length && didScreenTransitionEnd; return ( (searchTerm && isMembersListEmpty ? translate('common.noResultsFound') : ''), [searchTerm, isMembersListEmpty, translate]); + const headerMessage = useMemo(() => (debouncedSearchTerm && isMembersListEmpty ? translate('common.noResultsFound') : ''), [debouncedSearchTerm, isMembersListEmpty, translate]); return ( {approvalWorkflow?.action === CONST.APPROVAL_WORKFLOW.ACTION.CREATE && ( - {translate(isMembersListEmpty ? 'workflowsExpensesFromPage.emptyMembersList' : 'workflowsExpensesFromPage.header')} + {translate(!debouncedSearchTerm && isMembersListEmpty ? 'workflowsExpensesFromPage.emptyMembersList' : 'workflowsExpensesFromPage.header')} )} Date: Wed, 28 Aug 2024 18:55:12 +0200 Subject: [PATCH 06/12] Update translations --- src/languages/en.ts | 6 +++++- src/languages/es.ts | 5 +++++ 2 files changed, 10 insertions(+), 1 deletion(-) diff --git a/src/languages/en.ts b/src/languages/en.ts index efdbe10baca3..1378f7c7ff83 100755 --- a/src/languages/en.ts +++ b/src/languages/en.ts @@ -1344,6 +1344,11 @@ export default { approverInMultipleWorkflows: 'This member already belongs to another approval workflow. Any updates here will reflect there too.', approverCircularReference: ({name1, name2}: ApprovalWorkflowErrorParams) => `${name1} already approves reports to ${name2}. Please choose a different approver to avoid a circular workflow.`, + emptyContent: { + title: 'No members to display', + expensesFromSubtitle: 'All workspace members already belong to an existing approval workflow.', + approverSubtitle: 'All approvers belong to an existing workflow.', + }, }, workflowsDelayedSubmissionPage: { autoReportingErrorMessage: "Delayed submission couldn't be changed. Please try again or contact support.", @@ -1364,7 +1369,6 @@ export default { workflowsExpensesFromPage: { title: 'Expenses from', header: 'When the following members submit expenses:', - emptyMembersList: 'Nice job! All workspace members belong to an approval workflow.', }, workflowsApproverPage: { genericErrorMessage: "The approver couldn't be changed. Please try again or contact support.", diff --git a/src/languages/es.ts b/src/languages/es.ts index 5df22b88e4d1..3c66ffe95491 100644 --- a/src/languages/es.ts +++ b/src/languages/es.ts @@ -1350,6 +1350,11 @@ export default { approverInMultipleWorkflows: 'Este miembro ya pertenece a otro flujo de aprobación. Cualquier actualización aquí se reflejará allí también.', approverCircularReference: ({name1, name2}: ApprovalWorkflowErrorParams) => `${name1} ya aprueba informes a ${name2}. Por favor, elige un aprobador diferente para evitar un flujo de trabajo circular.`, + emptyContent: { + title: 'No hay miembros para mostrar', + expensesFromSubtitle: 'Todos los miembros del espacio de trabajo ya pertenecen a un flujo de aprobación existente.', + approverSubtitle: 'Todos los aprobadores pertenecen a un flujo de trabajo existente.', + }, }, workflowsDelayedSubmissionPage: { autoReportingErrorMessage: 'El parámetro de envío retrasado no pudo ser cambiado. Por favor, inténtelo de nuevo o contacte al soporte.', From f624b1c134c09bba9ab7a1926bff5264c3f536a8 Mon Sep 17 00:00:00 2001 From: Blazej Kustra Date: Wed, 28 Aug 2024 18:55:22 +0200 Subject: [PATCH 07/12] Add turtle in shell icon --- assets/images/turtle-in-shell.svg | 87 ++++++++++++++++++++++++++++ src/components/Icon/Illustrations.ts | 2 + 2 files changed, 89 insertions(+) create mode 100644 assets/images/turtle-in-shell.svg diff --git a/assets/images/turtle-in-shell.svg b/assets/images/turtle-in-shell.svg new file mode 100644 index 000000000000..6c5a8e74bb31 --- /dev/null +++ b/assets/images/turtle-in-shell.svg @@ -0,0 +1,87 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/components/Icon/Illustrations.ts b/src/components/Icon/Illustrations.ts index 060f31647b7c..083fe844faa2 100644 --- a/src/components/Icon/Illustrations.ts +++ b/src/components/Icon/Illustrations.ts @@ -111,6 +111,7 @@ import WalletAlt from '@assets/images/simple-illustrations/simple-illustration__ import Workflows from '@assets/images/simple-illustrations/simple-illustration__workflows.svg'; import ExpensifyApprovedLogoLight from '@assets/images/subscription-details__approvedlogo--light.svg'; import ExpensifyApprovedLogo from '@assets/images/subscription-details__approvedlogo.svg'; +import TurtleInShell from '@assets/images/turtle-in-shell.svg'; export { Abracadabra, @@ -226,4 +227,5 @@ export { AmexCompanyCards, MasterCardCompanyCards, VisaCompanyCards, + TurtleInShell, }; From 6c3f4c93d6abf4b18941006242a7351feef0538f Mon Sep 17 00:00:00 2001 From: Blazej Kustra Date: Wed, 28 Aug 2024 18:55:39 +0200 Subject: [PATCH 08/12] Add empty content view for expenses from page --- ...paceWorkflowsApprovalsExpensesFromPage.tsx | 55 +++++++++++++------ 1 file changed, 39 insertions(+), 16 deletions(-) diff --git a/src/pages/workspace/workflows/approvals/WorkspaceWorkflowsApprovalsExpensesFromPage.tsx b/src/pages/workspace/workflows/approvals/WorkspaceWorkflowsApprovalsExpensesFromPage.tsx index 59fc888f1d98..e282b2fb43cc 100644 --- a/src/pages/workspace/workflows/approvals/WorkspaceWorkflowsApprovalsExpensesFromPage.tsx +++ b/src/pages/workspace/workflows/approvals/WorkspaceWorkflowsApprovalsExpensesFromPage.tsx @@ -3,10 +3,12 @@ import React, {useCallback, useEffect, useMemo, useState} from 'react'; import type {SectionListData} from 'react-native'; import {useOnyx} from 'react-native-onyx'; import Badge from '@components/Badge'; +import BlockingView from '@components/BlockingViews/BlockingView'; import FullPageNotFoundView from '@components/BlockingViews/FullPageNotFoundView'; import FormAlertWithSubmitButton from '@components/FormAlertWithSubmitButton'; import HeaderWithBackButton from '@components/HeaderWithBackButton'; import {FallbackAvatar} from '@components/Icon/Expensicons'; +import * as Illustrations from '@components/Icon/Illustrations'; import ScreenWrapper from '@components/ScreenWrapper'; import SelectionList from '@components/SelectionList'; import InviteMemberListItem from '@components/SelectionList/InviteMemberListItem'; @@ -23,6 +25,7 @@ import * as PolicyUtils from '@libs/PolicyUtils'; import AccessOrNotFoundWrapper from '@pages/workspace/AccessOrNotFoundWrapper'; import withPolicyAndFullscreenLoading from '@pages/workspace/withPolicyAndFullscreenLoading'; import type {WithPolicyAndFullscreenLoadingProps} from '@pages/workspace/withPolicyAndFullscreenLoading'; +import variables from '@styles/variables'; import * as Workflow from '@userActions/Workflow'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; @@ -57,6 +60,7 @@ function WorkspaceWorkflowsApprovalsExpensesFromPage({policy, isLoadingReportDat // eslint-disable-next-line rulesdir/no-negated-variables const shouldShowNotFoundView = (isEmptyObject(policy) && !isLoadingReportData) || !PolicyUtils.isPolicyAdmin(policy) || PolicyUtils.isPendingDeletePolicy(policy); const isInitialCreationFlow = approvalWorkflow?.action === CONST.APPROVAL_WORKFLOW.ACTION.CREATE && !route.params.backTo; + const shouldShowListEmptyContent = approvalWorkflow && approvalWorkflow.availableMembers.length === 0; useEffect(() => { if (!approvalWorkflow?.members) { @@ -149,26 +153,44 @@ function WorkspaceWorkflowsApprovalsExpensesFromPage({policy, isLoadingReportDat Navigation.goBack(); }, [isInitialCreationFlow]); - const nextButton = useMemo( - () => ( + const button = useMemo(() => { + let buttonText = isInitialCreationFlow ? translate('common.next') : translate('common.save'); + + if (shouldShowListEmptyContent) { + buttonText = translate('common.buttonConfirm'); + } + + return ( Navigation.goBack() : nextStep} containerStyles={[styles.flexReset, styles.flexGrow0, styles.flexShrink0, styles.flexBasisAuto]} enabledWhenOffline /> - ), - [isInitialCreationFlow, nextStep, selectedMembers.length, styles.flexBasisAuto, styles.flexGrow0, styles.flexReset, styles.flexShrink0, translate], - ); + ); + }, [isInitialCreationFlow, nextStep, selectedMembers.length, shouldShowListEmptyContent, styles.flexBasisAuto, styles.flexGrow0, styles.flexReset, styles.flexShrink0, translate]); const toggleMember = (member: SelectionListMember) => { const isAlreadySelected = selectedMembers.some((selectedOption) => selectedOption.login === member.login); setSelectedMembers(isAlreadySelected ? selectedMembers.filter((selectedOption) => selectedOption.login !== member.login) : [...selectedMembers, {...member, isSelected: true}]); }; - const isMembersListEmpty = !sections[0].data.length; - const headerMessage = useMemo(() => (debouncedSearchTerm && isMembersListEmpty ? translate('common.noResultsFound') : ''), [debouncedSearchTerm, isMembersListEmpty, translate]); + const headerMessage = useMemo(() => (searchTerm && !sections[0].data.length ? translate('common.noResultsFound') : ''), [searchTerm, sections, translate]); + + const listEmptyContent = useMemo( + () => ( + + ), + [translate, styles.pb10], + ); return ( - {approvalWorkflow?.action === CONST.APPROVAL_WORKFLOW.ACTION.CREATE && ( - - {translate(!debouncedSearchTerm && isMembersListEmpty ? 'workflowsExpensesFromPage.emptyMembersList' : 'workflowsExpensesFromPage.header')} - + + {approvalWorkflow?.action === CONST.APPROVAL_WORKFLOW.ACTION.CREATE && !shouldShowListEmptyContent && ( + {translate('workflowsExpensesFromPage.header')} )} From 4db199ff3f317e8fdf348eba2952ebb8047f0ca0 Mon Sep 17 00:00:00 2001 From: Blazej Kustra Date: Wed, 28 Aug 2024 19:05:39 +0200 Subject: [PATCH 09/12] Add empty content view for approver page --- ...orkspaceWorkflowsApprovalsApproverPage.tsx | 57 +++++++++++++------ 1 file changed, 40 insertions(+), 17 deletions(-) diff --git a/src/pages/workspace/workflows/approvals/WorkspaceWorkflowsApprovalsApproverPage.tsx b/src/pages/workspace/workflows/approvals/WorkspaceWorkflowsApprovalsApproverPage.tsx index bbd43d1df018..77298d738615 100644 --- a/src/pages/workspace/workflows/approvals/WorkspaceWorkflowsApprovalsApproverPage.tsx +++ b/src/pages/workspace/workflows/approvals/WorkspaceWorkflowsApprovalsApproverPage.tsx @@ -4,10 +4,12 @@ import type {SectionListData} from 'react-native'; import type {OnyxEntry} from 'react-native-onyx'; import {useOnyx, withOnyx} from 'react-native-onyx'; import Badge from '@components/Badge'; +import BlockingView from '@components/BlockingViews/BlockingView'; import FullPageNotFoundView from '@components/BlockingViews/FullPageNotFoundView'; import FormAlertWithSubmitButton from '@components/FormAlertWithSubmitButton'; import HeaderWithBackButton from '@components/HeaderWithBackButton'; import {FallbackAvatar} from '@components/Icon/Expensicons'; +import * as Illustrations from '@components/Icon/Illustrations'; import ScreenWrapper from '@components/ScreenWrapper'; import SelectionList from '@components/SelectionList'; import InviteMemberListItem from '@components/SelectionList/InviteMemberListItem'; @@ -30,6 +32,7 @@ import * as PolicyUtils from '@libs/PolicyUtils'; import AccessOrNotFoundWrapper from '@pages/workspace/AccessOrNotFoundWrapper'; import withPolicyAndFullscreenLoading from '@pages/workspace/withPolicyAndFullscreenLoading'; import type {WithPolicyAndFullscreenLoadingProps} from '@pages/workspace/withPolicyAndFullscreenLoading'; +import variables from '@styles/variables'; import * as Policy from '@userActions/Policy/Policy'; import * as Workflow from '@userActions/Workflow'; import CONST from '@src/CONST'; @@ -74,9 +77,8 @@ function WorkspaceWorkflowsApprovalsApproverPageWrapper(props: WorkspaceWorkflow function WorkspaceWorkflowsApprovalsApproverPageBeta({policy, personalDetails, isLoadingReportData = true, route}: WorkspaceWorkflowsApprovalsApproverPageProps) { const styles = useThemeStyles(); const {translate} = useLocalize(); - const [didScreenTransitionEnd, setDidScreenTransitionEnd] = useState(false); const [searchTerm, debouncedSearchTerm, setSearchTerm] = useDebouncedState(''); - const [approvalWorkflow, approvalWorkflowMetadata] = useOnyx(ONYXKEYS.APPROVAL_WORKFLOW); + const [approvalWorkflow] = useOnyx(ONYXKEYS.APPROVAL_WORKFLOW); const [selectedApproverEmail, setSelectedApproverEmail] = useState(undefined); // eslint-disable-next-line rulesdir/no-negated-variables @@ -165,6 +167,8 @@ function WorkspaceWorkflowsApprovalsApproverPageBeta({policy, personalDetails, i translate, ]); + const shouldShowListEmptyContent = approvalWorkflow && !sections[0].data.length; + const nextStep = useCallback(() => { if (selectedApproverEmail) { const policyMemberEmailsToAccountIDs = PolicyUtils.getMemberAccountIDsForWorkspace(policy?.employeeList); @@ -191,18 +195,23 @@ function WorkspaceWorkflowsApprovalsApproverPageBeta({policy, personalDetails, i } }, [approvalWorkflow, approverIndex, personalDetails, policy?.employeeList, route.params.policyID, selectedApproverEmail]); - const nextButton = useMemo( - () => ( + const button = useMemo(() => { + let buttonText = isInitialCreationFlow ? translate('common.next') : translate('common.save'); + + if (shouldShowListEmptyContent) { + buttonText = translate('common.buttonConfirm'); + } + + return ( Navigation.goBack() : nextStep} containerStyles={[styles.flexReset, styles.flexGrow0, styles.flexShrink0, styles.flexBasisAuto]} enabledWhenOffline /> - ), - [isInitialCreationFlow, nextStep, selectedApproverEmail, styles.flexBasisAuto, styles.flexGrow0, styles.flexReset, styles.flexShrink0, translate], - ); + ); + }, [isInitialCreationFlow, nextStep, selectedApproverEmail, shouldShowListEmptyContent, styles.flexBasisAuto, styles.flexGrow0, styles.flexReset, styles.flexShrink0, translate]); const goBack = useCallback(() => { if (isInitialCreationFlow) { @@ -219,7 +228,21 @@ function WorkspaceWorkflowsApprovalsApproverPageBeta({policy, personalDetails, i setSelectedApproverEmail(approver.login); }; - const isApproversListEmpty = !sections[0].data.length && didScreenTransitionEnd; + const headerMessage = useMemo(() => (searchTerm && !sections[0].data.length ? translate('common.noResultsFound') : ''), [searchTerm, sections, translate]); + + const listEmptyContent = useMemo( + () => ( + + ), + [translate, styles.pb10], + ); return ( setDidScreenTransitionEnd(true)} > - {approvalWorkflow?.action === CONST.APPROVAL_WORKFLOW.ACTION.CREATE && ( + {approvalWorkflow?.action === CONST.APPROVAL_WORKFLOW.ACTION.CREATE && !shouldShowListEmptyContent && ( {translate('workflowsApproverPage.header')} )} From eed5c85b4c3871c3b23863d4104ae045585cbcfb Mon Sep 17 00:00:00 2001 From: Blazej Kustra Date: Wed, 28 Aug 2024 19:09:50 +0200 Subject: [PATCH 10/12] Fix es translations --- src/languages/es.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/src/languages/es.ts b/src/languages/es.ts index 3c66ffe95491..dd524ee0caf8 100644 --- a/src/languages/es.ts +++ b/src/languages/es.ts @@ -1375,7 +1375,6 @@ export default { workflowsExpensesFromPage: { title: 'Gastos de', header: 'Cuando los siguientes miembros presenten gastos:', - emptyMembersList: '¡Buen trabajo! Todos los miembros del espacio de trabajo pertenecen a un flujo de aprobación.', }, workflowsApproverPage: { genericErrorMessage: 'El aprobador no pudo ser cambiado. Por favor, inténtelo de nuevo o contacte al soporte.', From c1ce3ba5bc9b52a24930aab792e6cc07474ce079 Mon Sep 17 00:00:00 2001 From: Blazej Kustra Date: Wed, 28 Aug 2024 19:15:31 +0200 Subject: [PATCH 11/12] Fix the case when removing an approver that is in circular reference --- .../approvals/WorkspaceWorkflowsApprovalsApproverPage.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/pages/workspace/workflows/approvals/WorkspaceWorkflowsApprovalsApproverPage.tsx b/src/pages/workspace/workflows/approvals/WorkspaceWorkflowsApprovalsApproverPage.tsx index 77298d738615..ac8b80295045 100644 --- a/src/pages/workspace/workflows/approvals/WorkspaceWorkflowsApprovalsApproverPage.tsx +++ b/src/pages/workspace/workflows/approvals/WorkspaceWorkflowsApprovalsApproverPage.tsx @@ -167,7 +167,7 @@ function WorkspaceWorkflowsApprovalsApproverPageBeta({policy, personalDetails, i translate, ]); - const shouldShowListEmptyContent = approvalWorkflow && !sections[0].data.length; + const shouldShowListEmptyContent = !debouncedSearchTerm && approvalWorkflow && !sections[0].data.length; const nextStep = useCallback(() => { if (selectedApproverEmail) { @@ -206,7 +206,7 @@ function WorkspaceWorkflowsApprovalsApproverPageBeta({policy, personalDetails, i Navigation.goBack() : nextStep} + onSubmit={nextStep} containerStyles={[styles.flexReset, styles.flexGrow0, styles.flexShrink0, styles.flexBasisAuto]} enabledWhenOffline /> From 203cc5f15613663aaa10661b8169e58c8916da9c Mon Sep 17 00:00:00 2001 From: Blazej Kustra Date: Fri, 30 Aug 2024 17:27:48 +0200 Subject: [PATCH 12/12] Use a different style for subtitle --- .../approvals/WorkspaceWorkflowsApprovalsApproverPage.tsx | 3 ++- .../approvals/WorkspaceWorkflowsApprovalsExpensesFromPage.tsx | 3 ++- 2 files changed, 4 insertions(+), 2 deletions(-) diff --git a/src/pages/workspace/workflows/approvals/WorkspaceWorkflowsApprovalsApproverPage.tsx b/src/pages/workspace/workflows/approvals/WorkspaceWorkflowsApprovalsApproverPage.tsx index ac8b80295045..9daf6a6a41eb 100644 --- a/src/pages/workspace/workflows/approvals/WorkspaceWorkflowsApprovalsApproverPage.tsx +++ b/src/pages/workspace/workflows/approvals/WorkspaceWorkflowsApprovalsApproverPage.tsx @@ -238,10 +238,11 @@ function WorkspaceWorkflowsApprovalsApproverPageBeta({policy, personalDetails, i iconHeight={variables.emptyListIconHeight} title={translate('workflowsPage.emptyContent.title')} subtitle={translate('workflowsPage.emptyContent.approverSubtitle')} + subtitleStyle={styles.textSupporting} containerStyle={styles.pb10} /> ), - [translate, styles.pb10], + [translate, styles.textSupporting, styles.pb10], ); return ( diff --git a/src/pages/workspace/workflows/approvals/WorkspaceWorkflowsApprovalsExpensesFromPage.tsx b/src/pages/workspace/workflows/approvals/WorkspaceWorkflowsApprovalsExpensesFromPage.tsx index e282b2fb43cc..e99164587da6 100644 --- a/src/pages/workspace/workflows/approvals/WorkspaceWorkflowsApprovalsExpensesFromPage.tsx +++ b/src/pages/workspace/workflows/approvals/WorkspaceWorkflowsApprovalsExpensesFromPage.tsx @@ -186,10 +186,11 @@ function WorkspaceWorkflowsApprovalsExpensesFromPage({policy, isLoadingReportDat iconHeight={variables.emptyListIconHeight} title={translate('workflowsPage.emptyContent.title')} subtitle={translate('workflowsPage.emptyContent.expensesFromSubtitle')} + subtitleStyle={styles.textSupporting} containerStyle={styles.pb10} /> ), - [translate, styles.pb10], + [translate, styles.textSupporting, styles.pb10], ); return (