diff --git a/src/pages/workspace/categories/CategoryForm.tsx b/src/pages/workspace/categories/CategoryForm.tsx index 304f4153df8c..30e30b29b216 100644 --- a/src/pages/workspace/categories/CategoryForm.tsx +++ b/src/pages/workspace/categories/CategoryForm.tsx @@ -25,9 +25,12 @@ type CategoryFormProps = { /** Function to call when the form is submitted */ onSubmit: (values: FormOnyxValues) => void; + + /** Function to validate the edited values of the form */ + validateEdit?: (values: FormOnyxValues) => FormInputErrors; }; -function CategoryForm({onSubmit, policyCategories, categoryName}: CategoryFormProps) { +function CategoryForm({onSubmit, policyCategories, categoryName, validateEdit}: CategoryFormProps) { const styles = useThemeStyles(); const {translate} = useLocalize(); const {inputCallbackRef} = useAutoFocusInput(); @@ -67,7 +70,8 @@ function CategoryForm({onSubmit, policyCategories, categoryName}: CategoryFormPr formID={ONYXKEYS.FORMS.WORKSPACE_CATEGORY_FORM} onSubmit={submit} submitButtonText={translate('common.save')} - validate={validate} + // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing + validate={validateEdit || validate} style={[styles.mh5, styles.flex1]} enabledWhenOffline > diff --git a/src/pages/workspace/categories/EditCategoryPage.tsx b/src/pages/workspace/categories/EditCategoryPage.tsx index 0e5ed0589934..dbf7c8913515 100644 --- a/src/pages/workspace/categories/EditCategoryPage.tsx +++ b/src/pages/workspace/categories/EditCategoryPage.tsx @@ -2,7 +2,7 @@ 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 type {FormOnyxValues} from '@components/Form/types'; +import type {FormInputErrors, FormOnyxValues} from '@components/Form/types'; import HeaderWithBackButton from '@components/HeaderWithBackButton'; import ScreenWrapper from '@components/ScreenWrapper'; import useLocalize from '@hooks/useLocalize'; @@ -32,9 +32,29 @@ function EditCategoryPage({route, policyCategories}: EditCategoryPageProps) { const {translate} = useLocalize(); const currentCategoryName = route.params.categoryName; + const validate = useCallback( + (values: FormOnyxValues) => { + const errors: FormInputErrors = {}; + const newCategoryName = values.categoryName.trim(); + + if (!newCategoryName) { + errors.categoryName = 'workspace.categories.categoryRequiredError'; + } else if (policyCategories?.[newCategoryName] && currentCategoryName !== newCategoryName) { + errors.categoryName = 'workspace.categories.existingCategoryError'; + } + + return errors; + }, + [policyCategories, currentCategoryName], + ); + const editCategory = useCallback( (values: FormOnyxValues) => { - Policy.renamePolicyCategory(route.params.policyID, {oldName: currentCategoryName, newName: values.categoryName}); + const newCategoryName = values.categoryName.trim(); + // Do not call the API if the edited category name is the same as the current category name + if (currentCategoryName !== newCategoryName) { + Policy.renamePolicyCategory(route.params.policyID, {oldName: currentCategoryName, newName: values.categoryName}); + } }, [currentCategoryName, route.params.policyID], ); @@ -58,6 +78,7 @@ function EditCategoryPage({route, policyCategories}: EditCategoryPageProps) { /> diff --git a/src/pages/workspace/tags/EditTagPage.tsx b/src/pages/workspace/tags/EditTagPage.tsx index 92d7c0a11ac9..fbde96eb2b91 100644 --- a/src/pages/workspace/tags/EditTagPage.tsx +++ b/src/pages/workspace/tags/EditTagPage.tsx @@ -57,7 +57,11 @@ function EditTagPage({route, policyTags}: EditTagPageProps) { const editTag = useCallback( (values: FormOnyxValues) => { - Policy.renamePolicyTag(route.params.policyID, {oldName: currentTagName, newName: values.tagName.trim()}); + const tagName = values.tagName.trim(); + // Do not call the API if the edited tag name is the same as the current tag name + if (currentTagName !== tagName) { + Policy.renamePolicyTag(route.params.policyID, {oldName: currentTagName, newName: values.tagName.trim()}); + } Keyboard.dismiss(); Navigation.dismissModal(); },