Repository: Expensify/App
Pull request #59568: Fix - Add a setting for creating a different default report title in New Expensify Collect
Author: login: FitseTLT
Created: 2025-04-02T20:49:07Z | Merged: 2025-05-08T16:33:08Z

<!-- If necessary, assign reviewers that know the area or changes well. Feel free to tag any additional reviewers you see fit. -->

### Details
<!-- Explanation of the change or anything fishy that is going on -->

### Fixed Issues
<!---
1. Please postfix `$` with a URL link to the GitHub issue this Pull Request is fixing. For example, `$ https://github.com/Expensify/App/issues/<issueID>`.
2. Please postfix  `PROPOSAL:` with a URL link to your GitHub comment, which contains the approved proposal (i.e. the proposal that was approved by Expensify).  For example, `PROPOSAL: https://github.com/Expensify/App/issues/<issueID>#issuecomment-1369752925`

Do NOT add the special GH keywords like `fixed` etc, we have our own process of managing the flow.
It MUST be an entire link to the github issue and your comment proposal ; otherwise, the linking and its automation will not work as expected.

Make sure this section looks similar to this (you can link multiple issues using the same formatting, just add a new line):

$ https://github.com/Expensify/App/issues/<issueID>
$ https://github.com/Expensify/App/issues/<issueID(comment)>

Do NOT only link the issue number like this: $ #<issueID>
--->
$ https://github.com/Expensify/App/issues/59065
PROPOSAL: https://github.com/Expensify/App/issues/59065#issuecomment-2751399866


### Tests
<!---
Add a numbered list of manual tests you performed that validates your changes work on all platforms, and that there are no regressions present.
Add any additional test steps if test steps are unique to a particular platform.
Manual test steps should be written so that your reviewer can repeat and verify one or more expected outcomes in the development environment.

For example:
1. Click on the text input to bring it into focus
2. Upload an image via copy paste
3. Verify a modal appears displaying a preview of that image
--->

1. Create new workspace
2. Go to more features and verify report fields option is no more available
3. Note that there is Reports menu below Members
4. Click on it
5. Note that `Custom report names` and `Prevent members from changing report titles` options appear (they are moved from the Rules features options)
6. Verify that you can set `Custom report names`
7. Press on `Prevent members from changing report titles` and check that upgrade page is opened
8. Press on Report Fields option and check that upgrade page is opened
9. Upgrade the workspace 
10. Verify that you can add report fields

- [x] Verify that no errors appear in the JS console

### Offline tests
<!---
Add any relevant steps that validate your changes work as expected in a variety of network states e.g. "offline", "spotty connection", "slow internet", etc. Manual test steps should be written so that your reviewer and QA testers can repeat and verify one or more expected outcomes. If you are unsure how the behavior should work ask for advice in the `#expensify-open-source` Slack channel.
--->
Same as above
### QA Steps
<!---
Add a numbered list of manual tests that can be performed by our QA engineers on the staging environment to validate that your changes work on all platforms, and that there are no regressions present.
Add any additional QA steps if test steps are unique to a particular platform.
Manual test steps should be written so that the QA engineer can repeat and verify one or more expected outcomes in the staging environment.

For example:
1. Click on the text input to bring it into focus
12. Upload an image via copy paste
13. Verify a modal appears displaying a preview of that image
--->
Same as above
- [x] Verify that no errors appear in the JS console

### PR Author Checklist
<!--
This is a checklist for PR authors. Please make sure to complete all tasks and check them off once you do, or else your PR will not be merged!
-->

