Create merchant rule

src/CONST/index.ts

@@ -3758,6 +3758,18 @@ const CONST = {
             DELETE: 'delete',
         },
     },
+    MERCHANT_RULES: {
+        FIELDS: {
+            BILLABLE: 'billable',
+            CATEGORY: 'category',
+            DESCRIPTION: 'comment',
+            MERCHANT_TO_MATCH: 'merchantToMatch',
+            MERCHANT: 'merchant',
+            REIMBURSABLE: 'reimbursable',
+            TAG: 'tag',
+            TAX: 'tax',
+        },
+    },
 
     get SUBSCRIPTION_PRICES() {
         return {

src/ONYXKEYS.ts

@@ -980,6 +980,8 @@ const ONYXKEYS = {
         SPLIT_EXPENSE_EDIT_DATES_DRAFT: 'splitExpenseEditDatesDraft',
         EXPENSE_RULE_FORM: 'expenseRuleForm',
         EXPENSE_RULE_FORM_DRAFT: 'expenseRuleFormDraft',
+        MERCHANT_RULE_FORM: 'merchantRuleForm',
+        MERCHANT_RULE_FORM_DRAFT: 'merchantRuleFormDraft',
         ADD_DOMAIN_MEMBER_FORM: 'addDomainMemberForm',
         ADD_DOMAIN_MEMBER_FORM_DRAFT: 'addDomainMemberFormDraft',
     },
@@ -1103,6 +1105,7 @@ type OnyxFormValuesMapping = {
     [ONYXKEYS.FORMS.CREATE_DOMAIN_FORM]: FormTypes.CreateDomainForm;
     [ONYXKEYS.FORMS.SPLIT_EXPENSE_EDIT_DATES]: FormTypes.SplitExpenseEditDateForm;
     [ONYXKEYS.FORMS.EXPENSE_RULE_FORM]: FormTypes.ExpenseRuleForm;
+    [ONYXKEYS.FORMS.MERCHANT_RULE_FORM]: FormTypes.MerchantRuleForm;
     [ONYXKEYS.FORMS.ADD_DOMAIN_MEMBER_FORM]: FormTypes.AddDomainMemberForm;
 };
 

src/ROUTES.ts

@@ -2670,6 +2670,42 @@ const ROUTES = {
         route: 'workspaces/:policyID/overview/policy',
         getRoute: (policyID: string) => `workspaces/${policyID}/overview/policy` as const,
     },
+    RULES_MERCHANT_NEW: {
+        route: 'workspaces/:policyID/rules/merchant-rules/new',
+        getRoute: (policyID: string) => `workspaces/${policyID}/rules/merchant-rules/new` as const,
+    },
+    RULES_MERCHANT_MERCHANT_TO_MATCH: {
+        route: 'workspaces/:policyID/rules/merchant-rules/new/merchant-to-match',
+        getRoute: (policyID: string) => `workspaces/${policyID}/rules/merchant-rules/new/merchant-to-match` as const,
+    },
+    RULES_MERCHANT_MERCHANT: {
+        route: 'workspaces/:policyID/rules/merchant-rules/new/merchant',
+        getRoute: (policyID: string) => `workspaces/${policyID}/rules/merchant-rules/new/merchant` as const,
+    },
+    RULES_MERCHANT_CATEGORY: {
+        route: 'workspaces/:policyID/rules/merchant-rules/new/category',
+        getRoute: (policyID: string) => `workspaces/${policyID}/rules/merchant-rules/new/category` as const,
+    },
+    RULES_MERCHANT_TAG: {
+        route: 'workspaces/:policyID/rules/merchant-rules/new/tag',
+        getRoute: (policyID: string) => `workspaces/${policyID}/rules/merchant-rules/new/tag` as const,
+    },
+    RULES_MERCHANT_TAX: {
+        route: 'workspaces/:policyID/rules/merchant-rules/new/tax',
+        getRoute: (policyID: string) => `workspaces/${policyID}/rules/merchant-rules/new/tax` as const,
+    },
+    RULES_MERCHANT_DESCRIPTION: {
+        route: 'workspaces/:policyID/rules/merchant-rules/new/description',
+        getRoute: (policyID: string) => `workspaces/${policyID}/rules/merchant-rules/new/description` as const,
+    },
+    RULES_MERCHANT_REIMBURSABLE: {
+        route: 'workspaces/:policyID/rules/merchant-rules/new/reimbursable',
+        getRoute: (policyID: string) => `workspaces/${policyID}/rules/merchant-rules/new/reimbursable` as const,
+    },
+    RULES_MERCHANT_BILLABLE: {
+        route: 'workspaces/:policyID/rules/merchant-rules/new/billable',
+        getRoute: (policyID: string) => `workspaces/${policyID}/rules/merchant-rules/new/billable` as const,
+    },
     // Referral program promotion
     REFERRAL_DETAILS_MODAL: {
         route: 'referral/:contentType',

src/SCREENS.ts

@@ -758,6 +758,15 @@ const SCREENS = {
         RULES_REIMBURSABLE_DEFAULT: 'Rules_Reimbursable_Default',
         RULES_CUSTOM: 'Rules_Custom',
         RULES_PROHIBITED_DEFAULT: 'Rules_Prohibited_Default',
+        RULES_MERCHANT_NEW: 'Rules_Merchant_New',
+        RULES_MERCHANT_MERCHANT_TO_MATCH: 'Rules_Merchant_Merchant_To_Match',
+        RULES_MERCHANT_MERCHANT: 'Rules_Merchant_Merchant',
+        RULES_MERCHANT_CATEGORY: 'Rules_Merchant_Category',
+        RULES_MERCHANT_TAG: 'Rules_Merchant_Tag',
+        RULES_MERCHANT_TAX: 'Rules_Merchant_Tax',
+        RULES_MERCHANT_DESCRIPTION: 'Rules_Merchant_Description',
+        RULES_MERCHANT_REIMBURSABLE: 'Rules_Merchant_Reimbursable',
+        RULES_MERCHANT_BILLABLE: 'Rules_Merchant_Billable',
         PER_DIEM: 'Per_Diem',
         PER_DIEM_IMPORT: 'Per_Diem_Import',
         PER_DIEM_IMPORTED: 'Per_Diem_Imported',

src/components/Rule/RuleBooleanBase.tsx

@@ -9,45 +9,54 @@ import type {ListItem} from '@components/SelectionList/ListItem/types';
 import useLocalize from '@hooks/useLocalize';
 import useOnyx from '@hooks/useOnyx';
 import useThemeStyles from '@hooks/useThemeStyles';
-import {updateDraftRule} from '@libs/actions/User';
-import Navigation from '@libs/Navigation/Navigation';
 import CONST from '@src/CONST';
 import type {TranslationPaths} from '@src/languages/types';
-import ONYXKEYS from '@src/ONYXKEYS';
-import ROUTES from '@src/ROUTES';
-import type {InputID} from '@src/types/form/ExpenseRuleForm';
+import type {OnyxFormKey} from '@src/ONYXKEYS';
 import RuleNotFoundPageWrapper from './RuleNotFoundPageWrapper';
 
 type BooleanFilterItem = ListItem & {
     value: ValueOf<typeof CONST.SEARCH.BOOLEAN>;
 };
 
-type RuleBooleanBasePageProps = {
-    /** The key from boolean-based InputID */
-    fieldID: InputID;
+type RuleBooleanBaseProps = {
+    /** The field ID from the form */
+    fieldID: string;
 
     /** The translation key for the page title */
     titleKey: TranslationPaths;
 
-    /** The rule identifier */
+    /** The form ID to read from Onyx */
+    formID: OnyxFormKey;
+
+    /** Callback when a value is selected - receives boolean for merchant rules, string for personal rules */
+    onSelect: (fieldID: string, value: boolean | 'true' | 'false' | null) => void;
+
+    /** Callback to go back */
+    onBack: () => void;
+
+    /** Optional hash for rule not found validation */
     hash?: string;
+
+    /** Whether to use string values ('true'/'false') instead of boolean values (for ExpenseRuleForm compatibility) */
+    useStringValues?: boolean;
 };
 
 const booleanValues = Object.values(CONST.SEARCH.BOOLEAN);
 
-function RuleBooleanBasePage({fieldID, titleKey, hash}: RuleBooleanBasePageProps) {
+function RuleBooleanBase({fieldID, titleKey, formID, onSelect, onBack, hash, useStringValues = false}: RuleBooleanBaseProps) {
     const {translate} = useLocalize();
-    const [form] = useOnyx(ONYXKEYS.FORMS.EXPENSE_RULE_FORM, {canBeMissing: true});
+    const [form] = useOnyx(formID, {canBeMissing: true});
     const styles = useThemeStyles();
 
-    const selectedItem =
-        booleanValues.find((value) => {
-            if (!form?.[fieldID]) {
-                return false;
-            }
-            const booleanValue = form[fieldID] === 'true' ? CONST.SEARCH.BOOLEAN.YES : CONST.SEARCH.BOOLEAN.NO;
-            return booleanValue === value;
-        }) ?? null;
+    const formValue = (form as Record<string, boolean | string | undefined>)?.[fieldID];
+
+    let selectedItem = null;
+    if (formValue !== undefined) {
+        // Handle both string ('true'/'false') and boolean (true/false) values
+        const isTruthy = useStringValues ? formValue === 'true' : formValue === true;
+        const booleanValue = isTruthy ? CONST.SEARCH.BOOLEAN.YES : CONST.SEARCH.BOOLEAN.NO;
+        selectedItem = booleanValues.find((value) => booleanValue === value) ?? null;
+    }
 
     const items = booleanValues.map((value) => ({
         value,
@@ -56,34 +65,34 @@ function RuleBooleanBasePage({fieldID, titleKey, hash}: RuleBooleanBasePageProps
         isSelected: selectedItem === value,
     }));
 
-    const goBack = () => {
-        Navigation.goBack(hash ? ROUTES.SETTINGS_RULES_EDIT.getRoute(hash) : ROUTES.SETTINGS_RULES_ADD.getRoute());
-    };
-
     const onSelectItem = (selectedValue: BooleanFilterItem) => {
-        const newValue = selectedValue.isSelected ? null : selectedValue.value;
-        let value = '';
-        if (newValue === CONST.SEARCH.BOOLEAN.YES) {
-            value = 'true';
-        } else if (newValue === CONST.SEARCH.BOOLEAN.NO) {
-            value = 'false';
+        // If clicking on already-selected item, unselect it (set to undefined)
+        if (selectedValue.isSelected) {
+            onSelect(fieldID, null);
+            return;
+        }
+        const isYes = selectedValue.value === CONST.SEARCH.BOOLEAN.YES;
+        let value: boolean | 'true' | 'false';
+        if (useStringValues) {
+            value = isYes ? 'true' : 'false';
+        } else {
+            value = isYes;
         }
-        updateDraftRule({[fieldID]: value});
-        goBack();
+        onSelect(fieldID, value);
     };
 
     return (
         <RuleNotFoundPageWrapper hash={hash}>
             <ScreenWrapper
-                testID="RuleBooleanBasePage"
+                testID="RuleBooleanBase"
                 shouldShowOfflineIndicatorInWideScreen
                 offlineIndicatorStyle={styles.mtAuto}
                 includeSafeAreaPaddingBottom
                 shouldEnableMaxHeight
             >
                 <HeaderWithBackButton
                     title={translate(titleKey)}
-                    onBackButtonPress={goBack}
+                    onBackButtonPress={onBack}
                 />
                 <View style={[styles.flex1]}>
                     <SelectionList
@@ -98,4 +107,4 @@ function RuleBooleanBasePage({fieldID, titleKey, hash}: RuleBooleanBasePageProps
     );
 }
 
-export default RuleBooleanBasePage;
+export default RuleBooleanBase;

src/components/Rule/RuleSelectionBase.tsx

@@ -0,0 +1,73 @@
+import React from 'react';
+import {View} from 'react-native';
+import HeaderWithBackButton from '@components/HeaderWithBackButton';
+import ScreenWrapper from '@components/ScreenWrapper';
+import SearchSingleSelectionPicker from '@components/Search/SearchSingleSelectionPicker';
+import useLocalize from '@hooks/useLocalize';
+import useThemeStyles from '@hooks/useThemeStyles';
+import type {TranslationPaths} from '@src/languages/types';
+import type {Route} from '@src/ROUTES';
+import RuleNotFoundPageWrapper from './RuleNotFoundPageWrapper';
+
+type SelectionItem = {
+    name: string;
+    value: string;
+};
+
+type RuleSelectionBaseProps = {
+    /** The translation key for the page title */
+    titleKey: TranslationPaths;
+
+    /** Test ID for the screen wrapper */
+    testID: string;
+
+    /** The currently selected item */
+    selectedItem?: SelectionItem;
+
+    /** The list of items to display */
+    items: SelectionItem[];
+
+    /** Callback when a value is selected */
+    onSave: (value?: string) => void;
+
+    /** Callback to go back */
+    onBack: () => void;
+
+    /** The route to navigate back to */
+    backToRoute: Route;
+
+    /** Optional hash for rule not found validation */
+    hash?: string;
+};
+
+function RuleSelectionBase({titleKey, testID, selectedItem, items, onSave, onBack, backToRoute, hash}: RuleSelectionBaseProps) {
+    const styles = useThemeStyles();
+    const {translate} = useLocalize();
+
+    return (
+        <RuleNotFoundPageWrapper hash={hash}>
+            <ScreenWrapper
+                testID={testID}
+                shouldShowOfflineIndicatorInWideScreen
+                offlineIndicatorStyle={styles.mtAuto}
+                shouldEnableMaxHeight
+            >
+                <HeaderWithBackButton
+                    title={translate(titleKey)}
+                    onBackButtonPress={onBack}
+                />
+                <View style={[styles.flex1]}>
+                    <SearchSingleSelectionPicker
+                        backToRoute={backToRoute}
+                        initiallySelectedItem={selectedItem}
+                        items={items}
+                        onSaveSelection={onSave}
+                        shouldAutoSave
+                    />
+                </View>
+            </ScreenWrapper>
+        </RuleNotFoundPageWrapper>
+    );
+}
+
+export default RuleSelectionBase;

src/components/Rule/RuleTextBase.tsx

@@ -4,20 +4,14 @@ import HeaderWithBackButton from '@components/HeaderWithBackButton';
 import ScreenWrapper from '@components/ScreenWrapper';
 import useLocalize from '@hooks/useLocalize';
 import useThemeStyles from '@hooks/useThemeStyles';
-import {updateDraftRule} from '@libs/actions/User';
-import Navigation from '@libs/Navigation/Navigation';
-import CONST from '@src/CONST';
 import type {TranslationPaths} from '@src/languages/types';
-import type ONYXKEYS from '@src/ONYXKEYS';
-import ROUTES from '@src/ROUTES';
-import type {InputID} from '@src/types/form/ExpenseRuleForm';
+import type {OnyxFormKey} from '@src/ONYXKEYS';
 import RuleNotFoundPageWrapper from './RuleNotFoundPageWrapper';
 import TextBase from './TextBase';
 
-// Text-based field IDs that accept string input
-type RuleTextBaseProps = {
+type RuleTextBaseProps<TFormID extends OnyxFormKey> = {
     /** The key from text-based InputID */
-    fieldID: InputID;
+    fieldID: string;
 
     /** The translation key for the page title and input label if labelKey is missing */
     titleKey: TranslationPaths;
@@ -37,23 +31,23 @@ type RuleTextBaseProps = {
     /** The character limit for the input */
     characterLimit?: number;
 
-    /** The rule identifier */
+    /** The form ID to read from Onyx */
+    formID: TFormID;
+
+    /** Callback when the form is saved */
+    onSave: (values: FormOnyxValues<TFormID>) => void;
+
+    /** Callback to go back */
+    onBack: () => void;
+
+    /** Optional hash for rule not found validation */
     hash?: string;
 };
 
-function RuleTextBase({fieldID, hintKey, isRequired, titleKey, labelKey, testID, hash, characterLimit = CONST.MERCHANT_NAME_MAX_BYTES}: RuleTextBaseProps) {
+function RuleTextBase<TFormID extends OnyxFormKey>({fieldID, hintKey, isRequired, titleKey, labelKey, testID, characterLimit, formID, onSave, onBack, hash}: RuleTextBaseProps<TFormID>) {
     const {translate} = useLocalize();
     const styles = useThemeStyles();
 
-    const goBack = () => {
-        Navigation.goBack(hash ? ROUTES.SETTINGS_RULES_EDIT.getRoute(hash) : ROUTES.SETTINGS_RULES_ADD.getRoute());
-    };
-
-    const onSave = (values: FormOnyxValues<typeof ONYXKEYS.FORMS.EXPENSE_RULE_FORM>) => {
-        updateDraftRule(values);
-        goBack();
-    };
-
     return (
         <RuleNotFoundPageWrapper hash={hash}>
             <ScreenWrapper
@@ -65,10 +59,11 @@ function RuleTextBase({fieldID, hintKey, isRequired, titleKey, labelKey, testID,
             >
                 <HeaderWithBackButton
                     title={translate(titleKey)}
-                    onBackButtonPress={goBack}
+                    onBackButtonPress={onBack}
                 />
                 <TextBase
                     fieldID={fieldID}
+                    formID={formID}
                     hint={hintKey ? translate(hintKey) : undefined}
                     isRequired={isRequired}
                     label={translate(labelKey ?? titleKey)}