Tags - Violation for unselected dependent tags displays tag name briefly then changes to "tag"

src/components/ReportActionItem/MoneyRequestView.tsx

@@ -467,11 +467,16 @@ function MoneyRequestView({
                                     getErrorForField('tag', {
                                         tagListIndex: index,
                                         tagListName: name,
+                                        policyHasDependentTags: PolicyUtils.hasDependentTags(policy, policyTagList),
                                     })
                                         ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR
                                         : undefined
                                 }
-                                error={getErrorForField('tag', {tagListIndex: index, tagListName: name})}
+                                error={getErrorForField('tag', {
+                                    tagListIndex: index,
+                                    tagListName: name,
+                                    policyHasDependentTags: PolicyUtils.hasDependentTags(policy, policyTagList),
+                                })}
                             />
                         </OfflineWithFeedback>
                     ))}

src/hooks/useViolations.ts

@@ -63,24 +63,39 @@ function useViolations(violations: TransactionViolation[]) {
     const getViolationsForField = useCallback(
         (field: ViolationField, data?: TransactionViolation['data']) => {
             const currentViolations = violationsByField.get(field) ?? [];
+            const violation = currentViolations[0];
 
             // someTagLevelsRequired has special logic becase data.errorIndexes is a bit unique in how it denotes the tag list that has the violation
             // tagListIndex can be 0 so we compare with undefined
-            if (currentViolations[0]?.name === 'someTagLevelsRequired' && data?.tagListIndex !== undefined && Array.isArray(currentViolations[0]?.data?.errorIndexes)) {
+            if (violation?.name === 'someTagLevelsRequired' && data?.tagListIndex !== undefined && Array.isArray(violation?.data?.errorIndexes)) {
                 return currentViolations
-                    .filter((violation) => violation.data?.errorIndexes?.includes(data?.tagListIndex ?? -1))
-                    .map((violation) => ({
+                    .filter((currentViolation) => currentViolation.data?.errorIndexes?.includes(data?.tagListIndex ?? -1))
+                    .map((currentViolation) => ({
+                        ...currentViolation,
+                        data: {
+                            ...currentViolation.data,
+                            tagName: data?.tagListName,
+                        },
+                    }));
+            }
+
+            // missingTag has special logic for policies with dependent tags, because only violation is returned for all tags
+            // when no tags are present, so the tag name isn't set in the violation data. That's why we add it here
+            if (data?.policyHasDependentTags && violation?.name === 'missingTag' && data?.tagListName) {
+                return [
+                    {
                         ...violation,
                         data: {
                             ...violation.data,
                             tagName: data?.tagListName,
                         },
-                    }));
+                    },
+                ];
             }
 
             // tagOutOfPolicy has special logic because we have to account for multi-level tags and use tagName to find the right tag to put the violation on
-            if (currentViolations[0]?.name === 'tagOutOfPolicy' && data?.tagListName !== undefined && currentViolations[0]?.data?.tagName) {
-                return currentViolations.filter((violation) => violation.data?.tagName === data?.tagListName);
+            if (violation?.name === 'tagOutOfPolicy' && data?.tagListName !== undefined && violation?.data?.tagName) {
+                return currentViolations.filter((currentViolation) => currentViolation.data?.tagName === data?.tagListName);
             }
 
             return currentViolations;

src/libs/PolicyUtils.ts

@@ -390,6 +390,13 @@ function canSendInvoice(policies: OnyxCollection<Policy>): boolean {
     return getActiveAdminWorkspaces(policies).length > 0;
 }
 
+function hasDependentTags(policy: OnyxEntry<Policy>, policyTagList: OnyxEntry<PolicyTagList>) {
+    if (!policy?.hasMultipleTagLists) {
+        return false;
+    }
+    return Object.values(policyTagList ?? {}).some((tagList) => Object.values(tagList.tags).some((tag) => !!tag.rules?.parentTagsFilter || !!tag.parentTagsFilter));
+}
+
 export {
     getActivePolicies,
     hasAccountingConnections,
@@ -435,6 +442,7 @@ export {
     getPolicy,
     getActiveAdminWorkspaces,
     canSendInvoice,
+    hasDependentTags,
 };
 
 export type {MemberEmailsToAccountIDs};

src/libs/Violations/ViolationsUtils.ts

@@ -49,31 +49,39 @@ function getTagViolationsForSingleLevelTags(
 }
 
 /**
- * Calculates some tag levels required and missing tag violations for the given transaction
+ * Calculates missing tag violations for policies with dependent tags,
+ * by returning one per tag with its corresponding tagName in the data
  */
-function getTagViolationsForMultiLevelTags(
-    updatedTransaction: Transaction,
-    transactionViolations: TransactionViolation[],
-    policyRequiresTags: boolean,
-    policyTagList: PolicyTagList,
-): TransactionViolation[] {
-    const policyTagKeys = getSortedTagKeys(policyTagList);
-    const selectedTags = updatedTransaction.tag?.split(CONST.COLON) ?? [];
+function getTagViolationsForDependentTags(policyTagList: PolicyTagList, transactionViolations: TransactionViolation[]) {
+    return [
+        ...transactionViolations,
+        ...Object.values(policyTagList).map((tagList) => ({
+            name: CONST.VIOLATIONS.MISSING_TAG,
+            type: CONST.VIOLATION_TYPES.VIOLATION,
+            data: {tagName: tagList.name},
+        })),
+    ];
+}
+
+/**
+ * Calculates missing tag violations for policies with independent tags,
+ * by returning one per tag with its corresponding tagName in the data
+ */
+function getTagViolationForIndependentTags(policyTagList: PolicyTagList, transactionViolations: TransactionViolation[], policyTagKeys: string[], selectedTags: string[]) {
     let newTransactionViolations = [...transactionViolations];
-    newTransactionViolations = newTransactionViolations.filter(
-        (violation) => violation.name !== CONST.VIOLATIONS.SOME_TAG_LEVELS_REQUIRED && violation.name !== CONST.VIOLATIONS.TAG_OUT_OF_POLICY,
-    );
 
     // We first get the errorIndexes for someTagLevelsRequired. If it's not empty, we puth SOME_TAG_LEVELS_REQUIRED in Onyx.
     // Otherwise, we put TAG_OUT_OF_POLICY in Onyx (when applicable)
     const errorIndexes = [];
+
     for (let i = 0; i < policyTagKeys.length; i++) {
         const isTagRequired = policyTagList[policyTagKeys[i]].required ?? true;
         const isTagSelected = Boolean(selectedTags[i]);
         if (isTagRequired && (!isTagSelected || (selectedTags.length === 1 && selectedTags[0] === ''))) {
             errorIndexes.push(i);
         }
     }
+
     if (errorIndexes.length !== 0) {
         newTransactionViolations.push({
             name: CONST.VIOLATIONS.SOME_TAG_LEVELS_REQUIRED,
@@ -84,10 +92,12 @@ function getTagViolationsForMultiLevelTags(
         });
     } else {
         let hasInvalidTag = false;
+
         for (let i = 0; i < policyTagKeys.length; i++) {
             const selectedTag = selectedTags[i];
             const tags = policyTagList[policyTagKeys[i]].tags;
             const isTagInPolicy = Object.values(tags).some((tag) => tag.name === selectedTag && Boolean(tag.enabled));
+
             if (!isTagInPolicy) {
                 newTransactionViolations.push({
                     name: CONST.VIOLATIONS.TAG_OUT_OF_POLICY,
@@ -100,15 +110,40 @@ function getTagViolationsForMultiLevelTags(
                 break;
             }
         }
+
         if (!hasInvalidTag) {
             newTransactionViolations = reject(newTransactionViolations, {
                 name: CONST.VIOLATIONS.TAG_OUT_OF_POLICY,
             });
         }
     }
+
     return newTransactionViolations;
 }
 
+/**
+ * Calculates some tag levels required and missing tag violations for the given transaction
+ */
+function getTagViolationsForMultiLevelTags(
+    updatedTransaction: Transaction,
+    transactionViolations: TransactionViolation[],
+    policyRequiresTags: boolean,
+    policyTagList: PolicyTagList,
+    hasDependentTags: boolean,
+): TransactionViolation[] {
+    const policyTagKeys = getSortedTagKeys(policyTagList);
+    const selectedTags = updatedTransaction.tag?.split(CONST.COLON) ?? [];
+    const filteredTransactionViolations = transactionViolations.filter(
+        (violation) => violation.name !== CONST.VIOLATIONS.SOME_TAG_LEVELS_REQUIRED && violation.name !== CONST.VIOLATIONS.TAG_OUT_OF_POLICY,
+    );
+
+    if (hasDependentTags && !updatedTransaction.tag) {
+        return getTagViolationsForDependentTags(policyTagList, filteredTransactionViolations);
+    }
+
+    return getTagViolationForIndependentTags(policyTagList, filteredTransactionViolations, policyTagKeys, selectedTags);
+}
+
 const ViolationsUtils = {
     /**
      * Checks a transaction for policy violations and returns an object with Onyx method, key and updated transaction
@@ -121,6 +156,7 @@ const ViolationsUtils = {
         policyTagList: PolicyTagList,
         policyRequiresCategories: boolean,
         policyCategories: PolicyCategories,
+        hasDependentTags: boolean,
     ): OnyxUpdate {
         const isPartialTransaction = TransactionUtils.isPartialMerchant(TransactionUtils.getMerchant(updatedTransaction)) && TransactionUtils.isAmountMissing(updatedTransaction);
         if (isPartialTransaction) {
@@ -166,7 +202,7 @@ const ViolationsUtils = {
             newTransactionViolations =
                 Object.keys(policyTagList).length === 1
                     ? getTagViolationsForSingleLevelTags(updatedTransaction, newTransactionViolations, policyRequiresTags, policyTagList)
-                    : getTagViolationsForMultiLevelTags(updatedTransaction, newTransactionViolations, policyRequiresTags, policyTagList);
+                    : getTagViolationsForMultiLevelTags(updatedTransaction, newTransactionViolations, policyRequiresTags, policyTagList, hasDependentTags);
         }
 
         return {

src/libs/actions/IOU.ts

@@ -779,7 +779,15 @@
         return [optimisticData, successData, failureData];
     }
 
-    const violationsOnyxData = ViolationsUtils.getViolationsOnyxData(transaction, [], !!policy.requiresTag, policyTagList ?? {}, !!policy.requiresCategory, policyCategories ?? {});
+    const violationsOnyxData = ViolationsUtils.getViolationsOnyxData(
+        transaction,
+        [],
+        !!policy.requiresTag,
+        policyTagList ?? {},
+        !!policy.requiresCategory,
+        policyCategories ?? {},
+        PolicyUtils.hasDependentTags(policy, policyTagList ?? {}),
+    );
 
     if (violationsOnyxData) {
         optimisticData.push(violationsOnyxData);
@@ -1074,7 +1082,7 @@
         return [optimisticData, successData, failureData];
     }
 
     const violationsOnyxData = ViolationsUtils.getViolationsOnyxData(transaction, [], !!policy.requiresTag, policyTagList ?? {}, !!policy.requiresCategory, policyCategories ?? {});
 
     if (violationsOnyxData) {
         optimisticData.push(violationsOnyxData);
@@ -1411,7 +1419,15 @@
         return [optimisticData, successData, failureData];
     }
 
-    const violationsOnyxData = ViolationsUtils.getViolationsOnyxData(transaction, [], !!policy.requiresTag, policyTagList ?? {}, !!policy.requiresCategory, policyCategories ?? {});
+    const violationsOnyxData = ViolationsUtils.getViolationsOnyxData(
+        transaction,
+        [],
+        !!policy.requiresTag,
+        policyTagList ?? {},
+        !!policy.requiresCategory,
+        policyCategories ?? {},
+        PolicyUtils.hasDependentTags(policy, policyTagList ?? {}),
+    );
 
     if (violationsOnyxData) {
         optimisticData.push(violationsOnyxData);
@@ -2501,6 +2517,7 @@
                 policyTagList ?? {},
                 !!policy.requiresCategory,
                 policyCategories ?? {},
+                PolicyUtils.hasDependentTags(policy, policyTagList ?? {}),
             ),
         );
         failureData.push({
@@ -4878,6 +4895,7 @@
             policyTags,
             !!policy.requiresCategory,
             policyCategories,
+            PolicyUtils.hasDependentTags(policy, policyTags),
         );
         optimisticData.push(updatedViolationsOnyxData);
         failureData.push({

src/types/onyx/PolicyTag.ts

@@ -13,6 +13,16 @@ type PolicyTag = OnyxCommon.OnyxValueWithOfflineFeedback<{
 
     /** A list of errors keyed by microtime */
     errors?: OnyxCommon.Errors | null;
+
+    rules?: {
+        /**
+         * String representation of regex to match against parent tag. Eg, if San Francisco is a child tag of California
+         * its parentTagsFilter will be ^California$
+         */
+        parentTagsFilter?: string;
+    };
+
+    parentTagsFilter?: string;
 }>;
 
 type PolicyTags = Record<string, PolicyTag>;

src/types/onyx/TransactionViolation.ts

@@ -10,6 +10,7 @@ type TransactionViolation = {
     type: string;
     name: ViolationName;
     data?: {
+        policyHasDependentTags?: boolean;
         rejectedBy?: string;
         rejectReason?: string;
         formattedLimit?: string;