Add a switch for requiring tags on the multi level tags RHP

src/CONST.ts

@@ -1665,6 +1665,9 @@ const CONST = {
             // Often referred to as "collect" workspaces
             TEAM: 'team',
         },
+        TAG: {
+            REQUIRED: 'required',
+        },
         ROLE: {
             ADMIN: 'admin',
             AUDITOR: 'auditor',

src/libs/API/parameters/SetPolicyRequiresTag.ts

@@ -1,5 +1,6 @@
 type SetPolicyRequiresTag = {
     policyID: string;
+    tagListIndex: number;
     requiresTag: boolean;
 };
 

src/libs/actions/Policy/Tag.ts

@@ -531,7 +531,7 @@ function renamePolicyTaglist(policyID: string, policyTagListName: {oldName: stri
     API.write(WRITE_COMMANDS.RENAME_POLICY_TAG_LIST, parameters, onyxData);
 }
 
-function setPolicyRequiresTag(policyID: string, requiresTag: boolean) {
+function setPolicyRequiresTag(policyID: string, requiresTag: boolean, tagListIndex: number) {
     const onyxData: OnyxData = {
         optimisticData: [
             {
@@ -577,6 +577,7 @@ function setPolicyRequiresTag(policyID: string, requiresTag: boolean) {
 
     const parameters = {
         policyID,
+        tagListIndex,
         requiresTag,
     };
 

src/pages/workspace/tags/WorkspaceTagsSettingsPage.tsx

@@ -36,9 +36,9 @@ function WorkspaceTagsSettingsPage({route, policyTags}: WorkspaceTagsSettingsPag
     const hasEnabledOptions = OptionsListUtils.hasEnabledOptions(Object.values(policyTags ?? {}).flatMap(({tags}) => Object.values(tags)));
     const updateWorkspaceRequiresTag = useCallback(
         (value: boolean) => {
-            Tag.setPolicyRequiresTag(route.params.policyID, value);
+            Tag.setPolicyRequiresTag(route.params.policyID, value, policyTagLists[0].orderWeight);
         },
-        [route.params.policyID],
+        [route.params.policyID, policyTagLists],
     );
 
     return (

src/pages/workspace/tags/WorkspaceViewTagsPage.tsx

@@ -21,12 +21,14 @@ import useTheme from '@hooks/useTheme';
 import useThemeStyles from '@hooks/useThemeStyles';
 import useWindowDimensions from '@hooks/useWindowDimensions';
 import * as DeviceCapabilities from '@libs/DeviceCapabilities';
+import * as ErrorUtils from '@libs/ErrorUtils';
 import localeCompare from '@libs/LocaleCompare';
 import Navigation from '@libs/Navigation/Navigation';
 import * as PolicyUtils from '@libs/PolicyUtils';
 import type {SettingsNavigatorParamList} from '@navigation/types';
 import NotFoundPage from '@pages/ErrorPage/NotFoundPage';
 import AccessOrNotFoundWrapper from '@pages/workspace/AccessOrNotFoundWrapper';
+import ToggleSettingOptionRow from '@pages/workspace/workflows/ToggleSettingsOptionRow';
 import * as Tag from '@userActions/Policy/Tag';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
@@ -245,6 +247,17 @@ function WorkspaceViewTagsPage({route}: WorkspaceViewTagsProps) {
                         shouldShowRightIcon
                     />
                 </OfflineWithFeedback>
+                <View style={[styles.pv4, styles.ph5]}>
+                    <ToggleSettingOptionRow
+                        title={translate('workspace.tags.requiresTag')}
+                        switchAccessibilityLabel={translate('workspace.tags.requiresTag')}
+                        isActive={Boolean(policyTagList?.required)}
+                        onToggle={(on) => Tag.setPolicyRequiresTag(policyID, on, route.params.orderWeight ?? 0)}
+                        pendingAction={currentPolicyTag.pendingFields?.required}
+                        errors={ErrorUtils.getLatestErrorField(policyTags, CONST.POLICY.TAG.REQUIRED)}
+                        disabled={!Object.values(currentPolicyTag?.tags ?? {}).some((tag) => tag.enabled)}
+                    />
+                </View>
                 {isLoading && (
                     <ActivityIndicator
                         size={CONST.ACTIVITY_INDICATOR_SIZE.LARGE}

tests/actions/PolicyTagTest.ts

@@ -34,7 +34,7 @@ describe('actions/Policy', () => {
 
             return Onyx.set(`${ONYXKEYS.COLLECTION.POLICY}${fakePolicy.id}`, fakePolicy)
                 .then(() => {
-                    Tag.setPolicyRequiresTag(fakePolicy.id, true);
+                    Tag.setPolicyRequiresTag(fakePolicy.id, true, 0);
                     return waitForBatchedUpdates();
                 })
                 .then(
@@ -81,7 +81,7 @@ describe('actions/Policy', () => {
 
             return Onyx.set(`${ONYXKEYS.COLLECTION.POLICY}${fakePolicy.id}`, fakePolicy)
                 .then(() => {
-                    Tag.setPolicyRequiresTag(fakePolicy.id, false);
+                    Tag.setPolicyRequiresTag(fakePolicy.id, false, 0);
                     return waitForBatchedUpdates();
                 })
                 .then(
@@ -129,7 +129,7 @@ describe('actions/Policy', () => {
             return Onyx.set(`${ONYXKEYS.COLLECTION.POLICY}${fakePolicy.id}`, fakePolicy)
                 .then(() => {
                     mockFetch?.fail?.();
-                    Tag.setPolicyRequiresTag(fakePolicy.id, false);
+                    Tag.setPolicyRequiresTag(fakePolicy.id, false, 0);
                     return waitForBatchedUpdates();
                 })