From a1cc06f4cec667181469dd2a18bfffee702fabe7 Mon Sep 17 00:00:00 2001 From: Hayata Suenaga Date: Wed, 24 Apr 2024 20:28:14 -0400 Subject: [PATCH 01/10] feat: add new UI copy --- src/languages/en.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/src/languages/en.ts b/src/languages/en.ts index 728b214d65cf..0af5af59f9f1 100755 --- a/src/languages/en.ts +++ b/src/languages/en.ts @@ -2036,6 +2036,7 @@ export default { tagRequiredError: 'Tag name is required.', existingTagError: 'A tag with this name already exists.', genericFailureMessage: 'An error occurred while updating the tag, please try again.', + importedFromAccountingSoftware: 'The tags below are imported from your', }, taxes: { subtitle: 'Add tax names, rates, and set defaults.', From 558174701f53e44e5d999f94a941d17b943af14d Mon Sep 17 00:00:00 2001 From: Hayata Suenaga Date: Wed, 24 Apr 2024 20:30:30 -0400 Subject: [PATCH 02/10] feat: add new Spanish translation --- src/languages/es.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/src/languages/es.ts b/src/languages/es.ts index 6ca7c4a210e1..afaf4f829c94 100644 --- a/src/languages/es.ts +++ b/src/languages/es.ts @@ -2063,6 +2063,7 @@ export default { tagRequiredError: 'Lo nombre de la etiqueta es obligatorio.', existingTagError: 'Ya existe una etiqueta con este nombre.', genericFailureMessage: 'Se produjo un error al actualizar la etiqueta, inténtelo nuevamente.', + importedFromAccountingSoftware: 'Etiquetas importadas desde', }, taxes: { subtitle: 'Añade nombres, tasas y establezca valores por defecto para los impuestos.', From fa8b3fc908c885e1f14bf6e1c7e6b47996a5c343 Mon Sep 17 00:00:00 2001 From: Hayata Suenaga Date: Wed, 24 Apr 2024 20:35:23 -0400 Subject: [PATCH 03/10] chore: get current URL --- src/pages/workspace/tags/WorkspaceTagsPage.tsx | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/pages/workspace/tags/WorkspaceTagsPage.tsx b/src/pages/workspace/tags/WorkspaceTagsPage.tsx index fafee7b3b74d..976670286811 100644 --- a/src/pages/workspace/tags/WorkspaceTagsPage.tsx +++ b/src/pages/workspace/tags/WorkspaceTagsPage.tsx @@ -19,6 +19,7 @@ import TableListItem from '@components/SelectionList/TableListItem'; import type {ListItem} from '@components/SelectionList/types'; import Text from '@components/Text'; import WorkspaceEmptyStateSection from '@components/WorkspaceEmptyStateSection'; +import useEnvironment from '@hooks/useEnvironment'; import useLocalize from '@hooks/useLocalize'; import useNetwork from '@hooks/useNetwork'; import useTheme from '@hooks/useTheme'; @@ -71,6 +72,7 @@ function WorkspaceTagsPage({policyTags, route}: WorkspaceTagsPageProps) { const dropdownButtonRef = useRef(null); const [deleteTagsConfirmModalVisible, setDeleteTagsConfirmModalVisible] = useState(false); const isFocused = useIsFocused(); + const {environmentURL} = useEnvironment(); const fetchTags = useCallback(() => { Policy.openPolicyTagsPage(route.params.policyID); From 5623a7bb0b4e6363b57e704a9f7229764c4acc81 Mon Sep 17 00:00:00 2001 From: Hayata Suenaga Date: Wed, 24 Apr 2024 20:37:00 -0400 Subject: [PATCH 04/10] chore: access policy ID just once --- .../workspace/tags/WorkspaceTagsPage.tsx | 25 ++++++++++--------- 1 file changed, 13 insertions(+), 12 deletions(-) diff --git a/src/pages/workspace/tags/WorkspaceTagsPage.tsx b/src/pages/workspace/tags/WorkspaceTagsPage.tsx index 976670286811..d145c76e8f3c 100644 --- a/src/pages/workspace/tags/WorkspaceTagsPage.tsx +++ b/src/pages/workspace/tags/WorkspaceTagsPage.tsx @@ -72,11 +72,12 @@ function WorkspaceTagsPage({policyTags, route}: WorkspaceTagsPageProps) { const dropdownButtonRef = useRef(null); const [deleteTagsConfirmModalVisible, setDeleteTagsConfirmModalVisible] = useState(false); const isFocused = useIsFocused(); + const policyID = route.params.policyID ?? ''; const {environmentURL} = useEnvironment(); const fetchTags = useCallback(() => { - Policy.openPolicyTagsPage(route.params.policyID); - }, [route.params.policyID]); + Policy.openPolicyTagsPage(policyID); + }, [policyID]); const {isOffline} = useNetwork({onReconnect: fetchTags}); @@ -144,22 +145,22 @@ function WorkspaceTagsPage({policyTags, route}: WorkspaceTagsPageProps) { ); const navigateToTagsSettings = () => { - Navigation.navigate(ROUTES.WORKSPACE_TAGS_SETTINGS.getRoute(route.params.policyID)); + Navigation.navigate(ROUTES.WORKSPACE_TAGS_SETTINGS.getRoute(policyID)); }; const navigateToCreateTagPage = () => { - Navigation.navigate(ROUTES.WORKSPACE_TAG_CREATE.getRoute(route.params.policyID)); + Navigation.navigate(ROUTES.WORKSPACE_TAG_CREATE.getRoute(policyID)); }; const navigateToTagSettings = (tag: PolicyOption) => { - Navigation.navigate(ROUTES.WORKSPACE_TAG_SETTINGS.getRoute(route.params.policyID, tag.keyForList)); + Navigation.navigate(ROUTES.WORKSPACE_TAG_SETTINGS.getRoute(policyID, tag.keyForList)); }; const selectedTagsArray = Object.keys(selectedTags).filter((key) => selectedTags[key]); const handleDeleteTags = () => { setSelectedTags({}); - Policy.deletePolicyTags(route.params.policyID, selectedTagsArray); + Policy.deletePolicyTags(policyID, selectedTagsArray); setDeleteTagsConfirmModalVisible(false); }; @@ -194,7 +195,7 @@ function WorkspaceTagsPage({policyTags, route}: WorkspaceTagsPageProps) { value: CONST.POLICY.TAGS_BULK_ACTION_TYPES.DISABLE, onSelected: () => { setSelectedTags({}); - Policy.setWorkspaceTagEnabled(route.params.policyID, tagsToDisable); + Policy.setWorkspaceTagEnabled(policyID, tagsToDisable); }, }); } @@ -216,7 +217,7 @@ function WorkspaceTagsPage({policyTags, route}: WorkspaceTagsPageProps) { value: CONST.POLICY.TAGS_BULK_ACTION_TYPES.ENABLE, onSelected: () => { setSelectedTags({}); - Policy.setWorkspaceTagEnabled(route.params.policyID, tagsToEnable); + Policy.setWorkspaceTagEnabled(policyID, tagsToEnable); }, }); } @@ -259,10 +260,10 @@ function WorkspaceTagsPage({policyTags, route}: WorkspaceTagsPageProps) { }; return ( - - + + Policy.clearPolicyTagErrors(route.params.policyID, item.value)} + onDismissError={(item) => Policy.clearPolicyTagErrors(policyID, item.value)} /> )} From 45c94391cd33622ce505f91b90f2bb3cd0088134 Mon Sep 17 00:00:00 2001 From: Hayata Suenaga Date: Wed, 24 Apr 2024 20:38:08 -0400 Subject: [PATCH 05/10] refactor: get Onyx value using `useOnyx` --- src/pages/workspace/tags/WorkspaceTagsPage.tsx | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/src/pages/workspace/tags/WorkspaceTagsPage.tsx b/src/pages/workspace/tags/WorkspaceTagsPage.tsx index d145c76e8f3c..68e1985b1847 100644 --- a/src/pages/workspace/tags/WorkspaceTagsPage.tsx +++ b/src/pages/workspace/tags/WorkspaceTagsPage.tsx @@ -3,7 +3,7 @@ import type {StackScreenProps} from '@react-navigation/stack'; import lodashSortBy from 'lodash/sortBy'; import React, {useCallback, useEffect, useMemo, useRef, useState} from 'react'; import {ActivityIndicator, View} from 'react-native'; -import {withOnyx} from 'react-native-onyx'; +import {useOnyx, withOnyx} from 'react-native-onyx'; import type {OnyxEntry} from 'react-native-onyx'; import Button from '@components/Button'; import ButtonWithDropdownMenu from '@components/ButtonWithDropdownMenu'; @@ -63,7 +63,7 @@ type WorkspaceTagsOnyxProps = { type WorkspaceTagsPageProps = WorkspaceTagsOnyxProps & StackScreenProps; -function WorkspaceTagsPage({policyTags, route}: WorkspaceTagsPageProps) { +function WorkspaceTagsPage({route}: WorkspaceTagsPageProps) { const {isSmallScreenWidth} = useWindowDimensions(); const styles = useThemeStyles(); const theme = useTheme(); @@ -73,6 +73,7 @@ function WorkspaceTagsPage({policyTags, route}: WorkspaceTagsPageProps) { const [deleteTagsConfirmModalVisible, setDeleteTagsConfirmModalVisible] = useState(false); const isFocused = useIsFocused(); const policyID = route.params.policyID ?? ''; + const [policyTags] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY_TAGS}${policyId}`); const {environmentURL} = useEnvironment(); const fetchTags = useCallback(() => { From c1905bd8d7318fb41a3d6e631ffcc4088ee45761 Mon Sep 17 00:00:00 2001 From: Hayata Suenaga Date: Wed, 24 Apr 2024 20:39:46 -0400 Subject: [PATCH 06/10] replace withOnyx with withPolicyConnections --- src/pages/workspace/tags/WorkspaceTagsPage.tsx | 9 +++------ 1 file changed, 3 insertions(+), 6 deletions(-) diff --git a/src/pages/workspace/tags/WorkspaceTagsPage.tsx b/src/pages/workspace/tags/WorkspaceTagsPage.tsx index 68e1985b1847..3433451ac5ed 100644 --- a/src/pages/workspace/tags/WorkspaceTagsPage.tsx +++ b/src/pages/workspace/tags/WorkspaceTagsPage.tsx @@ -3,7 +3,7 @@ import type {StackScreenProps} from '@react-navigation/stack'; import lodashSortBy from 'lodash/sortBy'; import React, {useCallback, useEffect, useMemo, useRef, useState} from 'react'; import {ActivityIndicator, View} from 'react-native'; -import {useOnyx, withOnyx} from 'react-native-onyx'; +import {useOnyx} from 'react-native-onyx'; import type {OnyxEntry} from 'react-native-onyx'; import Button from '@components/Button'; import ButtonWithDropdownMenu from '@components/ButtonWithDropdownMenu'; @@ -33,6 +33,7 @@ import type {WorkspacesCentralPaneNavigatorParamList} from '@navigation/types'; import AdminPolicyAccessOrNotFoundWrapper from '@pages/workspace/AdminPolicyAccessOrNotFoundWrapper'; import FeatureEnabledAccessOrNotFoundWrapper from '@pages/workspace/FeatureEnabledAccessOrNotFoundWrapper'; import PaidPolicyAccessOrNotFoundWrapper from '@pages/workspace/PaidPolicyAccessOrNotFoundWrapper'; +import withPolicyConnections from '@pages/workspace/withPolicyConnections'; import * as Policy from '@userActions/Policy'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; @@ -333,8 +334,4 @@ function WorkspaceTagsPage({route}: WorkspaceTagsPageProps) { WorkspaceTagsPage.displayName = 'WorkspaceTagsPage'; -export default withOnyx({ - policyTags: { - key: ({route}) => `${ONYXKEYS.COLLECTION.POLICY_TAGS}${route.params.policyID}`, - }, -})(WorkspaceTagsPage); +export default withPolicyConnections(TagSettingsPage); From b20d67e907ea65b672b4e47b7a652dcebfd6f67d Mon Sep 17 00:00:00 2001 From: Hayata Suenaga Date: Wed, 24 Apr 2024 20:40:38 -0400 Subject: [PATCH 07/10] fix: wrong variable name --- src/pages/workspace/tags/WorkspaceTagsPage.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/workspace/tags/WorkspaceTagsPage.tsx b/src/pages/workspace/tags/WorkspaceTagsPage.tsx index 3433451ac5ed..8013b8b617a5 100644 --- a/src/pages/workspace/tags/WorkspaceTagsPage.tsx +++ b/src/pages/workspace/tags/WorkspaceTagsPage.tsx @@ -74,7 +74,7 @@ function WorkspaceTagsPage({route}: WorkspaceTagsPageProps) { const [deleteTagsConfirmModalVisible, setDeleteTagsConfirmModalVisible] = useState(false); const isFocused = useIsFocused(); const policyID = route.params.policyID ?? ''; - const [policyTags] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY_TAGS}${policyId}`); + const [policyTags] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY_TAGS}${policyID}`); const {environmentURL} = useEnvironment(); const fetchTags = useCallback(() => { From ecf51d4fdc16008b6266d076021a0895e1194c64 Mon Sep 17 00:00:00 2001 From: Hayata Suenaga Date: Wed, 24 Apr 2024 20:44:14 -0400 Subject: [PATCH 08/10] fix: import statements and component name --- src/pages/workspace/tags/WorkspaceTagsPage.tsx | 14 +++----------- 1 file changed, 3 insertions(+), 11 deletions(-) diff --git a/src/pages/workspace/tags/WorkspaceTagsPage.tsx b/src/pages/workspace/tags/WorkspaceTagsPage.tsx index 8013b8b617a5..724952a00aca 100644 --- a/src/pages/workspace/tags/WorkspaceTagsPage.tsx +++ b/src/pages/workspace/tags/WorkspaceTagsPage.tsx @@ -1,10 +1,8 @@ import {useFocusEffect, useIsFocused} from '@react-navigation/native'; -import type {StackScreenProps} from '@react-navigation/stack'; import lodashSortBy from 'lodash/sortBy'; import React, {useCallback, useEffect, useMemo, useRef, useState} from 'react'; import {ActivityIndicator, View} from 'react-native'; import {useOnyx} from 'react-native-onyx'; -import type {OnyxEntry} from 'react-native-onyx'; import Button from '@components/Button'; import ButtonWithDropdownMenu from '@components/ButtonWithDropdownMenu'; import type {DropdownOption} from '@components/ButtonWithDropdownMenu/types'; @@ -29,16 +27,15 @@ import * as DeviceCapabilities from '@libs/DeviceCapabilities'; import localeCompare from '@libs/LocaleCompare'; import Navigation from '@libs/Navigation/Navigation'; import * as PolicyUtils from '@libs/PolicyUtils'; -import type {WorkspacesCentralPaneNavigatorParamList} from '@navigation/types'; import AdminPolicyAccessOrNotFoundWrapper from '@pages/workspace/AdminPolicyAccessOrNotFoundWrapper'; import FeatureEnabledAccessOrNotFoundWrapper from '@pages/workspace/FeatureEnabledAccessOrNotFoundWrapper'; import PaidPolicyAccessOrNotFoundWrapper from '@pages/workspace/PaidPolicyAccessOrNotFoundWrapper'; +import type {WithPolicyConnectionsProps} from '@pages/workspace/withPolicyConnections'; import withPolicyConnections from '@pages/workspace/withPolicyConnections'; import * as Policy from '@userActions/Policy'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; -import type SCREENS from '@src/SCREENS'; import type * as OnyxTypes from '@src/types/onyx'; import type * as OnyxCommon from '@src/types/onyx/OnyxCommon'; import type DeepValueOf from '@src/types/utils/DeepValueOf'; @@ -57,12 +54,7 @@ type PolicyOption = ListItem & { keyForList: string; }; -type WorkspaceTagsOnyxProps = { - /** Collection of tags attached to a policy */ - policyTags: OnyxEntry; -}; - -type WorkspaceTagsPageProps = WorkspaceTagsOnyxProps & StackScreenProps; +type WorkspaceTagsPageProps = WithPolicyConnectionsProps; function WorkspaceTagsPage({route}: WorkspaceTagsPageProps) { const {isSmallScreenWidth} = useWindowDimensions(); @@ -334,4 +326,4 @@ function WorkspaceTagsPage({route}: WorkspaceTagsPageProps) { WorkspaceTagsPage.displayName = 'WorkspaceTagsPage'; -export default withPolicyConnections(TagSettingsPage); +export default withPolicyConnections(WorkspaceTagsPage); From 68e04b7e0e7b3be8834d9036aecfa993b5345a30 Mon Sep 17 00:00:00 2001 From: Hayata Suenaga Date: Wed, 24 Apr 2024 20:48:40 -0400 Subject: [PATCH 09/10] feat: display the explanatory text --- src/pages/workspace/tags/WorkspaceTagsPage.tsx | 18 ++++++++++++++++-- 1 file changed, 16 insertions(+), 2 deletions(-) diff --git a/src/pages/workspace/tags/WorkspaceTagsPage.tsx b/src/pages/workspace/tags/WorkspaceTagsPage.tsx index 724952a00aca..553f738bce2e 100644 --- a/src/pages/workspace/tags/WorkspaceTagsPage.tsx +++ b/src/pages/workspace/tags/WorkspaceTagsPage.tsx @@ -16,6 +16,7 @@ import RightElementEnabledStatus from '@components/SelectionList/RightElementEna import TableListItem from '@components/SelectionList/TableListItem'; import type {ListItem} from '@components/SelectionList/types'; import Text from '@components/Text'; +import TextLink from '@components/TextLink'; import WorkspaceEmptyStateSection from '@components/WorkspaceEmptyStateSection'; import useEnvironment from '@hooks/useEnvironment'; import useLocalize from '@hooks/useLocalize'; @@ -56,7 +57,7 @@ type PolicyOption = ListItem & { type WorkspaceTagsPageProps = WithPolicyConnectionsProps; -function WorkspaceTagsPage({route}: WorkspaceTagsPageProps) { +function WorkspaceTagsPage({route, policy}: WorkspaceTagsPageProps) { const {isSmallScreenWidth} = useWindowDimensions(); const styles = useThemeStyles(); const theme = useTheme(); @@ -68,6 +69,7 @@ function WorkspaceTagsPage({route}: WorkspaceTagsPageProps) { const policyID = route.params.policyID ?? ''; const [policyTags] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY_TAGS}${policyID}`); const {environmentURL} = useEnvironment(); + const isAccountingConnected = Object.keys(policy?.connections ?? {}).length > 0; const fetchTags = useCallback(() => { Policy.openPolicyTagsPage(policyID); @@ -286,7 +288,19 @@ function WorkspaceTagsPage({route}: WorkspaceTagsPageProps) { /> {isSmallScreenWidth && {getHeaderButtons()}} - {translate('workspace.tags.subtitle')} + {isAccountingConnected ? ( + + {`${translate('workspace.tags.importedFromAccountingSoftware')} `} + + {`${translate('workspace.accounting.qbo')} ${translate('workspace.accounting.settings')}`} + + + ) : ( + {translate('workspace.tags.subtitle')} + )} {isLoading && ( Date: Wed, 24 Apr 2024 20:52:05 -0400 Subject: [PATCH 10/10] chore: change variable name --- src/pages/workspace/tags/WorkspaceTagsPage.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/pages/workspace/tags/WorkspaceTagsPage.tsx b/src/pages/workspace/tags/WorkspaceTagsPage.tsx index 553f738bce2e..5c867ef43090 100644 --- a/src/pages/workspace/tags/WorkspaceTagsPage.tsx +++ b/src/pages/workspace/tags/WorkspaceTagsPage.tsx @@ -69,7 +69,7 @@ function WorkspaceTagsPage({route, policy}: WorkspaceTagsPageProps) { const policyID = route.params.policyID ?? ''; const [policyTags] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY_TAGS}${policyID}`); const {environmentURL} = useEnvironment(); - const isAccountingConnected = Object.keys(policy?.connections ?? {}).length > 0; + const isConnectedToAccounting = Object.keys(policy?.connections ?? {}).length > 0; const fetchTags = useCallback(() => { Policy.openPolicyTagsPage(policyID); @@ -288,7 +288,7 @@ function WorkspaceTagsPage({route, policy}: WorkspaceTagsPageProps) { /> {isSmallScreenWidth && {getHeaderButtons()}} - {isAccountingConnected ? ( + {isConnectedToAccounting ? ( {`${translate('workspace.tags.importedFromAccountingSoftware')} `}