diff --git a/src/pages/workspace/tags/TagGLCodePage.tsx b/src/pages/workspace/tags/TagGLCodePage.tsx index 89c281e91f4..8360108be36 100644 --- a/src/pages/workspace/tags/TagGLCodePage.tsx +++ b/src/pages/workspace/tags/TagGLCodePage.tsx @@ -1,7 +1,6 @@ import type {StackScreenProps} from '@react-navigation/stack'; import React, {useCallback} from 'react'; -import {withOnyx} from 'react-native-onyx'; -import type {OnyxEntry} from 'react-native-onyx'; +import {useOnyx} from 'react-native-onyx'; import FormProvider from '@components/Form/FormProvider'; import InputWrapper from '@components/Form/InputWrapper'; import type {FormOnyxValues} from '@components/Form/types'; @@ -10,6 +9,7 @@ import ScreenWrapper from '@components/ScreenWrapper'; import TextInput from '@components/TextInput'; import useAutoFocusInput from '@hooks/useAutoFocusInput'; import useLocalize from '@hooks/useLocalize'; +import usePolicy from '@hooks/usePolicy'; import useThemeStyles from '@hooks/useThemeStyles'; import Navigation from '@libs/Navigation/Navigation'; import * as PolicyUtils from '@libs/PolicyUtils'; @@ -21,19 +21,15 @@ import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; import type SCREENS from '@src/SCREENS'; import INPUT_IDS from '@src/types/form/WorkspaceTagForm'; -import type {PolicyTagLists} from '@src/types/onyx'; -type WorkspaceEditTagGLCodePageOnyxProps = { - /** Collection of categories attached to a policy */ - policyTags: OnyxEntry; -}; +type EditTagGLCodePageProps = StackScreenProps; -type EditTagGLCodePageProps = WorkspaceEditTagGLCodePageOnyxProps & StackScreenProps; - -function TagGLCodePage({route, policyTags}: EditTagGLCodePageProps) { +function TagGLCodePage({route}: EditTagGLCodePageProps) { const styles = useThemeStyles(); const {translate} = useLocalize(); const {inputCallbackRef} = useAutoFocusInput(); + const policy = usePolicy(route.params.policyID); + const [policyTags] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY_TAGS}${route?.params?.policyID}`); const tagName = route.params.tagName; const orderWeight = route.params.orderWeight; @@ -60,6 +56,7 @@ function TagGLCodePage({route, policyTags}: EditTagGLCodePageProps) { accessVariants={[CONST.POLICY.ACCESS_VARIANTS.ADMIN, CONST.POLICY.ACCESS_VARIANTS.CONTROL]} policyID={route.params.policyID} featureName={CONST.POLICY.MORE_FEATURES.ARE_CATEGORIES_ENABLED} + shouldBeBlocked={PolicyUtils.hasAccountingConnections(policy)} > ({ - policyTags: { - key: ({route}) => `${ONYXKEYS.COLLECTION.POLICY_TAGS}${route?.params?.policyID}`, - }, -})(TagGLCodePage); +export default TagGLCodePage; diff --git a/src/pages/workspace/tags/TagSettingsPage.tsx b/src/pages/workspace/tags/TagSettingsPage.tsx index 6b70b6f636f..f5599ed4c26 100644 --- a/src/pages/workspace/tags/TagSettingsPage.tsx +++ b/src/pages/workspace/tags/TagSettingsPage.tsx @@ -37,6 +37,7 @@ function TagSettingsPage({route, navigation}: TagSettingsPageProps) { const {translate} = useLocalize(); const policyTag = useMemo(() => PolicyUtils.getTagList(policyTags, orderWeight), [policyTags, orderWeight]); const policy = usePolicy(policyID); + const hasAccountingConnections = PolicyUtils.hasAccountingConnections(policy); const [isDeleteTagModalOpen, setIsDeleteTagModalOpen] = React.useState(false); @@ -146,6 +147,8 @@ function TagSettingsPage({route, navigation}: TagSettingsPageProps) { title={currentPolicyTag['GL Code']} description={translate(`workspace.tags.glCode`)} onPress={navigateToEditGlCode} + iconRight={hasAccountingConnections ? Expensicons.Lock : undefined} + interactive={!hasAccountingConnections} shouldShowRightIcon />