[HOLD https://github.com/Expensify/App/pull/82934] [Domain Control] [Release 4] Add Preferred Workspace to DomainGroupDetailsPage

src/ROUTES.ts

@@ -4108,6 +4108,11 @@ const ROUTES = {
         route: 'domain/:domainAccountID/groups/:groupID/name',
         getRoute: (domainAccountID: number, groupID: string) => `domain/${domainAccountID}/groups/${groupID}/name` as const,
     },
+
+    DOMAIN_SECURITY_GROUPS_PREFERRED_WORKSPACE: {
+        route: 'domain/:domainAccountID/groups/:groupID/preferred-workspace',
+        getRoute: (domainAccountID: number, groupID: string) => `domain/${domainAccountID}/groups/${groupID}/preferred-workspace` as const,
+    },
 } as const;
 
 /**

src/SCREENS.ts

@@ -995,6 +995,7 @@ const SCREENS = {
         MEMBER_LOCK_ACCOUNT: 'Member_Lock_Account',
         GROUP_DETAILS: 'Domain_Group_Details',
         GROUP_EDIT_NAME: 'Domain_Group_Edit_Name',
+        SECURITY_GROUPS_PREFERRED_WORKSPACE: 'Domain_Security_Groups_Preferred_Workspace',
     },
     MULTIFACTOR_AUTHENTICATION: {
         MAGIC_CODE: 'Multifactor_Authentication_Magic_Code',

src/languages/de.ts

@@ -8886,6 +8886,10 @@ Hier ist ein *Testbeleg*, um dir zu zeigen, wie es funktioniert:`,
                 settings:
                     '<rbr>Diese Änderung konnte nicht gespeichert werden. Bitte versuche es erneut oder <concierge-link>kontaktiere Concierge</concierge-link> für weitere Unterstützung.</rbr>',
             },
+            permissions: 'Gruppenberechtigungen',
+            preferredWorkspace: 'Bevorzugter Arbeitsbereich',
+            preferredWorkspaceDescription: (enabled: boolean) => `Alle neuen Berichte und Ausgaben werden im ${enabled ? 'ausgewählten bevorzugten' : 'diesem'} Arbeitsbereich erstellt.`,
+            preferredWorkspaceSelectDescription: 'Alle neuen Ausgaben und Berichte werden in diesem Arbeitsbereich erstellt.',
         },
     },
     proactiveAppReview: {

src/languages/en.ts

@@ -8869,6 +8869,11 @@ const translations = {
             error: {
                 settings: 'Couldn\'t save this change. Please try again.',
             },
+            permissions: 'Group permissions',
+            preferredWorkspace: 'Preferred Workspace',
+            preferredWorkspaceDescription: (enabled: boolean) => `All new reports and expenses will be created on ${enabled ? 'selected preferred' : 'this'} workspace.`,
+            preferredWorkspaceSelectDescription: 'All new expenses and reports will be created on this workspace.',
+            noWorkspacesMessage: 'There are no workspaces on this domain. A workspace is required to enable this restriction.',
         },
     },
 };

src/languages/es.ts

@@ -9152,6 +9152,12 @@ ${amount} para ${merchant} - ${date}`,
             error: {
                 settings: 'No se pudo guardar este cambio. Inténtalo de nuevo.',
             },
+            permissions: 'Permisos de grupo',
+            preferredWorkspace: 'Espacio de trabajo preferido',
+            preferredWorkspaceDescription: (enabled) =>
+                `Todos los nuevos informes y gastos se crearán en ${enabled ? 'el espacio de trabajo preferido seleccionado' : 'este espacio de trabajo'}.`,
+            preferredWorkspaceSelectDescription: 'Todos los nuevos gastos e informes se crearán en este espacio de trabajo.',
+            noWorkspacesMessage: 'No hay espacios de trabajo en este dominio. Se requiere un espacio de trabajo para habilitar esta restricción.',
         },
     },
     gps: {

src/languages/fr.ts

@@ -8907,6 +8907,11 @@ Voici un *reçu test* pour vous montrer comment ça fonctionne :`,
             title: 'Groupes',
             memberCount: () => ({one: '1 membre', other: (count: number) => `${count} membres`}),
             error: {settings: "<rbr>Impossible d'enregistrer cette modification. Veuillez réessayer ou <concierge-link>contacter Concierge</concierge-link> pour obtenir de l'aide.</rbr>"},
+            permissions: 'Permissions du groupe',
+            preferredWorkspace: 'Espace de travail préféré',
+            preferredWorkspaceDescription: (enabled: boolean) =>
+                `Tous les nouveaux rapports et dépenses seront créés dans ${enabled ? "l'espace de travail préféré sélectionné" : 'cet espace de travail'}.`,
+            preferredWorkspaceSelectDescription: 'Toutes les nouvelles dépenses et tous les nouveaux rapports seront créés dans cet espace de travail.',
         },
     },
     proactiveAppReview: {

src/languages/it.ts

@@ -8873,6 +8873,11 @@ Ecco una *ricevuta di prova* per mostrarti come funziona:`,
             title: 'Gruppi',
             memberCount: () => ({one: '1 membro', other: (count: number) => `${count} membri`}),
             error: {settings: '<rbr>Non è stato possibile salvare questa modifica. Riprova o <concierge-link>contatta Concierge</concierge-link> per ulteriore assistenza.</rbr>'},
+            permissions: 'Permessi del gruppo',
+            preferredWorkspace: 'Spazio di lavoro preferito',
+            preferredWorkspaceDescription: (enabled: boolean) =>
+                `Tutti i nuovi report e le spese verranno creati ${enabled ? 'nello spazio di lavoro preferito selezionato' : 'in questo spazio di lavoro'}.`,
+            preferredWorkspaceSelectDescription: 'Tutte le nuove spese e i report verranno creati in questo spazio di lavoro.',
         },
     },
     proactiveAppReview: {

src/languages/ja.ts

@@ -8762,6 +8762,10 @@ ${reportName}
             title: 'グループ',
             memberCount: () => ({one: 'メンバー 1 人', other: (count: number) => `${count}名のメンバー`}),
             error: {settings: '<rbr>この変更を保存できませんでした。もう一度お試しいただくか、<concierge-link>Conciergeにお問い合わせ</concierge-link>ください。</rbr>'},
+            permissions: 'グループ権限',
+            preferredWorkspace: '優先ワークスペース',
+            preferredWorkspaceDescription: (enabled: boolean) => `すべての新しいレポートと経費は${enabled ? '選択された優先' : 'この'}ワークスペースに作成されます。`,
+            preferredWorkspaceSelectDescription: 'すべての新しい経費とレポートはこのワークスペースに作成されます。',
         },
     },
     proactiveAppReview: {

src/languages/nl.ts

@@ -8851,6 +8851,10 @@ Hier is een *proefbon* om je te laten zien hoe het werkt:`,
             title: 'Groepen',
             memberCount: () => ({one: '1 lid', other: (count: number) => `${count} leden`}),
             error: {settings: '<rbr>Kon deze wijziging niet opslaan. Probeer het opnieuw of <concierge-link>neem contact op met Concierge</concierge-link> voor meer ondersteuning.</rbr>'},
+            permissions: 'Groepsrechten',
+            preferredWorkspace: 'Voorkeurswerkruimte',
+            preferredWorkspaceDescription: (enabled: boolean) => `Alle nieuwe rapporten en uitgaven worden aangemaakt in ${enabled ? 'de geselecteerde voorkeurs' : 'deze'} werkruimte.`,
+            preferredWorkspaceSelectDescription: 'Alle nieuwe uitgaven en rapporten worden aangemaakt in deze werkruimte.',
         },
     },
     proactiveAppReview: {

src/languages/pl.ts

@@ -8828,6 +8828,10 @@ Oto *paragon testowy*, żeby pokazać Ci, jak to działa:`,
             title: 'Grupy',
             memberCount: () => ({one: '1 członek', other: (count: number) => `${count} członków`}),
             error: {settings: '<rbr>Nie udało się zapisać tej zmiany. Spróbuj ponownie lub <concierge-link>skontaktuj się z Concierge</concierge-link>, aby uzyskać pomoc.</rbr>'},
+            permissions: 'Uprawnienia grupy',
+            preferredWorkspace: 'Preferowany obszar roboczy',
+            preferredWorkspaceDescription: (enabled: boolean) => `Wszystkie nowe raporty i wydatki będą tworzone w ${enabled ? 'wybranym preferowanym' : 'tym'} obszarze roboczym.`,
+            preferredWorkspaceSelectDescription: 'Wszystkie nowe wydatki i raporty będą tworzone w tym obszarze roboczym.',
         },
     },
     proactiveAppReview: {

src/languages/pt-BR.ts

@@ -8838,6 +8838,11 @@ Aqui está um *comprovante de teste* para mostrar como funciona:`,
             title: 'Grupos',
             memberCount: () => ({one: '1 membro', other: (count: number) => `${count} membros`}),
             error: {settings: '<rbr>Não foi possível salvar esta alteração. Tente novamente ou <concierge-link>entre em contato com o Concierge</concierge-link> para mais suporte.</rbr>'},
+            permissions: 'Permissões do grupo',
+            preferredWorkspace: 'Espaço de trabalho preferido',
+            preferredWorkspaceDescription: (enabled: boolean) =>
+                `Todos os novos relatórios e despesas serão criados ${enabled ? 'no espaço de trabalho preferido selecionado' : 'neste espaço de trabalho'}.`,
+            preferredWorkspaceSelectDescription: 'Todas as novas despesas e relatórios serão criados neste espaço de trabalho.',
         },
     },
     proactiveAppReview: {

src/languages/zh-hans.ts

@@ -8595,6 +8595,10 @@ ${reportName}
             title: '群组',
             memberCount: () => ({one: '1 名成员', other: (count: number) => `${count} 名成员`}),
             error: {settings: '<rbr>无法保存此更改。请重试或<concierge-link>联系Concierge</concierge-link>获取更多支持。</rbr>'},
+            permissions: '群组权限',
+            preferredWorkspace: '首选工作区',
+            preferredWorkspaceDescription: (enabled: boolean) => `所有新报告和费用将在${enabled ? '选定的首选' : '此'}工作区中创建。`,
+            preferredWorkspaceSelectDescription: '所有新费用和报告将在此工作区中创建。',
         },
     },
     proactiveAppReview: {title: '喜欢全新的 Expensify 吗？', description: '请告诉我们，这样我们就能帮助您让报销体验变得更好。', positiveButton: '太棒了！', negativeButton: '不太是'},

src/libs/Navigation/AppNavigator/ModalStackNavigators/index.tsx

@@ -931,6 +931,7 @@ const SettingsModalStackNavigator = createModalStackNavigator<SettingsNavigatorP
     [SCREENS.DOMAIN.MEMBER_LOCK_ACCOUNT]: () => require<ReactComponentModule>('../../../../pages/domain/Members/DomainReportSuspiciousActivityPage').default,
     [SCREENS.DOMAIN.GROUP_DETAILS]: () => require<ReactComponentModule>('../../../../pages/domain/Groups/DomainGroupDetailsPage').default,
     [SCREENS.DOMAIN.GROUP_EDIT_NAME]: () => require<ReactComponentModule>('../../../../pages/domain/Groups/DomainGroupEditNamePage').default,
+    [SCREENS.DOMAIN.SECURITY_GROUPS_PREFERRED_WORKSPACE]: () => require<ReactComponentModule>('../../../../pages/domain/Groups/DomainGroupPreferredWorkspacePage').default,
 });
 
 const TwoFactorAuthenticatorStackNavigator = createModalStackNavigator<EnablePaymentsNavigatorParamList>({

src/libs/Navigation/linkingConfig/RELATIONS/DOMAIN_TO_RHP.ts

@@ -16,7 +16,7 @@ const DOMAIN_TO_RHP: Partial<Record<keyof DomainSplitNavigatorParamList, string[
         SCREENS.DOMAIN.MEMBER_RESET_TWO_FACTOR_AUTH,
         SCREENS.DOMAIN.MEMBER_LOCK_ACCOUNT,
     ],
-    [SCREENS.DOMAIN.GROUPS]: [SCREENS.DOMAIN.GROUP_DETAILS, SCREENS.DOMAIN.GROUP_EDIT_NAME],
+    [SCREENS.DOMAIN.GROUPS]: [SCREENS.DOMAIN.GROUP_DETAILS, SCREENS.DOMAIN.GROUP_EDIT_NAME, SCREENS.DOMAIN.SECURITY_GROUPS_PREFERRED_WORKSPACE],
 };
 
 export default DOMAIN_TO_RHP;

src/libs/Navigation/linkingConfig/config.ts

@@ -1354,6 +1354,9 @@ const config: LinkingOptions<RootNavigatorParamList>['config'] = {
                         [SCREENS.DOMAIN.GROUP_EDIT_NAME]: {
                             path: ROUTES.DOMAIN_GROUP_EDIT_NAME.route,
                         },
+                        [SCREENS.DOMAIN.SECURITY_GROUPS_PREFERRED_WORKSPACE]: {
+                            path: ROUTES.DOMAIN_SECURITY_GROUPS_PREFERRED_WORKSPACE.route,
+                        },
                     },
                 },
                 [SCREENS.RIGHT_MODAL.TWO_FACTOR_AUTH]: {

src/libs/Navigation/types.ts

@@ -1578,6 +1578,10 @@ type SettingsNavigatorParamList = {
         domainAccountID: number;
         groupID: string;
     };
+    [SCREENS.DOMAIN.SECURITY_GROUPS_PREFERRED_WORKSPACE]: {
+        domainAccountID: number;
+        groupID: string;
+    };
 } & ReimbursementAccountNavigatorParamList;
 
 type DomainCardNavigatorParamList = {

src/libs/actions/Domain.ts

@@ -1707,7 +1707,7 @@ function updateDomainSecurityGroup(
     groupID: string,
     currentSecurityGroup: DomainSecurityGroup,
     newSettingValue: Partial<DomainSecurityGroup>,
-    settingsName: keyof Pick<DomainSecurityGroup, 'name'>,
+    settingsName: keyof Pick<DomainSecurityGroup, 'name' | 'enableRestrictedPrimaryPolicy' | 'restrictedPrimaryPolicyID'>,
 ) {
     const SECURITY_GROUP_KEY = `${CONST.DOMAIN.DOMAIN_SECURITY_GROUP_PREFIX}${groupID}`;
     const newSecurityGroup = {...currentSecurityGroup, ...newSettingValue};

src/pages/domain/Groups/DomainGroupDetailsPage.tsx

@@ -1,11 +1,13 @@
 import {domainSecurityGroupSettingErrorsSelector, domainSecurityGroupSettingPendingActionSelector, selectGroupByID} from '@selectors/Domain';
 import React from 'react';
+import {View} from 'react-native';
 import ErrorMessageRow from '@components/ErrorMessageRow';
 import HeaderWithBackButton from '@components/HeaderWithBackButton';
 import MenuItemWithTopDescription from '@components/MenuItemWithTopDescription';
 import OfflineWithFeedback from '@components/OfflineWithFeedback';
 import ScreenWrapper from '@components/ScreenWrapper';
 import ScrollView from '@components/ScrollView';
+import Text from '@components/Text';
 import useLocalize from '@hooks/useLocalize';
 import useOnyx from '@hooks/useOnyx';
 import useThemeStyles from '@hooks/useThemeStyles';
@@ -17,14 +19,15 @@ import {clearDomainSecurityGroupSettingError} from '@userActions/Domain';
 import ONYXKEYS from '@src/ONYXKEYS';
 import ROUTES from '@src/ROUTES';
 import type SCREENS from '@src/SCREENS';
+import PreferredWorkspaceToggle from './PreferredWorkspaceToggle';
 
 type DomainGroupDetailsPageProps = PlatformStackScreenProps<SettingsNavigatorParamList, typeof SCREENS.DOMAIN.GROUP_DETAILS>;
 
 function DomainGroupDetailsPage({route}: DomainGroupDetailsPageProps) {
     const {domainAccountID, groupID} = route.params;
 
-    const {translate} = useLocalize();
     const styles = useThemeStyles();
+    const {translate} = useLocalize();
 
     const [group] = useOnyx(`${ONYXKEYS.COLLECTION.DOMAIN}${domainAccountID}`, {
         selector: selectGroupByID(groupID),
@@ -58,6 +61,12 @@ function DomainGroupDetailsPage({route}: DomainGroupDetailsPageProps) {
                             errorRowStyles={[styles.mh5, styles.mt3]}
                         />
                     </OfflineWithFeedback>
+                    <View style={[styles.sectionDividerLine, styles.ph5, styles.mv6]} />
+                    <Text style={[styles.textNormal, styles.textStrong, styles.ph5]}>{translate('domain.groups.permissions')}</Text>
+                    <PreferredWorkspaceToggle
+                        domainAccountID={domainAccountID}
+                        groupID={groupID}
+                    />
                 </ScrollView>
             </ScreenWrapper>
         </DomainNotFoundPageWrapper>

src/pages/domain/Groups/DomainGroupPreferredWorkspacePage.tsx

@@ -0,0 +1,124 @@
+import {selectGroupByID} from '@selectors/Domain';
+import {createAdminPoliciesSelector} from '@selectors/Policy';
+import React, {useState} from 'react';
+import FormAlertWithSubmitButton from '@components/FormAlertWithSubmitButton';
+import HeaderWithBackButton from '@components/HeaderWithBackButton';
+import ScreenWrapper from '@components/ScreenWrapper';
+import SelectionList from '@components/SelectionList';
+import UserListItem from '@components/SelectionList/ListItem/UserListItem';
+import type {ListItem} from '@components/SelectionList/types';
+import Text from '@components/Text';
+import {useMemoizedLazyExpensifyIcons} from '@hooks/useLazyAsset';
+import useLocalize from '@hooks/useLocalize';
+import useOnyx from '@hooks/useOnyx';
+import useThemeStyles from '@hooks/useThemeStyles';
+import {getDefaultWorkspaceAvatar} from '@libs/ReportUtils';
+import Navigation from '@navigation/Navigation';
+import type {PlatformStackScreenProps} from '@navigation/PlatformStackNavigation/types';
+import type {SettingsNavigatorParamList} from '@navigation/types';
+import DomainNotFoundPageWrapper from '@pages/domain/DomainNotFoundPageWrapper';
+import {updateDomainSecurityGroup} from '@userActions/Domain';
+import CONST from '@src/CONST';
+import ONYXKEYS from '@src/ONYXKEYS';
+import ROUTES from '@src/ROUTES';
+import type SCREENS from '@src/SCREENS';
+
+type WorkspaceListItem = {
+    policyID: string;
+    created?: string;
+} & ListItem;
+
+type DomainGroupPreferredWorkspacePageProps = PlatformStackScreenProps<SettingsNavigatorParamList, typeof SCREENS.DOMAIN.SECURITY_GROUPS_PREFERRED_WORKSPACE>;
+
+function DomainGroupPreferredWorkspacePage({route}: DomainGroupPreferredWorkspacePageProps) {
+    const {domainAccountID, groupID} = route.params;
+
+    const styles = useThemeStyles();
+    const {translate, localeCompare} = useLocalize();
+    const icons = useMemoizedLazyExpensifyIcons(['FallbackWorkspaceAvatar']);
+
+    const [group] = useOnyx(`${ONYXKEYS.COLLECTION.DOMAIN}${domainAccountID}`, {
+        selector: selectGroupByID(groupID),
+    });
+
+    const currentPolicyID = group?.restrictedPrimaryPolicyID;
+
+    const [policies] = useOnyx(ONYXKEYS.COLLECTION.POLICY, {selector: createAdminPoliciesSelector(currentPolicyID)});
+    const [selectedPolicyID, setSelectedPolicyID] = useState<string | undefined>(currentPolicyID);
+    const [shouldShowError, setShouldShowError] = useState(false);
+
+    const workspaceOptions: WorkspaceListItem[] = [];
+    for (const policy of Object.values(policies ?? {})) {
+        if (!policy?.name || !policy?.id) {
+            continue;
+        }
+
+        workspaceOptions.push({
+            text: policy.name,
+            policyID: policy.id,
+            created: policy.created,
+            keyForList: policy.id,
+            isSelected: selectedPolicyID === policy.id,
+            icons: [
+                {
+                    source: policy.avatarURL ?? getDefaultWorkspaceAvatar(policy.name),
+                    fallbackIcon: icons.FallbackWorkspaceAvatar,
+                    name: policy.name,
+                    type: CONST.ICON_TYPE_WORKSPACE,
+                    id: policy.id,
+                },
+            ],
+        });
+    }
+
+    const handleSubmit = () => {
+        if (!selectedPolicyID) {
+            setShouldShowError(true);
+            return;
+        }
+        if (!group) {
+            return;
+        }
+
+        updateDomainSecurityGroup(domainAccountID, groupID, group, {restrictedPrimaryPolicyID: selectedPolicyID}, 'restrictedPrimaryPolicyID');
+        Navigation.goBack(ROUTES.DOMAIN_GROUP_DETAILS.getRoute(domainAccountID, groupID));
+    };
+
+    return (
+        <DomainNotFoundPageWrapper domainAccountID={domainAccountID}>
+            <ScreenWrapper
+                shouldEnableMaxHeight
+                testID="DomainGroupPreferredWorkspacePage"
+                includeSafeAreaPaddingBottom
+            >
+                <HeaderWithBackButton
+                    title={translate('domain.groups.preferredWorkspace')}
+                    onBackButtonPress={() => Navigation.goBack(ROUTES.DOMAIN_GROUP_DETAILS.getRoute(domainAccountID, groupID))}
+                />
+                <Text style={[styles.ph5, styles.mb3]}>{translate('domain.groups.preferredWorkspaceSelectDescription')}</Text>
+                <SelectionList<WorkspaceListItem>
+                    data={workspaceOptions.sort((a, b) => localeCompare(a.created ?? '', b.created ?? ''))}
+                    ListItem={UserListItem}
+                    onSelectRow={(item: WorkspaceListItem) => {
+                        setSelectedPolicyID(item.policyID);
+                        setShouldShowError(false);
+                    }}
+                    initiallyFocusedItemKey={currentPolicyID}
+                    shouldUpdateFocusedIndex
+                    footerContent={
+                        <FormAlertWithSubmitButton
+                            buttonText={translate('common.save')}
+                            onSubmit={handleSubmit}
+                            isAlertVisible={shouldShowError}
+                            containerStyles={[!shouldShowError && styles.mt5]}
+                            message={translate('common.error.pleaseSelectOne')}
+                            enabledWhenOffline
+                        />
+                    }
+                />
+            </ScreenWrapper>
+        </DomainNotFoundPageWrapper>
+    );
+}
+
+export default DomainGroupPreferredWorkspacePage;