- [x] I linked the correct issue in the `### Fixed Issues` section above
- [x] I wrote clear testing steps that cover the changes made in this PR
    - [x] I added steps for local testing in the `Tests` section
    - [x] I added steps for the expected offline behavior in the `Offline steps` section
    - [x] I added steps for Staging and/or Production testing in the `QA steps` section
    - [x] I added steps to cover failure scenarios (i.e. verify an input displays the correct error message if the entered data is not correct)
    - [x] I turned off my network connection and tested it while offline to ensure it matches the expected behavior (i.e. verify the default avatar icon is displayed if app is offline)
    - [x] I tested this PR with a [High Traffic account](https://github.com/Expensify/App/blob/main/contributingGuides/CONTRIBUTING.md#high-traffic-accounts) against the staging or production API to ensure there are no regressions (e.g. long loading states that impact usability).
- [x] I included screenshots or videos for tests on [all platforms](https://github.com/Expensify/App/blob/main/contributingGuides/CONTRIBUTING.md#make-sure-you-can-test-on-all-platforms)
- [x] I ran the tests on **all platforms** & verified they passed on:
    - [x] Android: Native
    - [x] Android: mWeb Chrome
    - [x] iOS: Native
    - [x] iOS: mWeb Safari
    - [x] MacOS: Chrome / Safari
    - [x] MacOS: Desktop
- [x] I verified there are no console errors (if there's a console error not related to the PR, report it or open an issue for it to be fixed)
- [x] I followed proper code patterns (see [Reviewing the code](https://github.com/Expensify/App/blob/main/contributingGuides/PR_REVIEW_GUIDELINES.md#reviewing-the-code))
    - [x] I verified that any callback methods that were added or modified are named for what the method does and never what callback they handle (i.e. `toggleReport` and not `onIconClick`)
    - [x] I verified that comments were added to code that is not self explanatory
    - [x] I verified that any new or modified comments were clear, correct English, and explained "why" the code was doing something instead of only explaining "what" the code was doing.
    - [x] I verified any copy / text shown in the product is localized by adding it to `src/languages/*` files and using the [translation method](https://github.com/Expensify/App/blob/4bd99402cebdf4d7394e0d1f260879ea238197eb/src/components/withLocalize.js#L60)
      - [x] If any non-english text was added/modified, I verified the translation was requested/reviewed in #expensify-open-source and it was approved by an internal Expensify engineer. Link to Slack message:
    - [x] I verified all numbers, amounts, dates and phone numbers shown in the product are using the [localization methods](https://github.com/Expensify/App/blob/4bd99402cebdf4d7394e0d1f260879ea238197eb/src/components/withLocalize.js#L60-L68)
    - [x] I verified any copy / text that was added to the app is grammatically correct in English. It adheres to proper capitalization guidelines (note: only the first word of header/labels should be capitalized), and is approved by marketing by adding the `Waiting for Copy` label for a copy review on the original GH to get the correct copy.
    - [x] I verified proper file naming conventions were followed for any new files or renamed files. All non-platform specific files are named after what they export and are not named "index.js". All platform-specific files are named for the platform the code supports as outlined in the README.
    - [x] I verified the JSDocs style guidelines (in [`STYLE.md`](https://github.com/Expensify/App/blob/main/contributingGuides/STYLE.md#jsdocs)) were followed
- [x] If a new code pattern is added I verified it was agreed to be used by multiple Expensify engineers
- [x] I followed the guidelines as stated in the [Review Guidelines](https://github.com/Expensify/App/blob/main/contributingGuides/PR_REVIEW_GUIDELINES.md)
- [x] I tested other components that can be impacted by my changes (i.e. if the PR modifies a shared library or component like `Avatar`, I verified the components using `Avatar` are working as expected)
- [x] I verified all code is DRY (the PR doesn't include any logic written more than once, with the exception of tests)
- [x] I verified any variables that can be defined as constants (ie. in CONST.js or at the top of the file that uses the constant) are defined as such
- [x] I verified that if a function's arguments changed that all usages have also been updated correctly
- [x] If any new file was added I verified that:
    - [x] The file has a description of what it does and/or why is needed at the top of the file if the code is not self explanatory
- [x] If a new CSS style is added I verified that:
    - [x] A similar style doesn't already exist
    - [x] The style can't be created with an existing [StyleUtils](https://github.com/Expensify/App/blob/main/src/styles/StyleUtils.js) function (i.e. `StyleUtils.getBackgroundAndBorderStyle(themeColors.componentBG)`)
- [x] If the PR modifies code that runs when editing or sending messages, I tested and verified there is no unexpected behavior for all supported markdown - URLs, single line code, code blocks, quotes, headings, bold, strikethrough, and italic.
- [x] If the PR modifies a generic component, I tested and verified that those changes do not break usages of that component in the rest of the App (i.e. if a shared library or component like `Avatar` is modified, I verified that `Avatar` is working as expected in all cases)
- [x] If the PR modifies a component related to any of the existing Storybook stories, I tested and verified all stories for that component are still working as expected.
- [x] If the PR modifies a component or page that can be accessed by a direct deeplink, I verified that the code functions as expected when the deeplink is used - from a logged in and logged out account.
- [x] If the PR modifies the form input styles:
    - [x] I verified that all the inputs inside a form are aligned with each other.
    - [x] I added `Design` label so the design team can review the changes.
- [x] If a new page is added, I verified it's using the `ScrollView` component to make it scrollable when more elements are added to the page.
- [x] I added [unit tests](https://github.com/Expensify/App/blob/main/tests/README.md) for any new feature or bug fix in this PR to help automatically prevent regressions in this user flow.
- [x] If the `main` branch was merged into this PR after a review, I tested again and verified the outcome was still expected according to the `Test` steps.

### Screenshots/Videos
<details>
<summary>Android: Native</summary>

<!-- add screenshots or videos here -->
https://github.com/user-attachments/assets/5c7588b5-9f66-4904-a48e-5ea0db9b2ebb

</details>

<details>
<summary>Android: mWeb Chrome</summary>

<!-- add screenshots or videos here -->

https://github.com/user-attachments/assets/2471f7de-16aa-4cfe-a895-b92eb470b2c6


</details>

<details>
<summary>iOS: Native</summary>

<!-- add screenshots or videos here -->

https://github.com/user-attachments/assets/b8f3b216-7b3d-482c-9a6c-d25fe4119bca


</details>

<details>
<summary>iOS: mWeb Safari</summary>

<!-- add screenshots or videos here -->

https://github.com/user-attachments/assets/f5e02778-c9d0-4b13-b33a-44e7a5f1ea9e


</details>

<details>
<summary>MacOS: Chrome / Safari</summary>

<!-- add screenshots or videos here -->


https://github.com/user-attachments/assets/728440d8-71f4-4ac8-be80-785fc2dd431c



</details>

<details>
<summary>MacOS: Desktop</summary>

<!-- add screenshots or videos here -->

https://github.com/user-attachments/assets/8947b211-8be8-476c-9284-4660d11164cf


</details>






Diff:
diff --git a/__mocks__/reportData/policies.ts b/__mocks__/reportData/policies.ts
index 4a1206364d18..576b1bbc4ef8 100644
--- a/__mocks__/reportData/policies.ts
+++ b/__mocks__/reportData/policies.ts
@@ -93,7 +93,6 @@ const policy420A: Policy = {
     },
     areRulesEnabled: false,
     eReceipts: true,
-    shouldShowCustomReportTitleOption: false,
     shouldShowAutoApprovalOptions: false,
     shouldShowAutoReimbursementLimitOption: false,
     maxExpenseAmountNoReceipt: 100000,
diff --git a/assets/images/simple-illustration__report-receipt.svg b/assets/images/simple-illustrations/simple-illustration__report-receipt.svg
similarity index 100%
rename from assets/images/simple-illustration__report-receipt.svg
rename to assets/images/simple-illustrations/simple-illustration__report-receipt.svg
diff --git a/src/CONST.ts b/src/CONST.ts
index 9013873bf383..fc99e337a7dd 100755
--- a/src/CONST.ts
+++ b/src/CONST.ts
@@ -1095,7 +1095,7 @@ const CONST = {
         'https://help.expensify.com/articles/new-expensify/connect-credit-cards/company-cards/Commercial-feeds#how-to-set-up-an-american-express-corporate-feed',
     COMPANY_CARDS_STRIPE_HELP: 'https://dashboard.stripe.com/login?redirect=%2Fexpenses%2Fsettings',
     COMPANY_CARDS_CONNECT_CREDIT_CARDS_HELP_URL: 'https://help.expensify.com/new-expensify/hubs/connect-credit-cards/',
-    CUSTOM_REPORT_NAME_HELP_URL: 'https://help.expensify.com/articles/expensify-classic/spending-insights/Custom-Templates',
+    CUSTOM_REPORT_NAME_HELP_URL: 'https://help.expensify.com/articles/expensify-classic/spending-insights/Export-Expenses-And-Reports#formulas',
     CONFIGURE_REIMBURSEMENT_SETTINGS_HELP_URL: 'https://help.expensify.com/articles/expensify-classic/workspaces/Configure-Reimbursement-Settings',
     COPILOT_HELP_URL: 'https://help.expensify.com/articles/new-expensify/settings/Add-or-Act-As-a-Copilot',
     DELAYED_SUBMISSION_HELP_URL: 'https://help.expensify.com/articles/expensify-classic/reports/Automatically-submit-employee-reports',
@@ -6720,6 +6720,11 @@ const CONST = {
                 description: 'workspace.upgrade.reportFields.description' as const,
                 icon: 'Pencil',
             },
+            policyPreventMemberChangingTitle: {
+                id: 'policyPreventMemberChangingTitle' as const,
+                alias: 'policy-prevent-member-changing-title',
+                name: undefined,
+            },
             categories: {
                 id: 'categories' as const,
                 alias: 'categories',
diff --git a/src/components/Icon/Illustrations.ts b/src/components/Icon/Illustrations.ts
index c334bae896d0..d36d4b892de6 100644
--- a/src/components/Icon/Illustrations.ts
+++ b/src/components/Icon/Illustrations.ts
@@ -66,7 +66,6 @@ import ThreeLeggedLaptopWoman from '@assets/images/product-illustrations/three_l
 import ToddBehindCloud from '@assets/images/product-illustrations/todd-behind-cloud.svg';
 import ToddWithPhones from '@assets/images/product-illustrations/todd-with-phones.svg';
 import RunningTurtle from '@assets/images/running-turtle.svg';
-import ReportReceipt from '@assets/images/simple-illustration__report-receipt.svg';
 import BigVault from '@assets/images/simple-illustrations/emptystate__big-vault.svg';
 import Puzzle from '@assets/images/simple-illustrations/emptystate__puzzlepieces.svg';
 import Abacus from '@assets/images/simple-illustrations/simple-illustration__abacus.svg';
@@ -131,6 +130,7 @@ import ReceiptEnvelope from '@assets/images/simple-illustrations/simple-illustra
 import ReceiptLocationMarker from '@assets/images/simple-illustrations/simple-illustration__receipt-location-marker.svg';
 import ReceiptWrangler from '@assets/images/simple-illustrations/simple-illustration__receipt-wrangler.svg';
 import ReceiptUpload from '@assets/images/simple-illustrations/simple-illustration__receiptupload.svg';
+import ReportReceipt from '@assets/images/simple-illustrations/simple-illustration__report-receipt.svg';
 import Rules from '@assets/images/simple-illustrations/simple-illustration__rules.svg';
 import SanFrancisco from '@assets/images/simple-illustrations/simple-illustration__sanfrancisco.svg';
 import SendMoney from '@assets/images/simple-illustrations/simple-illustration__sendmoney.svg';
diff --git a/src/languages/en.ts b/src/languages/en.ts
index f304ea8d928c..c03153c0b541 100755
--- a/src/languages/en.ts
+++ b/src/languages/en.ts
@@ -2905,6 +2905,7 @@ const translations = {
             categories: 'Categories',
             tags: 'Tags',
             reportFields: 'Report fields',
+            reportTitle: 'Report title',
             reportField: 'Report field',
             taxes: 'Taxes',
             bills: 'Bills',
@@ -4922,9 +4923,8 @@ const translations = {
                 examples: 'Examples:',
                 title: 'Expense reports',
                 subtitle: 'Automate expense report compliance, approvals, and payment.',
-                customReportNamesTitle: 'Custom report names',
-                customReportNamesSubtitle: 'Create custom names using our extensive formulas.',
-                customNameTitle: 'Custom name',
+                customReportNamesSubtitle: 'Customize report titles using our ',
+                customNameTitle: 'Default report title',
                 customNameDescription: 'Choose a custom name for expense reports using our ',
                 customNameDescriptionLink: 'extensive formulas',
                 customNameInputLabel: 'Name',
diff --git a/src/languages/es.ts b/src/languages/es.ts
index 94f5dd56677a..d8ade19914b3 100644
--- a/src/languages/es.ts
+++ b/src/languages/es.ts
@@ -2931,6 +2931,7 @@ const translations = {
             categories: 'Categorías',
             tags: 'Etiquetas',
             reportFields: 'Campos de informe',
+            reportTitle: 'El título del informe.',
             taxes: 'Impuestos',
             bills: 'Pagar facturas',
             invoices: 'Facturas',
@@ -4994,9 +4995,8 @@ const translations = {
                 examples: 'Ejemplos:',
                 title: 'Informes de gastos',
                 subtitle: 'Automatiza el cumplimiento, la aprobación y el pago de los informes de gastos.',
-                customReportNamesTitle: 'Nombres personalizados de informes',
-                customReportNamesSubtitle: 'Crea nombres personalizados usando nuestras fórmulas variadas.',
-                customNameTitle: 'Nombre personalizado',
+                customReportNamesSubtitle: 'Personaliza los títulos de los informes usando nuestras amplias fórmulas.',
+                customNameTitle: 'Título de informe predeterminado',
                 customNameDescription: 'Elige un nombre personalizado para los informes de gastos usando nuestras ',
                 customNameDescriptionLink: 'fórmulas variadas',
                 customNameInputLabel: 'Nombre',
diff --git a/src/libs/API/parameters/EnablePolicyDefaultReportTitle.ts b/src/libs/API/parameters/EnablePolicyDefaultReportTitle.ts
deleted file mode 100644
index 2852640ac70a..000000000000
--- a/src/libs/API/parameters/EnablePolicyDefaultReportTitle.ts
+++ /dev/null
@@ -1,6 +0,0 @@
-type EnablePolicyDefaultReportTitleParams = {
-    policyID: string;
-    enable: boolean;
-};
-
-export default EnablePolicyDefaultReportTitleParams;
diff --git a/src/libs/API/parameters/index.ts b/src/libs/API/parameters/index.ts
index 0c0e57557350..5db0f0d46287 100644
--- a/src/libs/API/parameters/index.ts
+++ b/src/libs/API/parameters/index.ts
@@ -299,7 +299,6 @@ export type {default as SetPolicyPreventMemberCreatedTitleParams} from './SetPol
 export type {default as SetPolicyAutoReimbursementLimitParams} from './SetPolicyAutoReimbursementLimit';
 export type {default as EnablePolicyAutoReimbursementLimitParams} from './EnablePolicyAutoReimbursementLimit';
 export type {default as EnablePolicyAutoApprovalOptionsParams} from './EnablePolicyAutoApprovalOptions';
-export type {default as EnablePolicyDefaultReportTitleParams} from './EnablePolicyDefaultReportTitle';
 export type {default as SetPolicyExpenseMaxAmountNoReceipt} from './SetPolicyExpenseMaxAmountNoReceipt';
 export type {default as SetPolicyExpenseMaxAmount} from './SetPolicyExpenseMaxAmount';
 export type {default as SetPolicyExpenseMaxAge} from './SetPolicyExpenseMaxAge';
diff --git a/src/libs/API/types.ts b/src/libs/API/types.ts
index 4616e906bfe0..b4034bde5a13 100644
--- a/src/libs/API/types.ts
+++ b/src/libs/API/types.ts
@@ -24,7 +24,6 @@ const WRITE_COMMANDS = {
     SET_POLICY_AUTO_REIMBURSEMENT_LIMIT: 'SetPolicyAutoReimbursementLimit',
     ENABLE_POLICY_AUTO_REIMBURSEMENT_LIMIT: 'EnablePolicyAutoReimbursementLimit',
     ENABLE_POLICY_AUTO_APPROVAL_OPTIONS: 'EnablePolicyAutoApprovalOptions',
-    ENABLE_POLICY_DEFAULT_REPORT_TITLE: 'EnablePolicyDefaultReportTitle',
     SET_WORKSPACE_DEFAULT_SPEND_CATEGORY: 'SetPolicyDefaultSpendCategory',
     DISMISS_REFERRAL_BANNER: 'DismissReferralBanner',
     UPDATE_PREFERRED_LOCALE: 'UpdatePreferredLocale',
@@ -693,7 +692,6 @@ type WriteCommandParameters = {
     [WRITE_COMMANDS.SET_POLICY_AUTO_REIMBURSEMENT_LIMIT]: Parameters.SetPolicyAutoReimbursementLimitParams;
     [WRITE_COMMANDS.ENABLE_POLICY_AUTO_REIMBURSEMENT_LIMIT]: Parameters.EnablePolicyAutoReimbursementLimitParams;
     [WRITE_COMMANDS.ENABLE_POLICY_AUTO_APPROVAL_OPTIONS]: Parameters.EnablePolicyAutoApprovalOptionsParams;
-    [WRITE_COMMANDS.ENABLE_POLICY_DEFAULT_REPORT_TITLE]: Parameters.EnablePolicyDefaultReportTitleParams;
     [WRITE_COMMANDS.SET_WORKSPACE_DEFAULT_SPEND_CATEGORY]: Parameters.SetWorkspaceDefaultSpendCategoryParams;
     [WRITE_COMMANDS.SWITCH_TO_OLD_DOT]: Parameters.SwitchToOldDotParams;
     [WRITE_COMMANDS.TRACK_EXPENSE]: Parameters.TrackExpenseParams;
diff --git a/src/libs/actions/Policy/Policy.ts b/src/libs/actions/Policy/Policy.ts
index 1aa05b0d4c2e..0995893891b7 100644
--- a/src/libs/actions/Policy/Policy.ts
+++ b/src/libs/actions/Policy/Policy.ts
@@ -19,7 +19,6 @@ import type {
     EnablePolicyAutoReimbursementLimitParams,
     EnablePolicyCompanyCardsParams,
     EnablePolicyConnectionsParams,
-    EnablePolicyDefaultReportTitleParams,
     EnablePolicyExpensifyCardsParams,
     EnablePolicyInvoicingParams,
     EnablePolicyReportFieldsParams,
@@ -3044,7 +3043,7 @@ function enableCompanyCards(policyID: string, enabled: boolean, shouldGoBack = t
     }
 }
 
-function enablePolicyReportFields(policyID: string, enabled: boolean, shouldGoBack = true) {
+function enablePolicyReportFields(policyID: string, enabled: boolean) {
     const onyxData: OnyxData = {
         optimisticData: [
             {
@@ -3088,10 +3087,6 @@ function enablePolicyReportFields(policyID: string, enabled: boolean, shouldGoBa
     API.write(WRITE_COMMANDS.ENABLE_POLICY_REPORT_FIELDS, parameters, onyxData, {
         checkAndFixConflictingRequest: (persistedRequests) => resolveEnableFeatureConflicts(WRITE_COMMANDS.ENABLE_POLICY_REPORT_FIELDS, persistedRequests, parameters),
     });
-
-    if (enabled && getIsNarrowLayout() && shouldGoBack) {
-        goBackWhenEnableFeature(policyID);
-    }
 }
 
 function enablePolicyTaxes(policyID: string, enabled: boolean) {
@@ -4273,79 +4268,6 @@ function getAdminPoliciesConnectedToNetSuite(): Policy[] {
     return Object.values(allPolicies ?? {}).filter<Policy>((policy): policy is Policy => !!policy && policy.role === CONST.POLICY.ROLE.ADMIN && !!policy?.connections?.netsuite);
 }
 
-/**
- * Call the API to enable custom report title for the reports in the given policy
- * @param policyID - id of the policy to apply the limit to
- * @param enabled - whether custom report title for the reports is enabled in the given policy
- */
-function enablePolicyDefaultReportTitle(policyID: string, enabled: boolean) {
-    const policy = getPolicy(policyID);
-
-    if (enabled === policy?.shouldShowCustomReportTitleOption) {
-        return;
-    }
-
-    const previousReportTitleField = policy?.fieldList?.[CONST.POLICY.FIELDS.FIELD_LIST_TITLE] ?? {};
-    const titleFieldValues = enabled ? {} : {fieldList: {[CONST.POLICY.FIELDS.FIELD_LIST_TITLE]: {...previousReportTitleField, defaultValue: CONST.POLICY.DEFAULT_REPORT_NAME_PATTERN}}};
-
-    const optimisticData: OnyxUpdate[] = [
-        {
-            onyxMethod: Onyx.METHOD.MERGE,
-            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
-            value: {
-                shouldShowCustomReportTitleOption: enabled,
-                ...titleFieldValues,
-                pendingFields: {
-                    shouldShowCustomReportTitleOption: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
-                },
-            },
-        },
-    ];
-
-    const successData: OnyxUpdate[] = [
-        {
-            onyxMethod: Onyx.METHOD.MERGE,
-            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
-            value: {
-                pendingFields: {
-                    shouldShowCustomReportTitleOption: null,
-                },
-                errorFields: null,
-            },
-        },
-    ];
-
-    const failureData: OnyxUpdate[] = [
-        {
-            onyxMethod: Onyx.METHOD.MERGE,
-            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
-            value: {
-                shouldShowCustomReportTitleOption: !!policy?.shouldShowCustomReportTitleOption,
-                fieldList: {
-                    [CONST.POLICY.FIELDS.FIELD_LIST_TITLE]: previousReportTitleField,
-                },
-                pendingFields: {
-                    shouldShowCustomReportTitleOption: null,
-                },
-                errorFields: {
-                    shouldShowCustomReportTitleOption: ErrorUtils.getMicroSecondOnyxErrorWithTranslationKey('common.genericErrorMessage'),
-                },
-            },
-        },
-    ];
-
-    const parameters: EnablePolicyDefaultReportTitleParams = {
-        enable: enabled,
-        policyID,
-    };
-
-    API.write(WRITE_COMMANDS.ENABLE_POLICY_DEFAULT_REPORT_TITLE, parameters, {
-        optimisticData,
-        successData,
-        failureData,
-    });
-}
-
 /**
  * Call the API to set default report title pattern for the given policy
  * @param policyID - id of the policy to apply the naming pattern to
@@ -5260,7 +5182,6 @@ export {
     setPolicyAutomaticApprovalLimit,
     setPolicyAutomaticApprovalRate,
     setPolicyAutoReimbursementLimit,
-    enablePolicyDefaultReportTitle,
     enablePolicyAutoReimbursementLimit,
     enableAutoApprovalOptions,
     setPolicyMaxExpenseAmountNoReceipt,
diff --git a/src/pages/workspace/WorkspaceInitialPage.tsx b/src/pages/workspace/WorkspaceInitialPage.tsx
index f47746750ac4..3133e3b681ba 100644
--- a/src/pages/workspace/WorkspaceInitialPage.tsx
+++ b/src/pages/workspace/WorkspaceInitialPage.tsx
@@ -12,13 +12,13 @@ import {
     Car,
     Coins,
     CreditCard,
+    Document,
     ExpensifyAppIcon,
     ExpensifyCard,
     Feed,
     Folder,
     Gear,
     InvoiceGeneric,
-    Pencil,
     Sync,
     Tag,
     Users,
@@ -177,6 +177,13 @@ function WorkspaceInitialPage({policyDraft, policy: policyProp, route}: Workspac
     const workspaceMenuItems: WorkspaceMenuItem[] = useMemo(() => {
         const protectedMenuItems: WorkspaceMenuItem[] = [];
 
+        protectedMenuItems.push({
+            translationKey: 'common.reports',
+            icon: Document,
+            action: singleExecution(waitForNavigate(() => Navigation.navigate(ROUTES.WORKSPACE_REPORT_FIELDS.getRoute(policyID)))),
+            screenName: SCREENS.WORKSPACE.REPORT_FIELDS,
+        });
+
         if (featureStates?.[CONST.POLICY.MORE_FEATURES.ARE_DISTANCE_RATES_ENABLED]) {
             protectedMenuItems.push({
                 translationKey: 'workspace.common.distanceRates',
@@ -263,16 +270,6 @@ function WorkspaceInitialPage({policyDraft, policy: policyProp, route}: Workspac
             });
         }
 
-        if (featureStates?.[CONST.POLICY.MORE_FEATURES.ARE_REPORT_FIELDS_ENABLED]) {
-            protectedMenuItems.push({
-                translationKey: 'workspace.common.reportFields',
-                icon: Pencil,
-                action: singleExecution(waitForNavigate(() => Navigation.navigate(ROUTES.WORKSPACE_REPORT_FIELDS.getRoute(policyID)))),
-                screenName: SCREENS.WORKSPACE.REPORT_FIELDS,
-                highlighted: highlightedFeature === CONST.POLICY.MORE_FEATURES.ARE_REPORT_FIELDS_ENABLED,
-            });
-        }
-
         if (featureStates?.[CONST.POLICY.MORE_FEATURES.ARE_WORKFLOWS_ENABLED]) {
             protectedMenuItems.push({
                 translationKey: 'workspace.common.workflows',
diff --git a/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx b/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
index 39f4ea535bab..503857f4658c 100644
--- a/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
+++ b/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
@@ -30,7 +30,6 @@ import {
     enableExpensifyCard,
     enablePolicyConnections,
     enablePolicyInvoicing,
-    enablePolicyReportFields,
     enablePolicyRules,
     enablePolicyTaxes,
     enablePolicyWorkflows,
@@ -92,7 +91,6 @@ function WorkspaceMoreFeaturesPage({policy, route}: WorkspaceMoreFeaturesPagePro
     const [cardFeeds] = useCardFeeds(policyID);
     const [isOrganizeWarningModalOpen, setIsOrganizeWarningModalOpen] = useState(false);
     const [isIntegrateWarningModalOpen, setIsIntegrateWarningModalOpen] = useState(false);
-    const [isReportFieldsWarningModalOpen, setIsReportFieldsWarningModalOpen] = useState(false);
     const [isDisableExpensifyCardWarningModalOpen, setIsDisableExpensifyCardWarningModalOpen] = useState(false);
     const [isDisableCompanyCardsWarningModalOpen, setIsDisableCompanyCardsWarningModalOpen] = useState(false);
     const [isDisableWorkflowWarningModalOpen, setIsDisableWorkflowWarningModalOpen] = useState(false);
@@ -284,32 +282,6 @@ function WorkspaceMoreFeaturesPage({policy, route}: WorkspaceMoreFeaturesPagePro
                 enablePolicyTaxes(policyID, isEnabled);
             },
         },
-        {
-            icon: Illustrations.Pencil,
-            titleTranslationKey: 'workspace.moreFeatures.reportFields.title',
-            subtitleTranslationKey: 'workspace.moreFeatures.reportFields.subtitle',
-            isActive: policy?.areReportFieldsEnabled ?? false,
-            disabled: hasAccountingConnection,
-            pendingAction: policy?.pendingFields?.areReportFieldsEnabled,
-            disabledAction: onDisabledOrganizeSwitchPress,
-            action: (isEnabled: boolean) => {
-                if (!policyID) {
-                    return;
-                }
-                if (isEnabled) {
-                    if (!isControlPolicy(policy)) {
-                        Navigation.navigate(
-                            ROUTES.WORKSPACE_UPGRADE.getRoute(policyID, CONST.UPGRADE_FEATURE_INTRO_MAPPING.reportFields.alias, ROUTES.WORKSPACE_MORE_FEATURES.getRoute(policyID)),
-                        );
-                        return;
-                    }
-
-                    enablePolicyReportFields(policyID, true, true);
-                    return;
-                }
-                setIsReportFieldsWarningModalOpen(true);
-            },
-        },
     ];
 
     const integrateItems: Item[] = [
@@ -508,22 +480,6 @@ function WorkspaceMoreFeaturesPage({policy, route}: WorkspaceMoreFeaturesPagePro
                     confirmText={translate('workspace.moreFeatures.connectionsWarningModal.manageSettings')}
                     cancelText={translate('common.cancel')}
                 />
-                <ConfirmModal
-                    title={translate('workspace.reportFields.disableReportFields')}
-                    isVisible={isReportFieldsWarningModalOpen}
-                    onConfirm={() => {
-                        if (!policyID) {
-                            return;
-                        }
-                        setIsReportFieldsWarningModalOpen(false);
-                        enablePolicyReportFields(policyID, false, true);
-                    }}
-                    onCancel={() => setIsReportFieldsWarningModalOpen(false)}
-                    prompt={translate('workspace.reportFields.disableReportFieldsConfirmation')}
-                    confirmText={translate('common.disable')}
-                    cancelText={translate('common.cancel')}
-                    danger
-                />
                 <ConfirmModal
                     title={translate('workspace.moreFeatures.expensifyCard.disableCardTitle')}
                     isVisible={isDisableExpensifyCardWarningModalOpen}
diff --git a/src/pages/workspace/reportFields/WorkspaceReportFieldsPage.tsx b/src/pages/workspace/reportFields/WorkspaceReportFieldsPage.tsx
index 0326b776d7f0..868fcde4dac1 100644
--- a/src/pages/workspace/reportFields/WorkspaceReportFieldsPage.tsx
+++ b/src/pages/workspace/reportFields/WorkspaceReportFieldsPage.tsx
@@ -1,64 +1,51 @@
 import {useFocusEffect} from '@react-navigation/native';
 import {Str} from 'expensify-common';
 import React, {useCallback, useMemo, useState} from 'react';
-import {ActivityIndicator, View} from 'react-native';
+import type {ListRenderItemInfo} from 'react-native';
+import {ActivityIndicator} from 'react-native';
 import {useOnyx} from 'react-native-onyx';
-import Button from '@components/Button';
-import ButtonWithDropdownMenu from '@components/ButtonWithDropdownMenu';
-import type {DropdownOption} from '@components/ButtonWithDropdownMenu/types';
 import ConfirmModal from '@components/ConfirmModal';
-import EmptyStateComponent from '@components/EmptyStateComponent';
+import FlatList from '@components/FlatList';
 import HeaderWithBackButton from '@components/HeaderWithBackButton';
-import {Plus, Trashcan} from '@components/Icon/Expensicons';
-import {Pencil} from '@components/Icon/Illustrations';
-import LottieAnimations from '@components/LottieAnimations';
+import {Plus} from '@components/Icon/Expensicons';
+import {ReportReceipt} from '@components/Icon/Illustrations';
+import MenuItem from '@components/MenuItem';
+import MenuItemWithTopDescription from '@components/MenuItemWithTopDescription';
+import OfflineWithFeedback from '@components/OfflineWithFeedback';
 import ScreenWrapper from '@components/ScreenWrapper';
 import ScrollView from '@components/ScrollView';
-import SearchBar from '@components/SearchBar';
-import ListItemRightCaretWithLabel from '@components/SelectionList/ListItemRightCaretWithLabel';
-import TableListItem from '@components/SelectionList/TableListItem';
+import Section from '@components/Section';
 import type {ListItem} from '@components/SelectionList/types';
-import SelectionListWithModal from '@components/SelectionListWithModal';
-import CustomListHeader from '@components/SelectionListWithModal/CustomListHeader';
-import TableListItemSkeleton from '@components/Skeletons/TableRowSkeleton';
 import Text from '@components/Text';
 import TextLink from '@components/TextLink';
-import useAutoTurnSelectionModeOffWhenHasNoActiveOption from '@hooks/useAutoTurnSelectionModeOffWhenHasNoActiveOption';
 import useEnvironment from '@hooks/useEnvironment';
-import useFilteredSelection from '@hooks/useFilteredSelection';
 import useLocalize from '@hooks/useLocalize';
-import useMobileSelectionMode from '@hooks/useMobileSelectionMode';
 import useNetwork from '@hooks/useNetwork';
 import usePolicy from '@hooks/usePolicy';
 import useResponsiveLayout from '@hooks/useResponsiveLayout';
-import useSearchResults from '@hooks/useSearchResults';
 import useTheme from '@hooks/useTheme';
 import useThemeStyles from '@hooks/useThemeStyles';
 import {isConnectionInProgress, isConnectionUnverified} from '@libs/actions/connections';
-import {turnOffMobileSelectionMode} from '@libs/actions/MobileSelectionMode';
-import {canUseTouchScreen} from '@libs/DeviceCapabilities';
+import {enablePolicyReportFields, setPolicyPreventMemberCreatedTitle} from '@libs/actions/Policy/Policy';
 import localeCompare from '@libs/LocaleCompare';
-import goBackFromWorkspaceCentralScreen from '@libs/Navigation/helpers/goBackFromWorkspaceCentralScreen';
 import Navigation from '@libs/Navigation/Navigation';
 import type {PlatformStackScreenProps} from '@libs/Navigation/PlatformStackNavigation/types';
 import type {WorkspaceSplitNavigatorParamList} from '@libs/Navigation/types';
-import {getConnectedIntegration, getCurrentConnectionName, hasAccountingConnections, shouldShowSyncError} from '@libs/PolicyUtils';
-import {getReportFieldKey} from '@libs/ReportUtils';
+import {getConnectedIntegration, getCurrentConnectionName, hasAccountingConnections, isControlPolicy, shouldShowSyncError} from '@libs/PolicyUtils';
 import {getReportFieldTypeTranslationKey} from '@libs/WorkspaceReportFieldUtils';
 import AccessOrNotFoundWrapper from '@pages/workspace/AccessOrNotFoundWrapper';
-import {deleteReportFields, openPolicyReportFieldsPage} from '@userActions/Policy/ReportField';
+import ToggleSettingOptionRow from '@pages/workspace/workflows/ToggleSettingsOptionRow';
+import {openPolicyReportFieldsPage} from '@userActions/Policy/ReportField';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
 import ROUTES from '@src/ROUTES';
 import type SCREENS from '@src/SCREENS';
-import type {PolicyReportField} from '@src/types/onyx';
-import type {OnyxValueWithOfflineFeedback} from '@src/types/onyx/OnyxCommon';
-import type DeepValueOf from '@src/types/utils/DeepValueOf';
+import {isEmptyObject} from '@src/types/utils/EmptyObject';
 
 type ReportFieldForList = ListItem & {
-    value: string;
     fieldID: string;
-    orderWeight?: number;
+    rightLabel: string;
+    isDisabled: boolean;
 };
 
 type WorkspaceReportFieldsPageProps = PlatformStackScreenProps<WorkspaceSplitNavigatorParamList, typeof SCREENS.WORKSPACE.REPORT_FIELDS>;
@@ -70,43 +57,36 @@ function WorkspaceReportFieldsPage({
 }: WorkspaceReportFieldsPageProps) {
     // We need to use isSmallScreenWidth instead of shouldUseNarrowLayout for the small screen selection mode
     // eslint-disable-next-line rulesdir/prefer-shouldUseNarrowLayout-instead-of-isSmallScreenWidth
-    const {shouldUseNarrowLayout, isSmallScreenWidth} = useResponsiveLayout();
+    const {shouldUseNarrowLayout} = useResponsiveLayout();
     const styles = useThemeStyles();
     const theme = useTheme();
     const {translate} = useLocalize();
-    const {environmentURL} = useEnvironment();
+    const [isReportFieldsWarningModalOpen, setIsReportFieldsWarningModalOpen] = useState(false);
     const policy = usePolicy(policyID);
-    const {selectionMode} = useMobileSelectionMode();
-    const [deleteReportFieldsConfirmModalVisible, setDeleteReportFieldsConfirmModalVisible] = useState(false);
-    const hasReportAccountingConnections = hasAccountingConnections(policy);
     const [connectionSyncProgress] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY_CONNECTION_SYNC_PROGRESS}${policy?.id}`, {canBeMissing: true});
+    const {environmentURL} = useEnvironment();
     const isSyncInProgress = isConnectionInProgress(connectionSyncProgress, policy);
     const hasSyncError = shouldShowSyncError(policy, isSyncInProgress);
     const connectedIntegration = getConnectedIntegration(policy) ?? connectionSyncProgress?.connectionName;
     const isConnectionVerified = connectedIntegration && !isConnectionUnverified(policy, connectedIntegration);
     const currentConnectionName = getCurrentConnectionName(policy);
-
-    const canSelectMultiple = !hasReportAccountingConnections && (isSmallScreenWidth ? selectionMode?.isEnabled : true);
-
-    const selectionFieldList = useMemo(() => {
+    const hasReportAccountingConnections = hasAccountingConnections(policy);
+    const filteredPolicyFieldList = useMemo(() => {
         if (!policy?.fieldList) {
             return {};
         }
-        return Object.values(policy.fieldList).reduce<Record<string, OnyxValueWithOfflineFeedback<PolicyReportField>>>((acc, reportField) => {
-            if (reportField.fieldID === CONST.POLICY.FIELDS.FIELD_LIST_TITLE) {
-                return acc;
-            }
-            const reportFieldKey = getReportFieldKey(reportField.fieldID);
-            acc[reportFieldKey] = reportField;
-            return acc;
-        }, {});
+        // eslint-disable-next-line @typescript-eslint/no-unused-vars
+        return Object.fromEntries(Object.entries(policy.fieldList).filter(([_, value]) => value.fieldID !== 'text_title'));
     }, [policy]);
+    const hasAccountingConnection = !isEmptyObject(policy?.connections);
+    const [isOrganizeWarningModalOpen, setIsOrganizeWarningModalOpen] = useState(false);
 
-    const filterReportFields = useCallback((reportField: OnyxValueWithOfflineFeedback<PolicyReportField> | undefined) => {
-        return !!reportField && reportField.pendingAction !== CONST.RED_BRICK_ROAD_PENDING_ACTION.DELETE;
-    }, []);
-
-    const [selectedReportFields, setSelectedReportFields] = useFilteredSelection(selectionFieldList, filterReportFields);
+    const onDisabledOrganizeSwitchPress = useCallback(() => {
+        if (!hasAccountingConnection) {
+            return;
+        }
+        setIsOrganizeWarningModalOpen(true);
+    }, [hasAccountingConnection]);
 
     const fetchReportFields = useCallback(() => {
         openPolicyReportFieldsPage(policyID);
@@ -114,137 +94,74 @@ function WorkspaceReportFieldsPage({
 
     const {isOffline} = useNetwork({onReconnect: fetchReportFields});
 
-    const hasVisibleReportField = Object.values(selectionFieldList).some((reportField) => reportField.pendingAction !== CONST.RED_BRICK_ROAD_PENDING_ACTION.DELETE || isOffline);
-
     useFocusEffect(fetchReportFields);
 
     const reportFieldsSections = useMemo(() => {
         if (!policy) {
             return [];
         }
-        return Object.values(selectionFieldList).map((reportField) => ({
-            value: reportField.name,
-            fieldID: reportField.fieldID,
-            keyForList: String(reportField.fieldID),
-            orderWeight: reportField.orderWeight,
-            pendingAction: reportField.pendingAction,
-            isSelected: selectedReportFields.includes(getReportFieldKey(reportField.fieldID)) && canSelectMultiple,
-            isDisabled: reportField.pendingAction === CONST.RED_BRICK_ROAD_PENDING_ACTION.DELETE,
-            text: reportField.name,
-            rightElement: <ListItemRightCaretWithLabel labelText={Str.recapitalize(translate(getReportFieldTypeTranslationKey(reportField.type)))} />,
-        }));
-    }, [canSelectMultiple, selectionFieldList, policy, selectedReportFields, translate]);
+        return Object.values(filteredPolicyFieldList)
+            .sort((a, b) => localeCompare(a.name, b.name))
+            .map((reportField) => ({
+                text: reportField.name,
+                keyForList: String(reportField.fieldID),
+                fieldID: reportField.fieldID,
+                pendingAction: reportField.pendingAction,
+                isDisabled: reportField.pendingAction === CONST.RED_BRICK_ROAD_PENDING_ACTION.DELETE,
+                rightLabel: Str.recapitalize(translate(getReportFieldTypeTranslationKey(reportField.type))),
+            }));
+    }, [filteredPolicyFieldList, policy, translate]);
 
-    const filterReportField = useCallback((reportField: ReportFieldForList, searchInput: string) => !!reportField.text?.toLowerCase().includes(searchInput), []);
-    const sortReportFields = useCallback((reportFields: ReportFieldForList[]) => reportFields.sort((a, b) => localeCompare(a.value, b.value)), []);
-    const [inputValue, setInputValue, filteredReportFields] = useSearchResults(reportFieldsSections, filterReportField, sortReportFields);
-
-    useAutoTurnSelectionModeOffWhenHasNoActiveOption(filteredReportFields);
-
-    const updateSelectedReportFields = (item: ReportFieldForList) => {
-        const fieldKey = getReportFieldKey(item.fieldID);
-        setSelectedReportFields((prevSelectedReportFields) => {
-            if (prevSelectedReportFields.includes(fieldKey)) {
-                return prevSelectedReportFields.filter((selectedField) => selectedField !== fieldKey);
-            }
-            return [...prevSelectedReportFields, fieldKey];
-        });
-    };
+    const navigateToReportFieldsSettings = useCallback(
+        (reportField: ReportFieldForList) => {
+            Navigation.navigate(ROUTES.WORKSPACE_REPORT_FIELDS_SETTINGS.getRoute(policyID, reportField.fieldID));
+        },
+        [policyID],
+    );
 
-    const toggleAllReportFields = () => {
-        const availableReportFields = Object.values(reportFieldsSections).filter(
-            (reportField) => reportField.pendingAction !== CONST.RED_BRICK_ROAD_PENDING_ACTION.DELETE && filteredReportFields.find((item) => item.fieldID === reportField.fieldID),
+    const getHeaderText = () =>
+        !hasSyncError && isConnectionVerified ? (
+            <Text style={[styles.mr5, styles.mt1]}>
+                <Text style={[styles.textNormal, styles.colorMuted]}>{`${translate('workspace.reportFields.importedFromAccountingSoftware')} `}</Text>
+                <TextLink
+                    style={[styles.textNormal, styles.link]}
+                    href={`${environmentURL}/${ROUTES.POLICY_ACCOUNTING.getRoute(policyID)}`}
+                >
+                    {`${currentConnectionName} ${translate('workspace.accounting.settings')}`}
+                </TextLink>
+                <Text style={[styles.textNormal, styles.colorMuted]}>.</Text>
+            </Text>
+        ) : (
+            <Text style={[styles.textNormal, styles.colorMuted, styles.mr5, styles.mt1]}>{translate('workspace.reportFields.subtitle')}</Text>
         );
-        setSelectedReportFields(selectedReportFields.length > 0 ? [] : Object.values(availableReportFields).map((reportField) => getReportFieldKey(reportField.fieldID)));
-    };
-
-    const navigateToReportFieldsSettings = (reportField: ReportFieldForList) => {
-        Navigation.navigate(ROUTES.WORKSPACE_REPORT_FIELDS_SETTINGS.getRoute(policyID, reportField.fieldID));
-    };
-
-    const handleDeleteReportFields = () => {
-        setSelectedReportFields([]);
-        deleteReportFields(policyID, selectedReportFields);
-        setDeleteReportFieldsConfirmModalVisible(false);
-    };
 
     const isLoading = !isOffline && policy === undefined;
-    const shouldShowEmptyState =
-        !Object.values(selectionFieldList).some((reportField) => reportField.pendingAction !== CONST.RED_BRICK_ROAD_PENDING_ACTION.DELETE || isOffline) && !isLoading;
 
-    const getHeaderButtons = () => {
-        const options: Array<DropdownOption<DeepValueOf<typeof CONST.POLICY.BULK_ACTION_TYPES>>> = [];
-
-        if (shouldUseNarrowLayout ? canSelectMultiple : selectedReportFields.length > 0) {
-            options.push({
-                icon: Trashcan,
-                text: translate(selectedReportFields.length === 1 ? 'workspace.reportFields.delete' : 'workspace.reportFields.deleteFields'),
-                value: CONST.POLICY.BULK_ACTION_TYPES.DELETE,
-                onSelected: () => setDeleteReportFieldsConfirmModalVisible(true),
-            });
-
-            return (
-                <ButtonWithDropdownMenu
-                    onPress={() => null}
-                    shouldAlwaysShowDropdownMenu
-                    pressOnEnter
-                    buttonSize={CONST.DROPDOWN_BUTTON_SIZE.MEDIUM}
-                    customText={translate('workspace.common.selected', {count: selectedReportFields.length})}
-                    options={options}
-                    isSplitButton={false}
-                    style={[shouldUseNarrowLayout && styles.flexGrow1, shouldUseNarrowLayout && styles.mb3]}
-                    isDisabled={!selectedReportFields.length}
-                />
-            );
-        }
-        return (
-            <View style={[styles.w100, styles.flexRow, styles.gap2, shouldUseNarrowLayout && styles.mb3]}>
-                <Button
-                    success
-                    onPress={() => Navigation.navigate(ROUTES.WORKSPACE_CREATE_REPORT_FIELD.getRoute(policyID))}
-                    icon={Plus}
-                    text={translate('workspace.reportFields.addField')}
-                    style={[shouldUseNarrowLayout && styles.flex1]}
+    const renderItem = useCallback(
+        ({item}: ListRenderItemInfo<ReportFieldForList>) => (
+            <OfflineWithFeedback pendingAction={item.pendingAction}>
+                <MenuItem
+                    style={shouldUseNarrowLayout ? styles.ph5 : styles.ph8}
+                    onPress={() => navigateToReportFieldsSettings(item)}
+                    description={item.text}
+                    disabled={item.isDisabled}
+                    shouldShowRightIcon={!item.isDisabled}
+                    interactive={!item.isDisabled}
+                    rightLabel={item.rightLabel}
+                    descriptionTextStyle={[styles.popoverMenuText, styles.textStrong]}
                 />
-            </View>
-        );
-    };
-
-    const getCustomListHeader = () => {
-        return (
-            <CustomListHeader
-                canSelectMultiple={canSelectMultiple}
-                leftHeaderText={translate('common.name')}
-                rightHeaderText={translate('common.type')}
-            />
-        );
-    };
+            </OfflineWithFeedback>
+        ),
 
-    const getHeaderText = () => (
-        <View style={[styles.ph5, styles.pb5, styles.pt3, shouldUseNarrowLayout ? styles.workspaceSectionMobile : styles.workspaceSection]}>
-            {!hasSyncError && isConnectionVerified ? (
-                <Text>
-                    <Text style={[styles.textNormal, styles.colorMuted]}>{`${translate('workspace.reportFields.importedFromAccountingSoftware')} `}</Text>
-                    <TextLink
-                        style={[styles.textNormal, styles.link]}
-                        href={`${environmentURL}/${ROUTES.POLICY_ACCOUNTING.getRoute(policyID)}`}
-                    >
-                        {`${currentConnectionName} ${translate('workspace.accounting.settings')}`}
-                    </TextLink>
-                    <Text style={[styles.textNormal, styles.colorMuted]}>.</Text>
-                </Text>
-            ) : (
-                <Text style={[styles.textNormal, styles.colorMuted]}>{translate('workspace.reportFields.subtitle')}</Text>
-            )}
-        </View>
+        [shouldUseNarrowLayout, styles.ph5, styles.ph8, styles.popoverMenuText, styles.textStrong, navigateToReportFieldsSettings],
     );
-    const selectionModeHeader = selectionMode?.isEnabled && shouldUseNarrowLayout;
+
+    const reportTitlePendingFields = policy?.fieldList?.[CONST.POLICY.FIELDS.FIELD_LIST_TITLE]?.pendingFields ?? {};
 
     return (
         <AccessOrNotFoundWrapper
             policyID={policyID}
             accessVariants={[CONST.POLICY.ACCESS_VARIANTS.ADMIN, CONST.POLICY.ACCESS_VARIANTS.PAID]}
-            featureName={CONST.POLICY.MORE_FEATURES.ARE_REPORT_FIELDS_ENABLED}
         >
             <ScreenWrapper
                 enableEdgeToEdgeBottomSafeAreaPadding
@@ -254,42 +171,11 @@ function WorkspaceReportFieldsPage({
                 offlineIndicatorStyle={styles.mtAuto}
             >
                 <HeaderWithBackButton
-                    icon={!selectionModeHeader ? Pencil : undefined}
-                    shouldUseHeadlineHeader={!selectionModeHeader}
-                    title={translate(selectionModeHeader ? 'common.selectMultiple' : 'workspace.common.reportFields')}
+                    icon={ReportReceipt}
+                    title={translate('common.reports')}
+                    shouldUseHeadlineHeader
                     shouldShowBackButton={shouldUseNarrowLayout}
-                    onBackButtonPress={() => {
-                        if (selectionModeHeader) {
-                            setSelectedReportFields([]);
-                            turnOffMobileSelectionMode();
-                            return;
-                        }
-                        goBackFromWorkspaceCentralScreen(policyID);
-                    }}
-                >
-                    {!shouldUseNarrowLayout && !hasReportAccountingConnections && getHeaderButtons()}
-                </HeaderWithBackButton>
-                {shouldUseNarrowLayout && <View style={[styles.pl5, styles.pr5]}>{!hasReportAccountingConnections && getHeaderButtons()}</View>}
-                <ConfirmModal
-                    isVisible={deleteReportFieldsConfirmModalVisible}
-                    onConfirm={handleDeleteReportFields}
-                    onCancel={() => setDeleteReportFieldsConfirmModalVisible(false)}
-                    title={translate(selectedReportFields.length === 1 ? 'workspace.reportFields.delete' : 'workspace.reportFields.deleteFields')}
-                    prompt={translate(selectedReportFields.length === 1 ? 'workspace.reportFields.deleteConfirmation' : 'workspace.reportFields.deleteFieldsConfirmation')}
-                    confirmText={translate('common.delete')}
-                    cancelText={translate('common.cancel')}
-                    danger
                 />
-                {(!shouldUseNarrowLayout || !hasVisibleReportField || isLoading) && getHeaderText()}
-                {!shouldShowEmptyState && !isLoading && shouldUseNarrowLayout && getHeaderText()}
-                {reportFieldsSections.length > CONST.SEARCH_ITEM_LIMIT && (
-                    <SearchBar
-                        label={translate('workspace.reportFields.findReportField')}
-                        inputValue={inputValue}
-                        onChangeText={setInputValue}
-                        shouldShowEmptyState={!shouldShowEmptyState && filteredReportFields.length === 0}
-                    />
-                )}
                 {isLoading && (
                     <ActivityIndicator
                         size={CONST.ACTIVITY_INDICATOR_SIZE.LARGE}
@@ -297,43 +183,143 @@ function WorkspaceReportFieldsPage({
                         color={theme.spinner}
                     />
                 )}
-                {shouldShowEmptyState && filteredReportFields.length === 0 && (
-                    <ScrollView contentContainerStyle={[styles.flexGrow1, styles.flexShrink0]}>
-                        <EmptyStateComponent
-                            title={translate('workspace.reportFields.emptyReportFields.title')}
-                            subtitle={translate('workspace.reportFields.emptyReportFields.subtitle')}
-                            SkeletonComponent={TableListItemSkeleton}
-                            headerMediaType={CONST.EMPTY_STATE_MEDIA.ANIMATION}
-                            headerMedia={LottieAnimations.GenericEmptyState}
-                            headerStyles={[styles.emptyStateCardIllustrationContainer, styles.emptyFolderBG]}
-                            lottieWebViewStyles={styles.emptyStateFolderWebStyles}
-                            headerContentStyles={styles.emptyStateFolderWebStyles}
-                        />
+                {!isLoading && (
+                    <ScrollView contentContainerStyle={[styles.flexGrow1, styles.mt3, shouldUseNarrowLayout ? styles.workspaceSectionMobile : styles.workspaceSection]}>
+                        <Section
+                            isCentralPane
+                            title={translate('workspace.common.reportTitle')}
+                            renderSubtitle={() => (
+                                <Text style={[[styles.textLabelSupportingEmptyValue, styles.lh20, styles.mt1]]}>
+                                    {translate('workspace.rules.expenseReportRules.customReportNamesSubtitle')}
+                                    <TextLink
+                                        style={[styles.link]}
+                                        href={CONST.CUSTOM_REPORT_NAME_HELP_URL}
+                                    >
+                                        {translate('workspace.rules.expenseReportRules.customNameDescriptionLink')}
+                                    </TextLink>
+                                    .
+                                </Text>
+                            )}
+                            containerStyles={shouldUseNarrowLayout ? styles.p5 : styles.p8}
+                            titleStyles={[styles.textHeadline, styles.cardSectionTitle, styles.accountSettingsSectionTitle, styles.mb1]}
+                        >
+                            <OfflineWithFeedback pendingAction={reportTitlePendingFields.defaultValue}>
+                                <MenuItemWithTopDescription
+                                    description={translate('workspace.rules.expenseReportRules.customNameTitle')}
+                                    title={policy?.fieldList?.[CONST.POLICY.FIELDS.FIELD_LIST_TITLE].defaultValue}
+                                    shouldShowRightIcon
+                                    style={[styles.sectionMenuItemTopDescription, styles.mt6, styles.mbn3]}
+                                    onPress={() => Navigation.navigate(ROUTES.RULES_CUSTOM_NAME.getRoute(policyID))}
+                                />
+                            </OfflineWithFeedback>
+                            <ToggleSettingOptionRow
+                                pendingAction={reportTitlePendingFields.deletable}
+                                title={translate('workspace.rules.expenseReportRules.preventMembersFromChangingCustomNamesTitle')}
+                                switchAccessibilityLabel={translate('workspace.rules.expenseReportRules.preventMembersFromChangingCustomNamesTitle')}
+                                wrapperStyle={[styles.sectionMenuItemTopDescription, styles.mt6]}
+                                titleStyle={styles.pv2}
+                                isActive={!policy?.fieldList?.[CONST.POLICY.FIELDS.FIELD_LIST_TITLE].deletable}
+                                onToggle={(isEnabled) => {
+                                    if (isEnabled && !isControlPolicy(policy)) {
+                                        Navigation.navigate(
+                                            ROUTES.WORKSPACE_UPGRADE.getRoute(
+                                                policyID,
+                                                CONST.UPGRADE_FEATURE_INTRO_MAPPING.policyPreventMemberChangingTitle.alias,
+                                                ROUTES.WORKSPACE_REPORT_FIELDS.getRoute(policyID),
+                                            ),
+                                        );
+                                        return;
+                                    }
+
+                                    setPolicyPreventMemberCreatedTitle(policyID, isEnabled);
+                                }}
+                            />
+                        </Section>
+                        <Section
+                            isCentralPane
+                            containerStyles={shouldUseNarrowLayout ? styles.p5 : styles.p8}
+                        >
+                            <ToggleSettingOptionRow
+                                pendingAction={policy?.pendingFields?.areReportFieldsEnabled}
+                                title={translate('workspace.common.reportFields')}
+                                switchAccessibilityLabel={translate('workspace.common.reportFields')}
+                                subtitle={getHeaderText()}
+                                titleStyle={[styles.textHeadline, styles.cardSectionTitle, styles.accountSettingsSectionTitle, styles.mb1]}
+                                isActive={!!policy?.areReportFieldsEnabled}
+                                onToggle={(isEnabled) => {
+                                    if (!isEnabled) {
+                                        setIsReportFieldsWarningModalOpen(true);
+                                        return;
+                                    }
+                                    if (!isControlPolicy(policy)) {
+                                        Navigation.navigate(
+                                            ROUTES.WORKSPACE_UPGRADE.getRoute(
+                                                policyID,
+                                                CONST.UPGRADE_FEATURE_INTRO_MAPPING.reportFields.alias,
+                                                ROUTES.WORKSPACE_REPORT_FIELDS.getRoute(policyID),
+                                            ),
+                                        );
+                                        return;
+                                    }
+                                    enablePolicyReportFields(policyID, isEnabled);
+                                }}
+                                disabled={hasAccountingConnection}
+                                disabledAction={onDisabledOrganizeSwitchPress}
+                                subMenuItems={
+                                    !!policy?.areReportFieldsEnabled && (
+                                        <>
+                                            <FlatList
+                                                data={reportFieldsSections}
+                                                renderItem={renderItem}
+                                                style={[shouldUseNarrowLayout ? styles.mhn5 : styles.mhn8, styles.mt6]}
+                                                scrollEnabled={false}
+                                            />
+                                            {!hasReportAccountingConnections && (
+                                                <MenuItem
+                                                    onPress={() => Navigation.navigate(ROUTES.WORKSPACE_CREATE_REPORT_FIELD.getRoute(policyID))}
+                                                    title={translate('workspace.reportFields.addField')}
+                                                    icon={Plus}
+                                                    style={[styles.sectionMenuItemTopDescription]}
+                                                />
+                                            )}
+                                        </>
+                                    )
+                                }
+                            />
+                        </Section>
                     </ScrollView>
                 )}
-                {!shouldShowEmptyState && !isLoading && (
-                    <SelectionListWithModal
-                        canSelectMultiple={canSelectMultiple}
-                        turnOnSelectionModeOnLongPress={!hasReportAccountingConnections}
-                        onTurnOnSelectionMode={(item) => item && updateSelectedReportFields(item)}
-                        sections={[
-                            {
-                                data: filteredReportFields,
-                                isDisabled: !policy,
-                            },
-                        ]}
-                        onCheckboxPress={updateSelectedReportFields}
-                        onSelectRow={navigateToReportFieldsSettings}
-                        onSelectAll={toggleAllReportFields}
-                        ListItem={TableListItem}
-                        customListHeader={getCustomListHeader()}
-                        listHeaderContent={shouldUseNarrowLayout ? getHeaderText() : null}
-                        shouldPreventDefaultFocusOnSelectRow={!canUseTouchScreen()}
-                        listHeaderWrapperStyle={[styles.ph9, styles.pv3, styles.pb5]}
-                        showScrollIndicator={false}
-                        addBottomSafeAreaPadding
-                    />
-                )}
+                <ConfirmModal
+                    title={translate('workspace.reportFields.disableReportFields')}
+                    isVisible={isReportFieldsWarningModalOpen}
+                    onConfirm={() => {
+                        if (!policyID) {
+                            return;
+                        }
+                        setIsReportFieldsWarningModalOpen(false);
+                        enablePolicyReportFields(policyID, false);
+                    }}
+                    onCancel={() => setIsReportFieldsWarningModalOpen(false)}
+                    prompt={translate('workspace.reportFields.disableReportFieldsConfirmation')}
+                    confirmText={translate('common.disable')}
+                    cancelText={translate('common.cancel')}
+                    danger
+                />
+                <ConfirmModal
+                    title={translate('workspace.moreFeatures.connectionsWarningModal.featureEnabledTitle')}
+                    onConfirm={() => {
+                        if (!policyID) {
+                            return;
+                        }
+                        setIsOrganizeWarningModalOpen(false);
+                        Navigation.navigate(ROUTES.POLICY_ACCOUNTING.getRoute(policyID));
+                    }}
+                    onCancel={() => setIsOrganizeWarningModalOpen(false)}
+                    isVisible={isOrganizeWarningModalOpen}
+                    prompt={translate('workspace.moreFeatures.connectionsWarningModal.featureEnabledText')}
+                    confirmText={translate('workspace.moreFeatures.connectionsWarningModal.manageSettings')}
+                    cancelText={translate('common.cancel')}
+                />
             </ScreenWrapper>
         </AccessOrNotFoundWrapper>
     );
diff --git a/src/pages/workspace/rules/ExpenseReportRulesSection.tsx b/src/pages/workspace/rules/ExpenseReportRulesSection.tsx
index 916b9b941c94..99c205badf45 100644
--- a/src/pages/workspace/rules/ExpenseReportRulesSection.tsx
+++ b/src/pages/workspace/rules/ExpenseReportRulesSection.tsx
@@ -11,13 +11,7 @@ import {convertToDisplayString} from '@libs/CurrencyUtils';
 import Navigation from '@libs/Navigation/Navigation';
 import {getWorkflowApprovalsUnavailable} from '@libs/PolicyUtils';
 import ToggleSettingOptionRow from '@pages/workspace/workflows/ToggleSettingsOptionRow';
-import {
-    enableAutoApprovalOptions,
-    enablePolicyAutoReimbursementLimit,
-    enablePolicyDefaultReportTitle,
-    setPolicyPreventMemberCreatedTitle,
-    setPolicyPreventSelfApproval,
-} from '@userActions/Policy/Policy';
+import {enableAutoApprovalOptions, enablePolicyAutoReimbursementLimit, setPolicyPreventSelfApproval} from '@userActions/Policy/Policy';
 import CONST from '@src/CONST';
 import ROUTES from '@src/ROUTES';
 
@@ -30,7 +24,6 @@ function ExpenseReportRulesSection({policyID}: ExpenseReportRulesSectionProps) {
     const styles = useThemeStyles();
     const policy = usePolicy(policyID);
     const workflowApprovalsUnavailable = getWorkflowApprovalsUnavailable(policy);
-    const customReportNamesUnavailable = !policy?.areReportFieldsEnabled;
     const autoPayApprovedReportsUnavailable = policy?.reimbursementChoice === CONST.POLICY.REIMBURSEMENT_CHOICES.REIMBURSEMENT_NO;
 
     const renderFallbackSubtitle = ({featureName, variant = 'unlock'}: {featureName: string; variant?: 'unlock' | 'enable'}) => {
@@ -52,44 +45,7 @@ function ExpenseReportRulesSection({policyID}: ExpenseReportRulesSectionProps) {
         );
     };
 
-    const reportTitlePendingFields = policy?.fieldList?.[CONST.POLICY.FIELDS.FIELD_LIST_TITLE]?.pendingFields ?? {};
     const optionItems = [
-        {
-            title: translate('workspace.rules.expenseReportRules.customReportNamesTitle'),
-            subtitle: customReportNamesUnavailable
-                ? renderFallbackSubtitle({featureName: translate('workspace.common.reportFields').toLowerCase(), variant: 'enable'})
-                : translate('workspace.rules.expenseReportRules.customReportNamesSubtitle'),
-            switchAccessibilityLabel: translate('workspace.rules.expenseReportRules.customReportNamesTitle'),
-            isActive: policy?.shouldShowCustomReportTitleOption,
-            disabled: customReportNamesUnavailable,
-            showLockIcon: customReportNamesUnavailable,
-            pendingAction: policy?.pendingFields?.shouldShowCustomReportTitleOption,
-            onToggle: (isEnabled: boolean) => enablePolicyDefaultReportTitle(policyID, isEnabled),
-            subMenuItems: [
-                <OfflineWithFeedback
-                    pendingAction={!policy?.pendingFields?.shouldShowCustomReportTitleOption && reportTitlePendingFields.defaultValue ? reportTitlePendingFields.defaultValue : null}
-                    key="customName"
-                >
-                    <MenuItemWithTopDescription
-                        description={translate('workspace.rules.expenseReportRules.customNameTitle')}
-                        title={policy?.fieldList?.[CONST.POLICY.FIELDS.FIELD_LIST_TITLE].defaultValue}
-                        shouldShowRightIcon
-                        style={[styles.sectionMenuItemTopDescription, styles.mt6, styles.mbn3]}
-                        onPress={() => Navigation.navigate(ROUTES.RULES_CUSTOM_NAME.getRoute(policyID))}
-                    />
-                </OfflineWithFeedback>,
-                <ToggleSettingOptionRow
-                    pendingAction={!policy?.pendingFields?.shouldShowCustomReportTitleOption && reportTitlePendingFields.deletable ? reportTitlePendingFields.deletable : null}
-                    key="preventMembersFromChangingCustomNames"
-                    title={translate('workspace.rules.expenseReportRules.preventMembersFromChangingCustomNamesTitle')}
-                    switchAccessibilityLabel={translate('workspace.rules.expenseReportRules.preventMembersFromChangingCustomNamesTitle')}
-                    wrapperStyle={[styles.sectionMenuItemTopDescription, styles.mt6]}
-                    titleStyle={styles.pv2}
-                    isActive={!policy?.fieldList?.[CONST.POLICY.FIELDS.FIELD_LIST_TITLE].deletable}
-                    onToggle={(isEnabled) => setPolicyPreventMemberCreatedTitle(policyID, isEnabled)}
-                />,
-            ],
-        },
         {
             title: translate('workspace.rules.expenseReportRules.preventSelfApprovalsTitle'),
             subtitle: workflowApprovalsUnavailable
diff --git a/src/pages/workspace/rules/RulesCustomNamePage.tsx b/src/pages/workspace/rules/RulesCustomNamePage.tsx
index 76f2a2985bb6..bb01394662b7 100644
--- a/src/pages/workspace/rules/RulesCustomNamePage.tsx
+++ b/src/pages/workspace/rules/RulesCustomNamePage.tsx
@@ -59,8 +59,6 @@ function RulesCustomNamePage({route}: RulesCustomNamePageProps) {
         <AccessOrNotFoundWrapper
             policyID={policyID}
             accessVariants={[CONST.POLICY.ACCESS_VARIANTS.ADMIN, CONST.POLICY.ACCESS_VARIANTS.PAID]}
-            featureName={CONST.POLICY.MORE_FEATURES.ARE_RULES_ENABLED}
-            shouldBeBlocked={!policy?.shouldShowCustomReportTitleOption}
         >
             <ScreenWrapper
                 enableEdgeToEdgeBottomSafeAreaPadding
diff --git a/src/pages/workspace/upgrade/UpgradeIntro.tsx b/src/pages/workspace/upgrade/UpgradeIntro.tsx
index 3e655ac72935..d7d8a06f0188 100644
--- a/src/pages/workspace/upgrade/UpgradeIntro.tsx
+++ b/src/pages/workspace/upgrade/UpgradeIntro.tsx
@@ -26,7 +26,7 @@ import GenericFeaturesView from './GenericFeaturesView';
 type Props = {
     buttonDisabled?: boolean;
     loading?: boolean;
-    feature?: ValueOf<typeof CONST.UPGRADE_FEATURE_INTRO_MAPPING>;
+    feature?: ValueOf<Omit<typeof CONST.UPGRADE_FEATURE_INTRO_MAPPING, typeof CONST.UPGRADE_FEATURE_INTRO_MAPPING.policyPreventMemberChangingTitle.id>>;
     onUpgrade: () => void;
     isCategorizing?: boolean;
     policyID?: string;
diff --git a/src/pages/workspace/upgrade/WorkspaceUpgradePage.tsx b/src/pages/workspace/upgrade/WorkspaceUpgradePage.tsx
index 840091cb8e6d..8e3d99dda7ce 100644
--- a/src/pages/workspace/upgrade/WorkspaceUpgradePage.tsx
+++ b/src/pages/workspace/upgrade/WorkspaceUpgradePage.tsx
@@ -1,6 +1,7 @@
 import {useFocusEffect} from '@react-navigation/native';
 import React, {useCallback, useMemo} from 'react';
 import {useOnyx} from 'react-native-onyx';
+import type {ValueOf} from 'type-fest';
 import HeaderWithBackButton from '@components/HeaderWithBackButton';
 import ScreenWrapper from '@components/ScreenWrapper';
 import ScrollView from '@components/ScrollView';
@@ -16,7 +17,7 @@ import {canModifyPlan, getPerDiemCustomUnit, isControlPolicy} from '@libs/Policy
 import NotFoundPage from '@pages/ErrorPage/NotFoundPage';
 import {enablePerDiem} from '@userActions/Policy/PerDiem';
 import CONST from '@src/CONST';
-import {enableCompanyCards, enablePolicyReportFields, enablePolicyRules, upgradeToCorporate} from '@src/libs/actions/Policy/Policy';
+import {enableCompanyCards, enablePolicyReportFields, enablePolicyRules, setPolicyPreventMemberCreatedTitle, upgradeToCorporate} from '@src/libs/actions/Policy/Policy';
 import ONYXKEYS from '@src/ONYXKEYS';
 import ROUTES from '@src/ROUTES';
 import type SCREENS from '@src/SCREENS';
@@ -44,9 +45,17 @@ function WorkspaceUpgradePage({route}: WorkspaceUpgradePageProps) {
 
     const featureNameAlias = route.params?.featureName && getFeatureNameAlias(route.params.featureName);
 
-    const feature = useMemo(() => Object.values(CONST.UPGRADE_FEATURE_INTRO_MAPPING).find((f) => f.alias === featureNameAlias), [featureNameAlias]);
+    const feature: ValueOf<Omit<typeof CONST.UPGRADE_FEATURE_INTRO_MAPPING, typeof CONST.UPGRADE_FEATURE_INTRO_MAPPING.policyPreventMemberChangingTitle.id>> = useMemo(
+        () =>
+            Object.values(CONST.UPGRADE_FEATURE_INTRO_MAPPING)
+                .filter((value) => value.id !== CONST.UPGRADE_FEATURE_INTRO_MAPPING.policyPreventMemberChangingTitle.id)
+                .find((f) => f.alias === featureNameAlias) as ValueOf<
+                Omit<typeof CONST.UPGRADE_FEATURE_INTRO_MAPPING, typeof CONST.UPGRADE_FEATURE_INTRO_MAPPING.policyPreventMemberChangingTitle.id>
+            >,
+        [featureNameAlias],
+    );
     const {translate} = useLocalize();
-    const [policy] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY}${policyID}`);
+    const [policy] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY}${policyID}`, {canBeMissing: true});
     const qboConfig = policy?.connections?.quickbooksOnline?.config;
     const {isOffline} = useNetwork();
 
@@ -57,11 +66,11 @@ function WorkspaceUpgradePage({route}: WorkspaceUpgradePageProps) {
     const categoryId = route.params?.categoryId;
 
     const goBack = useCallback(() => {
-        if (!feature || !policyID) {
+        if ((!feature && featureNameAlias !== CONST.UPGRADE_FEATURE_INTRO_MAPPING.policyPreventMemberChangingTitle.alias) || !policyID) {
             Navigation.dismissModal();
             return;
         }
-        switch (feature.id) {
+        switch (feature?.id) {
             case CONST.UPGRADE_FEATURE_INTRO_MAPPING.approvals.id:
                 Navigation.goBack();
                 if (route.params.backTo) {
@@ -71,7 +80,7 @@ function WorkspaceUpgradePage({route}: WorkspaceUpgradePageProps) {
             case CONST.UPGRADE_FEATURE_INTRO_MAPPING.reportFields.id:
                 switch (route.params.featureName) {
                     case CONST.UPGRADE_FEATURE_INTRO_MAPPING.reportFields.alias:
-                        return Navigation.goBack(ROUTES.WORKSPACE_MORE_FEATURES.getRoute(policyID));
+                        return Navigation.goBack(ROUTES.WORKSPACE_REPORT_FIELDS.getRoute(policyID));
                     default: {
                         Navigation.goBack();
                         if (route.params.backTo) {
@@ -89,7 +98,7 @@ function WorkspaceUpgradePage({route}: WorkspaceUpgradePageProps) {
             default:
                 return route.params.backTo ? Navigation.goBack(route.params.backTo) : Navigation.goBack();
         }
-    }, [feature, policyID, route.params?.backTo, route.params?.featureName]);
+    }, [feature, policyID, route.params?.backTo, route.params?.featureName, featureNameAlias]);
 
     const onUpgradeToCorporate = () => {
         if (!canPerformUpgrade || !policy) {
@@ -100,7 +109,13 @@ function WorkspaceUpgradePage({route}: WorkspaceUpgradePageProps) {
     };
 
     const confirmUpgrade = useCallback(() => {
-        if (!feature || !policyID) {
+        if (!policyID) {
+            return;
+        }
+        if (!feature) {
+            if (featureNameAlias === CONST.UPGRADE_FEATURE_INTRO_MAPPING.policyPreventMemberChangingTitle.alias) {
+                setPolicyPreventMemberCreatedTitle(policyID, true);
+            }
             return;
         }
         switch (feature.id) {
@@ -128,7 +143,7 @@ function WorkspaceUpgradePage({route}: WorkspaceUpgradePageProps) {
                         break;
                     }
                     default: {
-                        enablePolicyReportFields(policyID, true, false);
+                        enablePolicyReportFields(policyID, true);
                     }
                 }
                 break;
@@ -154,6 +169,7 @@ function WorkspaceUpgradePage({route}: WorkspaceUpgradePageProps) {
         qboConfig?.syncCustomers,
         qboConfig?.syncLocations,
         route.params?.featureName,
+        featureNameAlias,
     ]);
 
     useFocusEffect(
diff --git a/src/types/onyx/Policy.ts b/src/types/onyx/Policy.ts
index ab8da7fd5fca..77500528cdd5 100644
--- a/src/types/onyx/Policy.ts
+++ b/src/types/onyx/Policy.ts
@@ -1716,11 +1716,6 @@ type Policy = OnyxCommon.OnyxValueWithOfflineFeedback<
             'limit' | 'auditRate'
         >;
 
-        /**
-         * Whether the custom report name options are enabled in the policy rules
-         */
-        shouldShowCustomReportTitleOption?: boolean;
-
         /** Whether to leave the calling account as an admin on the policy */
         makeMeAdmin?: boolean;
 


Reviews:
user: login: suneox
state: COMMENTED
author_association: CONTRIBUTOR
submitted_at: 2025-05-05T04:51:58Z
user: login: FitseTLT
state: COMMENTED
author_association: CONTRIBUTOR
submitted_at: 2025-05-05T20:50:22Z
user: login: suneox
state: APPROVED
author_association: CONTRIBUTOR
submitted_at: 2025-05-07T17:51:01Z
user: login: blimpich
body: Code looks good. @FitseTLT @suneox can one of you provide a video of the new modal for when the user clicks on the toggle and is directed to go to the accounting settings? That way we can all confirm visually its what we expect.

@trjExpensify just to clarify, are you expecting that the toggle will have the "lock" icon on it too?
![Screenshot 2025-05-07 at 3 20 27 PM](https://github.com/user-attachments/assets/a3a0e884-2bab-4c27-a746-7ea1f9c9d7d0)

state: CHANGES_REQUESTED
author_association: CONTRIBUTOR
submitted_at: 2025-05-07T22:22:18Z
user: login: blimpich
body: Great job!
state: APPROVED
author_association: CONTRIBUTOR
submitted_at: 2025-05-08T16:31:51Z
user: login: MonilBhavsar
body: This PR might have introduced bug https://github.com/Expensify/App/issues/62065
If anyone could please take a look, thanks!
state: COMMENTED
author_association: CONTRIBUTOR
submitted_at: 2025-05-15T04:51:49Z
user: login: ikevin127
state: COMMENTED
author_association: CONTRIBUTOR
submitted_at: 2025-06-06T02:12:28Z
user: login: alitoshmatov
state: COMMENTED
author_association: CONTRIBUTOR
submitted_at: 2025-08-18T19:00:27Z
user: login: QichenZhu
state: COMMENTED
author_association: CONTRIBUTOR
submitted_at: 2025-12-22T20:14:23Z

Review comments:
diff_hunk: @@ -44,9 +45,17 @@ function WorkspaceUpgradePage({route}: WorkspaceUpgradePageProps) {
 
     const featureNameAlias = route.params?.featureName && getFeatureNameAlias(route.params.featureName);
 
-    const feature = useMemo(() => Object.values(CONST.UPGRADE_FEATURE_INTRO_MAPPING).find((f) => f.alias === featureNameAlias), [featureNameAlias]);
+    const feature: ValueOf<Omit<typeof CONST.UPGRADE_FEATURE_INTRO_MAPPING, typeof CONST.UPGRADE_FEATURE_INTRO_MAPPING.policyPreventMemberChangingTitle.id>> = useMemo(
+        () =>
+            Object.values(CONST.UPGRADE_FEATURE_INTRO_MAPPING)
+                .filter((value) => value.id !== CONST.UPGRADE_FEATURE_INTRO_MAPPING.policyPreventMemberChangingTitle.id)
+                .find((f) => f.alias === featureNameAlias) as ValueOf<
+                Omit<typeof CONST.UPGRADE_FEATURE_INTRO_MAPPING, typeof CONST.UPGRADE_FEATURE_INTRO_MAPPING.policyPreventMemberChangingTitle.id>
+            >,
+        [featureNameAlias],
+    );
path: src/pages/workspace/upgrade/WorkspaceUpgradePage.tsx
user: login: suneox
body: We don’t need to set the type for the feature because the find function still keeps the current type. Also, do we need to filter out `UPGRADE_FEATURE_INTRO_MAPPING.policyPreventMemberChangingTitle`?
```suggestion
    const feature = useMemo(
        () =>
            Object.values(CONST.UPGRADE_FEATURE_INTRO_MAPPING)
                .filter((value) => value.id !== CONST.UPGRADE_FEATURE_INTRO_MAPPING.policyPreventMemberChangingTitle.id)
                .find((f) => f.alias === featureNameAlias),
        [featureNameAlias],
    );
```
created_at: 2025-05-05T04:51:56Z
author_association: CONTRIBUTOR
diff_hunk: @@ -44,9 +45,17 @@ function WorkspaceUpgradePage({route}: WorkspaceUpgradePageProps) {
 
     const featureNameAlias = route.params?.featureName && getFeatureNameAlias(route.params.featureName);
 
-    const feature = useMemo(() => Object.values(CONST.UPGRADE_FEATURE_INTRO_MAPPING).find((f) => f.alias === featureNameAlias), [featureNameAlias]);
+    const feature: ValueOf<Omit<typeof CONST.UPGRADE_FEATURE_INTRO_MAPPING, typeof CONST.UPGRADE_FEATURE_INTRO_MAPPING.policyPreventMemberChangingTitle.id>> = useMemo(
+        () =>
+            Object.values(CONST.UPGRADE_FEATURE_INTRO_MAPPING)
+                .filter((value) => value.id !== CONST.UPGRADE_FEATURE_INTRO_MAPPING.policyPreventMemberChangingTitle.id)
+                .find((f) => f.alias === featureNameAlias) as ValueOf<
+                Omit<typeof CONST.UPGRADE_FEATURE_INTRO_MAPPING, typeof CONST.UPGRADE_FEATURE_INTRO_MAPPING.policyPreventMemberChangingTitle.id>
+            >,
+        [featureNameAlias],
+    );
path: src/pages/workspace/upgrade/WorkspaceUpgradePage.tsx
user: login: FitseTLT
body: `policyPreventMemberChangingTitle` need to be filtered out because it doesn't have the same type as other features, like it doesn't have icon. And unfortunately we need to set the type this way because the typescript couldn't automatically identify from the filter function.
created_at: 2025-05-05T20:50:22Z
author_association: CONTRIBUTOR
diff_hunk: @@ -254,86 +171,155 @@ function WorkspaceReportFieldsPage({
                 offlineIndicatorStyle={styles.mtAuto}
             >
                 <HeaderWithBackButton
-                    icon={!selectionModeHeader ? Pencil : undefined}
-                    shouldUseHeadlineHeader={!selectionModeHeader}
-                    title={translate(selectionModeHeader ? 'common.selectMultiple' : 'workspace.common.reportFields')}
+                    icon={ReportReceipt}
+                    title={translate('common.reports')}
+                    shouldUseHeadlineHeader
                     shouldShowBackButton={shouldUseNarrowLayout}
-                    onBackButtonPress={() => {
-                        if (selectionModeHeader) {
-                            setSelectedReportFields([]);
-                            turnOffMobileSelectionMode();
-                            return;
-                        }
-                        goBackFromWorkspaceCentralScreen(policyID);
-                    }}
-                >
-                    {!shouldUseNarrowLayout && !hasReportAccountingConnections && getHeaderButtons()}
-                </HeaderWithBackButton>
-                {shouldUseNarrowLayout && <View style={[styles.pl5, styles.pr5]}>{!hasReportAccountingConnections && getHeaderButtons()}</View>}
-                <ConfirmModal
-                    isVisible={deleteReportFieldsConfirmModalVisible}
-                    onConfirm={handleDeleteReportFields}
-                    onCancel={() => setDeleteReportFieldsConfirmModalVisible(false)}
-                    title={translate(selectedReportFields.length === 1 ? 'workspace.reportFields.delete' : 'workspace.reportFields.deleteFields')}
-                    prompt={translate(selectedReportFields.length === 1 ? 'workspace.reportFields.deleteConfirmation' : 'workspace.reportFields.deleteFieldsConfirmation')}
-                    confirmText={translate('common.delete')}
-                    cancelText={translate('common.cancel')}
-                    danger
                 />
-                {(!shouldUseNarrowLayout || !hasVisibleReportField || isLoading) && getHeaderText()}
-                {!shouldShowEmptyState && !isLoading && shouldUseNarrowLayout && getHeaderText()}
-                {reportFieldsSections.length > CONST.SEARCH_ITEM_LIMIT && (
-                    <SearchBar
-                        label={translate('workspace.reportFields.findReportField')}
-                        inputValue={inputValue}
-                        onChangeText={setInputValue}
-                        shouldShowEmptyState={!shouldShowEmptyState && filteredReportFields.length === 0}
-                    />
-                )}
                 {isLoading && (
                     <ActivityIndicator
                         size={CONST.ACTIVITY_INDICATOR_SIZE.LARGE}
                         style={styles.flex1}
                         color={theme.spinner}
                     />
                 )}
-                {shouldShowEmptyState && filteredReportFields.length === 0 && (
-                    <ScrollView contentContainerStyle={[styles.flexGrow1, styles.flexShrink0]}>
-                        <EmptyStateComponent
-                            title={translate('workspace.reportFields.emptyReportFields.title')}
-                            subtitle={translate('workspace.reportFields.emptyReportFields.subtitle')}
-                            SkeletonComponent={TableListItemSkeleton}
-                            headerMediaType={CONST.EMPTY_STATE_MEDIA.ANIMATION}
-                            headerMedia={LottieAnimations.GenericEmptyState}
-                            headerStyles={[styles.emptyStateCardIllustrationContainer, styles.emptyFolderBG]}
-                            lottieWebViewStyles={styles.emptyStateFolderWebStyles}
-                            headerContentStyles={styles.emptyStateFolderWebStyles}
-                        />
+                {!isLoading && (
+                    <ScrollView contentContainerStyle={[styles.flexGrow1, styles.mt3, shouldUseNarrowLayout ? styles.workspaceSectionMobile : styles.workspaceSection]}>
+                        <Section
+                            isCentralPane
+                            title={translate('workspace.common.reportTitle')}
+                            renderSubtitle={() => (
+                                <Text style={[[styles.textLabelSupportingEmptyValue, styles.lh20, styles.mt1]]}>
+                                    {translate('workspace.rules.expenseReportRules.customReportNamesSubtitle')}
+                                    <TextLink
+                                        style={[styles.link]}
+                                        href={CONST.CUSTOM_REPORT_NAME_HELP_URL}
+                                    >
+                                        {translate('workspace.rules.expenseReportRules.customNameDescriptionLink')}
+                                    </TextLink>
+                                    .
+                                </Text>
+                            )}
+                            containerStyles={shouldUseNarrowLayout ? styles.p5 : styles.p8}
+                            titleStyles={[styles.textHeadline, styles.cardSectionTitle, styles.accountSettingsSectionTitle, styles.mb1]}
+                        >
+                            <OfflineWithFeedback pendingAction={reportTitlePendingFields.defaultValue}>
+                                <MenuItemWithTopDescription
+                                    description={translate('workspace.rules.expenseReportRules.customNameTitle')}
+                                    title={policy?.fieldList?.[CONST.POLICY.FIELDS.FIELD_LIST_TITLE].defaultValue}
path: src/pages/workspace/reportFields/WorkspaceReportFieldsPage.tsx
user: login: ikevin127
body: Passing the title value here like this led to the following issue:
- https://github.com/Expensify/App/issues/62462

we fixed it by wrapping the value with `Str.htmlDecode()`.
created_at: 2025-06-06T02:12:28Z
author_association: CONTRIBUTOR
diff_hunk: @@ -254,86 +171,155 @@ function WorkspaceReportFieldsPage({
                 offlineIndicatorStyle={styles.mtAuto}
             >
                 <HeaderWithBackButton
-                    icon={!selectionModeHeader ? Pencil : undefined}
-                    shouldUseHeadlineHeader={!selectionModeHeader}
-                    title={translate(selectionModeHeader ? 'common.selectMultiple' : 'workspace.common.reportFields')}
+                    icon={ReportReceipt}
+                    title={translate('common.reports')}
+                    shouldUseHeadlineHeader
                     shouldShowBackButton={shouldUseNarrowLayout}
-                    onBackButtonPress={() => {
-                        if (selectionModeHeader) {
-                            setSelectedReportFields([]);
-                            turnOffMobileSelectionMode();
-                            return;
-                        }
-                        goBackFromWorkspaceCentralScreen(policyID);
-                    }}
-                >
-                    {!shouldUseNarrowLayout && !hasReportAccountingConnections && getHeaderButtons()}
-                </HeaderWithBackButton>
-                {shouldUseNarrowLayout && <View style={[styles.pl5, styles.pr5]}>{!hasReportAccountingConnections && getHeaderButtons()}</View>}
-                <ConfirmModal
-                    isVisible={deleteReportFieldsConfirmModalVisible}
-                    onConfirm={handleDeleteReportFields}
-                    onCancel={() => setDeleteReportFieldsConfirmModalVisible(false)}
-                    title={translate(selectedReportFields.length === 1 ? 'workspace.reportFields.delete' : 'workspace.reportFields.deleteFields')}
-                    prompt={translate(selectedReportFields.length === 1 ? 'workspace.reportFields.deleteConfirmation' : 'workspace.reportFields.deleteFieldsConfirmation')}
-                    confirmText={translate('common.delete')}
-                    cancelText={translate('common.cancel')}
-                    danger
                 />
-                {(!shouldUseNarrowLayout || !hasVisibleReportField || isLoading) && getHeaderText()}
-                {!shouldShowEmptyState && !isLoading && shouldUseNarrowLayout && getHeaderText()}
-                {reportFieldsSections.length > CONST.SEARCH_ITEM_LIMIT && (
-                    <SearchBar
-                        label={translate('workspace.reportFields.findReportField')}
-                        inputValue={inputValue}
-                        onChangeText={setInputValue}
-                        shouldShowEmptyState={!shouldShowEmptyState && filteredReportFields.length === 0}
-                    />
-                )}
                 {isLoading && (
                     <ActivityIndicator
                         size={CONST.ACTIVITY_INDICATOR_SIZE.LARGE}
                         style={styles.flex1}
                         color={theme.spinner}
                     />
                 )}
-                {shouldShowEmptyState && filteredReportFields.length === 0 && (
-                    <ScrollView contentContainerStyle={[styles.flexGrow1, styles.flexShrink0]}>
-                        <EmptyStateComponent
-                            title={translate('workspace.reportFields.emptyReportFields.title')}
-                            subtitle={translate('workspace.reportFields.emptyReportFields.subtitle')}
-                            SkeletonComponent={TableListItemSkeleton}
-                            headerMediaType={CONST.EMPTY_STATE_MEDIA.ANIMATION}
-                            headerMedia={LottieAnimations.GenericEmptyState}
-                            headerStyles={[styles.emptyStateCardIllustrationContainer, styles.emptyFolderBG]}
-                            lottieWebViewStyles={styles.emptyStateFolderWebStyles}
-                            headerContentStyles={styles.emptyStateFolderWebStyles}
-                        />
+                {!isLoading && (
+                    <ScrollView contentContainerStyle={[styles.flexGrow1, styles.mt3, shouldUseNarrowLayout ? styles.workspaceSectionMobile : styles.workspaceSection]}>
+                        <Section
+                            isCentralPane
+                            title={translate('workspace.common.reportTitle')}
+                            renderSubtitle={() => (
+                                <Text style={[[styles.textLabelSupportingEmptyValue, styles.lh20, styles.mt1]]}>
+                                    {translate('workspace.rules.expenseReportRules.customReportNamesSubtitle')}
+                                    <TextLink
+                                        style={[styles.link]}
+                                        href={CONST.CUSTOM_REPORT_NAME_HELP_URL}
+                                    >
+                                        {translate('workspace.rules.expenseReportRules.customNameDescriptionLink')}
+                                    </TextLink>
+                                    .
+                                </Text>
+                            )}
+                            containerStyles={shouldUseNarrowLayout ? styles.p5 : styles.p8}
+                            titleStyles={[styles.textHeadline, styles.cardSectionTitle, styles.accountSettingsSectionTitle, styles.mb1]}
+                        >
+                            <OfflineWithFeedback pendingAction={reportTitlePendingFields.defaultValue}>
+                                <MenuItemWithTopDescription
+                                    description={translate('workspace.rules.expenseReportRules.customNameTitle')}
+                                    title={policy?.fieldList?.[CONST.POLICY.FIELDS.FIELD_LIST_TITLE].defaultValue}
+                                    shouldShowRightIcon
+                                    style={[styles.sectionMenuItemTopDescription, styles.mt6, styles.mbn3]}
+                                    onPress={() => Navigation.navigate(ROUTES.RULES_CUSTOM_NAME.getRoute(policyID))}
+                                />
+                            </OfflineWithFeedback>
+                            <ToggleSettingOptionRow
+                                pendingAction={reportTitlePendingFields.deletable}
+                                title={translate('workspace.rules.expenseReportRules.preventMembersFromChangingCustomNamesTitle')}
+                                switchAccessibilityLabel={translate('workspace.rules.expenseReportRules.preventMembersFromChangingCustomNamesTitle')}
+                                wrapperStyle={[styles.sectionMenuItemTopDescription, styles.mt6]}
+                                titleStyle={styles.pv2}
+                                isActive={!policy?.fieldList?.[CONST.POLICY.FIELDS.FIELD_LIST_TITLE].deletable}
+                                onToggle={(isEnabled) => {
+                                    if (isEnabled && !isControlPolicy(policy)) {
+                                        Navigation.navigate(
+                                            ROUTES.WORKSPACE_UPGRADE.getRoute(
+                                                policyID,
+                                                CONST.UPGRADE_FEATURE_INTRO_MAPPING.policyPreventMemberChangingTitle.alias,
+                                                ROUTES.WORKSPACE_REPORT_FIELDS.getRoute(policyID),
+                                            ),
+                                        );
+                                        return;
+                                    }
+
+                                    setPolicyPreventMemberCreatedTitle(policyID, isEnabled);
+                                }}
+                            />
+                        </Section>
+                        <Section
+                            isCentralPane
+                            containerStyles={shouldUseNarrowLayout ? styles.p5 : styles.p8}
+                        >
+                            <ToggleSettingOptionRow
+                                pendingAction={policy?.pendingFields?.areReportFieldsEnabled}
+                                title={translate('workspace.common.reportFields')}
+                                switchAccessibilityLabel={translate('workspace.common.reportFields')}
+                                subtitle={getHeaderText()}
+                                titleStyle={[styles.textHeadline, styles.cardSectionTitle, styles.accountSettingsSectionTitle, styles.mb1]}
+                                isActive={!!policy?.areReportFieldsEnabled}
+                                onToggle={(isEnabled) => {
+                                    if (!isEnabled) {
+                                        setIsReportFieldsWarningModalOpen(true);
+                                        return;
+                                    }
+                                    if (!isControlPolicy(policy)) {
+                                        Navigation.navigate(
+                                            ROUTES.WORKSPACE_UPGRADE.getRoute(
+                                                policyID,
+                                                CONST.UPGRADE_FEATURE_INTRO_MAPPING.reportFields.alias,
+                                                ROUTES.WORKSPACE_REPORT_FIELDS.getRoute(policyID),
+                                            ),
+                                        );
+                                        return;
+                                    }
+                                    enablePolicyReportFields(policyID, isEnabled);
+                                }}
+                                disabled={hasAccountingConnection}
+                                disabledAction={onDisabledOrganizeSwitchPress}
+                                subMenuItems={
+                                    !!policy?.areReportFieldsEnabled && (
+                                        <>
+                                            <FlatList
+                                                data={reportFieldsSections}
+                                                renderItem={renderItem}
+                                                style={[shouldUseNarrowLayout ? styles.mhn5 : styles.mhn8, styles.mt6]}
+                                                scrollEnabled={false}
+                                            />
+                                            {!hasReportAccountingConnections && (
+                                                <MenuItem
path: src/pages/workspace/reportFields/WorkspaceReportFieldsPage.tsx
user: login: alitoshmatov
body: We should have avoided nesting `FlatList` inside `ScrollView` as per [docs](https://github.com/Expensify/App/blob/main/contributingGuides/STYLE.md#handling-scroll-issues-with-nested-lists-in-react-native). Issue: https://github.com/Expensify/App/issues/62240
created_at: 2025-08-18T19:00:27Z
author_association: CONTRIBUTOR
diff_hunk: @@ -254,86 +171,155 @@ function WorkspaceReportFieldsPage({
                 offlineIndicatorStyle={styles.mtAuto}
             >
                 <HeaderWithBackButton
-                    icon={!selectionModeHeader ? Pencil : undefined}
-                    shouldUseHeadlineHeader={!selectionModeHeader}
-                    title={translate(selectionModeHeader ? 'common.selectMultiple' : 'workspace.common.reportFields')}
+                    icon={ReportReceipt}
+                    title={translate('common.reports')}
+                    shouldUseHeadlineHeader
                     shouldShowBackButton={shouldUseNarrowLayout}
-                    onBackButtonPress={() => {
-                        if (selectionModeHeader) {
-                            setSelectedReportFields([]);
-                            turnOffMobileSelectionMode();
-                            return;
-                        }
-                        goBackFromWorkspaceCentralScreen(policyID);
-                    }}
-                >
-                    {!shouldUseNarrowLayout && !hasReportAccountingConnections && getHeaderButtons()}
-                </HeaderWithBackButton>
-                {shouldUseNarrowLayout && <View style={[styles.pl5, styles.pr5]}>{!hasReportAccountingConnections && getHeaderButtons()}</View>}
-                <ConfirmModal
-                    isVisible={deleteReportFieldsConfirmModalVisible}
-                    onConfirm={handleDeleteReportFields}
-                    onCancel={() => setDeleteReportFieldsConfirmModalVisible(false)}
-                    title={translate(selectedReportFields.length === 1 ? 'workspace.reportFields.delete' : 'workspace.reportFields.deleteFields')}
-                    prompt={translate(selectedReportFields.length === 1 ? 'workspace.reportFields.deleteConfirmation' : 'workspace.reportFields.deleteFieldsConfirmation')}
-                    confirmText={translate('common.delete')}
-                    cancelText={translate('common.cancel')}
-                    danger
                 />
-                {(!shouldUseNarrowLayout || !hasVisibleReportField || isLoading) && getHeaderText()}
-                {!shouldShowEmptyState && !isLoading && shouldUseNarrowLayout && getHeaderText()}
-                {reportFieldsSections.length > CONST.SEARCH_ITEM_LIMIT && (
-                    <SearchBar
-                        label={translate('workspace.reportFields.findReportField')}
-                        inputValue={inputValue}
-                        onChangeText={setInputValue}
-                        shouldShowEmptyState={!shouldShowEmptyState && filteredReportFields.length === 0}
-                    />
-                )}
                 {isLoading && (
                     <ActivityIndicator
                         size={CONST.ACTIVITY_INDICATOR_SIZE.LARGE}
                         style={styles.flex1}
                         color={theme.spinner}
                     />
                 )}
-                {shouldShowEmptyState && filteredReportFields.length === 0 && (
-                    <ScrollView contentContainerStyle={[styles.flexGrow1, styles.flexShrink0]}>
-                        <EmptyStateComponent
-                            title={translate('workspace.reportFields.emptyReportFields.title')}
-                            subtitle={translate('workspace.reportFields.emptyReportFields.subtitle')}
-                            SkeletonComponent={TableListItemSkeleton}
-                            headerMediaType={CONST.EMPTY_STATE_MEDIA.ANIMATION}
-                            headerMedia={LottieAnimations.GenericEmptyState}
-                            headerStyles={[styles.emptyStateCardIllustrationContainer, styles.emptyFolderBG]}
-                            lottieWebViewStyles={styles.emptyStateFolderWebStyles}
-                            headerContentStyles={styles.emptyStateFolderWebStyles}
-                        />
+                {!isLoading && (
+                    <ScrollView contentContainerStyle={[styles.flexGrow1, styles.mt3, shouldUseNarrowLayout ? styles.workspaceSectionMobile : styles.workspaceSection]}>
+                        <Section
path: src/pages/workspace/reportFields/WorkspaceReportFieldsPage.tsx
user: login: QichenZhu
body: This section didn't have offline styling like the other sections.

We [wrapped the title and subtitle in `OfflineWithFeedback`](https://github.com/Expensify/App/pull/77719) to fix it.
created_at: 2025-12-22T20:14:23Z
author_association: CONTRIBUTOR

PR comments:
user: login: FitseTLT
created_at: 2025-04-03T13:35:15Z
body: Waiting for the BE changes I wanted to finish up the FE part so I want comments from design perspective @shawnborton. Is there any way I can have the exact px of the spacing of the design in the [OP](https://github.com/Expensify/App/issues/59065#issue-2946494241)



https://github.com/user-attachments/assets/6d7a6c4d-d475-42bd-bc83-10f68206d0f4



author_association: CONTRIBUTOR
user: login: shawnborton
created_at: 2025-04-03T14:39:28Z
body: Looking pretty close! Some quick comments (cc @Expensify/design to check this too):

In the empty state, we have too much space at the bottom of this card:
![CleanShot 2025-04-03 at 16 37 36@2x](https://github.com/user-attachments/assets/b9e6224b-3990-4afa-b05e-ed5040b57519)

The spacing should look more like these from Workflows:
![CleanShot 2025-04-03 at 16 38 54@2x](https://github.com/user-attachments/assets/a54c9b53-0db2-4e67-9121-601a26b7b721)

Please check the space between the card title and the toggle below it. Again, check the Workflows page for exact spacing. 

author_association: CONTRIBUTOR
user: login: shawnborton
created_at: 2025-04-03T14:39:58Z
body: The Add field row should bleed from edge-to-edge:
![CleanShot 2025-04-03 at 16 39 29@2x](https://github.com/user-attachments/assets/b42d94f0-3171-480d-9a4c-7542903f68d2)


Again, check Workflows > Add approvals to see how it should actually look:
![CleanShot 2025-04-03 at 16 39 46@2x](https://github.com/user-attachments/assets/7dfb4b59-1844-4288-9621-eeb593305d19)

author_association: CONTRIBUTOR
user: login: shawnborton
created_at: 2025-04-03T14:41:23Z
body: It looks like the fields that are added aren't lined up correct either:
![CleanShot 2025-04-03 at 16 40 34@2x](https://github.com/user-attachments/assets/3d4348a9-f962-428c-9928-276504ee08e0)

They should be over to the left and right some more. Basically if you fix the padding issue you have with the create row, you should fix this padding issue here as well. But notice how the text in the rows aren't left-aligned with the intro text above?
author_association: CONTRIBUTOR
user: login: shawnborton
created_at: 2025-04-03T14:41:58Z
body: I think we need a period after "extensive formulas" here:
![CleanShot 2025-04-03 at 16 41 42@2x](https://github.com/user-attachments/assets/6785921b-435e-4541-b0f4-507fab953e16)

author_association: CONTRIBUTOR
user: login: shawnborton
created_at: 2025-04-03T14:42:33Z
body: Yup, similar comment as above, these rows aren't bleeding edge-to-edge:
![CleanShot 2025-04-03 at 16 42 17@2x](https://github.com/user-attachments/assets/ac583df5-5be2-41f1-a470-35f531fe174e)

author_association: CONTRIBUTOR
user: login: shawnborton
created_at: 2025-04-03T14:43:16Z
body: @FitseTLT I am happy to share the Figma file with you, but can you first just try to reference other parts of the workspace editor and use the exact spacing you see from say the Workflows page? 
author_association: CONTRIBUTOR
user: login: FitseTLT
created_at: 2025-04-03T14:44:07Z
body: Yep Will do Pretty helpful guidance Thx 👍 
author_association: CONTRIBUTOR
user: login: FitseTLT
created_at: 2025-04-04T21:56:19Z
body: Here is how it looks now

https://github.com/user-attachments/assets/78cd19ae-214b-4d44-bd51-0db86534c78c


author_association: CONTRIBUTOR
user: login: shawnborton
created_at: 2025-04-07T06:37:28Z
body: This is feeling really solid to me! Let us know when it's ready for a test build and I will trigger them for us. 
author_association: CONTRIBUTOR
user: login: flaviadefaria
created_at: 2025-04-07T12:40:34Z
body: Same! Looking forward to a test build to play around with it a bit more.
author_association: CONTRIBUTOR
user: login: FitseTLT
created_at: 2025-04-07T12:42:56Z
body: Will do after we get the BE fixed 👍 
author_association: CONTRIBUTOR
user: login: flaviadefaria
created_at: 2025-04-10T13:35:38Z
body: @FitseTLT I believe we're good to resume the work here now that the BE changes are live!
author_association: CONTRIBUTOR
user: login: FitseTLT
created_at: 2025-04-10T13:57:49Z
body: @shawnborton or @flaviadefaria We used to have a confirm modal for disabling report field feature in More features page do you think we need to have it now?
author_association: CONTRIBUTOR
user: login: shawnborton
created_at: 2025-04-10T14:24:32Z
body: Can you show me what that looks like? I don't mind the idea of using it here too. 
author_association: CONTRIBUTOR
user: login: FitseTLT
created_at: 2025-04-10T15:03:37Z
body: 
https://github.com/user-attachments/assets/09c472e1-eb17-4700-8e7e-086e8c75756f


author_association: CONTRIBUTOR
user: login: flaviadefaria
created_at: 2025-04-10T15:05:20Z
body: Oh I really like adding that modal in!
author_association: CONTRIBUTOR
user: login: shawnborton
created_at: 2025-04-10T15:08:53Z
body: Yeah, same. Is it definitely true though that text and date fields get deleted when you disable Report Fields? It looks like they still remain in your video [here](https://github.com/Expensify/App/pull/59568#issuecomment-2779793889). 
author_association: CONTRIBUTOR
user: login: shawnborton
created_at: 2025-04-10T15:09:10Z
body: Like in your video, you disable report fields, but when you re-enable it, the fields are still listed in the table. 
author_association: CONTRIBUTOR
user: login: dannymcclain
created_at: 2025-04-10T15:18:27Z
body: +1 to liking the modal! But as Shawn pointed out, let's make sure the copy we're using in it is accurate 👍
author_association: CONTRIBUTOR
user: login: FitseTLT
created_at: 2025-04-10T15:22:16Z
body: @shawnborton I only cancelled it the first time that's what confused u 😄 . It's already working as expected
author_association: CONTRIBUTOR
user: login: shawnborton
created_at: 2025-04-10T15:23:41Z
body: Sounds good 👍 
author_association: CONTRIBUTOR
user: login: melvin-bot[bot]
created_at: 2025-04-10T16:46:54Z
body: @suneox Please copy/paste the Reviewer Checklist from [here](https://raw.githubusercontent.com/Expensify/App/main/contributingGuides/REVIEWER_CHECKLIST.md) into a new comment on this PR and complete it. If you have the K2 extension, you can simply click: [this button]
author_association: NONE
user: login: FitseTLT
created_at: 2025-04-10T16:47:08Z
body: READY for review
author_association: CONTRIBUTOR
user: login: shawnborton
created_at: 2025-04-10T17:01:14Z
body: Will trigger a test build now 🚀 
author_association: CONTRIBUTOR
user: login: github-actions[bot]
created_at: 2025-04-10T17:02:28Z
body: 🚧 @shawnborton has triggered a test app build. You can view the [workflow run here](https://github.com/Expensify/App/actions/runs/14386134784).
author_association: CONTRIBUTOR
user: login: github-actions[bot]
created_at: 2025-04-10T17:40:37Z
body: :test_tube::test_tube: Use the links below to test this adhoc build on Android, iOS, Desktop, and Web. Happy testing! :test_tube::test_tube:
| Android :robot:  | iOS :apple: |
| ------------- | ------------- |
| Android :robot::arrows_counterclockwise:  | iOS :apple::arrows_counterclockwise: |
| https://ad-hoc-expensify-cash.s3.amazonaws.com/android/59568-hybrid/index.html  | https://ad-hoc-expensify-cash.s3.amazonaws.com/ios/59568-hybrid/index.html  |
| ![Android](https://api.qrserver.com/v1/create-qr-code/?size=120x120&data=https://ad-hoc-expensify-cash.s3.amazonaws.com/android/59568-hybrid/index.html)  | ![iOS](https://api.qrserver.com/v1/create-qr-code/?size=120x120&data=https://ad-hoc-expensify-cash.s3.amazonaws.com/ios/59568-hybrid/index.html)  |
| Desktop :computer: | Web :spider_web: |
| https://ad-hoc-expensify-cash.s3.amazonaws.com/desktop/59568/NewExpensify.dmg  | https://59568.pr-testing.expensify.com  |
| ![Desktop](https://api.qrserver.com/v1/create-qr-code/?size=120x120&data=https://ad-hoc-expensify-cash.s3.amazonaws.com/desktop/59568/NewExpensify.dmg)  | ![Web](https://api.qrserver.com/v1/create-qr-code/?size=120x120&data=https://59568.pr-testing.expensify.com)  |

---

:eyes: [View the workflow run that generated this build](https://github.com/Expensify/App/actions/runs/14386134784) :eyes:

author_association: CONTRIBUTOR
user: login: dannymcclain
created_at: 2025-04-10T19:38:10Z
body: Can't deep dive right now, but did an initial cruise and so far so good
author_association: CONTRIBUTOR
user: login: dubielzyk-expensify
created_at: 2025-04-11T01:08:47Z
body: Not feedback per se, but I assume we're ordering this list in alphabetical order? 

![CleanShot 2025-04-11 at 11 06 35@2x](https://github.com/user-attachments/assets/b8e910d5-907b-4cbb-90c0-a4fc9b75bcbf)

I was initially thrown off as I was expecting the new report field to go to the bottom, but I think that's a wrong expectation and that alphabetical makes most sense.
author_association: CONTRIBUTOR
user: login: dubielzyk-expensify
created_at: 2025-04-11T01:09:48Z
body: For the `extensive formulas` link, can we use this link instead: https://help.expensify.com/articles/expensify-classic/spending-insights/Export-Expenses-And-Reports#formulas

That way the user gets dropped to the relevant part of the article. Otherwise they are sent to the top where there's talk about export options etc. 
author_association: CONTRIBUTOR
user: login: shawnborton
created_at: 2025-04-11T06:59:28Z
body: Tests pretty well to me, agree with Jon's comments above too!
author_association: CONTRIBUTOR
user: login: shawnborton
created_at: 2025-04-11T07:00:45Z
body: I think I would expect the "Add report field" row to be directly below the list items - no need for a gap in between. And then on mobile, I would expect some more padding/gap below it too:
![CleanShot 2025-04-11 at 09 00 00@2x](https://github.com/user-attachments/assets/d6484829-0437-40fc-bc6d-133e400e6548)

author_association: CONTRIBUTOR
user: login: suneox
created_at: 2025-04-14T15:35:20Z
body: @FitseTLT Could you please resolve the conflict?
author_association: CONTRIBUTOR
user: login: FitseTLT
created_at: 2025-04-14T17:12:37Z
body: @suneox Please wait for the BE fix the PR has been reverted 👍 
author_association: CONTRIBUTOR
user: login: flaviadefaria
created_at: 2025-04-23T12:59:09Z
body: I believe we're good to move forward here again?
author_association: CONTRIBUTOR
user: login: FitseTLT
created_at: 2025-04-23T17:34:31Z
body: This is ready for review for design team as well as C+ 👍 Above comments have been handled.
author_association: CONTRIBUTOR
user: login: FitseTLT
created_at: 2025-04-23T18:07:58Z
body: Waiting for translation https://expensify.slack.com/archives/C01GTK53T8Q/p1745431624638349
author_association: CONTRIBUTOR
user: login: suneox
created_at: 2025-04-23T18:27:14Z
body: Thank for update i'll review within today
author_association: CONTRIBUTOR
user: login: flaviadefaria
created_at: 2025-04-28T10:19:40Z
body: @suneox are you able to get to this today/tomorrow?
author_association: CONTRIBUTOR
user: login: suneox
created_at: 2025-04-28T13:33:39Z
body: > @suneox are you able to get to this today/tomorrow?

I can get this one today @FitseTLT could you please resolve the conflict?
author_association: CONTRIBUTOR
user: login: FitseTLT
created_at: 2025-04-28T13:42:10Z
body: Resolved
author_association: CONTRIBUTOR
user: login: suneox
created_at: 2025-04-29T02:31:24Z
body: ## Reviewer Checklist

- [x] I have verified the author checklist is complete (all boxes are checked off).
- [x] I verified the correct issue is linked in the `### Fixed Issues` section above
- [x] I verified testing steps are clear and they cover the changes made in this PR
    - [x] I verified the steps for local testing are in the `Tests` section
    - [x] I verified the steps for Staging and/or Production testing are in the `QA steps` section
    - [x] I verified the steps cover any possible failure scenarios (i.e. verify an input displays the correct error message if the entered data is not correct)
    - [x] I turned off my network connection and tested it while offline to ensure it matches the expected behavior (i.e. verify the default avatar icon is displayed if app is offline)
- [x] I checked that screenshots or videos are included for tests on [all platforms](https://github.com/Expensify/App/blob/main/contributingGuides/CONTRIBUTING.md#make-sure-you-can-test-on-all-platforms)
- [x] I included screenshots or videos for tests on [all platforms](https://github.com/Expensify/App/blob/main/contributingGuides/CONTRIBUTING.md#make-sure-you-can-test-on-all-platforms)
- [x] I verified that the composer does not automatically focus or open the keyboard on mobile unless explicitly intended. This includes checking that returning the app from the background does not unexpectedly open the keyboard.
- [x] I verified tests pass on **all platforms** & I tested again on:
    - [x] Android: HybridApp
    - [x] Android: mWeb Chrome
    - [x] iOS: HybridApp
    - [x] iOS: mWeb Safari
    - [x] MacOS: Chrome / Safari
    - [x] MacOS: Desktop
- [x] If there are any errors in the console that are unrelated to this PR, I either fixed them (preferred) or linked to where I reported them in Slack
- [x] I verified there are no new alerts related to the `canBeMissing` param for `useOnyx`
- [x] I verified proper code patterns were followed (see [Reviewing the code](https://github.com/Expensify/App/blob/main/contributingGuides/PR_REVIEW_GUIDELINES.md#reviewing-the-code))
    - [x] I verified that any callback methods that were added or modified are named for what the method does and never what callback they handle (i.e. `toggleReport` and not `onIconClick`).
    - [x] I verified that comments were added to code that is not self explanatory
    - [x] I verified that any new or modified comments were clear, correct English, and explained "why" the code was doing something instead of only explaining "what" the code was doing.
    - [x] I verified any copy / text shown in the product is localized by adding it to `src/languages/*` files and using the [translation method](https://github.com/Expensify/App/blob/4bd99402cebdf4d7394e0d1f260879ea238197eb/src/components/withLocalize.js#L60)
    - [x] I verified all numbers, amounts, dates and phone numbers shown in the product are using the [localization methods](https://github.com/Expensify/App/blob/4bd99402cebdf4d7394e0d1f260879ea238197eb/src/components/withLocalize.js#L60-L68)
    - [x] I verified any copy / text that was added to the app is grammatically correct in English. It adheres to proper capitalization guidelines (note: only the first word of header/labels should be capitalized), and is either coming verbatim from figma or has been approved by marketing (in order to get marketing approval, ask the Bug Zero team member to add the Waiting for copy label to the issue)
    - [x] I verified proper file naming conventions were followed for any new files or renamed files. All non-platform specific files are named after what they export and are not named "index.js". All platform-specific files are named for the platform the code supports as outlined in the README.
    - [x] I verified the JSDocs style guidelines (in [`STYLE.md`](https://github.com/Expensify/App/blob/main/contributingGuides/STYLE.md#jsdocs)) were followed
- [x] If a new code pattern is added I verified it was agreed to be used by multiple Expensify engineers
- [x] I verified that this PR follows the guidelines as stated in the [Review Guidelines](https://github.com/Expensify/App/blob/main/contributingGuides/PR_REVIEW_GUIDELINES.md)
- [x] I verified other components that can be impacted by these changes have been tested, and I retested again (i.e. if the PR modifies a shared library or component like `Avatar`, I verified the components using `Avatar` have been tested & I retested again)
- [x] I verified all code is DRY (the PR doesn't include any logic written more than once, with the exception of tests)
- [x] I verified any variables that can be defined as constants (ie. in CONST.ts or at the top of the file that uses the constant) are defined as such
- [x] If a new component is created I verified that:
    - [x] A similar component doesn't exist in the codebase
    - [x] All props are defined accurately and each prop has a `/** comment above it */`
    - [x] The file is named correctly
    - [x] The component has a clear name that is non-ambiguous and the purpose of the component can be inferred from the name alone
    - [x] The only data being stored in the state is data necessary for rendering and nothing else
    - [x] For Class Components, any internal methods passed to components event handlers are bound to `this` properly so there are no scoping issues (i.e. for `onClick={this.submit}` the method `this.submit` should be bound to `this` in the constructor)
    - [x] Any internal methods bound to `this` are necessary to be bound (i.e. avoid `this.submit = this.submit.bind(this);` if `this.submit` is never passed to a component event handler like `onClick`)
    - [x] All JSX used for rendering exists in the render method
    - [x] The component has the minimum amount of code necessary for its purpose, and it is broken down into smaller components in order to separate concerns and functions
- [x] If any new file was added I verified that:
    - [x] The file has a description of what it does and/or why is needed at the top of the file if the code is not self explanatory
- [x] If a new CSS style is added I verified that:
    - [x] A similar style doesn't already exist
    - [x] The style can't be created with an existing [StyleUtils](https://github.com/Expensify/App/blob/main/src/utils/index.ts) function (i.e. `StyleUtils.getBackgroundAndBorderStyle(theme.componentBG`)
- [x] If the PR modifies code that runs when editing or sending messages, I tested and verified there is no unexpected behavior for all supported markdown - URLs, single line code, code blocks, quotes, headings, bold, strikethrough, and italic.
- [x] If the PR modifies a generic component, I tested and verified that those changes do not break usages of that component in the rest of the App (i.e. if a shared library or component like `Avatar` is modified, I verified that `Avatar` is working as expected in all cases)
- [x] If the PR modifies a component related to any of the existing Storybook stories, I tested and verified all stories for that component are still working as expected.
- [x] If the PR modifies a component or page that can be accessed by a direct deeplink, I verified that the code functions as expected when the deeplink is used - from a logged in and logged out account.
- [x] If the PR modifies the UI (e.g. new buttons, new UI components, changing the padding/spacing/sizing, moving components, etc) or modifies the form input styles:
    - [x] I verified that all the inputs inside a form are aligned with each other.
    - [x] I added `Design` label and/or tagged `@Expensify/design` so the design team can review the changes.
- [x] If a new page is added, I verified it's using the `ScrollView` component to make it scrollable when more elements are added to the page.
- [x] For any bug fix or new feature in this PR, I verified that sufficient [unit tests](https://github.com/Expensify/App/blob/main/tests/README.md) are included to prevent regressions in this flow.
- [x] If the `main` branch was merged into this PR after a review, I tested again and verified the outcome was still expected according to the `Test` steps.
- [x] I have checked off every checkbox in the PR reviewer checklist, including those that don't apply to this PR.

### Screenshots/Videos
<details>
<summary>Android: HybridApp</summary>


https://github.com/user-attachments/assets/c1e4eef6-99f0-4760-8053-5704915423b9



</details>

<details>
<summary>Android: mWeb Chrome</summary>


https://github.com/user-attachments/assets/fe38de2d-ec8a-4b53-a9e6-512387bf4d67



</details>

<details>
<summary>iOS: HybridApp</summary>


https://github.com/user-attachments/assets/e4c2c570-5fd3-441a-9e74-f206d99dfc50



</details>

<details>
<summary>iOS: mWeb Safari</summary>


https://github.com/user-attachments/assets/a339fccd-f446-4e24-ab88-24d4e8972d7a



</details>

<details>
<summary>MacOS: Chrome / Safari</summary>


https://github.com/user-attachments/assets/6b91c74e-b1cd-4768-aa8a-ddef86fb23df


https://github.com/user-attachments/assets/6faace50-a806-4d41-8949-65faeeecae0c

<img width="1512" alt="Screenshot 2025-04-29 at 10 12 38" src="https://github.com/user-attachments/assets/fa83e2b6-bbf4-4faf-be51-f7b997e7eb14" />


</details>

<details>
<summary>MacOS: Desktop</summary>


https://github.com/user-attachments/assets/cc954da3-520b-45f3-9a6d-8e74257a3f3e



</details>

author_association: CONTRIBUTOR
user: login: suneox
created_at: 2025-04-29T04:48:56Z
body: @FitseTLT  Could you please check the “Add Field” functionality isn’t working on mWeb?


https://github.com/user-attachments/assets/112fc39c-6664-4bfb-90be-61648db43d2a



author_association: CONTRIBUTOR
user: login: FitseTLT
created_at: 2025-04-30T13:26:35Z
body: @suneox Nice catch we shouldn't display add field when there is an accounting connection. Fixed
author_association: CONTRIBUTOR
user: login: suneox
created_at: 2025-05-01T15:47:48Z
body: > @suneox Nice catch we shouldn't display add field when there is an accounting connection. Fixed

Could you please provide the root cause for the error page display? This issue only happens on mWeb.

author_association: CONTRIBUTOR
user: login: FitseTLT
created_at: 2025-05-01T16:34:48Z
body: Nope @suneox it happens to all platforms because we show not found if we have active accounting connection here
https://github.com/Expensify/App/blob/358e54e424342a2fd1f4f380f7e8d6bd35a76c47/src/pages/workspace/reportFields/CreateReportFieldsPage.tsx#L115
author_association: CONTRIBUTOR
user: login: suneox
created_at: 2025-05-05T10:40:46Z
body: @FitseTLT  There's a conflict we need to resolve
author_association: CONTRIBUTOR
user: login: FitseTLT
created_at: 2025-05-05T20:51:24Z
body: Resolved conflicts and also re-added the report field accounting header info we used to have: `The report fields below are imported from your [QuickBooks Online settings]`
author_association: CONTRIBUTOR
user: login: trjExpensify
created_at: 2025-05-06T09:58:16Z
body: @FitseTLT you have more conflicts. Let's try and get that resolved and final reviewed today to avoid picking up more. 
author_association: CONTRIBUTOR
user: login: FitseTLT
created_at: 2025-05-06T12:01:46Z
body: @suneox Can we wrap it up today ? Thx

author_association: CONTRIBUTOR
user: login: suneox
created_at: 2025-05-06T12:10:24Z
body: > @suneox Can we wrap it up today ? Thx

Yes, the checklist is finished I will just verify again after resolving the conflicts.

author_association: CONTRIBUTOR
user: login: FitseTLT
created_at: 2025-05-06T12:15:22Z
body: BTW The failing jest is from another pr and the fix is [here](https://github.com/Expensify/App/pull/61476)
author_association: CONTRIBUTOR
user: login: suneox
created_at: 2025-05-06T13:25:38Z
body: @FitseTLT I just compared this PR with the latest main branch. I think we should keep the warning and prevent enabling the report field in cases where there is an accounting connection.


<details>
<summary>Before</summary>

https://github.com/user-attachments/assets/67c867d7-065e-48a5-8ed3-d0c2472dac95


</details>

<details>
<summary>After</summary>

https://github.com/user-attachments/assets/a6d99946-8b3b-48f9-bb5f-d2ec6039c3ea

</details>

cc: @flaviadefaria

author_association: CONTRIBUTOR
user: login: trjExpensify
created_at: 2025-05-06T14:43:37Z
body: Specifically you mean the Report fields toggle here, right? The `Report fields` option in `More features` has gone away with these changes. 

<img width="805" alt="image" src="https://github.com/user-attachments/assets/02338e28-b8cf-4ea2-8fea-455e1e7692c2" />

I agree with that if so. The report fields toggle on the Reports page should be locked (which can be either enabled or disabled) when the accounting solution is connected. When clicked, it shows the alert modal with the reason why and a button to get over to the accounting settings. 

author_association: CONTRIBUTOR
user: login: FitseTLT
created_at: 2025-05-07T17:06:34Z
body: @suneox Added
author_association: CONTRIBUTOR
user: login: suneox
created_at: 2025-05-07T17:48:52Z
body: > @suneox Added

Thanks for the quick update! The new change set works as expected



https://github.com/user-attachments/assets/6b91c74e-b1cd-4768-aa8a-ddef86fb23df


author_association: CONTRIBUTOR
user: login: trjExpensify
created_at: 2025-05-07T23:17:31Z
body: >@trjExpensify just to clarify, are you expecting that the toggle will have the "lock" icon on it too?

Yep, it's locked enabled or locked disabled when you're connected to an accounting solution. It all depends on if you're importing coding as report fields or not. But in both cases, you can't "manually" or independently manage report fields once you connect. 
author_association: CONTRIBUTOR
user: login: trjExpensify
created_at: 2025-05-07T23:17:45Z
body: P.S @FitseTLT conflicts again. 😅 
author_association: CONTRIBUTOR
user: login: suneox
created_at: 2025-05-08T01:38:56Z
body: > Code looks good. @FitseTLT @suneox can one of you provide a video of the new modal for when the user clicks on the toggle and is directed to go to the accounting settings?

The video has included in my checklist

https://github.com/user-attachments/assets/6b91c74e-b1cd-4768-aa8a-ddef86fb23df
author_association: CONTRIBUTOR
user: login: FitseTLT
created_at: 2025-05-08T13:47:07Z
body: @blimpich Conflict resolved
author_association: CONTRIBUTOR
user: login: OSBotify
created_at: 2025-05-08T16:42:12Z
body: :hand: This PR was not deployed to staging yet because QA is ongoing. It will be automatically deployed to staging after the next production release.
author_association: CONTRIBUTOR
user: login: dukenv0307
created_at: 2025-05-21T03:21:33Z
body: Coming from: https://github.com/Expensify/App/issues/62090. We should move `SCREENS.WORKSPACE.RULES_CUSTOM_NAME` from [SCREENS.WORKSPACE.RULES] to [SCREENS.WORKSPACE.REPORT_FIELDS]


author_association: CONTRIBUTOR