diff --git a/docs/articles/expensify-classic/bank-accounts-and-payments/payments/Pay-an-Invoice.md b/docs/articles/expensify-classic/bank-accounts-and-payments/payments/Pay-an-Invoice.md
index 84fafc949527..18020402f7de 100644
--- a/docs/articles/expensify-classic/bank-accounts-and-payments/payments/Pay-an-Invoice.md
+++ b/docs/articles/expensify-classic/bank-accounts-and-payments/payments/Pay-an-Invoice.md
@@ -10,9 +10,15 @@ There are multiple ways to pay Invoices in Expensify. Let’s go over each metho
# How to Pay Invoices
1. Sign in to your [Expensify web account](www.expensify.com).
-2. Click on the Invoice you’d like to pay to see the details.
-3. Click on the **Pay** button.
-4. Follow the prompts to pay through one of the following methods.
+2. Click on **Home** and find the pending Invoice payment
+3. Click **Pay** to be redirected to the Invoice
+4. Review the Invoice
+5. When you are ready to pay, click the **Pay** button at the top of the Invoice
+6. Follow the prompts to pay through one of the following methods.
+
+{:width="100%"}
+
+{:width="100%"}
### ACH bank-to-bank transfer
diff --git a/docs/articles/expensify-classic/bank-accounts-and-payments/payments/Reimburse-Reports.md b/docs/articles/expensify-classic/bank-accounts-and-payments/payments/Reimburse-Reports.md
index afe366fb1dbe..41dc52a4239c 100644
--- a/docs/articles/expensify-classic/bank-accounts-and-payments/payments/Reimburse-Reports.md
+++ b/docs/articles/expensify-classic/bank-accounts-and-payments/payments/Reimburse-Reports.md
@@ -14,7 +14,7 @@ Before a report can be reimbursed via direct deposit:
To reimburse a report via direct deposit (USD):
1. Open the report.
-2. Click the **Reimburse** button and select **Via Direct Deposit (ACH)**.
+2. Click the **Reimburse** button and select **Via Direct Deposit**.
3. Confirm that the correct bank account is listed in the dropdown menu.
4. Click **Accept Terms & Pay**.
@@ -27,7 +27,7 @@ Before a report can be reimbursed via global reimbursement:
To reimburse a report via global reimbursement:
1. Open the report.
-2. Click the **Reimburse** button and select **Via Direct Deposit (ACH)**.
+2. Click the **Reimburse** button and select **Via Direct Deposit**.
3. Confirm that the correct bank account is listed in the dropdown menu.
4. Click **Accept Terms & Pay**.
diff --git a/docs/articles/expensify-classic/connections/quickbooks-desktop/Connect-To-QuickBooks-Desktop.md b/docs/articles/expensify-classic/connections/quickbooks-desktop/Connect-To-QuickBooks-Desktop.md
index bda84eb0a49f..30785330a9ad 100644
--- a/docs/articles/expensify-classic/connections/quickbooks-desktop/Connect-To-QuickBooks-Desktop.md
+++ b/docs/articles/expensify-classic/connections/quickbooks-desktop/Connect-To-QuickBooks-Desktop.md
@@ -52,6 +52,10 @@ For this step, it is key to ensure that the correct company file is open in Quic
{:width="100%"}
+{% include info.html %}
+Be sure to securely save this password in a trusted password manager. You'll need it for future configuration updates or troubleshooting. Having it easily accessible will help avoid delays and ensure a smoother workflow.
+{% include end-info.html %}
+
# FAQ
## What are the hardware and software requirements for the QuickBooks Desktop connector?
diff --git a/docs/articles/expensify-classic/expenses/Add-Invoices-in-Bulk.md b/docs/articles/expensify-classic/expenses/Add-Invoices-in-Bulk.md
index 6257c1e6d84d..3e9b6c0397db 100644
--- a/docs/articles/expensify-classic/expenses/Add-Invoices-in-Bulk.md
+++ b/docs/articles/expensify-classic/expenses/Add-Invoices-in-Bulk.md
@@ -14,6 +14,13 @@ Expensify offers importing multiple invoices (bulk import) via CSV to save you f
5. Add the invoice details following the formatting rules (see below **CSV formatting guide** section)
6. Click **Upload CSV**
+{:width="100%"}
+
+{:width="100%"}
+
+{:width="100%"}
+
+
## CSV formatting guide
- Send to: recipient's email address (ex: john.smith@companydomain.com)
@@ -27,10 +34,15 @@ Expensify offers importing multiple invoices (bulk import) via CSV to save you f
## After the Invoices are uploaded
- After you click **Upload**, the invoices will automatically be created and viewable on the **Reports** page.
+- Set the **Reports page** filter to Invoices to narrow down your search.
- The **Send To** contact will get an email notifying them of the invoice you sent.
- You can manually edit the invoice details.
- You can manually upload a PDF of the invoice to the report.
+{:width="100%"}
+
+{:width="100%"}
+
{% include faq-begin.md %}
## Are there any fees associated with Invoices in Expensify?
diff --git a/docs/articles/expensify-classic/expenses/Add-an-expense.md b/docs/articles/expensify-classic/expenses/Add-an-expense.md
index 461748c6af9e..5f40ff377be6 100644
--- a/docs/articles/expensify-classic/expenses/Add-an-expense.md
+++ b/docs/articles/expensify-classic/expenses/Add-an-expense.md
@@ -2,7 +2,6 @@
title: Add an expense
description: Create a new expense in Expensify
---
-
You can add an expense automatically with SmartScan or enter the expense details manually.
@@ -41,62 +40,189 @@ You can open any receipt and click **Fill out details myself** to add or edit th
{% include end-selector.html %}
-# Email a receipt
-
You can also email receipts to SmartScan by sending them to receipts@expensify.com from an email address tied to your Expensify account (either a primary or secondary email). SmartScan will automatically pull all of the details from the receipt, fill them in for you, and add the receipt to the Expenses tab on your account.
{% include info.html %}
**For copilots**: To ensure a receipt is routed to the Expensify account you are copiloting instead of your own account, email the receipt to receipts@expensify.com with the email address of the account you are copiloting as the subject line of the email.
{% include end-info.html %}
-# Add an expense manually
+# Add a per diem expense
+
+A per diem (also called “per diem allowance” or “daily allowance”) is a fixed daily payment provided by an employer to cover expenses during business or work-related travel. These allowances simplify travel expense tracking and reimbursement for meals, lodging, and incidental expenses.
+
+{% include info.html %}
+Before you can add a per diem expense, a Workspace Admin must [enable per diem expenses](https://help.expensify.com/articles/expensify-classic/workspaces/Enable-per-diem-expenses) for the workspace and add the per diem rates. If you do not see an option for per diem rates, it is currently unavailable for your workspace, and you’ll need to reach out to one of your Workspace Admins for guidance.
+{% include end-info.html %}
+
+To add a per diem expense,
+
+1. Click the **Expenses** tab.
+2. Click **New Expense** and choose **Per Diem**.
+3. Select your travel destination.
+ - If your trip involves multiple stops, create a separate per diem expense for each destination.
+4. Select the start date, end date, start time, and end time for the trip.
+5. Select a sub-rate. The available sub-rates are dependent on the trip duration.
+ - You can include meal deductions or overnight lodging costs if allowed by your workspace.
+6. Enter any other required coding information, such as the category, description, or report, and click **Save**.
+
+# Add a mileage expense
+
+You can track your mileage-related expenses by logging your trips in Expensify. You have a couple of different options for logging distance:
+
+- Web app:
+ - **Manually create**: Manually enter the number of miles for the trip
+ - **Create from map**: Automatically determine the trip distance based on the start and end location.
+- Mobile app:
+ - **Manually create**: Manually enter the miles for the trip and your mileage rate
+ - **Odometer**: Enter your odometer reading before and after the trip
+ - **Start GPS**: Currently under development and unavailable for use.
+
+{% include info.html %}
+When adding a distance expense, the rates available are determined by the rates set in your [workspace rate settings](https://help.expensify.com/articles/expensify-classic/workspaces/Set-time-and-distance-rates). To update these rates or add a new rate, you must be a Workspace Admin.
+{% include end-info.html %}
{% include selector.html values="desktop, mobile" %}
{% include option.html value="desktop" %}
1. Click the **Expenses** tab.
-2. Click the + icon in the top right.
-3. Select the type of expense.
- - **Manually create**: Manually enter receipt details.
- - **Scan receipt**: Upload a saved image of a receipt.
- - **Create multiple**: Manually enter multiple expenses at once.
- - **Time**: Create an expense based on hours.
- - **Distance**: Create an expense based on distance.
- - Manually Create: Manually enter the distance details for the expense.
- - Create from Map: Enter the start and end destination and Expensify will help you create a receipt for the trip.
-4. Click **Save**.
+2. Click **New Expense**.
+3. Select the expense type.
+ - **Manually create**:
+ - Enter the number of miles for the trip.
+ - Select your rate.
+ - If desired, select the category, add a description, or select a report to add the expense to.
+ - Click **Save**.
+ - **Create from map**:
+ - Add your start location as point A.
+ - Add your end location as point B.
+ - If applicable, click **Add Destination** to add additional stops.
+ - To generate a map receipt, leave the Create Receipt checkbox selected.
+ - Click **Save**.
+ - Select your rate.
+ - If desired, select the category, add a description, or select a report to add the expense to.
+ - Click **Save**.
+
{% include end-option.html %}
{% include option.html value="mobile" %}
-1. Tap the ☰ menu icon in the top left.
-2. Tap **Expenses**.
-3. Tap the + icon in the top right.
-4. Tap the correct expense type and enter the expense details.
- - **Manually create**: Manually enter receipt details.
- - **Time**: Enter work time and rate.
- - **Manually create (Distance)**: Manually enter trip details by total distance.
- - **Odometer**: Manually enter trip details by start and end odometer readings.
- - **Start GPS**: Track distance while using the Expensify app to automatically calculate the distance in real time during the trip.
-5. Tap **Save**.
+1. Click the + icon in the top right corner.
+2. Under the Distance section, select the expense type.
+ - **Manually create**:
+ - Enter your mileage.
+ - Select your rate.
+ - If desired, click **More Options** to select the category, add a description, or select a report to add the expense to.
+ - Click **Save**.
+ - **Odometer**:
+ - Enter your vehicle’s odometer reading before the trip.
+ - Enter your vehicle’s odometer reading after the trip.
+ - Select your rate.
+ - If desired, click **More Options** to select the category, add a description, or select a report to add the expense to.
+ - Click **Save**.
{% include end-option.html %}
{% include end-selector.html %}
+# Add a group expense
+
+Capture group and event expenses with Attendee Tracking by documenting who attended and the cost per attendee. The amount is always divided evenly between all attendees—different amounts cannot be allocated to specific attendees. To divide the amounts differently, you’ll first have to split the expense.
+
{% include info.html %}
-If you are an employee under a company workspace, you may not see all of the different expense type options depending on your company’s workspace settings.
+Attendees added to an expense will not be notified that they were added to an expense, nor will they share in the expense or be requested to pay for any portion of the expense.
{% include end-info.html %}
-# FAQs
+{% include selector.html values="desktop, mobile" %}
+
+{% include option.html value="desktop" %}
+1. Click the **Expenses** tab.
+2. Click the expense you want to add attendees to.
+3. Click the attendees field and enter the name or email address of the attendee.
+ - If the attendee is a member of your workspace, you can select their name from the list.
+ - If the attendee is not a member of your workspace, enter their full name or email address and press Enter on your keyboard to add them as a new attendee.
+4. Click **Save**.
+
+Once added, you’ll also see the list of attendees in the expense overview on the Expenses tab. To see the cost per employee, hover over the receipt total. These details are also available on any report that you add the expense to.
+{% include end-option.html %}
+
+{% include option.html value="mobile" %}
+1. Tap the **Expenses** tab.
+2. Tap the expense you want to add attendees to.
+3. Scroll down to the bottom and tap **More Options**.
+4. Tap the attendees field and enter the name or email address of the attendee.
+ - If the attendee is a member of your workspace, you can select their name from the list.
+ - If the attendee is not a member of your workspace, enter their full name or email address and press Enter on your keyboard to add them as a new attendee.
+5. Tap **Save**.
+
+Attendees will also be listed on any report that you add the expense to.
+
+{% include end-option.html %}
+
+{% include end-selector.html %}
+
+# Add expenses in bulk
+
+You can upload bulk receipt images or add receipt details in bulk.
+
+## SmartScan receipt images in bulk
+
+{% include selector.html values="desktop, mobile" %}
+
+{% include option.html value="desktop" %}
+1. Click the **Expenses** tab.
+2. Drag and drop up to 10 images or PDF receipts at once from your computer’s files. You can drop them anywhere on the Expense page where you see a green plus icon next to your mouse cursor.
+{% include end-option.html %}
+
+{% include option.html value="mobile" %}
+1. Open the mobile app and tap the camera icon in the bottom right corner.
+2. Tap the camera icon in the right corner to select the Rapid Fire mode.
+3. Take a clear photo of each receipt.
+4. When all receipts are captured, tap the X in the left corner to close the camera.
+{% include end-option.html %}
+
+{% include end-selector.html %}
+
+## Manually add receipt details in bulk
+
+*Note: This process is currently not available from the mobile app and must be completed from the Expensify website.*
+
+1. Click the **Expenses** tab.
+2. Click **New Expense** and select **Create Multiple**.
+3. Enter the expense details for up to 10 expenses and click **Save**.
+
+## Upload personal expenses via CSV, XLS, etc.
+
+*Note: This process is currently not available from the mobile app and must be completed from the Expensify website.*
+
+1. Hover over Settings, then click **Account**.
+2. Click the **Credit Card Import** tab.
+3. Under Personal Cards, click **Import Transactions from File**.
+4. Click **Upload** and select a .csv, .xls, .ofx, or a .qfx file.
+
+{% include faq-begin.md %}
**What’s the difference between a reimbursable and non-reimbursable expense?**
-- Reimbursable expenses are things that you pay for with your own money that the company has agreed to pay you back for (like business travel paid for with personal funds).
-- Non-reimbursable expenses are things you pay for with company money that need to be documented for accounting purposes (like a lunch paid for with a company card).
+- **Reimbursable expenses**: Expenses that the company has agreed to pay you back for. This may include:
+ - Cash & personal card: Expenses paid for by the employee on behalf of the business.
+ - Per diem: Expenses for a daily or partial daily rate [configured in your Workspace](https://help.expensify.com/articles/expensify-classic/workspaces/Enable-per-diem-expenses).
+ - Time: An hourly rate for your employees or jobs as [set for your workspace](https://help.expensify.com/articles/expensify-classic/workspaces/Set-time-and-distance-rates). This expense type is usually used by contractors or small businesses billing the customer via [Expensify Invoicing](https://help.expensify.com/articles/expensify-classic/workspaces/Set-Up-Invoicing).
+ - Distance: Expenses related to business travel.
+- **Non-reimbursable expenses**: Expenses are things you pay for with company money that need to be documented for accounting purposes (like a lunch paid for with a company card).
+- **Billable expenses**: Business or employee expenses that must be billed to a specific client or vendor. This option is for tracking expenses for invoicing to customers, clients, or other departments. Any kind of expense can be billable, in _addition_ to being either reimbursable or non-reimbursable.
+
+You can also see a breakdown of these expense types on your report and can even organize the report by them.
{% include info.html %}
If you are an employee under a company workspace, your expenses may automatically be configured as reimbursable or non-reimbursable depending on the details that are entered. If an expense is incorrectly labeled, you must reach out to an admin to have it corrected.
{% include end-info.html %}
-
+**Why don't I see the option for one of these types of expenses?**
+
+If you are an employee under a company workspace, you may not see all of the different expense type options depending on your company’s workspace settings.
+
+**How do I edit my per diem expenses?**
+
+Per diem expenses cannot be amended. To make changes, you must delete the expense and recreate it.
+
+{% include faq-end.md %}
diff --git a/docs/articles/expensify-classic/expenses/Add-expenses-in-bulk.md b/docs/articles/expensify-classic/expenses/Add-expenses-in-bulk.md
deleted file mode 100644
index 6ee84e1ead15..000000000000
--- a/docs/articles/expensify-classic/expenses/Add-expenses-in-bulk.md
+++ /dev/null
@@ -1,44 +0,0 @@
----
-title: Add expenses in bulk
-description: Add multiple expenses at one time
----
-
-
-You can upload bulk receipt images or add receipt details in bulk.
-
-# SmartScan receipt images in bulk
-
-{% include selector.html values="desktop, mobile" %}
-
-{% include option.html value="desktop" %}
-1. Click the **Expenses** tab.
-2. Drag and drop up to 10 images or PDF receipts at once from your computer’s files. You can drop them anywhere on the Expense page where you see a green plus icon next to your mouse cursor.
-{% include end-option.html %}
-
-{% include option.html value="mobile" %}
-1. Open the mobile app and tap the camera icon in the bottom right corner.
-2. Tap the camera icon in the right corner to select the Rapid Fire mode.
-3. Take a clear photo of each receipt.
-4. When all receipts are captured, tap the X in the left corner to close the camera.
-{% include end-option.html %}
-
-{% include end-selector.html %}
-
-# Manually add receipt details in bulk
-
-*Note: This process is currently not available from the mobile app and must be completed from the Expensify website.*
-
-1. Click the **Expenses** tab.
-2. Click **New Expense** and select **Create Multiple**.
-3. Enter the expense details for up to 10 expenses and click **Save**.
-
-# Upload personal expenses via CSV, XLS, etc.
-
-*Note: This process is currently not available from the mobile app and must be completed from the Expensify website.*
-
-1. Hover over Settings, then click **Account**.
-2. Click the **Credit Card Import** tab.
-3. Under Personal Cards, click **Import Transactions from File**.
-4. Click **Upload** and select a .csv, .xls, .ofx, or a .qfx file.
-
-
diff --git a/docs/articles/expensify-classic/expenses/Send-and-Receive-Payment-for-Invoices.md b/docs/articles/expensify-classic/expenses/Send-and-Receive-Payment-for-Invoices.md
index c2ebb64b0af6..fde2c43e9d95 100644
--- a/docs/articles/expensify-classic/expenses/Send-and-Receive-Payment-for-Invoices.md
+++ b/docs/articles/expensify-classic/expenses/Send-and-Receive-Payment-for-Invoices.md
@@ -11,9 +11,18 @@ Invoices can be sent to anyone with or without an Expensify account and paid dir
1. Sign in to your [Expensify web account](www.expensify.com)
2. Customize your company invoices following the steps in this [help article](https://help.expensify.com/articles/expensify-classic/workspaces/Set-Up-Invoicing). (Optional)
3. From the **Reports** page, click the drop-down and select **Invoice**.
-4. Upload a PDF/image of the invoice.
-5. Add applicable tags and categories based on your workspace settings.
-6. Click **Send**.
+4. Click **Add Expense** to upload an invoice or drag and drop the invoice as a pdf into the report to start the SmartScan process.
+5. Once the SmartScan process is complete, the invoice PDF will be added as a receipt to the expense
+6. Add applicable tags and categories based on your workspace settings.
+7. Click **Send**
+8. Enter the recipient's email address
+9. Add a memo, due date, attach a PDF of the invoice (Optional)
+10. Click **Send**
+11. The recipient will receive an email about the invoice and can pay through Expensify following these [steps](https://help.expensify.com/articles/expensify-classic/bank-accounts-and-payments/payments/Pay-an-Invoice).
+
+{:width="100%"}
+
+{:width="100%"}
## How to Receive an Invoice Payment in Expensify
diff --git a/docs/articles/expensify-classic/expenses/Track-group-expenses.md b/docs/articles/expensify-classic/expenses/Track-group-expenses.md
deleted file mode 100644
index 82921b0e8cd3..000000000000
--- a/docs/articles/expensify-classic/expenses/Track-group-expenses.md
+++ /dev/null
@@ -1,41 +0,0 @@
----
-title: Track group expenses
-description: Use Attendee Tracking to track group expenses
----
-
-
-Capture group and event expenses with Attendee Tracking by documenting who attended and the cost per attendee. The amount is always divided evenly between all attendees—different amounts cannot be allocated to specific attendees. To divide the amounts differently, you’ll first have to split the expense.
-
-{% include info.html %}
-Attendees added to an expense will not be notified that they were added to an expense, nor will they share in the expense or be requested to pay for any portion of the expense.
-{% include end-info.html %}
-
-{% include selector.html values="desktop, mobile" %}
-
-{% include option.html value="desktop" %}
-1. Click the **Expenses** tab.
-2. Click the expense you want to add attendees to.
-3. Click the attendees field and enter the name or email address of the attendee.
- - If the attendee is a member of your workspace, you can select their name from the list.
- - If the attendee is not a member of your workspace, enter their full name or email address and press Enter on your keyboard to add them as a new attendee.
-4. Click **Save**.
-
-Once added, you’ll also see the list of attendees in the expense overview on the Expenses tab. To see the cost per employee, hover over the receipt total. These details are also available on any report that you add the expense to.
-{% include end-option.html %}
-
-{% include option.html value="mobile" %}
-1. Tap the **Expenses** tab.
-2. Tap the expense you want to add attendees to.
-3. Scroll down to the bottom and tap **More Options**.
-4. Tap the attendees field and enter the name or email address of the attendee.
- - If the attendee is a member of your workspace, you can select their name from the list.
- - If the attendee is not a member of your workspace, enter their full name or email address and press Enter on your keyboard to add them as a new attendee.
-5. Tap **Save**.
-
-Attendees will also be listed on any report that you add the expense to.
-
-{% include end-option.html %}
-
-{% include end-selector.html %}
-
-
-
-You can track your mileage-related expenses by logging your trips in Expensify. You have a couple of different options for logging distance:
-
-- Web app:
- - **Manually create**: Manually enter the number of miles for the trip
- - **Create from map**: Automatically determine the trip distance based on the start and end location.
-- Mobile app:
- - **Manually create**: Manually enter the miles for the trip and your mileage rate
- - **Odometer**: Enter your odometer reading before and after the trip
- - **Start GPS**: Currently under development and unavailable for use.
-
-{% include info.html %}
-When adding a distance expense, the rates available are determined by the rates set in your workspace rate settings. To update these rates or add a new rate, you must be a Workspace Admin.
-{% include end-info.html %}
-
-{% include selector.html values="desktop, mobile" %}
-
-{% include option.html value="desktop" %}
-
-1. Click the **Expenses** tab.
-2. Click **New Expense**.
-3. Select the expense type.
- - **Manually create**:
- - Enter the number of miles for the trip.
- - Select your rate.
- - If desired, select the category, add a description, or select a report to add the expense to.
- - Click **Save**.
- - **Create from map**:
- - Add your start location as point A.
- - Add your end location as point B.
- - If applicable, click **Add Destination** to add additional stops.
- - To generate a map receipt, leave the Create Receipt checkbox selected.
- - Click **Save**.
- - Select your rate.
- - If desired, select the category, add a description, or select a report to add the expense to.
- - Click **Save**.
-
-{% include end-option.html %}
-
-{% include option.html value="mobile" %}
-
-1. Click the + icon in the top right corner.
-2. Under the Distance section, select the expense type.
- - **Manually create**:
- - Enter your mileage.
- - Select your rate.
- - If desired, click **More Options** to select the category, add a description, or select a report to add the expense to.
- - Click **Save**.
- - **Odometer**:
- - Enter your vehicle’s odometer reading before the trip.
- - Enter your vehicle’s odometer reading after the trip.
- - Select your rate.
- - If desired, click **More Options** to select the category, add a description, or select a report to add the expense to.
- - Click **Save**.
-{% include end-option.html %}
-
-{% include end-selector.html %}
-
-
-
diff --git a/docs/articles/expensify-classic/expenses/Track-per-diem-expenses.md b/docs/articles/expensify-classic/expenses/Track-per-diem-expenses.md
deleted file mode 100644
index 88dd91997592..000000000000
--- a/docs/articles/expensify-classic/expenses/Track-per-diem-expenses.md
+++ /dev/null
@@ -1,34 +0,0 @@
----
-title: Track per diem expenses
-description: Add daily allowance expenses for business travel
----
-
-
-A per diem (also called “per diem allowance” or “daily allowance”) is a fixed daily payment provided by an employer to cover expenses during business or work-related travel. These allowances simplify travel expense tracking and reimbursement for meals, lodging, and incidental expenses.
-
-{% include info.html %}
-Before you can add a per diem expense, a Workspace Admin must enable per diem expenses for the workspace and add the per diem rates. If you do not see an option for per diem rates, it is currently unavailable for your workspace, and you’ll need to reach out to one of your Workspace Admins for guidance.
-{% include end-info.html %}
-
-To add a per diem expense,
-
-1. Click the **Expenses** tab.
-2. Click **New Expense** and choose **Per Diem**.
-3. Select your travel destination.
- - If your trip involves multiple stops, create a separate per diem expense for each destination.
-4. Select the start date, end date, start time, and end time for the trip.
-5. Select a sub-rate. The available sub-rates are dependent on the trip duration.
- - You can include meal deductions or overnight lodging costs if allowed by your workspace.
-6. Enter any other required coding information, such as the category, description, or report, and click **Save**.
-
-# FAQs
-
-**How do I edit my per diem expenses?**
-
-Per diem expenses cannot be amended. To make changes, you must delete the expense and recreate it.
-
-**What if my admin requires daily per diem submissions?**
-
-No problem! Create a separate per diem expense for each day of your trip.
-
-
diff --git a/docs/articles/expensify-classic/expensify-billing/Change-Plan-Or-Subscription.md b/docs/articles/expensify-classic/expensify-billing/Change-Plan-Or-Subscription.md
index 1e631a53b0b3..b245a26d10a0 100644
--- a/docs/articles/expensify-classic/expensify-billing/Change-Plan-Or-Subscription.md
+++ b/docs/articles/expensify-classic/expensify-billing/Change-Plan-Or-Subscription.md
@@ -50,7 +50,7 @@ If Auto Renew is disabled then the last bill at the annual rate will be issued o
# How to downgrade to a free account from an Individual Plan
## Web
1. Log in to your account through a web browser.
-1. Go to **Settings > Policies > Individual > Subscription**.
+1. Go to **Settings > Workspaces > Individual > Subscription**.
1. Click "Cancel Subscription" to end your Monthly Subscription.
Note: Your subscription is a pre-purchase for 30 days of unlimited SmartScanning. This means that when you cancel, you do not get a refund and instead get to use the remainder of the month of unlimited SmartScanning you purchased.
diff --git a/docs/articles/expensify-classic/expensify-card/Request-the-Card.md b/docs/articles/expensify-classic/expensify-card/Request-the-Card.md
index 1f412665fc2f..1272cbd1f117 100644
--- a/docs/articles/expensify-classic/expensify-card/Request-the-Card.md
+++ b/docs/articles/expensify-classic/expensify-card/Request-the-Card.md
@@ -2,6 +2,11 @@
title: Request the Card
description: Details on requesting the Expensify Card as an employee
---
+_Note: The Expensify Card is currently only available to companies that have:_
+_- A US Bank Account_
+_- US documentation_
+_- A private email domain i.e. we cannot provision Expensify cards for users with gmail.com, hotmail.com, yahoo.com etc_
+
To start using the Expensify Card, do the following:
1. **Enable Expensify Cards:** An admin must first enable the cards. Then, an admin can assign you a card by setting a limit, which allows access to the card.
2. **Request the Card:**
diff --git a/docs/articles/expensify-classic/settings/Set-Notifications.md b/docs/articles/expensify-classic/settings/Set-Notifications.md
index 0e18d6f22cf5..da55dafb833c 100644
--- a/docs/articles/expensify-classic/settings/Set-Notifications.md
+++ b/docs/articles/expensify-classic/settings/Set-Notifications.md
@@ -4,72 +4,66 @@ description: This article is about how to troubleshoot notifications from Expens
---
# Overview
-Sometimes, members may have trouble receiving important email notifications from Expensify, such as Expensify Magic Code emails, account validation emails, secondary login validations, integration emails, or report action notifications (rejections, approvals, etc.).
-
-# Here's how to troubleshoot missing Expensify notifications:
-
-1. **No error message, but the email is never received**
-The email might be delayed; give it 30-60 minutes to arrive in your inbox.
-Check **Email Preferences** on the web via **Settings > Your Account > Preferences**In the **Contact Preferences** section. Ensure that the relevant boxes are checked for the email type you're missing. Check your email spam and trash folders, as Expensify messages might end up there inadvertently.
-Check to make sure you haven't unintentionally blocked Expensify emails and whitelist [expensify.com](https://community.expensify.com/home/leaving?allowTrusted=1&target=http%3A%2F%2Fexpensify.com%2F), mg.expensify.com, and [amazonSES.com](https://community.expensify.com/home/leaving?allowTrusted=1&target=http%3A%2F%2Famazonses.com%2F) with your email provider.
-
-2. **A "We're having trouble emailing you" banner at the top of your screen**
-Verify that your email address in your account settings is correct and is a real deliverable email address.
-Re-send Verification Email: Look for an option to re-send a verification email, usually provided when this banner appears.
-
-{:width="100%"}
-
-# Deep Dive
+Sometimes members may have trouble receiving important email notifications from Expensify, such as Expensify Magic Code emails, account validation emails, secondary login validations, integration emails, or report action notifications (rejections, approvals, etc.).
+
+# Troubleshooting missing Expensify notifications
+
+## Issue: The email or notification is never received, and no message, banner, or additional context is provided
+Emails can sometimes be delayed and could take up to 30-60 minutes to arrive in your inbox. If you're expecting a notification that still hasn't arrived after waiting:
+ - Check your **Email Preferences** on the web via **Settings > Account > Preferences**. In the **Contact Preferences** section, ensure that the relevant boxes are checked for the email type you're missing.
+ - Check your email spam and trash folders, as Expensify messages might end up there inadvertently.
+ - Check to make sure you haven't unintentionally blocked Expensify emails. Allowlist the domain expensify.com with your email provider.
+
+## Issue: A banner that says “We’re having trouble emailing you” shows the top of your screen.
+Confirm the email address on your Expensify account is a deliverable email address, and then click the link in the banner that says "here". If successful, you will see a confirmation that your email was unblocked.
+
+ {:width="100%"}
+
+ **If unsuccessful, you will see another error:**
+ - If the new error or SMTP message includes a URL, navigate to that URL for further instructions.
+ - If the new error or SMTP message includes "mimecast.com", consult with your company's IT team.
+ - If the new error or SMTP message includes "blacklist", it means your company has configured their email servers to use a third-party email reputation or blocklisting service. Consult with your company's IT team.
+
+{:width="100%"}
-**For Private Domains**:
+# Further troubleshooting for public domains
-If your organization uses a private domain, consult your IT department or IT person to ensure that the following domains are whitelisted to receive our emails: expensify.com, mg.expensify.com, and amazonSES.com. These domains are the sources of various notification emails, so make sure they aren't being blocked.
+If you are still not receiving Expensify notifications and have an email address on a public domain such as gmail.com or yahoo.com, you may need to add Expensify's domain expensify.com to your email's allowlist by taking the following steps:
-**For Public Domains (e.g., Gmail, Yahoo, Hotmail)**:
+ - Search for messages from expensify.com in your spam folder, open them, and click “Not Spam” at the top of each message.
+ - Configure an email filter that identifies Expensify's email domain expensify.com and directs all incoming messages to your inbox, to avoid messages going to spam.
+ - Add specific known Expensify email addresses such as concierge@expensify.com to your email contacts list.
-To whitelist our emails on public email services:
+# Further troubleshooting for private domains
-1. Check your Spam Folder: Search for messages from expensify.com in your Spam folder, open them, and click "Not Spam" at the top of the message.
-2. Create a Filter: Set up a filter that identifies the entire expensify.com domain and directs all incoming messages to your inbox, preventing them from going to Spam.
-3. Add Specific Contacts: While optional, adding specific email addresses from Expensify as contacts can further prevent emails from going to Spam.
+If your organization uses a private domain, Expensify emails may be blocked at the server level. This can sometimes happen unexpectedly due to broader changes in email provider's handling or filtering of incoming messages. Consult your internal IT team to assist with the following:
-Please note that even if you receive emails from our Concierge support communication, ensure that both expensify.com and mg.expensify.com are whitelisted as they use different servers.
+ - Ensure that the domain expensify.com is allowlisted on domain email servers. This domains is the sources of various notification emails, so it's important it is allowlisted.
+ - Confirm there is no server-level email blocking and that spam filters are not blocking Expensify emails. Even if you have received messages from our Concierge support in the past, ensure that expensify.com is allowlisted.
-**Email Server Blocking**:
-Your email server may be blocking our emails due to spam filters or other services. Check with your IT department to investigate and resolve any server-level email blocking issues.
+## Companies using Outlook
-**Mimecast**:
-If your company uses Mimecast, a service that can affect email deliverability, check with your IT department. If Mimecast is in use, reach out to us at concierge@expensify.com through a new email, as this should ensure delivery to your inbox. Mimecast should eventually recognize the Expensify domain, preventing future filtering.
+- Add Expensify to your personal Safe Senders list by following these steps: [Outlook email client](https://support.microsoft.com/en-us/office/add-recipients-of-my-email-messages-to-the-safe-senders-list-be1baea0-beab-4a30-b968-9004332336ce) / [Outlook.com](https://support.microsoft.com/en-us/office/safe-senders-in-outlook-com-470d4ee6-e3b6-402b-8cd9-a6f00eda7339)
+- **Company IT administrators:** Add Expensify to your domain's Safe Sender list by following the steps here: [Create safe sender lists in EOP](https://learn.microsoft.com/en-us/defender-office-365/create-safe-sender-lists-in-office-365)
+- **Company IT administrators:** Add expensify.com to the domain's explicit allowlist. You may need to contact Outlook support for specific instructions, as each company's setup varies.
+- **Company administrators:** Contact Outlook support to see if there are additional steps to take based on your domain's email configuration.
-**For Outlook Users**:
-For Outlook users specifically:
+## Companies using Google Workspaces:
-1. Click the gear icon in Outlook and select "View all Outlook settings."
-2. Choose "Mail" from the settings menu.
-3. Under the "Junk email" submenu, click "Add" under "Safe senders and domains."
-4. Enter the email address you want to whitelist.
-5. Click "Save."
+- **Company IT administrators:** Adjust your domain's email allowlist and safe senders lists to include expensify.com by following these steps: [Allowlists, denylists, and approved senders](https://support.google.com/a/answer/60752)
-When you click the "Settings" link in the banner in Expensify, you'll be directed to your account settings page, where you may encounter a few different scenarios:
+{% include faq-begin.md %}
-- "Temporarily Suspended Emails": If the message mentions "temporarily suspended emails to," follow the steps provided in the yellow box. This situation typically occurs when we can't find a valid inbox to send our emails to. Possible reasons include:
- - A misspelled email address during account creation.
- - Use of a distribution list email (acting as an "alias" email) without a linked inbox.
- - An auto-responder that has been responding to our emails for an extended period.
-- To resolve this issue, confirm that the email address is indeed associated with an active inbox. Then, click the link that says "here," and your email should be unblocked shortly.
-- SMTP Error (Gray Box): In some cases, you might encounter a gray box with an SMTP error message. This error can vary, but it typically looks something like this:
+## How can I be sure that emails from Expensify are legitimate and not spam?
-{:width="100%"}
+Expensify's emails are SPF and DKIM-signed, meaning they are cryptographically signed and encrypted to prevent spoofing.
-**These look a bit cryptic, yes, but hang in there!**
+## Why do legitimate emails from Expensify sometimes end up marked as spam?
-The error messages you see are the raw message text received from your email provider's server to Amazon. These messages can vary in text, but the best course of action is to follow the link provided (by copying and pasting) in the text for the next steps.
+The problem typically arises when our domain or one of our sending IP addresses gets erroneously flagged by a 3rd party domain or IP reputation services. Many IT departments use lists published by such services to filter email for the entire company.
-**Scenario 1**: If the message in the gray box includes "mimecast.com": It means that our emails are being blocked by the server. In this case, you should contact your IT person or team to address the issue.
+## What is the best way to ensure emails are not accidentally marked as Spam?
-**Scenario 2**: If the message in the gray box mentions "blacklist at org/.com/.net," or resembles the screenshot provided, it indicates that your IT team has configured your email to use a third-party email reputation or blacklisting service. Here's what you need to know:
-- All our emails are SPF and DKIM-signed, meaning they are cryptographically signed as coming from us and are not spam.
-- The problem arises because we send mail from a cloud-based service. This means that the sender's IP serves multiple vendors, including Expensify. If one of those vendors is marked as spam, it can block all messages from that IP, even if they're from different vendors (including us).
-- The better approach is for the server to flag spam via DKIM and SPF (rather than solely relying on the sender's IP address), as our messages are correctly signed and encrypted to prevent spoofing.
+For server-level spam detection, the safest approach to allowlisting email from Expensify is to verify DKIM and SPF, rather than solely relying on the third-party reputation of the sending IP address.
-To resolve these issues, consider discussing them with your IT team, as they can help implement the necessary changes to ensure you receive our emails without interruption.
+{% include faq-end.md %}
diff --git a/docs/articles/expensify-classic/workspaces/Personal-and-Corporate-Karma.md b/docs/articles/expensify-classic/workspaces/Personal-and-Corporate-Karma.md
index 5c146b279163..ca6d9cf52f47 100644
--- a/docs/articles/expensify-classic/workspaces/Personal-and-Corporate-Karma.md
+++ b/docs/articles/expensify-classic/workspaces/Personal-and-Corporate-Karma.md
@@ -23,6 +23,16 @@ For every $500 of expenses added, you’ll donate $1 to a related Expensify.org
The fund from your Personal Karma is determined by the expense's MCC (Merchant Category Code). Each MCC supports one of Expensify.org's funds: Climate Justice, Food Security, Housing Equity, Reentry Services, and Youth Advocacy.
+## How do I opt-in to Personal Karma donations?
+
+You can enable Personal Karma donations from your personal workspace settings.
+
+- Sign in to your account at www.expensify.com.
+- Go to **Settings** > **Workspaces** > click on your **Individual** workspace settings.
+- Click Opt-in to Karma donations.
+
+{:width="100%"}
+
## What is Corporate Karma?
Corporate Karma is for companies that want to engage in social responsibility. Each month, the donation is calculated based on the total amount of all approved expense reports, including invoices, across all Workspace.
@@ -31,12 +41,12 @@ For every $500 your team spends monthly, your company will donate $1 to a relate
The fund to which your Corporate Karma goes is determined by the expense's MCC (Merchant Category Code). Each MCC supports one of Expensify.org's funds: Climate Justice, Food Security, Housing Equity, Reentry Services, and Youth Advocacy.
-{% include faq-begin.md %}
-
-**How do I opt-in to Personal or Corporate Karma donations?**
+## How do I opt-in to Corporate Karma donations?
-You can donate Personal and Corporate Karma to Expensify.org in your company or personal workspace settings.
+As a [workspace billing owner](https://help.expensify.com/articles/expensify-classic/workspaces/Assign-billing-owner-and-payment-account), you can enable Corporate Karma from the group workspace settings.
-Go to **Settings** > **Workspaces** > click on your Individual or Group workspace settings and Opt-in to Karma donations.
+- Sign in to your account at www.expensify.com.
+- Go to **Settings** > **Workspaces** > **Subscription**.
+- Toggle on Karma donations.
-{% include faq-end.md %}
+{:width="100%"}
diff --git a/docs/articles/new-expensify/billing-and-subscriptions/Billing-page-coming-soon.md b/docs/articles/new-expensify/billing-and-subscriptions/Billing-page-coming-soon.md
deleted file mode 100644
index 2ae2fcd2426d..000000000000
--- a/docs/articles/new-expensify/billing-and-subscriptions/Billing-page-coming-soon.md
+++ /dev/null
@@ -1,6 +0,0 @@
----
-title: Billing and Subscriptions
-description: Coming soon
----
-
-# Coming Soon
diff --git a/docs/articles/new-expensify/billing-and-subscriptions/Billing-page.md b/docs/articles/new-expensify/billing-and-subscriptions/Billing-page.md
new file mode 100644
index 000000000000..f945840d65da
--- /dev/null
+++ b/docs/articles/new-expensify/billing-and-subscriptions/Billing-page.md
@@ -0,0 +1,6 @@
+---
+title: Billing and Subscriptions
+description: An overview of how billing works in Expensify.
+---
+
+# Coming Soon
diff --git a/docs/articles/new-expensify/connections/quickbooks-online/Connect-to-QuickBooks-Online.md b/docs/articles/new-expensify/connections/quickbooks-online/Connect-to-QuickBooks-Online.md
index 60fdbe94b33b..192f7bf172b6 100644
--- a/docs/articles/new-expensify/connections/quickbooks-online/Connect-to-QuickBooks-Online.md
+++ b/docs/articles/new-expensify/connections/quickbooks-online/Connect-to-QuickBooks-Online.md
@@ -56,73 +56,6 @@ Log in to QuickBooks Online and ensure all of your employees are setup as either
{:width="100%"}
-
-
-# Step 3: Configure import settings
-
-The following steps help you determine how data will be imported from QuickBooks Online to Expensify.
-
-
-
Under the Accounting settings for your workspace, click Import under the QuickBooks Online connection.
-
Review each of the following import settings:
-
-
Chart of accounts: The chart of accounts are automatically imported from QuickBooks Online as categories. This cannot be amended.
-
Classes: Choose whether to import classes, which will be shown in Expensify as tags for expense-level coding.
-
Customers/projects: Choose whether to import customers/projects, which will be shown in Expensify as tags for expense-level coding.
-
Locations: Choose whether to import locations, which will be shown in Expensify as tags for expense-level coding.
-{% include info.html %}
-As Locations are only configurable as tags, you cannot export expense reports as vendor bills or checks to QuickBooks Online. To unlock these export options, either disable locations import or upgrade to the Control Plan to export locations encoded as a report field.
-{% include end-info.html %}
-
Taxes: Choose whether to import tax rates and defaults.
-
-
-
-# Step 4: Configure export settings
-
-The following steps help you determine how data will be exported from Expensify to QuickBooks Online.
-
-
-
Under the Accounting settings for your workspace, click Export under the QuickBooks Online connection.
-
Review each of the following export settings:
-
-
Preferred Exporter: Choose whether to assign a Workspace Admin as the Preferred Exporter. Once selected, the Preferred Exporter automatically receives reports for export in their account to help automate the exporting process.
-
-{% include info.html %}
-* Other Workspace Admins will still be able to export to QuickBooks Online.
-* If you set different export accounts for individual company cards under your domain settings, then your Preferred Exporter must be a Domain Admin.
-{% include end-info.html %}
-
-
Date: Choose whether to use the date of last expense, export date, or submitted date.
-
Export Out-of-Pocket Expenses as: Select whether out-of-pocket expenses will be exported as a check, journal entry, or vendor bill.
-
-{% include info.html %}
-These settings may vary based on whether tax is enabled for your workspace.
-* If tax is not enabled on the workspace, you’ll also select the Accounts Payable/AP.
-* If tax is enabled on the workspace, journal entry will not be available as an option. If you select the journal entries option first and later enable tax on the workspace, you will see a red dot and an error message under the “Export Out-of-Pocket Expenses as” options. To resolve this error, you must change your export option to vendor bill or check to successfully code and export expense reports.
-{% include end-info.html %}
-
-
Invoices: Select the QuickBooks Online invoice account that invoices will be exported to.
-
Export as: Select whether company cards export to QuickBooks Online as a credit card (the default), debit card, or vendor bill. Then select the account they will export to.
-
If you select vendor bill, you’ll also select the accounts payable account that vendor bills will be created from, as well as whether to set a default vendor for credit card transactions upon export. If this option is enabled, you will select the vendor that all credit card transactions will be applied to.
-
-
-
-# Step 5: Configure advanced settings
-
-The following steps help you determine the advanced settings for your connection, like auto-sync and employee invitation settings.
-
-
-
Under the Accounting settings for your workspace, click Advanced under the QuickBooks Online connection.
-
Select an option for each of the following settings:
-
-
Auto-sync: Choose whether to enable QuickBooks Online to automatically communicate changes with Expensify to ensure that the data shared between the two systems is up-to-date. New report approvals/reimbursements will be synced during the next auto-sync period.
-
Invite Employees: Choose whether to enable Expensify to import employee records from QuickBooks Online and invite them to this workspace.
-
Automatically Create Entities: Choose whether to enable Expensify to automatically create vendors and customers in QuickBooks Online if a matching vendor or customer does not exist.
-
Sync Reimbursed Reports: Choose whether to enable report syncing for reimbursed expenses. If enabled, all reports that are marked as Paid in QuickBooks Online will also show in Expensify as Paid. If enabled, you must also select the QuickBooks Online account that reimbursements are coming out of, and Expensify will automatically create the payment in QuickBooks Online.
-
Invoice Collection Account: Select the invoice collection account that you want invoices to appear under once the invoice is marked as paid.
-
-
-
{% include faq-begin.md %}
**Why do I see a red dot next to my connection?**
diff --git a/docs/articles/new-expensify/connections/xero/Configure-Xero.md b/docs/articles/new-expensify/connections/xero/Configure-Xero.md
index 218e81c98707..b417d6169a1e 100644
--- a/docs/articles/new-expensify/connections/xero/Configure-Xero.md
+++ b/docs/articles/new-expensify/connections/xero/Configure-Xero.md
@@ -1,11 +1,75 @@
---
title: Configure Xero
-description: Coming soon
+description: How to configure your settings for Xero
---
+
+To configure your Xero settings, complete the steps below.
-# FAQ
+# Step 1: Configure import settings
-## How do I know if a report successfully exported to Xero?
+The following steps help you determine how data will be imported from Xero to Expensify.
+
+
+
Under the Accounting settings for your workspace, click Import under the Xero connection.
+
Select an option for each of the following settings to determine what information will be imported from Xero into Expensify:
+
+
Xero organization: Select which Xero organization your Expensify workspace is connected to. Each organization can only be connected to one workspace at a time.
+
Chart of Accounts: Your Xero chart of accounts and any accounts marked as “Show In Expense Claims” will be automatically imported into Expensify as Categories. This cannot be amended.
+
Tracking Categories: Choose whether to import your Xero categories for cost centers and regions as tags in Expensify.
+
Re-bill Customers: When enabled, Xero customer contacts are imported into Expensify as tags for expense tracking. After exporting to Xero, tagged billable expenses can be included on a sales invoice to your customer.
+
Taxes: Choose whether to import tax rates and tax defaults from Xero.
+
+
+
+# Step 2: Configure export settings
+The following steps help you determine how data will be exported from Expensify to Xero.
+
+
+
Under the Accounting settings for your workspace, click Export under the Xero connection.
+
Review each of the following export settings:
+
+
Preferred Exporter: Choose whether to assign a Workspace Admin as the Preferred Exporter. Once selected, the Preferred Exporter automatically receives reports for export in their account to help automate the exporting process.
+
+
+{% include info.html %}
+- Other Workspace Admins will still be able to export to Xero.
+- If you set different export accounts for individual company cards under your domain settings, then your Preferred Exporter must be a Domain Admin.
+{% include end-info.html %}
+
+
+
+
Export Out-of-Pocket Expenses as: All out-of-pocket expenses will be exported as purchase bills. This cannot be amended.
+
Purchase Bill Date: Choose whether to use the date of the last expense, export date, or submitted date.
+
Export invoices as: All invoices exported to Xero will be as sales invoices. This cannot be amended.
+
Export company card expenses as: All company card expenses are exported to Xero as bank transactions. This cannot be amended.
+
Xero Bank Account: Select which bank account will be used to post bank transactions when non-reimbursable expenses are exported.
+
+
+
+# Step 3: Configure advanced settings
+
+The following steps help you determine the advanced settings for your connection, like auto-sync.
+
+
+
Under the Accounting settings for your workspace, click Advanced under the Xero connection.
+
Select an option for each of the following settings:
+
+
Auto-sync: Choose whether to enable Xero to automatically communicate changes with Expensify to ensure that the data shared between the two systems is up-to-date. New report approvals/reimbursements will be synced during the next auto-sync period. Once you’ve added a business bank account for ACH reimbursement, any reimbursable expenses will be sent to Xero automatically when the report is reimbursed. For non-reimbursable reports, Expensify automatically queues the report to export to Xero after it has completed the approval workflow in Expensify.
+
Set Purchase Bill Status: Choose the status of your purchase bills:
+
+
Draft
+
Awaiting Approval
+
Awaiting Payment
+
+
Sync Reimbursed Reports: Choose whether to enable report syncing for reimbursed expenses. If enabled, all reports that are marked as Paid in Xero will also show in Expensify as Paid. If enabled, you must also select the Xero account that reimbursements are coming out of, and Expensify will automatically create the payment in Xero.
+
Xero Bill Payment Account: If you enable Sync Reimbursed Reports, you must select the Xero Bill Payment account your reimbursements will come from.
+
Xero Invoice Collections Account: If you are exporting invoices from Expensify, select the invoice collection account that you want invoices to appear under once they are marked as paid.
+
+
+
+{% include faq-begin.md %}
+
+## How do I know if a report is successfully exported to Xero?
When a report exports successfully, a message is posted in the related Expensify Chat room.
@@ -23,3 +87,5 @@ When an admin manually exports a report, Expensify will warn them if the report
- If a report has been exported and reimbursed via ACH, it will be automatically marked as paid in Xero during the next sync.
- If a report has been exported and marked as paid in Xero, it will be automatically marked as reimbursed in Expensify during the next sync.
- If a report has not yet been exported to Xero, it won’t be automatically exported.
+
+{% include faq-end.md %}
diff --git a/docs/articles/new-expensify/expenses-&-payments/Approve-and-pay-expenses.md b/docs/articles/new-expensify/expenses-&-payments/Approve-and-pay-expenses.md
deleted file mode 100644
index 26634d9a33df..000000000000
--- a/docs/articles/new-expensify/expenses-&-payments/Approve-and-pay-expenses.md
+++ /dev/null
@@ -1,109 +0,0 @@
----
-title: Approve and Pay Expenses
-description: Approve, hold, or pay expenses submitted to you
----
-
-
-As a workspace admin, you can set an approval workflow for the expenses submitted to you. Expenses can be,
-
-- Instantly submitted without needing approval.
-- Submitted at a desired frequency (daily, weekly, monthly) and follow an approval workflow.
-
-**Setting approval workflow and submission frequencies**
-
-Approval workflow settings and submission frequencies can be set in the Workflow settings of your workspace.
-
-# Manually approve expense
-
-When someone sends an expense or a group of expenses to you for approval, you’ll receive the expense in Expensify Chat for the related workspace. Chats with new updates appear with a green dot to the right of the chat message. Concierge also sends you an email notification for the new expense.
-
-{% include info.html %}
-If an expense is sent to you by a friend, you will not need to approve the expense. Instead, you can immediately pay the expense when you are ready.
-{% include end-info.html %}
-
-# Approve expenses
-
-To approve an expense,
-
-1. Open the Expensify Chat thread for the expense.
-2. Click the expense or group of expenses.
-3. Review the expense details to ensure they are correct. Look at each receipt, the amount, the description, and any additional details.
-4. Determine the next steps.
- - **Approve**: When you’re satisfied with the expense, click **Approve**.
- - **Handle holds**: If any of the expenses are on hold, you can choose to either approve only the expenses that are not on hold or approve the full amount, including any held expenses.
- - **Request changes**: You can add a comment to the expense’s chat thread in your Expensify Chat inbox to request changes to the expense details.
-
-{% include info.html %}
-If the transaction is pending (a common occurrence with recent company card expenses or SmartScan expenses), you’ll need to wait until the transaction posts before approving it.
-{% include end-info.html %}
-
-{:width="100%"}
-
-{:width="100%"}
-
-You’re now ready to pay the expense.
-
-# Hold an expense
-
-If you need to delay a payment or if you need more information on the expense before it can be approved, you can hold the expense.
-
-To hold an expense,
-
-1. Open the Expensify Chat thread for the expense.
-2. Click the expense or group of expenses.
-3. Click the three dot menu at the top right of the expense and select **Hold**.
-4. Enter a reason for the delay.
-5. Review the Hold Overview page and click **Got It**.
-
-When you’re ready, you can choose to:
-- **Remove the hold**: Complete the steps above and select **Unhold**.
-- **Approve the expense**: Complete the steps above for “Approve expenses.”
-Once the expense has been approved, you can now pay the expense.
-
-{% include info.html %}
-Held expenses will not be available for payment until they have been approved.
-{% include end-info.html %}
-
-# Unapprove an expense
-
-Some details of approved expenses and reports cannot be edited. If you need to edit an expense that has been approved, admins and the last approver have the option to unapprove reports.
-
-1. Click the workspace logo in the top left corner.
-2. Select the workspace associated with the expense report.
-3. Find the approved report by searching for the submitter.
-4. Click the dropdown arrow at the top of the report to view the report actions.
-5. Click **Unapprove**.
-
-The unapproved report will return to an editable state, and the submitter will receive an email and chat notification that the expense has been unapproved.
-
-{% include info.html %}
-Reports that have been paid cannot be unapproved. If the approved expense has already been exported to an accounting package, you’ll see a warning that unapproving an expense can cause data discrepancies and Expensify Card reconciliation issues. Ideally, you’ll want to delete the data that has already been exported to the accounting package before approving the expense again.
-{% include end-info.html %}
-
-# Pay expenses
-
-Once you’ve approved an expense—or if the expense does not require approval—you’ll be able to pay it.
-
-{% include info.html %}
-To pay expenses within Expensify, you’ll need to [set up your Expensify Wallet](https://help.expensify.com/articles/new-expensify/expenses-&-payments/Set-up-your-wallet).
-{% include end-info.html %}
-
-To pay an expense,
-
-1. Open the Expensify Chat thread for the expense.
-2. Click the expense or group of expenses.
-3. Select a payment option.
- - Click **Pay** to pay the full expense within Expensify. If the expenses contain one that has been held, the pay amount will only include the expenses that have not been held. Then you’ll select your payment method.
- - Click **Pay Elsewhere** to indicate that a payment has been sent using a method outside of Expensify, such as cash or a check. This will label the expense as Paid.
-
-# FAQ
-
-**Why was an expense automatically approved?**
-
-We refer to this as **Instant Submit**. If a workspace doesn’t have Delayed Submission enabled, an expense report will automatically be submitted.
-
-**Why is an employee expense showing as ‘pending?’**
-
-An Expensify Card expense will show as pending if the merchant hasn’t posted it. This is usually the case with hotel holds, or card rental holds. A hold will normally last no more than 7-10 business days unless it’s a hotel hold, which can last 31 days.
-
-
+
+Expenses can be created through manual entry, tracking distance, or scanning a receipt. They can be submitted to an individual or a workspace.
+
+This help article has more details about creating and submitting an expense to an individual or a workspace.
+
+# Receiving an expense from an Individual
+
+When an expense is submitted to an individual, it doesn’t need approval. It only needs to be paid.
+
+This help article has the steps to pay the expense.
+
+# Receiving a workspace expense
+
+When an expense is submitted to a workspace with an “approval workflow”, it must be approved before it can be paid.
+
+As a workspace admin, you can set an [approval workflow](https://help.expensify.com/articles/new-expensify/workspaces/Add-approvals) in the workspace settings. For each expense report, you’ll have the option to:
+
+- **Approve:** Click Approve if you’re satisfied with the expense details.
+- **Hold the expense:** If you need to delay a payment or provide more information before approval, you can hold an expense.
+- **Unapprove the expense:** You can return the expense to the submitter for revisions.
+
+# Approve workspace expenses
+
+{% include selector.html values="desktop, mobile" %}
+
+{% include option.html value="desktop or WebApp" %}
+1. When an expense is submitted, you will receive an email and in-app notification with the details of the expense.
+2. Click the expense in the email to be directed to New Expensify, where you can review it.
+3. Click on the expense to view the receipt, amount, description, and additional details the submitter provides.
+4. Click **Approve**.
+5. When you are ready to pay the expense, follow the steps in this help article.
+{% include end-option.html %}
+
+{% include option.html value="mobile" %}
+1. When an expense is submitted, you will receive a text message and in-app notification with its details.
+2. Tap on the expense in the text or notification to be directed to New Expensify, where you can review it.
+3. Tap on the expense to view the receipt, amount, description, and any additional details the submitter provides.
+4. Tap **Approve**.
+{% include end-option.html %}
+
+{% include end-selector.html %}
+
+{% include info.html %}
+If the transaction is pending (a common occurrence with recent company cards or SmartScan expenses), you’ll need to wait until the transaction posts before approving it.
+{% include end-info.html %}
+
+
+# Hold a workspace expense
+
+{% include selector.html values="desktop, mobile" %}
+
+{% include option.html value="desktop" %}
+1. Locate the expense on the **Search** page.
+2. Click **View**.
+3. Click the drop-down arrow at the top of the expense.
+4. Click the **Hold** button.
+5. Enter a reason for the delay. The reason for the hold will be added to the expense report.
+
+
+
+When you’re ready to remove the hold,
+
+1. Locate the expense on the Search page.
+2. Click **View**.
+3. Click the drop-down arrow at the top of the expense.
+4. Select **UnHold**.
+5. Complete the steps above to “Approve expenses.” Once the expense has been approved, you can pay it.
+{% include end-option.html %}
+
+{% include option.html value="mobile" %}
+1. Locate the expense on the **Search** page.
+2. Tap **View**.
+3. Tap the drop-down arrow at the top of the expense.
+4. Select the **Hold** button.
+5. Enter a reason for the delay. The reason for the hold will be added to the expense report.
+
+
+
+When you’re ready to remove the hold,
+
+1. Tap **Search** and select the expense.
+2. Tap the drop-down arrow at the top of the expense.
+3. Select **UnHold**.
+4. Complete the steps above to “Approve expenses.” Once the expense has been approved, you can pay it.
+{% include end-option.html %}
+
+{% include end-selector.html %}
+
+{% include info.html %}
+Held expenses will not be available for payment until they have been approved.
+{% include end-info.html %}
+
+# Unapprove a workspace expense
+
+{% include selector.html values="desktop, mobile" %}
+
+{% include option.html value="desktop" %}
+1. Locate the expense on the **Search** page.
+2. Click **View**.
+3. Click the drop-down arrow at the top of the report
+4. Click **Unapprove**.
+5. The submitter will receive an email and in-app notification that the expense has been unapproved.
+6. An unapproved expense can be deleted by clicking the drop-down arrow at the top of the expense.
+{% include end-option.html %}
+
+{% include option.html value="mobile" %}
+1. Locate the expense on the **Search** page.
+2. Tap **View**.
+3. Tap the drop-down arrow at the top of the expense.
+4. Tap **Unapprove**.
+5. The submitter will receive a text and in-app notification that the expense has been unapproved.
+6. An unapproved expense can be deleted by clicking the drop-down arrow at the top of the expense.
+{% include end-option.html %}
+
+{% include end-selector.html %}
+
+Reports that have been paid cannot be unapproved.
+
+If the approved expense has already been exported to an accounting package, you’ll see a warning that unapproving an expense can cause data discrepancies and Expensify Card reconciliation issues. Ideally, you’ll want to delete the data already exported to the accounting package before approving the expense again.
+
+{% include faq-begin.md %}
+
+**Why is an employee expense showing as ‘pending?’**
+
+An Expensify Card expense will show as pending if the merchant hasn’t posted it. This is usually the case with hotel holds, or card rental holds. A hold will normally last no more than 7-10 business days unless it’s a hotel hold, which can last 31 days.
+
+**What are expense reports?**
+
+In Expensify, expense reports group expenses in a batch to be paid or reconciled. When a draft report is open, all new expenses are added to it.
+
+Once a report is submitted, you can track the status from the **Search** section. Click the **View** button for a specific expense or expense report. The status is displayed at the top of the expense or report.
+{% include faq-end.md %}
+
+
diff --git a/docs/articles/new-expensify/expenses-&-payments/Create-an-expense.md b/docs/articles/new-expensify/expenses-&-payments/Create-an-expense.md
index cf6a13f9d5ac..38f1e0fdd466 100644
--- a/docs/articles/new-expensify/expenses-&-payments/Create-an-expense.md
+++ b/docs/articles/new-expensify/expenses-&-payments/Create-an-expense.md
@@ -1,68 +1,83 @@
---
title: Create an expense
-description: Request payment from an employer or a friend
+description: How to create an expense as an individual or workspace member
redirect_from: articles/request-money/Request-and-Split-Bills/
---
-You can create an expense to request payment from an employer’s workspace or from a friend using any of the following options:
-- **SmartScan**: Take a picture of a receipt to capture the expense details automatically.
-- **Add manually**: Manually enter the expense details.
-- **Create a distance expense**: Capture mileage expenses by entering the addresses you traveled to. Expensify automatically calculates the distance, the rate per mile, and the total cost.
+Expenses can be created through SmartScanning a receipt, emailing a receipt, tracking distance, and manually creating an expense.
+
+They can be submitted to an individual or a workspace. Before we outline the steps to create an expense, let’s go over the reasons to send an expense to an individual or a workspace.
+
+# Sending an expense to an Individual
+
+If you use Expensify for personal use, submitting to an individual is likely best.
+
+Once the expense is created, you will see the option to send it to an email or phone number. Alternatively, add an expense to a chat, which will go straight to the person you are chatting with.
+
+When an expense is submitted to an individual’s email or phone number, the payor will receive an email or text notification with the amount that needs to be paid. They can click on the amount in the email or text to pay the expense.
+
+# Submit an expense to a workspace or employer
+
+If you are an employee or a workspace member, you should submit the expense to the workspace instead of an individual. A workspace is designed to code expenses to the company's requirements.
+
+When an expense is submitted to a workspace, your approver will receive an email or text notification prompting them to approve and pay it.
+
+# How to Create an Expense
# SmartScan a receipt
{% include selector.html values="desktop, mobile" %}
-{% include option.html value="desktop" %}
-1. Click the + icon in the bottom left menu and select **Submit Expense**.
+{% include option.html value="desktop or WebApp" %}
+1. Click the **Global Create** button and select **Submit Expense**.
2. Click **Scan**.
-3. Drag and drop the receipt into Expensify, or click **Choose File** to select it from your saved files. *Note: The SmartScan process will auto-populate the merchant, date, and amount.*
-4. Use the search field to find the desired workspace or an individual’s name, email, or phone number.
-5. Add a description, category, tags, or tax as desired, or as required by your workspace.
+3. You can drag and drop the receipt into Expensify or click **Choose File** to select it from your saved files. _The SmartScan process will auto-populate the merchant, date, and amount._
+4. Enter the desired workspace or an individual’s email or phone number to receive the expense report.
+5. Add a description, category, tags, or tax as desired or as required by your workspace.
6. (Optional) Enable the expense as billable if it should be billed to a client.
-7. Click **Submit Expense**.
+7. Click **Submit expense**.
{% include end-option.html %}
{% include option.html value="mobile" %}
-1. Tap the + icon at the bottom of the screen and select **Submit Expense**.
+1. Tap the **Global Create** button and select **Submit Expense**.
2. Tap **Scan**.
-3. Tap the green button to take a photo of a receipt, or tap the Image icon to the left of it to upload a receipt from your phone. *Note: The SmartScan process will auto-populate the merchant, date, and amount.*
-4. Use the search field to find the desired workspace or an individual’s name, email, or phone number.
-5. Add a description, category, tags, or tax as desired, or as required by your workspace.
+3. Tap the green button to take a photo of a receipt, or tap the Image icon to upload a receipt from your phone. _The SmartScan process will auto-populate the merchant, date, and amount._
+4. Enter the desired workspace or an individual’s email or phone number to receive the expense report.
+5. Add a description, category, tags, or tax as desired or as required by your workspace.
6. (Optional) Enable the expense as billable if it should be billed to a client.
-7. Tap **Submit**.
+7. Tap **Submit expense**.
{% include end-option.html %}
{% include end-selector.html %}
{% include info.html %}
-You can also forward receipts to receipts@expensify.com using an email address that is your primary or secondary email address. SmartScan will automatically pull all of the details from the receipt and add it to your expenses.
+You can also forward receipts to receipts@expensify.com using your primary or secondary email address. SmartScan will automatically extract all the details from the receipt and add them to your expenses.
{% include end-info.html %}
# Manually add an expense
{% include selector.html values="desktop, mobile" %}
-{% include option.html value="desktop" %}
-1. Click the + icon in the bottom left menu and select **Submit Expense**.
+{% include option.html value="desktop or WebApp" %}
+1. Click the **Global Create** button and select **Submit Expense**.
2. Click **Manual**.
-3. Enter the amount on the receipt and click **Next**. *Note: Click the currency symbol to select a different currency.*
-4. Use the search field to find the desired workspace or an individual’s name, email, or phone number.
-5. (Optional) Add a description.
-6. Add a merchant.
-7. Click **Show more** to add additional fields (like a category) as desired, or as required by your workspace.
+3. Enter the currency and amount.
+4. Click **Next**.
+5. Enter the desired workspace or an individual’s email or phone number to receive the expense report.
+6. Add a description, category, tags, or tax as desired or as required by your workspace. Click **Show More** to see all coding options.
+7. (Optional) Enable the expense as billable if it should be billed to a client.
8. Click **Submit**.
{% include end-option.html %}
{% include option.html value="mobile" %}
-1. Tap the + icon at the bottom of the screen and select **Submit Expense**.
+1. Tap the **Global Create** button and select **Submit Expense**.
2. Tap **Manual**.
-3. Enter the amount on the receipt and tap **Next**. *Note: Click the currency symbol to select a different currency.*
-4. Use the search field to find the desired workspace or an individual’s name, email, or phone number.
-5. (Optional) Add a description.
-6. Add a merchant.
-7. Tap **Show more** to add additional fields (like a category) as desired, or as required by your workspace.
+3. Enter the currency and amount.
+4. Tap **Next**.
+5. Enter the desired workspace or an individual’s email or phone number to receive the expense report.
+6. Add a description, category, tags, or tax as desired or as required by your workspace. Tap **Show More** to see all coding options.
+7. (Optional) Enable the expense as billable if it should be billed to a client.
8. Tap **Submit**.
{% include end-option.html %}
@@ -72,54 +87,65 @@ You can also forward receipts to receipts@expensify.com using an email address t
{% include selector.html values="desktop, mobile" %}
-{% include option.html value="desktop" %}
-1. Click the + icon in the bottom left menu and select **Submit Expense**.
+{% include option.html value="desktop or WebApp" %}
+1. Click the **Global Create** button and select **Submit Expense**.
2. Click **Distance**.
3. Click **Start** and enter the starting location of your trip.
-4. Click **Stop** and enter the ending location of your trip.
-5. (Optional) Click **Add stop** to add additional stops, if applicable.
+4. Click **Stop** and enter the ending location of your trip.
+5. (Optional) Click **Add Stop** to add additional stops, if applicable. Drag and drop on the parallel lines (=) to reorder the stops if needed.
6. Tap **Next**.
-7. Use the search field to find the desired workspace or an individual’s name, email, or phone number.
-8. (Optional) Add a description.
-9. Click **Submit**.
+7. Enter the desired workspace or an individual’s email or phone number to receive the expense report.
+8. Add a description, category, tags, or tax as desired or as required by your workspace. Click **Show More** to see all coding options.
+9. (Optional) Enable the expense as billable if it should be billed to a client.
+10. Click **Submit**.
{% include end-option.html %}
{% include option.html value="mobile" %}
-1. Tap the + icon at the bottom of the screen and select **Submit Expense**.
+1. Tap the **Global Create** button and select **Submit Expense**.
2. Tap **Distance**.
3. Tap **Start** and enter the starting location of your trip.
-4. Tap **Stop** and enter the ending location of your trip.
-5. (Optional) Tap **Add stop** to add additional stops, if applicable.
-6. Tap **Next**.
-7. Use the search field to find the desired workspace or an individual’s name, email, or phone number.
-8.(Optional) Add a description.
-9. Tap **Submit**.
+4. Tap **Stop** and enter the ending location of your trip.
+5. (Optional) Tap **Add Stop** to add additional stops, if applicable. Drag and drop on the parallel lines (=) to reorder the stops if needed.
+6. Tap Next.
+7. Enter the desired workspace or an individual’s email or phone number to receive the expense report.
+8. Add a description, category, tags, or tax as desired or as required by your workspace. Tap **Show More** to see all coding options.
+9. (Optional) Enable the expense as billable if it should be billed to a client.
+10. Click **Submit**.
{% include end-option.html %}
{% include end-selector.html %}
-# Next Steps
+# Next Steps for expenses sent to an Individual
-The next steps for the expense depend on whether it was submitted to a workspace or to an individual:
-- **Expenses submitted to a workspace** are automatically added to a report and checked for any violations or inconsistencies. A chat thread for the expense is also added to your chat inbox. When you open the chat, the top banner will show the expense status and any next steps. By default, reports are automatically submitted for approval every Sunday. However, if it is ready for early submission, you can manually submit a report for approval. Once a report is submitted, your approver will be prompted to review your expense report. If changes are required, you will receive a notification to resolve any violations and resubmit. You will also be notified once your approver approves or denies your expenses.
-- **Expenses submitted to a friend** are sent right to that individual via email or text. You can chat with them about the expense in Expensify Chat, and you can receive payments through your Expensify Wallet or outside of Expensify.
+- Expenses submitted to an individual are instantly sent.
+- The payer will receive an email or text prompting them to review and pay the expense.
+- You can chat with the paying individual in Expensify.
+- Make sure to [connect your personal bank account](https://help.expensify.com/articles/new-expensify/expenses-&-payments/Connect-a-Personal-Bank-Account) to receive payment.
-{% include faq-begin.md %}
-**Can I divide a payment between multiple people?**
+# Next Steps for expense sent to a workspace
-Yes, you can split an expense to share the cost between multiple people.
+- Expenses submitted to a workspace are automatically added to a report and checked for violations or inconsistencies.
+- You can view the details and status of the expense on the **Search** tab.
+- Workspace settings determine the frequency of report submission. However, if the report is ready for early submission, you can manually submit a report for approval.
+- Once a report is submitted, your approver will get an email or text to review and pay the expense.
+- If changes are required, you will receive a notification to fix the expense and resubmit.
+- You will also be notified once your approver approves or denies your expenses.
+- Make sure to [connect your personal bank account](https://help.expensify.com/articles/new-expensify/expenses-&-payments/Connect-a-Personal-Bank-Account) to receive payment.
-**Can I pay someone in another currency?**
+{% include faq-begin.md %}
+**Can I divide a payment between multiple people?**
-While you can record your expenses in different currencies, Expensify wallets are only available for members who can add a U.S. personal bank account.
+Yes, you can [split an expense](https://help.expensify.com/articles/new-expensify/expenses-&-payments/Split-an-expense) in a group chat.
**Can I change an expense once I’ve submitted it?**
-Yes, you can edit an expense until it is paid. When an expense is submitted to a workspace, you, your approvers, and admins can edit the details on an expense except for the amount and date.
+Yes, you can edit an expense until it is paid. When an expense is submitted, the details can be edited except for the amount and date.
**What are expense reports?**
-In Expensify, expenses are submitted on an expense report. When a draft report is open, all new expenses are added to the draft report. Once a report is submitted, it shows what stage of the approval process the expenses are in and any required next steps.
+In Expensify, expense reports group expenses in a batch to be paid or reconciled. When a draft report is open, all new expenses are added to it.
+
+Once a report is submitted, you can track the status from the **Search** section. Click the **View** button for a specific expense or expense report. The status is displayed at the top of the expense or report.
{% include faq-end.md %}
diff --git a/docs/articles/new-expensify/expensify-card/Upgrade-to-the-new-Expensify-Card-from-Visa.md b/docs/articles/new-expensify/expensify-card/Upgrade-to-the-new-Expensify-Card-from-Visa.md
index 8fffec75e744..782e939e991e 100644
--- a/docs/articles/new-expensify/expensify-card/Upgrade-to-the-new-Expensify-Card-from-Visa.md
+++ b/docs/articles/new-expensify/expensify-card/Upgrade-to-the-new-Expensify-Card-from-Visa.md
@@ -12,7 +12,7 @@ When you upgrade the Expensify Cards to the new program, you'll have access to e
- Unique naming for each virtual card for simplified expense categorization
{% include info.html %}
-The Expensify Card upgrade must be completed by November 1, 2024.
+The Expensify Card upgrade must be completed by December 1, 2024.
{% include end-info.html %}
# Upgrade your company’s Expensify Card program
diff --git a/docs/articles/new-expensify/expensify-card/Use-your-Expensify-Card.md b/docs/articles/new-expensify/expensify-card/Use-your-Expensify-Card.md
index 6c7457641ce6..8915778962a0 100644
--- a/docs/articles/new-expensify/expensify-card/Use-your-Expensify-Card.md
+++ b/docs/articles/new-expensify/expensify-card/Use-your-Expensify-Card.md
@@ -4,13 +4,13 @@ description: Use your physical or virtual Expensify Card
---
-As soon as you receive your physical Expensify Visa® Commercial Card, you can start using it right away by swiping it like you would with any other card, or you can link your card to your Apple or Google Pay mobile wallet to make in-person, contactless payments. You can also use your virtual Expensify Card for online and in-app purchases.
+As soon as you receive your physical Expensify Visa® Commercial Card, you can start using it right away by swiping it like you would with any other card. You can also link your card to your Apple or Google Pay mobile wallet to make in-person, contactless payments. You can also use your virtual Expensify Card for online and in-app purchases.
A virtual card is a digital card that can be used for online transactions. Virtual cards have the same details as physical cards, but they offer several additional benefits:
-- **Flexibility**: Virtual cards can be created or deleted instantly. You can use them for individual transactions with predetermined amounts or recurring payments and subscriptions.
+- **Flexibility:** Virtual cards can be created or deleted instantly. They can be used for individual transactions with predetermined amounts or recurring payments and subscriptions.
- **Customizable limits**: You can set spending limits for each virtual card.
-- **Security**: Admins have the option to issue virtual cards for a single-use (e.g. for one of expenses) or fixed-use (e.g. for recurring expenses). Since you have placed a limit on their usage, it makes them less susceptible to unauthorized transactions.
-- **Insights**: You can easily track recurring spend for specific vendors when assigning a virtual card to a team, department, or vendor.
+- **Security**: Admins have the option to issue virtual cards for a single-use (e.g., for one of the expenses) or fixed-use (e.g., for recurring expenses). Since you have placed a limit on their usage, it makes them less susceptible to unauthorized transactions.
+- **Insights**: When assigning a virtual card to a team, department, or vendor, you can easily track recurring spending for specific vendors.
# View your virtual card details
@@ -34,7 +34,7 @@ A virtual card is a digital card that can be used for online transactions. Virtu
{% include faq-begin.md %}
-**Why did my transaction get declined?**
+## Why did my transaction get declined?
Here are some reasons why an Expensify Card transaction might be declined:
@@ -43,7 +43,13 @@ Here are some reasons why an Expensify Card transaction might be declined:
- **Incorrect card details**: Your card information was entered incorrectly with the merchant. Entering incorrect card information, such as the CVC, ZIP, or expiration date, will also lead to declines. There was suspicious activity
- **Fraudulent or risky activity**: If Expensify detects unusual or suspicious activity, we may block transactions as a security measure. This could happen due to irregular spending patterns, attempted purchases from risky vendors, or multiple rapid transactions. Check your Expensify Home page to approve unusual merchants and try again. If the spending looks suspicious, we may complete a manual due diligence check, and our team will do this as quickly as possible - your cards will all be locked while this happens. The merchant is located in a restricted country
-**How do I report my Expensify Card expenses?**
+## Where can I use my Expensify Card?
+
+Generally, the Expensify Card can be used anywhere Visa is accepted. However, the Expensify Card program is based in the US, so we are bound by US sanctions and other international limitations.
+
+Expensify Card purchases will be declined if a merchant is physically located in, or has its headquarters or billing address, in the following countries -- Belarus, Burundi, Cambodia, Central African Republic, Democratic Republic of the Congo, Cuba, Iran, Iraq, North Korea, Lebanon, Libya, Russia, Somalia, South Sudan, Syrian Arab Republic, Tanzania, Ukraine, Venezuela, Yemen, Zimbabwe
+
+## How do I report my Expensify Card expenses?
You can report and submit Expensify Card expenses just like any other expenses, and you’ll want to submit them regularly to ensure you have a sufficient spending amount available on the card. As your expenses are approved, your Smart Limit updates accordingly.
diff --git a/docs/articles/new-expensify/workspaces/Require-tags-and-categories-for-expenses.md b/docs/articles/new-expensify/workspaces/Require-tags-and-categories-for-expenses.md
index df77ed3b5b01..f2fd6970f5af 100644
--- a/docs/articles/new-expensify/workspaces/Require-tags-and-categories-for-expenses.md
+++ b/docs/articles/new-expensify/workspaces/Require-tags-and-categories-for-expenses.md
@@ -30,7 +30,7 @@ To require workspace members to add tags and/or categories to their expenses,
{% include end-selector.html %}
-{:width="100%"}
+{:width="100%"}
This will highlight the tag and/or category field as required on all expenses.
diff --git a/docs/assets/images/ExpensifyHelp_OldDot_Karma_Group.png b/docs/assets/images/ExpensifyHelp_OldDot_Karma_Group.png
new file mode 100644
index 000000000000..e0d5d406ba2f
Binary files /dev/null and b/docs/assets/images/ExpensifyHelp_OldDot_Karma_Group.png differ
diff --git a/docs/assets/images/ExpensifyHelp_OldDot_Karma_Individual.png b/docs/assets/images/ExpensifyHelp_OldDot_Karma_Individual.png
new file mode 100644
index 000000000000..d3115469350f
Binary files /dev/null and b/docs/assets/images/ExpensifyHelp_OldDot_Karma_Individual.png differ
diff --git a/docs/assets/images/SageConfigureIntegrationConfigureButton.png b/docs/assets/images/SageConfigureIntegrationConfigureButton.png
new file mode 100644
index 000000000000..e3ec52bacbb0
Binary files /dev/null and b/docs/assets/images/SageConfigureIntegrationConfigureButton.png differ
diff --git a/docs/assets/images/SageConfigureUserDefinedDimensionsFilter.png b/docs/assets/images/SageConfigureUserDefinedDimensionsFilter.png
new file mode 100644
index 000000000000..f126bb10dc51
Binary files /dev/null and b/docs/assets/images/SageConfigureUserDefinedDimensionsFilter.png differ
diff --git a/docs/assets/images/SageConnectCreatingWorkspace.png b/docs/assets/images/SageConnectCreatingWorkspace.png
new file mode 100644
index 000000000000..6084d0a8c7fb
Binary files /dev/null and b/docs/assets/images/SageConnectCreatingWorkspace.png differ
diff --git a/docs/assets/images/SageConnectEnableSage.png b/docs/assets/images/SageConnectEnableSage.png
new file mode 100644
index 000000000000..25b43a510c15
Binary files /dev/null and b/docs/assets/images/SageConnectEnableSage.png differ
diff --git a/docs/assets/images/SageConnectEnterCredentials.png b/docs/assets/images/SageConnectEnterCredentials.png
new file mode 100644
index 000000000000..63772972290d
Binary files /dev/null and b/docs/assets/images/SageConnectEnterCredentials.png differ
diff --git a/docs/assets/images/SageConnectSettingUpWebServicesUser.png b/docs/assets/images/SageConnectSettingUpWebServicesUser.png
new file mode 100644
index 000000000000..0fd3bb68c3d2
Binary files /dev/null and b/docs/assets/images/SageConnectSettingUpWebServicesUser.png differ
diff --git a/docs/assets/images/SageConnectSubscriptionSettings.png b/docs/assets/images/SageConnectSubscriptionSettings.png
new file mode 100644
index 000000000000..2e74d27c71e6
Binary files /dev/null and b/docs/assets/images/SageConnectSubscriptionSettings.png differ
diff --git a/docs/assets/images/SageConnectTimeandExpenseSequenceNumbers.png b/docs/assets/images/SageConnectTimeandExpenseSequenceNumbers.png
new file mode 100644
index 000000000000..8750c1ed596b
Binary files /dev/null and b/docs/assets/images/SageConnectTimeandExpenseSequenceNumbers.png differ
diff --git a/docs/assets/images/SageConnectWebServicesAuthorizations.png b/docs/assets/images/SageConnectWebServicesAuthorizations.png
new file mode 100644
index 000000000000..d0b9a786d1cc
Binary files /dev/null and b/docs/assets/images/SageConnectWebServicesAuthorizations.png differ
diff --git a/docs/redirects.csv b/docs/redirects.csv
index d3672618cfad..d9f18ebb0227 100644
--- a/docs/redirects.csv
+++ b/docs/redirects.csv
@@ -590,3 +590,11 @@ https://help.expensify.com/articles/expensify-classic/articles/expensify-classic
https://help.expensify.com/articles/expensify-classic/articles/expensify-classic/expenses/Bulk-Upload-Multiple-Invoices,https://help.expensify.com/articles/expensify-classic/articles/expensify-classic/expenses/Add-Invoices-in-Bulk
https://help.expensify.com/articles/expensify-classic/bank-accounts-and-payments/payments/Pay-Bills,https://help.expensify.com/articles/expensify-classic/bank-accounts-and-payments/payments/Create-and-Pay-Bills
https://help.expensify.com/articles/new-expensify/billing-and-subscriptions/add-a-payment-card-and-view-your-subscription,https://help.expensify.com/articles/new-expensify/billing-and-subscriptions/Add-a-payment-card-and-view-your-subscription
+https://help.expensify.com/articles/new-expensify/billing-and-subscriptions/Billing-page-coming-soon,https://help.expensify.com/articles/new-expensify/billing-and-subscriptions/Billing-page
+https://help.expensify.com/articles/expensify-classic/expenses/Add-expenses-in-bulk,https://help.expensify.com/articles/expensify-classic/expenses/Add-an-expense
+https://help.expensify.com/articles/expensify-classic/expenses/Track-group-expenses,https://help.expensify.com/articles/expensify-classic/expenses/Add-an-expense
+https://help.expensify.com/articles/expensify-classic/expenses/Track-mileage-expenses,https://help.expensify.com/articles/expensify-classic/expenses/Add-an-expense
+https://help.expensify.com/articles/expensify-classic/expenses/Track-per-diem-expenses,https://help.expensify.com/articles/expensify-classic/expenses/Add-an-expense
+https://community.expensify.com/discussion/5116/faq-where-can-i-use-the-expensify-card,https://help.expensify.com/articles/new-expensify/expensify-card/Use-your-Expensify-Card#where-can-i-use-my-expensify-card
+https://help.expensify.com/articles/other/Expensify-Lounge,https://help.expensify.com/Hidden/Expensify-Lounge
+https://help.expensify.com/articles/new-expensify/expenses-&-payments/Approve-and-pay-expenses,https://help.expensify.com/articles/new-expensify/expenses-&-payments/Approve-expenses
diff --git a/fastlane/Appfile b/fastlane/Appfile
index 66955822aab7..42f887a827d1 100644
--- a/fastlane/Appfile
+++ b/fastlane/Appfile
@@ -1,5 +1,4 @@
-app_identifier("com.chat.expensify.chat") # The bundle identifier of your app
-apple_id("ios@expensify.com") # Your Apple email address
-
-itc_team_id("152696") # App Store Connect Team ID
-team_id("368M544MTT") # Developer Portal Team ID
+# See https://docs.fastlane.tools/advanced/Appfile/
+apple_id("ios@expensify.com")
+itc_team_id("152696")
+team_id("368M544MTT")
diff --git a/fastlane/Fastfile b/fastlane/Fastfile
index eed84acdc916..e90fdbe50255 100644
--- a/fastlane/Fastfile
+++ b/fastlane/Fastfile
@@ -68,6 +68,23 @@ platform :android do
setGradleOutputsInEnv()
end
+ desc "Generate a production HybridApp AAB"
+ lane :build_hybrid do
+ ENV["ENVFILE"]="../.env.production.hybridapp"
+ gradle(
+ project_dir: '../Android',
+ task: "bundleRelease",
+ flags: "--refresh-dependencies",
+ properties: {
+ "android.injected.signing.store.file" => './upload-key.keystore',
+ "android.injected.signing.store.password" => ENV["ANDROID_UPLOAD_KEYSTORE_PASSWORD"],
+ "android.injected.signing.key.alias" => ENV["ANDROID_UPLOAD_KEYSTORE_ALIAS"],
+ "android.injected.signing.key.password" => ENV["ANDROID_UPLOAD_KEY_PASSWORD"],
+ }
+ )
+ setGradleOutputsInEnv()
+ end
+
desc "Generate a new local APK"
lane :build_local do
ENV["ENVFILE"]=".env.production"
@@ -80,6 +97,18 @@ platform :android do
setGradleOutputsInEnv()
end
+ desc "Generate a new local HybridApp APK"
+ lane :build_local_hybrid do
+ ENV["ENVFILE"]=".env.production"
+ gradle(
+ project_dir: '../Android',
+ task: 'assemble',
+ flavor: 'Production',
+ build_type: 'Release',
+ )
+ setGradleOutputsInEnv()
+ end
+
desc "Generate a new local APK for e2e testing"
lane :build_e2e do
ENV["ENVFILE"]="tests/e2e/.env.e2e"
@@ -151,6 +180,38 @@ platform :android do
)
end
+ desc "Upload HybridApp to Google Play for internal testing"
+ lane :upload_google_play_internal_hybrid do
+ # Google is very unreliable, so we retry a few times
+ ENV["SUPPLY_UPLOAD_MAX_RETRIES"]="5"
+ upload_to_play_store(
+ package_name: "org.me.mobiexpensifyg",
+ json_key: './android-fastlane-json-key.json',
+ aab: ENV[KEY_GRADLE_AAB_PATH],
+ track: 'alpha',
+ rollout: '1.0'
+ )
+
+ # Update the internal testing group "beta" with the latest version
+ upload_to_play_store(
+ package_name: "org.me.mobiexpensifyg",
+ json_key: './android-fastlane-json-key.json',
+ track: 'alpha',
+ track_promote_to: 'beta',
+ skip_upload_aab: true
+ )
+
+ # Update the internal testing group "Internal Testers" with the latest version
+ upload_to_play_store(
+ package_name: "org.me.mobiexpensifyg",
+ json_key: './android-fastlane-json-key.json',
+ track: 'alpha',
+ track_promote_to: 'Internal Testers',
+ skip_upload_aab: true
+ )
+
+ end
+
desc "Deploy app to Google Play production"
lane :upload_google_play_production do
# Google is very unreliable, so we retry a few times
@@ -228,6 +289,37 @@ platform :ios do
setIOSBuildOutputsInEnv()
end
+ desc "Build an iOS HybridApp production build"
+ lane :build_hybrid do
+ ENV["ENVFILE"]="../.env.production.hybridapp"
+
+ setupIOSSigningCertificate()
+
+ install_provisioning_profile(
+ path: "./OldApp_AppStore.mobileprovision"
+ )
+
+ install_provisioning_profile(
+ path: "./OldApp_AppStore_Share_Extension.mobileprovision"
+ )
+
+ build_app(
+ workspace: "../iOS/Expensify.xcworkspace",
+ scheme: "Expensify",
+ output_name: "Expensify.ipa",
+ export_method: "app-store",
+ export_options: {
+ manageAppVersionAndBuildNumber: false,
+ provisioningProfiles: {
+ "com.expensify.expensifylite" => "(OldApp) AppStore",
+ "com.expensify.expensifylite.SmartScanExtension" => "(OldApp) AppStore: Share Extension"
+ }
+ }
+ )
+
+ setIOSBuildOutputsInEnv()
+ end
+
desc "Build an unsigned iOS production build"
lane :build_unsigned do
ENV["ENVFILE"]=".env.production"
@@ -238,6 +330,16 @@ platform :ios do
setIOSBuildOutputsInEnv()
end
+ desc "Build an unsigned iOS HybridApp production build"
+ lane :build_unsigned_hybrid do
+ ENV["ENVFILE"]="../Mobile-Expensify/.env.production.hybridapp"
+ build_app(
+ workspace: "../Mobile-Expensify/iOS/Expensify.xcworkspace",
+ scheme: "Expensify"
+ )
+ setIOSBuildOutputsInEnv()
+ end
+
desc "Build AdHoc app for testing"
lane :build_adhoc do
ENV["ENVFILE"]=".env.adhoc"
@@ -286,6 +388,7 @@ platform :ios do
desc "Upload app to TestFlight"
lane :upload_testflight do
upload_to_testflight(
+ app_identifier: "com.chat.expensify.chat",
api_key_path: "./ios/ios-fastlane-json-key.json",
distribute_external: true,
notify_external_testers: true,
@@ -316,9 +419,46 @@ platform :ios do
)
end
- desc "Submit app to App Store Review"
+ desc "Upload HybridApp to TestFlight"
+ lane :upload_testflight_hybrid do
+ upload_to_testflight(
+ app_identifier: "com.expensify.expensifylite",
+ api_key_path: "./ios/ios-fastlane-json-key.json",
+ distribute_external: true,
+ notify_external_testers: true,
+ reject_build_waiting_for_review: true,
+ changelog: "Thank you for beta testing New Expensify, this version includes bug fixes and improvements.",
+ groups: ["Applause", "Beta Testers", "Expensify Employees"],
+ demo_account_required: true,
+ beta_app_review_info: {
+ contact_email: ENV["APPLE_CONTACT_EMAIL"],
+ contact_first_name: "Andrew",
+ contact_last_name: "Gable",
+ contact_phone: ENV["APPLE_CONTACT_PHONE"],
+ demo_account_name: ENV["APPLE_DEMO_EMAIL"],
+ demo_account_password: ENV["APPLE_DEMO_PASSWORD"],
+ notes: "1. In the Expensify app, enter the email 'appletest.expensify@proton.me'. This will trigger a sign-in link to be sent to 'appletest.expensify@proton.me'
+ 2. Navigate to https://account.proton.me/login, log into Proton Mail using 'appletest.expensify@proton.me' as email and the password associated with 'appletest.expensify@proton.me', provided above
+ 3. Once logged into Proton Mail, navigate to your inbox and locate the email triggered in step 1. The email subject should be 'Your magic sign-in link for Expensify'
+ 4. Open the email and copy the 6-digit sign-in code provided within
+ 5. Return to the Expensify app and enter the copied 6-digit code in the designated login field"
+ }
+ )
+
+ puts "dsym path: #{ENV[KEY_DSYM_PATH]}"
+ upload_symbols_to_crashlytics(
+ app_id: "1:1008697809946:ios:3ffad71f664f2886",
+ dsym_path: ENV[KEY_DSYM_PATH],
+ gsp_path: "./ios/GoogleService-Info.plist",
+ # Assuming we are running this from the react-native submodule directory for HybridApp
+ binary_path: "../iOS/Pods/FirebaseCrashlytics/upload-symbols"
+ )
+ end
+
+ desc "Submit app for production App Store Review"
lane :submit_for_review do
deliver(
+ app_identifier: "com.chat.expensify.chat",
api_key_path: "./ios/ios-fastlane-json-key.json",
# Skip HTMl report verification
diff --git a/help/GUIDELINES.md b/help/GUIDELINES.md
new file mode 100644
index 000000000000..7fbf693e6830
--- /dev/null
+++ b/help/GUIDELINES.md
@@ -0,0 +1,150 @@
+# New Help Guidelines
+This file outlines a series of specific rules. Whenever editing any file on this site, please verify your changes comply with these rules.
+
+## General Philosophy
+In general, this help site is built around a few common principles:
+
+* **Consistency** - Every page of the site should follow a common pattern, as should every chapter on the page, and every section in the chapter
+* **Focus** - Every section should focus as much as possible on a single self-contained subset of the page, with complex subsets being broken into section groups rather than large singular sections
+* **Plain language** - All writing should target a high-school reading level, with very common language and simple phrasings.
+
+
+## Structure Rules
+To avoid ambiguity, let's establish the following terms:
+
+* **Site** - All of the pages combine to create a single help "site" providing comprehensive details on the Expensify Superapp, which is a collection of multiple products combined into a single app.
+
+* **Page** - Each help "page" is devoted to a single product within a tightly integrated suite. Accordingly, while each product page can refer to other products, each product page should only provide detailed definitions on a single product to avoid redundancy between product pages. Each product is split into multiple
+
+* **Chapter** - Each page is split into a standard set of "chapters", each of which contains multiple sections.
+
+* **Section** - Each chapter has three or more "sections", consisting of a header and body.
+[Fr
+* **Header** - Each section has a "header", which describes the contents of that section.
+
+* **Body** - Each section has a "body", which contains the contents of that section.
+
+
+## Chapter Rules
+Every page has exactly four "top level" chapters, which are given `##` (H2) headers:
+
+* **Introduction** - This chapter is devoted to very high level, jargon-free marketing language explaining the benefits of the product in clear and simple prose. The Introduction chapter has exactly three sections:
+
+ * *Main uses* - This section has a definition list summarizing the key scenarios in which this product would be used.
+
+ * *Core users* - This section has a definition list summarizing the key audiences that use this product.
+
+ * *Key advantages* - This section has a definition list summarizing the major benefits of this product over the competition.
+
+* **Concepts** - This chapter is devoted to establishing a clear, unambiguous lexicon for discussing this product. It contains three or more definition list sections or section groups. It does not contain any how-to or FAQ sections, the Concepts section is entirely focused on establishing the concepts themselves, not explaining how to use them.
+
+* **Tutorials** - This chapter is devoted to providing detailed step-by-step instructions on how to accomplish certain goals. This chapter contains three or more how-to sections or section groups. Everything in the Tutorial should be consistent with the language established in the Concepts.
+
+* **FAQ** - This chapter provides focused answers to very specific questions that are easily misunderstood or otherwise don't fit perfectly in the above chapters. This chapter contains three or more FAQ-style sections or section groups. The FAQ does not define any new terms (only the Concepts section does that), and does not give any step-by-step instructions (only the Tutorials section does that).
+
+Anything outside of these four chapters should be moved within the relevant chapter, following the section guidelines for that chapter.
+
+
+## Header Rules
+There are two kinds of headers:
+
+* **Short headers** - These are titles that are limited to 1-3 short words, such that it will fit into the "left hand nav" containing the table of contents, without "wrapping" around. Short titles capitalize major words. For example, this would be a short title:
+
+ ```
+ # Platforms
+ ```
+
+* **Long headers** - These are longer titles (4+ words), prefixed with a short title in square brackets. This allows for longer and more descriptive titles, while still providing a short title that fits into the left-hand nav comfortably. Long titles ask a complete question, and are capitalized and punctuated like a normal sentence. For example, this would be a long title:
+
+ ```
+ # [Platforms] Where can I use the Expensify App?
+ ```
+
+* To avoid confusion, no two sections in the same chapter or section group should have the same short or long title.
+
+* Headers that contain questions should be asked from the customer's perspective (ie, "How do I X?" not "How do you do X?")
+
+
+## Section Rules
+There are three kinds of sections:
+
+### Definition List Sections
+A "definition list" type section break a high level concept into smaller pieces, and consists of:
+
+* A "long header" describing the topic being deconstructed and defined, generally starting with "What", but never "How" or "Why".
+* 1-2 introductory sentences, explaining the theme of the list
+* An unnumbered bullet list, where each bullet consists of:
+ * A bolded term of 1-3 words
+ * A clear definition or description of the term, in 1-3 complete sentences.
+* Nothing should exist in the section after the bullet list
+
+An example of a definition list section follows:
+
+ ```
+ # [Fruit] What are the best fruits?
+ It's well known that these are the best fruits:
+
+ * **Apples** - The king of fruit. So crispy.
+ * **Oranges** - Often seen as diametrically opposed. But still delish.
+ * **Tomato** - Some people don't know this is a fruit. But it is.
+ ```
+
+### How-to List Sections
+A "how-to list" type section gives sequential steps to accomplish a goal, and consists of:
+
+* A "long header" describing the goal of the tutorial, starting with "How".
+* 1-2 introductory sentences, explaining the goal of the tutorial
+* A numbered list, where each step consists of a single sentence covering:
+ * A specific UI element to press or type into, if any, in bold
+ * An explanation of the benefit of doing this
+ * Each step describes exactly one user action; do not combine multiple actions into a single step
+* Confirm the sum of the steps accomplishes the clearly stated goal
+* Confirm every concept mentioned in the tutorial has a corresponding definition in the Concepts section
+* Nothing should exist in the section after the numbered list
+
+An example of a how-to section follows:
+
+ ```
+ # [Email] How do I send an email?
+ Email is the easiest way to write someone. To send an email:
+
+ 1. Press the **Email** app icon, to open the app.
+ 2. Press the **Compose** button, to start writing the email.
+ 3. Enter the address you want to send to into the **To** field, so it gets to the right person.
+ 4. Provide a subject of the email in the **Subject** field, to entice them to open the email.
+ 5. Write the email into the large blank body, to detail the message.
+ 6. Press the **Send** button, to deliver it to its addressed recipient.
+ ```
+
+### Frequently Asked Question (FAQ) Sections
+A "FAQ" type section gives a detailed answer to a single question, often to explain the non-obvious reasoning behind something, and consists of:
+
+* A "long header", asking a specific question, generally starting with "Why"
+ * Note: A FAQ cannot ask a "How do I...?" question -- move this to the Tutorials chapter and use a HowTo section
+* 1 paragraph answering the question, in 2-4 comprehensive sentences.
+ * Note: A FAQ cannot have a bullet list -- move this to the Concepts chapter and use a definition list section
+ * Note: A FAQ cannot have a numbered list -- move this to the Tutorials chapter and use a HowTo section
+
+
+## Section Group Rules
+When the Concepts, Tutorials, or FAQ chapters have 6 or more sections, those sections can optionally be split into two or more "section groups". Each section group is given a "H3" header (`###`), and consists of:
+
+* A short header, named after the common theme of the sections of the section group
+* 3-6 sections, of any type
+
+
+## Cross Platform Rules
+All instructions should be written in a fashion to work across all platforms (web, mobile, desktop, native, etc). Accordingly, the language should to the greatest degree possible be written in such a fashion that works across all platforms. Specifically:
+
+* Where possible, use a cross-platform verb. For example, do not say "click" or "tap", say "press"
+* If there is no suitable cross-platform term, briefly explain how to do the equivalent action on both platforms. For example, "right-click or long-tap to open the context menu..."
+* For anything that has no equivalent, clarify which platform the instruction refers to. For example: "If you have a mouse, hover over the chat to see the hover menu..."
+
+## General Language Rules
+To ensure that the content always sounds consistent:
+
+* "You" always refers to the reader, who is a user and customer of Expensify
+* "We" refers to the company Expensify, who is the author of the superapp this is documenting.
+* Any use of "we" could be replaced with "Expensify" and would still work.
+* The help documentation is in effect the product/company talking directly to the user, in the first person.
+
diff --git a/help/_config.yml b/help/_config.yml
index 11091b1a8b7c..407dfe9fea91 100644
--- a/help/_config.yml
+++ b/help/_config.yml
@@ -8,3 +8,4 @@ github_username: expensify
# Ignore what's only used for the Github repo
exclude:
- README.md
+ - GUIDELINES.md
diff --git a/help/_layouts/default.html b/help/_layouts/default.html
index cf8c7feeaea0..7fcd95c1b325 100644
--- a/help/_layouts/default.html
+++ b/help/_layouts/default.html
@@ -85,13 +85,27 @@
.toc-sidebar li {
margin-left: 0;
- padding-left: 10px;
+ padding-left: 0;
+ }
+
+ .js-toc > ul > li > a {
+ font-weight: bold;
+ font-size: 18px;
+
}
.js-toc > ul > li > ul > li {
margin-top: 25px;
}
+ .js-toc > ul > li > ul > li > a {
+ font-weight: bold;
+ }
+
+ .js-toc > ul > li > ul > li > ul > li > ul > li {
+ padding-left: 10px;
+ }
+
.toc-sidebar a {
word-wrap: break-word;
display: block;
@@ -110,20 +124,9 @@
.toc-sidebar .is-active-link {
background-color: #eaf5ff;
color: #0366d6;
- font-weight: bold;
border-radius: 6px;
}
- a:has(+ ul.is-collapsible)::after {
- content: '∧'; /* Use the logical AND symbol */
- display: inline; /* Ensure the caret appears directly after the content */
- margin-left: 5px; /* Add some space between the text and the caret */
- transform: rotate(180deg); /* Rotate the caret 180 degrees */
- display: inline-block; /* Required to apply transform */
- position: relative; /* Enables positioning adjustments */
- top: 3px; /* Moves the caret down 3 pixels */
- }
-
/* Main content area */
main {
margin-left: 300px;
@@ -161,7 +164,7 @@
}
.is-active-link {
- font-weight: bold;
+ font-weight: normal;
}
.scroll-spacer {
@@ -211,7 +214,7 @@
.footer-column {
flex: 1;
max-width: 300px; /* Set a max-width for each column */
- padding: 0 20px; /* Add padding for some space between the columns */
+ padding: 0 20px; /* Add padding for some space between the columns */
}
@@ -270,8 +273,8 @@
diff --git a/help/card.md b/help/card.md
index c6a457629643..1ed51daf7713 100644
--- a/help/card.md
+++ b/help/card.md
@@ -5,14 +5,14 @@ title: Expensify Cards
## Introduction
The Expensify Card is a corporate payment card that integrates seamlessly with Expensify Expense, allowing you to manage company spending in real-time. By enforcing your company’s expense policy at the point of sale, the Expensify Card eliminates the need for manual receipt tracking, reduces fraud, and ensures compliance with expense policies. Whether you’re looking for simplified expense management, real-time control, or cashback rewards, the Expensify Card is designed to meet your needs.
-### [Main uses] When should I use the Expensify Card?
+### Main uses
The Expensify Card is ideal for any business looking to streamline its expense management and control employee spending. Key use cases include:
* **Enforcing company policy** - Ensure that purchases are compliant with your company’s expense policy automatically at the point of sale.
* **Automating expense tracking** - Eliminate manual receipt entry by capturing expenses automatically with every card transaction.
* **Real-time spending control** - Gain immediate insight into employee spending, and control purchases with dynamic card limits.
* **Earning cashback** - Get rewarded for company spending with up to 2% cashback on all purchases.
-### [Core users] Who uses the Expensify Card?
+### Core users
The Expensify Card is a valuable tool for companies of all sizes, from startups to large enterprises. Some common users include:
* **Small businesses** - Manage corporate spending efficiently without the complexity of traditional corporate cards.
* **Enterprises** - Gain full visibility into employee spending and ensure compliance across all transactions.
@@ -20,7 +20,7 @@ The Expensify Card is a valuable tool for companies of all sizes, from startups
* **Nonprofits** - Track and control organizational spending while ensuring that all expenses align with donor guidelines.
* **Accountants** - Streamline reimbursement and auditing processes by eliminating manual entry and simplifying receipt management.
-### [Key advantages] Why should I use the Expensify Card?
+### Key advantages
The Expensify Card offers unique advantages for companies looking to optimize their expense management:
* **Policy enforcement at the point of sale** - Automatically enforce your company’s expense policy when employees use the card, ensuring that only approved purchases go through.
* **Real-time visibility** - See employee spending as it happens, with every transaction instantly visible in Expensify Expense.
@@ -31,11 +31,10 @@ The Expensify Card offers unique advantages for companies looking to optimize th
* **Fraud reduction** - Reduce fraud by limiting card use to specific categories or vendors, and by gaining full visibility into all transactions.
## Concepts
-Expensify Cards introduce several concepts that redefine corporate spending management.
### [Policy enforcement] How does the Expensify Card enforce company policy?
The Expensify Card is designed to automatically enforce your company’s expense policy:
-* **Policy-based approvals** - Transactions are approved or denied based on predefined expense categories, amounts, or vendor types. For example, purchases outside of approved categories (e.g., entertainment, personal items) can be blocked in real-time.
+* **Policy-based approvals** - Transactions are approved or denied based on predefined expense categories, amounts, or vendor types.
* **Spending limits** - Set individual or department-level spending limits that the card will automatically enforce.
* **Real-time monitoring** - Managers and admins can view all transactions as they happen, allowing them to flag or approve expenses in real-time.
@@ -62,61 +61,232 @@ The Expensify Card includes several features that reduce the risk of fraud:
* **Real-time visibility** - Track all card transactions as they happen, making it easy to identify and address suspicious activity.
* **Dynamic limits** - Adjust spending limits in real-time, so if an employee is in a situation where they need additional funds, it can be handled securely.
-## Platforms
-The Expensify Card works seamlessly across all platforms, ensuring that your company’s expense management is fully integrated:
-* **Web app** - Manage Expensify Cards and monitor transactions from the Expensify web app.
-* **Mobile app** - Employees can use the Expensify mobile app to track expenses, view transactions, and manage their cards on the go.
-* **Desktop app** - Full control of Expensify Cards is available through the Expensify desktop app for Mac and Windows, making it easy for admins to manage policies and review transactions.
+### [Virtual Cards] What are the benefits of using virtual Expensify Cards?
+Virtual cards are digital cards designed for online transactions with several benefits:
+* **Flexibility** - Create or delete virtual cards instantly for transactions with predetermined amounts or recurring payments.
+* **Customizable limits** - Set spending limits for each virtual card.
+* **Security** - Issue virtual cards for single-use or recurring expenses to reduce the risk of unauthorized transactions.
+* **Insights** - Track recurring spend for specific vendors by assigning a virtual card to a team, department, or vendor.
## Tutorials
-### [Issue a card] How do I issue an Expensify Card to an employee?
-1. Go to **Settings** > **Cards** in the Expensify app.
-2. Press **Issue Card** and select the employee from the list.
-3. Set an initial spending limit, and assign the card to the employee’s workspace.
-4. The employee will receive an email with instructions to activate their card.
+### Getting Started
+#### [Enable Expensify Card] How do I enable the Expensify Card for my workspace?
+To enable the Expensify Card for your workspace, you must be a Workspace Admin. Follow these steps:
+
+1. Press your profile image or icon in the menu.
+2. Scroll and press **Workspaces** in the menu.
+3. Select the workspace you want to enable Expensify Cards for.
+4. Press **More features** in the menu.
+5. Under the **Spend** section, enable the Expensify Card toggle.
+
+#### [Select a bank account] How do I select a bank account for the Expensify Card?
+Before issuing Expensify Cards, connect them with a bank account. Here's how:
+
+1. Press **Expensify Card** in the menu.
+2. Press **Issue new card**.
+3. Select an existing bank account or follow the steps to add a new one.
+
+### Card Management
+#### [Issue a card] How do I issue an Expensify Card to an employee?
+To issue an Expensify Card to an employee, follow these steps:
+
+1. Press **Issue card**.
+2. Select the employee you want to issue the card to.
+3. Choose to issue a physical or virtual card.
+4. Pick a smart, monthly, or fixed limit.
+5. Enter the limit amount and add a card name.
+6. Press **Issue card** to confirm and issue the card.
+
+#### [Adjust limits] How do I adjust spending limits on an Expensify Card?
+To adjust spending limits on an Expensify Card, follow these steps:
-### [Adjust limits] How do I adjust spending limits on an Expensify Card?
1. Go to **Settings** > **Cards**.
2. Select the employee’s card from the list.
3. Press **Edit Limits** and adjust the spending limit for the card.
4. Press **Save** to apply the new limit.
-### [View transactions] How do I track Expensify Card transactions?
+#### [Manage Expensify Cards] How do I manage my issued Expensify Cards?
+To manage your issued Expensify Cards, you must be a Workspace Admin. Follow these steps:
+
+1. Press your profile image or icon in the bottom left menu.
+2. Scroll down and press **Workspaces** in the left menu.
+3. Select the workspace containing the desired Expensify Cards.
+4. Press **Expensify Card** in the left menu to see a list of all issued cards.
+5. Press a card row to view details or adjust the card limit, limit type, name, or deactivate it.
+6. Press **Settings** in the top right to adjust the settlement account or change the settlement frequency.
+
+### Transactions and Tracking
+#### [View transactions] How do I track Expensify Card transactions?
+To track Expensify Card transactions, follow these steps:
+
1. Navigate to the **Expenses** section in the Expensify app.
2. Filter by **Expensify Card** to view all transactions made using the card.
3. Select any transaction to view the details, including receipts and categorization.
-### [Manage policies] How do I enforce a company policy using Expensify Cards?
-1. Go to **Settings** > **Policies**.
-2. Select the policy to apply to your Expensify Cards.
-3. Under **Spending Rules**, set category and spending restrictions.
-4. Press **Save** to ensure all Expensify Card transactions follow these rules.
+#### [Dispute a transaction] How do I dispute an Expensify Card transaction?
+If you encounter a transaction error, you can dispute it by following these steps:
-## FAQ
+1. Contact the merchant to try and resolve the issue directly.
+2. If unresolved, contact Expensify by opening a chat with Expensify Concierge or emailing concierge@expensify.com with details of the disputed charge and supporting documentation.
+3. If you suspect fraud, immediately deactivate your card by pressing your profile image, selecting **Wallet**, pressing your Expensify Card, and then **Report card fraud**. Follow the prompts to deactivate and request a new card.
+4. Enable [Two-Factor Authentication (2FA)](https://help.expensify.com/articles/new-expensify/settings/Enable-Two-Factor-Authentication) for added security.
-### How do I set up the Expensify Card for my company?
-To set up the Expensify Card:
-1. Go to **Settings** > **Cards**.
-2. Follow the prompts to enable the Expensify Card for your company.
-3. Issue cards to employees, set spending limits, and define company policies for card usage.
+### Digital Wallet and Notifications
+#### [Add to Wallet] How do I add the Expensify Card to my digital wallet?
+To use your Expensify Card for contactless payments, add it to your Apple or Google Pay digital wallet:
+
+**Apple Pay**
+
+1. Open the **Wallet** app on your device.
+2. Press the **+** button to add a new card.
+3. Select **Debit or Credit Card**.
+4. Press **Continue** and follow the instructions to add your virtual Expensify Card.
+
+**Google Pay**
+
+1. Open the **Google Pay** app on your device.
+2. Press **Add to Wallet**.
+3. Select **Payment Card** and then **Add new debit or credit card**.
+4. Enter your virtual Expensify Card details to complete the process.
+
+#### [Enable Notifications] How do I enable notifications for my Expensify Card?
+To receive real-time notifications for spending activity on your Expensify Card, follow these steps:
+
+1. From your Expensify Chat inbox, press the dropdown on the logo or avatar in the top left corner.
+2. Select the workspace you want to update the notification settings for.
+3. Press the workspace chat in your inbox (the chat with your workspace’s name as the title).
+4. Press the header at the top of the chat.
+5. Press **Settings**.
+6. Press **Notify me about new messages** and select **Immediately**.
+
+Then, enable notifications on your device:
+
+**iPhone**
+
+1. Go to your device settings.
+2. Find and tap **New Expensify**.
+3. Tap **Notifications** and enable notifications.
+4. Customize your alerts. Depending on your phone model, you may have extra options to customize the types of notifications you receive.
+
+**Android**
+
+1. Go to your device settings.
+2. Tap **Notifications** and select **Apps notifications**.
+3. Find and tap **New Expensify**.
+4. Enable notifications.
+5. Customize your alerts. Depending on your phone model, you may have extra options to customize the types of notifications you receive.
+
+You will now receive real-time spend notifications to your mobile device.
-### How does the Expensify Card enforce my company’s expense policy?
-The Expensify Card automatically enforces your company’s expense policy by:
-* Blocking purchases outside of approved categories.
-* Enforcing spending limits in real-time.
-* Providing real-time visibility into employee spending for managers.
+### Card Details and Limits
+#### [Update Mailing Address] How do I update my Expensify Card mailing address?
+To update your mailing address for your Expensify Card, follow these steps:
-### How do employees submit expenses with the Expensify Card?
+1. Hover over **Settings** and press **Account**.
+2. Press the **Credit Card Import** tab.
+3. Press **Request a New Card** on your physical card pending activation.
+4. Select **I lost my card**. If you’re updating your address to receive your new Expensify Visa® Commercial Card, select this option even though you have not lost a card.
+5. Confirm your details and press **Continue**.
+6. Update your address and press **Continue**. If the new card has already been shipped to an incorrect address, proceed to the next step to resend the card to the newly updated address.
+7. Proceed with the card replacement. Your new card will arrive in 2-3 business days.
+
+#### [Check Card Limit] How do I check my Expensify Card limit?
+The Smart Limit of your Expensify Card updates automatically after each purchase. To check your available Smart Limit, follow these steps:
+
+1. Press your profile image or icon in the menu.
+2. Press **Wallet**.
+3. Press your Expensify Card to see the available Smart Limit.
+
+### Upgrading and Virtual Card Details
+#### [Upgrade Cards] How do I upgrade to the new Expensify Visa® Commercial Card?
+To upgrade your company’s Expensify Cards to the new Expensify Visa® Commercial Card, follow these steps:
+
+1. On the **Home** page, press the task titled "Upgrade to the new and improved Expensify Card."
+2. Review and agree to the **Terms of Service**.
+3. Press **Get the new card** to automatically mail new physical cards to existing cardholders with limits greater than $0 and issue virtual cards for immediate use.
+4. If Positive Pay is enabled, contact your bank to whitelist the new ACH ID: 2270239450.
+5. Remind employees to update payment information for recurring charges to their virtual card information.
+
+Existing cards remain active until deactivated by a Domain Admin or the cardholder. Cards won't be issued to employees who don't currently have them; you'll need to [issue a new card](https://help.expensify.com/articles/expensify-classic/expensify-card/Set-Up-the-Expensify-Visa%C2%AE-Commercial-Card-for-your-Company) for them.
+
+#### [View Virtual Card Details] How do I view my virtual Expensify Card details?
+To view your virtual card details in Expensify, follow these steps:
+
+1. Press your profile image or icon in the menu.
+2. Press **Wallet**.
+3. Press your Expensify Card.
+4. Press **Reveal Details** to view your virtual Expensify Card number, expiration date, CVV, and address.
+
+## FAQs
+
+### Usage and Setup
+#### Why should I use Expensify Expense for my business?
+The Expensify Card is a corporate payment card that integrates seamlessly with Expensify Expense, providing simplified expense management, real-time control, and cashback rewards.
+
+#### How do I set up the Expensify Card for my company?
+To set up the Expensify Card, go to **Settings** > **Cards**, follow the prompts to enable the Expensify Card for your company, issue cards to employees, set spending limits, and define company policies for card usage.
+
+#### How does the Expensify Card enforce my company’s expense policy?
+The Expensify Card automatically enforces your company’s expense policy by blocking purchases outside of approved categories, enforcing spending limits in real-time, and providing real-time visibility into employee spending for managers.
+
+### Expense Submission and Tracking
+#### How do employees submit expenses with the Expensify Card?
Employees don’t need to manually submit expenses with the Expensify Card. Each transaction is automatically recorded, categorized, and attached to an expense report. Receipts are automatically captured and matched with transactions, eliminating the need for manual entry.
-### Can I track transactions in real-time?
+#### Can I track transactions in real-time?
Yes, the Expensify Card provides real-time visibility into all transactions. Admins and managers can monitor employee spending as it happens, ensuring full control and oversight.
-### What rewards do I earn with the Expensify Card?
+### Rewards and Benefits
+#### What rewards do I earn with the Expensify Card?
The Expensify Card offers up to 2% cashback on all purchases. Cashback can be applied directly to reduce your monthly Expensify bill, or used to offset other company expenses.
-### How do I control where employees can use their Expensify Cards?
+#### How do I control where employees can use their Expensify Cards?
You can control employee card usage by setting vendor and category restrictions. For example, you can restrict cards to be used only for travel-related purchases, or limit spending to certain vendors. These restrictions are enforced at the point of sale.
+### Transaction Issues
+#### Why did my transaction get declined?
+Here are some reasons why an Expensify Card transaction might be declined:
+ - **Insufficient card limit**: If a transaction exceeds your Expensify Card’s available limit, the transaction will be declined. Submitting expenses and getting them approved will free up your limit for more spending.
+ - **Inactive card**: Your card isn’t active yet or it was disabled by your Domain Admin.
+ - **Incorrect card details**: Your card information was entered incorrectly with the merchant. Entering incorrect card information, such as the CVC, ZIP, or expiration date, will also lead to declines.
+ - **Fraudulent or risky activity**: If Expensify detects unusual or suspicious activity, we may block transactions as a security measure.
+
+### Expense Reporting
+#### How do I report my Expensify Card expenses?
+You can report and submit Expensify Card expenses just like any other expenses, and you’ll want to submit them regularly to ensure you have a sufficient spending amount available on the card. As your expenses are approved, your Smart Limit updates accordingly.
+
+SmartScanned receipts should automatically attach to the related Expensify Card expense. Expensify also automatically generates an IRS-compliant eReceipt for every transaction as long as the expense isn’t lodging-related. If your organization doesn’t require itemized receipts, you can rely on eReceipts instead.
+
+### Fraud Protection
+#### How am I protected from fraud using the Expensify Card?
+Expensify uses sophisticated algorithms to detect and block unusual card activity. You can also enable real-time notifications to receive alerts each time your card is charged.
+
+#### How long does the dispute process take?
+The dispute process can take up to 90 days.
+
+#### Can I cancel a dispute?
+You can cancel a filed dispute by using your Expensify Chat thread with Concierge or by emailing concierge@expensify.com.
+
+### Account and Usage Requirements
+#### Do I need a specific type of bank account to use the Expensify Card?
+The Expensify Card requires a US business bank account opened in the name of a business incorporated in the US.
+
+#### Can I use the Expensify Card across multiple workspaces?
+You can use the Expensify Card on every workspace you create. However, a settlement account can only be used with the Expensify Card on one workspace.
+
+#### Can I issue multiple cards to the same employee?
+You can issue an unlimited number of both physical and virtual cards to employees, supporting a variety of use cases.
+
+### Upgrading and Reconciliation
+#### Why don’t I see the task to agree to new terms on my Home page?
+There are several reasons why the task to accept new terms might not appear:
+ - You may not be a Domain Admin.
+ - Another domain admin has already accepted the terms.
+ - The task might be hidden. Scroll to the bottom of the Home page and press **Show Hidden Tasks** to view all tasks.
+
+#### Will upgrading affect the continuous reconciliation process?
+The upgrade process won't affect continuous reconciliation. During the transition, you may have employees with both old and new cards, resulting in two separate debits for your settlement account per period. Once all spending transitions to the new cards, you'll only see one settlement.
+#### Do I have to upgrade to the new Expensify Visa® Commercial Card?
+Yes, an upgrade to the new Expensify Visa® Commercial Card is necessary. A deadline will be provided soon, but you'll have ample time to complete the upgrade.
\ No newline at end of file
diff --git a/help/chat.md b/help/chat.md
index c3b684874974..b46d1bec1066 100644
--- a/help/chat.md
+++ b/help/chat.md
@@ -2,136 +2,246 @@
layout: product
title: Expensify Chat
---
+
## Introduction
-Expensify Chat is a full-featured business chat tool, seamlessly integrated into the Expensify Superapp. It enables real-time collaboration with your team, clients, vendors, and friends, offering a powerful, Slack-style chat experience. Expensify Chat provides all the features you expect from a modern chat tool, including chat rooms, direct messages, file sharing, image attachments, emoji reactions, and threaded conversations.
-
-### [Main uses] When should I use Expensify Chat?
-Expensify Chat is designed for teams and businesses of all sizes to facilitate communication and collaboration. Use Expensify Chat to:
-* **Collaborate with teammates** - Create chat rooms and direct messages to discuss projects, share updates, and work together in real-time.
-* **Support clients** - Manage client conversations with ease, keeping all discussions, invoices, and approvals in one place.
-* **Engage with vendors** - Communicate with your vendors to negotiate, place orders, and track payments.
-* **Coordinate with friends** - Keep in touch with friends and colleagues using direct messages or group chats.
-
-### [Core users] Who uses Expensify Chat?
-Expensify Chat is for everyone who needs to stay connected and collaborate, including:
-* **Teams** - Coordinate work, share updates, and resolve issues quickly with real-time chat rooms and message threads.
-* **Remote workers** - Stay connected with your team from anywhere, with desktop and mobile chat apps that support real-time communication.
-* **Clients** - Provide seamless client communication, allowing you to manage projects and billing through the same platform.
-* **Vendors** - Manage vendor communication, ensuring that orders, invoices, and payments are all handled in one platform.
-* **Friends and family** - Expensify Chat is also great for personal conversations, making it easy to chat and share files with anyone who has an email address.
-
-### [Key advantages] Why should I use Expensify Chat?
-Expensify Chat offers unique benefits that set it apart from other business chat tools:
-* **Integrated with Expensify** - Unlike standalone chat apps, Expensify Chat is fully integrated with the Expensify Superapp, giving you access to all your expenses, invoices, payments, and chats in one platform.
-* **Real-time communication** - Instantly message anyone with an email address or phone number, whether they are part of your organization or an external client or vendor.
-* **Threads and reactions** - Organize conversations with threaded replies and react to messages with emojis to keep discussions focused and fun.
-* **File sharing and attachments** - Share files, images, and links directly within your chats for easy collaboration.
-* **Searchable history** - Expensify Chat allows you to search through all conversations, so you never lose track of important discussions or files.
-* **Cross-device functionality** - Stay connected with your team from anywhere, with support for both desktop and mobile apps.
+Expensify Chat is a tool for real-time collaboration with a Slack-style experience.
+
+### Main Uses
+Key scenarios for using Expensify Chat:
+
+* **Team collaboration** - Discuss projects and share updates in real-time.
+* **Client support** - Keep all client communications and approvals in one place.
+* **Vendor engagement** - Communicate with vendors for negotiations and orders.
+* **Friend coordination** - Stay in touch with friends through direct messages or group chats.
+
+### Core Users
+The main audiences for Expensify Chat:
+
+* **Teams** - Coordinate work and resolve issues quickly.
+* **Remote workers** - Stay connected via desktop and mobile apps.
+* **Clients** - Manage projects and billing seamlessly.
+* **Vendors** - Handle orders and payments efficiently.
+* **Friends and family** - Easy personal conversations with file sharing.
+
+### Key Advantages
+Benefits of using Expensify Chat:
+
+* **Integration with Expensify** - Access expenses, invoices, and chats in one place.
+* **Instant communication** - Message anyone with an email or phone number.
+* **Organized discussions** - Threaded replies and emoji reactions.
+* **Easy file sharing** - Directly share files and images within chats.
+* **Searchable history** - Find past conversations and files effortlessly.
+* **Cross-device support** - Stay connected on desktop and mobile.
## Concepts
-Expensify Chat introduces several key features that make it a powerful communication tool.
-
-### [Chat rooms] How do chat rooms work in Expensify Chat?
-Chat rooms are the core feature of Expensify Chat, allowing groups of people to collaborate in real-time:
-* **Create rooms** - You can create public or private rooms for your team, clients, or vendors. Public rooms are open to anyone in your workspace, while private rooms require an invitation.
-* **Invite members** - Invite anyone with an email address or SMS number to join a chat room, even if they aren’t on Expensify yet.
-* **Threads** - Keep conversations organized by replying to specific messages in a thread. This is useful for discussing multiple topics in a single room.
-
-### [Direct messages] What are direct messages?
-Direct messages are private, one-on-one conversations between two users:
-* **One-to-one messaging** - Use direct messages for private conversations with teammates, clients, or friends.
-* **Send files** - Attach images, documents, and links directly in your one-on-one conversations.
-* **Searchable** - All direct messages are fully searchable, so you can easily find past conversations or files.
-
-### [File sharing] How do I share files in Expensify Chat?
-Expensify Chat makes it easy to share files and attachments:
-* **Upload files** - You can upload images, documents, PDFs, and other files directly into any chat room or direct message.
-* **Preview files** - View shared files directly in the chat without having to download them.
-* **Download files** - All shared files can be downloaded for offline use or further collaboration.
-
-### [Emoji reactions] How do emoji reactions work in Expensify Chat?
-Emoji reactions add a fun and efficient way to respond to messages:
-* **React to messages** - Simply click the emoji icon under any message to react with an emoji. Reactions are visible to everyone in the conversation.
-* **Multiple reactions** - You can add multiple reactions to the same message, and others can join in by adding their own reactions.
-
-### [Threads] How do threaded conversations work?
-Threads allow you to keep conversations organized within chat rooms:
-* **Reply to a specific message** - Instead of creating a new message, you can reply directly to a previous message to start a thread.
-* **View threaded replies** - Threads are nested under the original message, making it easy to follow the conversation.
-* **Keep discussions organized** - Threads prevent clutter in busy chat rooms by grouping related messages together.
-
-### [Search] How does search work in Expensify Chat?
-Expensify Chat includes a powerful search feature to help you find messages, files, and conversations:
-* **Search messages** - Search across all your chat rooms and direct messages to find specific keywords, phrases, or conversations.
-* **Search files** - Quickly locate any files shared in chat rooms or direct messages by searching for file names or types.
-* **Filter by chat room** - Narrow your search results by limiting them to a specific chat room or direct message.
-
-## Platforms
-Expensify Chat works across multiple platforms, ensuring you can stay connected with your team wherever you are:
-* **Web app** - Access Expensify Chat through your browser, with full support for chat rooms, file sharing, and emoji reactions.
-* **Mobile app** - Stay connected on the go with the Expensify mobile app, which supports all chat features, including image attachments and notifications.
-* **Desktop app** - Use the Expensify desktop app for a more immersive experience, with full support for notifications, file sharing, and threaded conversations.
+
+### Chat Types
+Expensify Chat supports several types of communication:
+
+* **Private chats** - One-on-one communication.
+* **Group chats** - Private conversations with multiple participants.
+* **Chat rooms** - Public or private discussions available to workspace members.
+
+### Special Chat Rooms
+Expensify Chat includes special chat rooms for specific purposes:
+
+#### Admin and Announce
+Special rooms in a workspace:
+
+* **#admins** - Only accessible to Workspace Admins to manage settings and collaborate with other admins. This room includes your Expensify Setup Specialist and, if applicable, your Account Manager. You can also:
+ - Chat with your dedicated Expensify Setup Specialist.
+ - Chat with your Account Manager (if you have a subscription with 10 or more members).
+ - Review changes made to your Workspace settings.
+
+* **#announce** - For company-wide announcements. By default, all Workspace Members can send messages, but permissions can be updated to allow only admins to post.
+
+### Update Messaging Permissions in #announce
+To allow only admins to post in an #announce room:
+
+1. Open the #announce room chat in your inbox.
+2. Press the room header.
+3. Select **Settings**.
+4. Choose **Who can post** and select **Admins only**.
+
+### Reorder Chat Inbox
+
+Customize the order of chat messages in your inbox by pinning them or changing your message priority:
+
+* **Pin**: Moves a specific chat to the top of your inbox list.
+* **Message priority**: Determines the order of message display:
+ - **Most Recent**: Shows all chats by the most recent, with pinned chats at the top.
+ - **#focus**: Displays only unread and pinned chats, sorted alphabetically.
+
+#### Pin a Message
+
+To pin a message:
+
+1. Press and hold (or right-click) a chat in your inbox.
+2. Select **Pin**. The chat will be pinned to the top of your inbox.
+3. To unpin, repeat this process and select the pin icon again.
+
+#### Change Message Priority
+
+To change message priority:
+
+1. Press your profile image or icon.
+2. Select the **Preferences** tab.
+3. Choose **Priority Mode** and select either #focus or Most Recent.
+
+### Leave a Chat Room
+
+To leave a chat room:
+
+1. Open the chat room.
+2. Press the header or the 3 dot menu icon in the top right.
+3. Select **Leave**. After leaving, the chat room will no longer appear in your inbox, and you won't receive notifications from it.
+
+### Flag Chat Messages
+
+Flagging a message as offensive (including unwanted behavior or offensive messages or attachments) escalates it to Expensify’s internal moderation team for review. The person who sent the message will be notified of the flag anonymously, and the moderation team will decide what further action is needed.
+
+Depending on the severity of the offense, messages can be hidden (with an option to reveal) or fully removed. In extreme cases, the sender of the message may be temporarily or permanently blocked from posting.
+
+Messages sent in public chat rooms are automatically reviewed for offensive content by an automated system. If offensive content is found, the message is sent to Expensify’s internal moderation team for further review.
+
+To flag a message:
+
+1. Open the chat in your inbox.
+2. Press and hold (or hover over on desktop) the message and select **Flag as offensive**.
+3. Select a category: spam, inconsiderate, intimidation, bullying, harassment, or assault.
## Tutorials
-### [Create a chat room] How do I create a chat room in Expensify Chat?
-1. Navigate to the **Chat** section of the Expensify app.
-2. Press **Create Room**.
-3. Enter a name for the room and choose whether to make it public or private.
-4. Invite members by entering their email addresses or phone numbers.
-5. Press **Create** to finalize the room.
-
-### [Send a direct message] How do I send a direct message?
-1. Press **New Message** from the chat screen.
-2. Enter the email address or phone number of the person you want to message.
-3. Type your message and press **Send**.
-4. Optionally, attach files or images by pressing the attachment icon.
-
-### [React to a message] How do I react to a message with an emoji?
-1. Hover over the message you want to react to.
-2. Press the **emoji** icon that appears below the message.
-3. Choose an emoji from the list, and it will be added to the message.
-4. To add more reactions, simply repeat the process.
-
-### [Start a thread] How do I reply to a message in a thread?
-1. Hover over the message you want to reply to.
-2. Press the **Reply in thread** button.
-3. Type your reply and press **Send**. Your reply will appear nested under the original message.
-
-### [Search for a message] How do I search for messages or files?
-1. Press the **Search** bar at the top of the chat screen.
-2. Enter the keyword, phrase, or file name you are looking for.
-3. Filter results by chat room or direct message (optional).
-4. Press **Search** to view the results.
+### [Create Room] How do I create a chat room?
+To create a chat room:
+
+1. Press the **+** button and select **Start Chat**.
+2. Choose the **#Room** tab.
+3. Enter a name for the room (ensure it's unique within the workspace).
+4. Optionally, add a description.
+5. Select **Workspace** to assign the room to a workspace.
+6. Choose **Who can post** to set posting permissions (all members or only admins).
+7. Set **Visibility** to determine room accessibility:
+ - **Public**: Viewable by anyone (ideal for conferences).
+ - **Private**: Only invited individuals can find it.
+ - **Workspace**: Accessible by all workspace members.
+8. Press **Create room** to finalize the setup.
+
+*Note: Anyone, including those outside the workspace, can be invited to private or restricted rooms.*
+
+### [Invite Members] How do I invite members to a chat group or room?
+Invite members using one of the following methods:
+
+- **Mentioning**:
+ 1. Open the chat group or room.
+ 2. In the message field, type @ and the person’s name or email address. Repeat for all participants.
+ 3. Enter a message if desired and press Send.
+
+- **Members Pane**:
+ 1. Open the chat group or room.
+ 2. Press the room or group header, then **Members**.
+ 3. Press **Invite member**, select contacts, and press **Invite**.
+
+- **Sharing Link or QR Code**:
+ 1. Open the chat group or room.
+ 2. Press the room or group header, then **Share**.
+ 3. Copy the link or present the QR code for others to scan.
+
+*Note*: These options are only for groups or rooms, not for private 1-on-1 chats.
+
+### [Start a Private Chat] How do I start a private 1-on-1 chat?
+To start a private 1-on-1 chat:
+
+1. Press the **+** button and select **Start Chat**.
+2. Enter the name, email, or phone number of the person you want to chat with.
+3. Select their name to start a new chat with them.
+
+*Note: You cannot add more people to a private chat. To include additional participants, create a group chat.*
+
+### [Start a Group Chat] How do I start a group chat?
+To start a group chat:
+
+1. Press the **+** button and select **Start Chat**.
+2. Enter the names, emails, or phone numbers of the participants and select **Add to group** for each.
+3. Press **Next** and update the group image or name if desired.
+ - **Name**: Select **Group Name**, enter the new name, and save.
+ - **Image**: Select the profile image, upload a new image, and adjust as needed.
+4. Press **Start group** to create the chat.
+
+### [Direct Message] How do I send a direct message?
+To send a direct message:
+
+1. Press **New Message**.
+2. Enter the recipient's email or phone.
+3. Type and send your message.
+4. Attach files using the attachment icon.
+
+### [Send and Format Messages] How do I send and format chat messages?
+To send and format chat messages:
+
+1. Open any chat in your inbox.
+2. Use the message bar at the bottom to enter your message, add attachments, and insert emojis.
+ - **To add a message**: Press the field labeled "Write something" and type your message.
+ - **To add an attachment**: Press the plus icon and select **Add attachment**. Choose the attachment from your files.
+ - **To add an emoji**: Press the emoji icon to the right of the message field.
+3. Press the Send icon to send the message.
+
+You can format the text using markdown:
+
+- _Italicize_: Add underscores _ on both sides of the text.
+- **Bold**: Add two asterisks ** on both sides of the text.
+- ~~Strikethrough~~: Add two tildes ~~ on both sides of the text.
+- Heading: Add a number sign # in front of the text.
+- Inline image: Add `` with the URL and alt text.
+- Tag another member: Add an @ symbol followed by the member's name, username, or email.
+- Mention a room: Add a # followed by the room name.
+- > Blockquote: Add an angled bracket > in front of the text.
+- `Code block for a small amount of text`: Add a backtick ` on both sides of the text.
+- Code block for the entire message: Add three backticks ``` at the beginning and end of the message.
+
+### [Start a Conversation Thread] How do I start a conversation thread?
+To start a conversation thread within a chat:
+
+1. Open the chat in your inbox.
+2. Press on the message you want to reply to and select **Reply in thread**.
+3. Enter and submit your reply in the new chat thread.
+
+To return to the main conversation, use the link at the top of the thread.
+
+### [React Message] How do I react to a message?
+To react to a message:
+
+1. Hover over the message (desktop only).
+2. Press the **emoji** icon.
+3. Select an emoji to add to the message.
+
+### [Edit or Delete Messages] How do I edit or delete messages?
+To edit or delete your own messages:
+
+1. Open a chat in your inbox.
+2. Press on the message you want to edit or delete.
+3. Select **Edit comment** to modify the message. Once edited, an "edited" label will appear next to it.
+4. Select **Delete comment** to remove the message or image for all viewers. Note that deleting a message cannot be undone.
## FAQ
### How do I get started with Expensify Chat?
-To start using Expensify Chat:
-1. Log in to your Expensify account and navigate to the **Chat** section.
-2. Create new chat rooms or direct messages and start chatting with your team, clients, or vendors.
-3. You can also join existing chat rooms if you've been invited.
-
-### Can I invite external users to Expensify Chat?
-Yes, you can invite anyone to Expensify Chat by entering their email address or phone number. They will receive an invitation to join and can participate in chat rooms or direct messages.
-
-### Can I search through past conversations in Expensify Chat?
-Yes, Expensify Chat allows you to search through all your past conversations, including chat rooms and direct messages. Simply use the search bar at the top of the screen to find specific messages or files.
+Log in to your account and go to the **Chat** section to create or join chat rooms and start messaging.
-### How do I send files and attachments in Expensify Chat?
-To send files:
-1. Open a chat room or direct message.
-2. Press the **attachment** icon.
-3. Select the file from your device and press **Send**.
+### Can I invite external users?
+Yes, invite anyone via email or phone to join chat rooms or direct messages.
-### What types of files can I share in Expensify Chat?
-You can share images, documents, PDFs, and other common file types in Expensify Chat.
+### Can I search past conversations?
+Yes, use the search bar to find specific messages or files in past conversations.
-### Can I create private chat rooms?
-Yes, when creating a new chat room, you can choose to make it private. Private rooms require an invitation to join, and only invited members can see the room or participate in the conversation.
+### What's the difference between a private 1-on-1 chat and a group chat with only 2 people?
+With a group chat, you can add additional people to the chat at any time. However, you cannot add more participants to a private 1-on-1 chat.
-### How do I manage notifications in Expensify Chat?
-You can manage your notifications from the **Settings** section of the Expensify app. Here, you can customize notification preferences for chat messages, mentions, and other activity.
+### How do I remove someone from a chat group or room?
+Currently, members have to remove themselves from a chat.
+### Why is someone I don't recognize in my #admins room?
+Your #admins room includes your dedicated Expensify Setup Specialist who assists with onboarding and answers your questions. If you have a subscription with 10 or more members, your dedicated Account Manager is also part of the #admins room for ongoing support.
+### Additional Permissions
+Some chat rooms may have permissions that restrict who can send messages. If you do not have the required permission level, you will not be able to send messages in those rooms.
\ No newline at end of file
diff --git a/help/expense.md b/help/expense.md
index 0d0012c95fbb..a6335b8e3549 100644
--- a/help/expense.md
+++ b/help/expense.md
@@ -2,110 +2,881 @@
layout: product
title: Expensify Expense
---
+
## Introduction
Expensify Expense is the core of the Expensify Superapp, offering world-class expense management capabilities for individuals and businesses alike. Whether you're tracking personal expenses for budgeting, submitting receipts for reimbursement, or overseeing company-wide spending, Expensify Expense simplifies the process with its user-friendly design and powerful automation features.
-### [Main uses] When should I use Expensify Expense?
-Expensify Expense is designed for a wide range of expense management needs, including:
-* **Reimburse employee receipts** - Manage business expenses by capturing and submitting receipts for approval.
-* **Track personal expenses** - Keep tabs on your own expenses for tax deductions, budgeting, or general financial tracking.
-* **Split bills** - Easily divide the cost of shared expenses like meals or group activities and send or receive payments.
-* **Automate receipt capture** - Use SmartScan to automatically capture receipt details and categorize them instantly.
-* **Submit and approve expense reports** - Create detailed reports for approval, with multi-level workflows if needed.
-* **Stay on top of company spending** - With corporate cards and real-time tracking, managers can ensure compliance and stay within budget.
-
-### [Core users] Who uses Expensify Expense?
-Expensify Expense is versatile enough for personal, business, and enterprise use. Some key user groups include:
+### [Main uses] What are the main uses of Expensify Expense?
+Expensify Expense is designed for a wide range of expense management needs:
+* **Reimburse Employee Receipts** - Manage business expenses by capturing and submitting receipts for approval.
+* **Track Personal Expenses** - Keep tabs on your expenses for tax deductions, budgeting, or general financial tracking.
+* **Split Bills** - Easily divide the cost of shared expenses like meals or group activities and send or receive payments.
+* **Automate Receipt Capture** - Use SmartScan to automatically capture receipt details and categorize them instantly.
+* **Submit and Approve Expense Reports** - Create detailed reports for approval, with multi-level workflows if needed.
+* **Stay on Top of Company Spending** - With corporate cards and real-time tracking, managers can ensure compliance and stay within budget.
+
+### [Core users] Who are the core users of Expensify Expense?
+Expensify Expense is versatile enough for personal, business, and enterprise use. Key user groups include:
* **Individuals** - Track personal spending and maximize tax deductions with easy categorization of expenses.
* **Freelancers** - Manage client billable expenses and reimbursements.
* **Employees** - Submit expense reports with attached receipts, whether you're in the office or traveling.
* **Managers** - Approve expenses, oversee spending, and ensure compliance with company policies.
* **Accountants** - Streamline financial reporting by integrating with accounting platforms and processing reimbursements.
-* **Corporate teams** - Manage large-scale company expenses with corporate cards and centralized approval workflows.
+* **Corporate Teams** - Manage large-scale company expenses with corporate cards and centralized approval workflows.
-### [Key advantages] Why should I use Expensify Expense?
-Expensify Expense offers a variety of advantages for both personal and corporate users:
-* **Automated receipt capture** - Eliminate manual data entry with SmartScan, which reads and categorizes receipts automatically.
-* **Integrated corporate cards** - Link company cards to track purchases in real-time and avoid the need for reimbursements.
-* **Real-time expense tracking** - Keep an eye on budgets and expenses as they happen, reducing the risk of overspending.
-* **Custom approval workflows** - Create multi-level approval processes to streamline and secure the expense submission process.
-* **Seamless integration** - Sync your expenses with accounting systems like QuickBooks, Xero, NetSuite, and others.
-* **Worldwide compatibility** - Expensify supports every currency, making it ideal for international travel and business.
+### [Key advantages] What are the key advantages of using Expensify Expense?
+Expensify Expense offers a variety of advantages:
+* **Automated Receipt Capture** - Eliminate manual data entry with SmartScan.
+* **Integrated Corporate Cards** - Link company cards to track purchases in real-time.
+* **Real-Time Expense Tracking** - Monitor budgets and expenses as they happen.
+* **Custom Approval Workflows** - Create multi-level approval processes.
+* **Seamless Integration** - Sync your expenses with accounting systems like QuickBooks, Xero, NetSuite, and others.
+* **Worldwide Compatibility** - Expensify supports every currency, ideal for international business.
## Concepts
-Expensify Expense is built on a set of core concepts that make expense tracking easy and efficient:
-### [Receipt capture] How does Expensify Expense capture receipts?
-Expensify simplifies receipt management with SmartScan:
-* **SmartScan** - Automatically scans and extracts important details from your receipts (date, amount, merchant, etc.) and categorizes the expense.
+### [Receipt capture] What is receipt capture in Expensify Expense?
+Receipt capture simplifies receipt management with SmartScan:
+* **SmartScan** - Automatically scans and extracts details from your receipts and categorizes the expense.
* **E-receipts** - Automatically generate IRS-compliant electronic receipts for purchases made with the Expensify Card.
-* **Manual upload** - Take a photo of your receipt or upload it manually from your phone or desktop.
-
-### [Expense reports] How do I create and submit an expense report?
-Expensify streamlines expense report creation:
-1. **Add expenses** - Attach receipts or manually enter expenses into a report.
-2. **Categorize expenses** - Use custom categories and tags to organize your expenses.
-3. **Submit for approval** - Send your report to the relevant approver(s) with just one click.
-4. **Track status** - Get notified when your report is approved and reimbursed.
-
-### [Approvals] What is the approval process?
-Managers can review and approve expenses through a customizable workflow:
-* **Single or multi-level approvals** - Set up multiple approvers based on the amount or department.
-* **Automatic reminders** - Send automatic reminders to approvers to ensure timely processing.
-* **Real-time visibility** - Approvers can see the full expense report with attached receipts and can approve or reject it with a single click.
-
-### [Corporate cards] How do Expensify Cards work?
-Expensify Cards integrate directly with Expensify Expense to automate expense tracking:
-* **Automatic receipt capture** - Transactions made with Expensify Cards automatically generate e-receipts.
-* **Spend limits and controls** - Managers can set individual spending limits, track real-time spend, and lock cards if needed.
-* **Rewards** - Earn up to 2% cashback on Expensify Card purchases.
-
-### [Integrations] Which accounting systems does Expensify Expense support?
-Expensify integrates with all major accounting systems:
-* **QuickBooks** - Sync expenses and receipts with your QuickBooks account for easy reconciliation.
-* **Xero** - Automate the transfer of expense data to your Xero account.
-* **NetSuite** - Link expenses to your NetSuite ERP system for complete financial management.
-* **More integrations** - Expensify also integrates with Sage Intacct, Oracle, and others.
-
-### [Reimbursement] How do I get reimbursed for my expenses?
-Expensify makes reimbursement quick and easy:
-* **Direct deposit** - Get reimbursed directly to your bank account after your report is approved.
-* **International payments** - Expensify supports reimbursement in multiple currencies, perfect for global teams.
-
-## Platforms
-Expensify Expense is available on all platforms, ensuring you can track expenses wherever you are:
-* **Web app** - Access Expensify Expense from your browser at any time.
-* **Mobile app** - Track expenses on the go using the Expensify mobile app for iOS and Android.
-* **Desktop app** - Use the Expensify desktop app for Windows or Mac to manage expenses and reports.
+* **Manual Upload** - Take a photo or upload your receipt manually from your device.
+
+### [Expense categories] What are expense categories?
+Expense categories help code expenses for accounting and financial reporting. Categories can be manually created or imported from connected platforms like QuickBooks, Xero, and NetSuite. Over time, Expensify learns how you categorize specific merchants and applies them automatically.
+
+### [Track taxes] What is tax management in Expensify?
+Expensify allows you to configure and manage tax rates within your workspace, applicable on Collect and Control plans. This applies the correct tax rates to expenses based on currency and workspace settings.
+
+#### Enabling and Managing Taxes
+Expensify allows you to enable and manage tax rates in your workspace:
+
+* **Enable Taxes** - Taxes can be enabled on any workspace where the default currency is not USD. If there's a direct accounting integration, tax rates will be managed through the integration.
+
+* **Managing Tax Rates** - You can manually add, edit, or delete tax rates. Additionally, you can set default tax rates for both workspace currency and foreign currencies.
+
+### [Corporate cards] What is the role of corporate cards in Expensify Expense?
+Corporate cards integrate with Expensify Expense for automated expense tracking:
+* **Automatic Receipt Capture** - Transactions automatically generate e-receipts.
+* **Spend Limits and Controls** - Managers can set limits, track spending, and lock cards.
+* **Rewards** - Earn cashback on Expensify Card purchases.
+
+### [Integrations] What accounting systems does Expensify support?
+Expensify integrates with all major accounting systems, including QuickBooks Online, Xero, NetSuite, and Sage Intacct.
+
+### [Distance Rates] What are distance rates in Expensify?
+Distance rates are configured for mileage expenses, allowing employees to select predefined rates when logging distance-based expenses.
+
+### [NetSuite Integration] What is the NetSuite integration in Expensify?
+NetSuite integration allows for seamless data transfer between Expensify and NetSuite:
+* **Expense Categories** - Automatically imported from NetSuite into Expensify for consistency.
+* **Tags and Report Fields** - Import departments, classes, and locations as tags or report fields for detailed categorization.
+* **Custom Segments/Records** - Import custom segments and records for more specific data mapping.
+* **Auto-Sync** - Synchronize data changes between Expensify and NetSuite daily.
+
+### [Duplicate Detection] What is duplicate detection in Expensify?
+Duplicate Detection helps prevent duplicate expense requests by flagging expenses with the same date and amount in the same member's account:
+* **Flagging** - A red dot appears in the left menu or the expense’s chat room, putting the expense on “hold.”
+* **Eligibility** - Available exclusively for Collect & Control plans.
+
+### [Bank Account Connection] What does connecting a personal bank account to Expensify mean?
+Connecting a personal bank account allows direct receipt of payments and reimbursements:
+* **Secure Verification** - We use Plaid, an encrypted third-party platform, to verify your banking information securely.
+* **Direct Deposits** - Once connected, all payments and reimbursements go directly into your designated bank account.
+
+### [Expensify Wallet] What is the Expensify Wallet?
+The Expensify Wallet enables peer-to-peer payments by connecting a personal bank account:
+* **Setup** - Connect your bank account via Plaid to enable the wallet.
+* **Verification** - Verify your identity through Onfido by uploading identification.
+* **Payments** - Once the wallet is enabled, you can send and receive payments seamlessly.
+
+### [Business Bank Account Validation] What is validating a business bank account in Expensify?
+Validating a business bank account is essential to ensure that your account is ready for use in Expensify:
+* **Test Deposits** - After the bank account connection is approved, Expensify sends three test transactions to your account for validation.
+* **Verification Status** - Check your bank account status in the **Bank accounts** section under workspace settings. The status will either be **Verifying** or **Pending**.
+* **Input Transaction Amounts** - Once you receive the test deposits, input the transaction amounts as prompted in Expensify to complete the validation process.
+
+### [Expense Tags] What are tags in Expensify Expense?
+Tags in Expensify refer to line-item details like classes, projects, locations, and customers that help code expenses for accounting and reporting. Tags can be manually created or imported from a connected accounting system. Expensify learns and applies tags automatically over time.
+
+### [Workflows] What are workflows in Expensify Expense?
+Workflows in Expensify Expense allow you to manage expense approvals and submissions:
+* **Add Approvals** - Requires additional approval for an expense before payment can be authorized. The default approver is the workspace owner, but it can be changed to another workspace admin.
+* **Delay Submissions** - Determines when expenses without issues are automatically submitted. You can set a delay frequency for automatic submissions.
+
+### [Report Fields] What are report fields in Expensify Expense?
+Report fields allow you to add additional details to your reports:
+* **Enable Report Fields** - Report fields can be enabled in Workspaces on the Control plan. They provide a way to specify header-level details like project names or locations.
+* **Create Report Fields** - Once enabled, report fields can be created for free-text input, date selection, or a list of options.
+* **Edit/Delete Report Fields** - Existing report fields can be modified or removed as needed to keep your workspace organized.
## Tutorials
-### [Create report] How do I create an expense report?
-1. Navigate to **Create** > **Expense Report**.
-2. Add your receipts and manually log expenses.
-3. Categorize your expenses.
-4. Submit the report for approval.
+### Expense Reports
+#### [Create report] How do I create an expense report?
+To create an expense report:
+1. Press **Create** > **Expense Report** to start a new report.
+2. Add your receipts and manually log expenses for tracking.
+3. Categorize your expenses for organization.
+4. Submit the report for approval to the relevant supervisor.
+
+#### [Submit Expenses] What happens after I submit an expense?
+After submitting an expense, the next steps depend on whether it was sent to a workspace or an individual:
+- **Workspace submissions**: Automatically added to a report, checked for violations, and a chat is created. Reports are submitted for approval every Sunday, but can be manually submitted if ready.
+- **Individual submissions**: Sent via email or text, with chat option in Expensify Chat for discussions.
+
+#### [Approve expenses] How do I approve expense reports?
+To approve expense reports:
+1. Go to your Inbox and select the report needing approval.
+2. Review the receipts and expense details for accuracy.
+3. Press **Approve** or **Reject** based on your assessment.
+
+### Manage Workflows
+#### [Enable workflows] How do I enable workflows in Expensify?
+To enable workflows:
+1. Press your profile image or icon in the bottom left menu.
+2. Press **Workspaces** in the left menu.
+3. Select the desired workspace.
+4. Press **More features** in the left menu.
+5. Under the Spend section, toggle **Workflows** to enable approval settings.
+
+#### [Select workflows] How do I select workflow settings?
+To select workflow settings:
+1. Press **Workflows** in the left menu.
+2. Toggle the desired settings:
+ - **Add Approvals**: Select an approver for expenses requiring additional approval.
+ - **Delay Submissions**: Choose a frequency for automatic submission of expenses.
+
+#### [Add approvals] How do I add approvals to a workspace?
+To enable Add approvals on a workspace:
+1. Press your profile image or icon in the bottom left menu.
+2. Press **Workspaces** in the left menu.
+3. Select the workspace where you want to add approvals.
+4. Press **Workflows** in the left menu.
+5. Toggle **Add approvals**.
+
+Enabling **Add approvals** reveals the option to set a default approval workflow.
+
+#### [Configure approval workflows] How do I configure approval workflows in a workspace?
+To configure the default approval workflow:
+1. Press your profile image or icon in the bottom left menu.
+2. Press **Workspaces** in the left menu.
+3. Select the workspace where you want to set the approval workflow.
+4. Press **Workflows** in the left menu.
+5. Under **Expenses from Everyone**, press **First approver**.
+6. Select the workspace member as the first approver.
+7. Under **Additional approver**, continue selecting members.
+8. Press **Save**.
+
+To set a custom approval workflow for specific members:
+1. Press your profile image or icon in the bottom left menu.
+2. Press **Workspaces** in the left menu.
+3. Select the workspace where you want to add approvals.
+4. Press **Workflows** in the left menu.
+5. Under **Add approvals**, press **Add approval workflow**.
+6. Choose the specific member for the custom workflow.
+7. Press **Next**.
+8. Select the first approver.
+9. Press **Next**.
+10. Press **Additional approver** to select more members.
+11. Press **Add workflow** to save.
+
+#### [Edit or delete approval workflows] How do I manage approval workflows in Expensify?
+To edit an approval workflow:
+1. On the **Workflows** page, press the workflow to edit.
+2. Press the Approver field for the desired level.
+3. Select or deselect members as approvers.
+4. Press **Save**.
+
+To delete an approval workflow:
+1. On the **Workflows** page, press the workflow to delete.
+2. Press **Delete**.
+3. In the confirmation window, press **Delete** again.
+
+### Set Up Payment Account
+#### [Set up payment account] How do I set up a business bank account for workspace payments?
+To set up a business bank account for payments:
+1. Press **Workflows**.
+2. Enable the **Payments** toggle.
+3. Press **Connect Bank Account** and follow the prompts to connect your company bank account.
+4. Select an authorized expense payer, who is a workspace admin with access to the business bank account.
+
+### Expense Capture
+#### [SmartScan] How do I use SmartScan to capture receipts?
+To use SmartScan, follow these steps:
+1. Press the **+** icon and select **Submit Expense**.
+2. Press **Scan**.
+3. Take a photo of a receipt or upload it from your device. SmartScan will auto-populate details like merchant, date, and amount.
+4. Use the search field to find the desired workspace or person's name, email, or phone number.
+5. Add a description, category, tags, or tax as needed.
+6. (Optional) Enable the expense as billable if it should be billed to a client.
+7. Press **Submit**.
+
+#### [Manually add expense] How do I manually add an expense?
+To add an expense manually, follow these steps:
+1. Press the **+** icon and select **Submit Expense**.
+2. Press **Manual**.
+3. Enter the amount and press **Next**. Choose a currency if necessary.
+4. Use the search field to find the desired workspace or person's name, email, or phone number.
+5. (Optional) Add a description.
+6. Add a merchant.
+7. Press **Show more** to add additional fields like category if needed.
+8. Press **Submit**.
+
+### Manage Expense Tags
+#### [Create and manage tags] How do I create and manage expense tags?
+To create and manage expense tags in your workspace:
+1. Press your profile image or icon in the bottom left menu.
+2. Press **Workspaces** in the left menu.
+3. Select the desired workspace.
+4. Press **More features** and enable the **Tags** toggle in the Organize section.
+5. Press **Tags**.
+6. To add a tag, press **Add Tag**, enter a name, and press **Save**.
+7. To delete a tag, press the tag, press the three-dot menu, and select **Delete tag**.
+
+#### [Enable or disable tags] How do I enable or disable tags for expenses?
+To enable or disable tags:
+1. Press your profile image or icon in the bottom left menu.
+2. Press **Workspaces** in the left menu.
+3. Select the desired workspace.
+4. Press **Tags**.
+5. Press the tag and use the toggle to enable or disable it.
+
+#### [Add or edit a GL code] How do I add or edit a GL code for a tag?
+If your workspace is on the Control plan, you can add or edit a GL code for a tag:
+1. Press your profile image or icon in the bottom left menu.
+2. Press **Workspaces** in the left menu.
+3. Select the workspace.
+4. Press **Tags**.
+5. Press the tag to open tag-settings.
+6. Click the GL code field, make changes, and press **Save**.
+
+### Manage Expense Categories
+#### [Create categories] How do I create expense categories?
+To create expense categories:
+1. Press your profile image or icon in the bottom menu.
+2. Press **Workspaces**.
+3. Select the workspace you want to add categories to.
+4. Press **Categories**.
+5. Press **Add Category** and enter a name.
+6. Press **Save**.
+
+#### [Delete categories] How do I delete expense categories?
+To delete an expense category:
+1. Press the category in the **Categories** page.
+2. Press the three-dot menu in the top right.
+3. Press **Delete category** to permanently delete it.
+
+#### [Enable or disable categories] How do I enable or disable expense categories?
+To enable or disable categories:
+1. Press your profile image or icon in the bottom menu.
+2. Press **Workspaces**.
+3. Select a workspace.
+4. Press **Categories**.
+5. Press a category and use the toggle to enable or disable it.
+
+### Require Tags and Categories
+#### [Require tags and categories] How do I require tags and categories for expenses?
+To require workspace members to add tags and/or categories to their expenses:
+1. Press your profile image or icon in the bottom left menu.
+2. Press **Workspaces** in the left menu.
+3. Select a workspace.
+4. Press **Tags** or **Categories** in the left menu.
+5. Press **Settings** at the top right of the page.
+6. Enable the “Members must tag/categorize all expenses" toggle.
+7. If desired, repeat steps 4-6 for tags or categories (whichever you haven’t done yet).
+
+This will highlight the tag and/or category field as required on all expenses. Note that expenses can still be submitted without a tag and/or category, but the submitter and approver will see an orange dot on the expense details to alert them that the tag/category is missing.
+
+### Distance Expenses
+#### [Create distance expense] How do I create a distance expense?
+To create a distance expense:
+1. Press the **+** icon and select **Submit Expense**.
+2. Press **Distance**.
+3. Enter starting and ending locations.
+4. (Optional) Add stops by pressing **Add stop**.
+5. Press **Next**.
+6. Use the search field to find the desired workspace or person's name, email, or phone number.
+7. (Optional) Add a description.
+8. Press **Submit**.
+
+#### [Create and send a distance request] How do I create and send a distance request for reimbursement?
+To create and send a distance request for mileage reimbursement:
+1. Press the green **+** button and select **Request Money**.
+2. Press **Distance** on the Request Money screen.
+3. Enter the **Start** and **Finish** addresses and press **Next**. If you have multiple stops, add them before proceeding.
+4. Choose the recipient by selecting your organization's workspace from the recent workspaces list.
+5. On the confirmation page, review the amount, date, and distance. Optionally, add a description or category. Press **Request**.
+6. Your request will be sent to a workspace admin for approval and reimbursement through Expensify or other means.
+
+### Manage Distance Rates
+#### [Enable distance rates] How do I enable distance rates in a workspace?
+To enable distance rates in a workspace you manage:
+1. Press your profile image or icon in the bottom left menu.
+2. Press **Workspaces** in the left menu.
+3. Select the workspace where you want to enable distance rates.
+4. Press **More features** in the left menu.
+5. Toggle **Distance rates** to enable the feature.
+
+Once enabled, a new **Distance rates** option will appear in the left menu.
+
+#### [Add or manage distance rates] How do I add, edit, or delete distance rates?
+To manage distance rates:
+1. Press your profile image or icon in the bottom left menu.
+2. Press **Workspaces** in the left menu.
+3. Select the workspace where you want to manage distance rates.
+4. Press **Distance rates** in the left menu.
+
+To add a rate:
+1. Press **Add rate** in the top right.
+2. Enter a value and press **Save**.
+
+To edit or delete a rate:
+1. Press the desired distance rate.
+2. To enable or disable, use the toggle next to **Enable rate** and press **Save**.
+3. To edit, enter the new value and press **Save**.
+4. To delete, press **Delete**.
+
+For bulk actions:
+1. Use the checkboxes next to distance rates.
+2. Press "x selected" at the top right.
+3. Choose **Enable rates**, **Disable rates**, or **Delete rates** as needed.
+
+### Manage Tax Rates
+#### [Enable Taxes] How do I enable taxes on a workspace?
+To enable taxes on your workspace:
+1. Press your profile image or icon in the bottom left menu.
+2. Press **Workspaces** in the left menu.
+3. Select the workspace where you want to enable tax codes.
+4. Press **More features** in the left menu.
+5. Toggle **Taxes** to enable the feature.
+
+After enabling taxes, a new **Taxes** option will appear in the left menu.
+
+#### [Add or manage tax rates] How do I add, edit, or delete tax rates?
+To manage tax rates:
+1. Press your profile image or icon in the bottom left menu.
+2. Press **Workspaces** in the left menu.
+3. Select the workspace where you want to manage tax rates.
+4. Press **Taxes** in the left menu.
+
+To add a rate:
+1. Press **Add rate** in the top right.
+2. Enter a name, value, and tax code, then press **Save**.
+
+To edit or delete a rate:
+1. Press the desired tax rate.
+2. To enable or disable, use the toggle next to **Enable rate** and press **Save**.
+3. To edit, enter the new value and press **Save**.
+4. To delete, press **Delete**.
+
+For bulk actions:
+1. Use the checkboxes next to tax rates.
+2. Press "x selected" at the top right.
+3. Choose **Enable rates**, **Disable rates**, or **Delete rates** as needed.
+
+#### [Change Default Tax Rates] How do I change the default tax rates in a workspace?
+To change the default tax rates:
+1. On the **Taxes** settings page, press **Settings** in the top right.
+2. Press **Workspace currency default** or **Foreign currency default** and select the desired tax rate.
+
+### Bank Account Management
+#### [Connect Business Bank Account] How do I connect a business bank account in Expensify?
+To connect a business bank account:
+1. Enable the Make or Track Payments Workflow by navigating to **Workspaces** > **More Features** > **Enable Workflows**, then press **Workflows** and enable **Make or Track Payments**.
+2. Press **Connect Bank Account** and select either **Connect Online with Plaid** or **Connect Manually**.
+3. Enter your bank details.
+4. Upload a photo of your ID and take a selfie video for verification.
+5. Enter your company information, including business name, address, tax ID, and website.
+6. Provide additional information on beneficial owners if applicable.
+7. Verify all details are accurate and accept the agreement terms.
+
+#### [Validate Business Bank Account] How do I validate a business bank account in Expensify?
+To validate your business bank account:
+1. Navigate to **Settings > Workspaces > _Workspace Name_ > Bank account** to check the status.
+2. If the status is **Verifying**, check your email for further instructions. If **Pending**, proceed to the next step.
+3. Wait 1-2 business days for Expensify to send three test transactions to your bank account.
+4. In the **Bank accounts** section of your workspace settings, input the transaction amounts as prompted.
+
+Once completed, your business bank account is validated and ready for use in Expensify.
+
+#### [Unlock Business Bank Account] How do I unlock a business bank account?
+If your business bank account is locked due to a rejected withdrawal request, follow these steps to unlock it:
+1. Go to **Settings > Workspaces > _Workspace Name_ > Bank account** and press **Fix**. This sends a request to our support team to review the reason for the lock. They will provide you with the necessary next steps.
+2. Be patient, as unlocking the account can take several business days due to ACH processing times and clawback periods.
+
+If you need to enable direct debits from your verified bank account, provide your bank with the following details:
+- **For Expensify**:
+ - ACH CompanyIDs: 1270239450, 4270239450, 2270239450
+ - ACH Originator Name: Expensify
+- **For Bill Payments with Stripe**:
+ - ACH CompanyIDs: 1800948598, 4270465600
+ - ACH Originator Name: expensify.com
+- **For International Reimbursements with CorPay**:
+ - ACH CompanyIDs: 1522304924, 2522304924
+ - ACH Originator Name: Cambridge Global Payments
+
+#### [Connect Personal Bank Account] How do I connect a personal bank account to Expensify?
+To connect a personal bank account for receiving payments and reimbursements:
+1. Press your profile image or icon in the bottom left menu.
+2. Press **Wallet**.
+3. Press **Add Bank Account** to initiate the process.
+4. Press **Continue** to redirect to Plaid for secure bank account verification.
+5. Follow the prompts to enter your bank account details via Plaid.
+6. Once done, return to Expensify to complete the linking process.
+7. Choose the account you wish to connect and press **Save & continue**.
+
+Once connected, payments and reimbursements will be automatically deposited into the linked bank account.
+
+### Invoice Management
+#### [Enable Invoicing] How do I enable invoicing on a workspace?
+To enable invoicing:
+1. Press your profile image or icon in the bottom left menu.
+2. Press **Workspaces** and select the workspace for which you want to enable invoicing.
+3. Press **More features** in the left menu.
+4. Under the Earn section, enable the **Invoice** toggle.
+
+#### [Send Invoice] How do I send an invoice using Expensify?
+To send an invoice:
+1. Press the **+** icon in the bottom left menu and select **Send Invoice**.
+2. Enter the amount due and press **Next**.
+3. Enter the email or phone number of the person who should receive the invoice.
+4. (Optional) Add additional invoice details, including description, date, category, tag, and/or tax.
+5. Press **Send**.
+
+#### [Receive Invoice Payment] How do I receive invoice payments?
+If you have not connected a business bank account to receive invoice payments, you will see an **Invoice balance** in your Wallet. Expensify will automatically transfer these invoice payments once a business bank account is connected.
+
+#### [Pay an Invoice] How do I pay an invoice in Expensify?
+To pay an invoice in Expensify, follow these steps:
+
+1. Press the link in the email or text notification you receive from Expensify.
+2. Press **Pay**.
+3. Choose to **Pay as an individual** or **Pay as a business**.
+4. Press **Add Bank Account** or **Add debit or credit card** to issue payment.
+
+You can also view all unpaid invoices by searching for the sender’s email or phone number on the left-hand side of the app. The invoices waiting for your payment will have a green dot.
+
+### Expense Management
+#### [Approve and Pay Expenses] How do I approve and pay expenses in Expensify?
+To manage expenses effectively, follow these steps:
+
+1. **Manually Approve an Expense**:
+ - Open the Expensify Chat thread for the expense.
+ - Press the expense or group of expenses.
+ - Review the details, ensuring receipt, amount, and description accuracy.
+ - Determine the next step: Approve, hold, or request changes.
+
+2. **Approve Expenses**:
+ - Open the Expensify Chat thread for the expense.
+ - Press the expense or group of expenses.
+ - Review the expense details for correctness.
+ - Decide the next steps:
+ - **Approve**: When satisfied, press **Approve**.
+ - **Handle Holds**: Choose to approve non-held expenses or the full amount, including held ones.
+ - **Request Changes**: Add a comment in the chat thread to request any changes.
+
+3. **Hold an Expense**:
+ - Open the Expensify Chat thread for the expense.
+ - Press the expense or group of expenses.
+ - Press the three-dot menu and select **Hold**.
+ - Enter a reason for the hold.
+ - Review the hold overview and press **Got It**.
+ - When ready, remove the hold or approve the expense.
+
+4. **Unapprove an Expense**:
+ - Press the workspace logo in the top left.
+ - Select the workspace with the expense report.
+ - Search for the approved report.
+ - Press the dropdown arrow for report actions.
+ - Press **Unapprove**.
+
+5. **Pay Expenses**:
+ - Open the Expensify Chat thread for the expense.
+ - Press the expense or group of expenses.
+ - Select a payment option:
+ - Press **Pay** to pay the full amount within Expensify.
+ - Press **Pay Elsewhere** if payment is made outside Expensify.
+
+#### [Review & Resolve Duplicates] How do I handle duplicate expense requests?
+To review and resolve duplicate expenses:
+1. Press the red dot in the left menu or open the expense’s chat room to view the flagged request.
+2. Press the green **Review duplicates** button at the top of the request.
+3. Review the list of potential duplicates.
+4. To resolve a duplicate, press either **Keep all** or **Keep this one**.
+ - **Keep all**: Retains all expenses as separate charges and removes the hold.
+ - **Keep this one**: Retains this expense and discards its other related duplicates.
+5. If discrepancies exist between the duplicates (e.g., category, tags), choose which details to keep.
+6. Confirm your selection to merge the requests or keep all.
+
+The expenses are removed from the duplicates list and the hold is removed.
-### [SmartScan] How do I use SmartScan to capture receipts?
-1. Snap a photo of your receipt or upload it to Expensify.
-2. Let SmartScan automatically detect and categorize the expense.
+#### [Track Expenses] How do I track expenses in Expensify?
+To create, store, or share non-reimbursable expenses using the Track Expenses feature:
+1. Press the **+** icon in the bottom menu and select **Track Expense**.
+2. Create the expense manually, scan the receipt, or add a distance expense.
+3. Choose the next steps for the expense:
+ - **Submit it to someone**: Select this option to request payment from a contact or other members of your Expensify workspace.
+ - **Categorize it**: Select this option to choose a category and additional details to code the expense for a specific workspace. The expense will then be placed on a report and can be submitted to the workspace for approval.
+ - **Share it with my accountant**: Select this option to share the expense with your accountant. The expense will then be placed on a report under the workspace for your accountant to review.
+ - **Nothing for now**: Select this option to store the expense. Expensify will keep the expense until you are ready to take action on it—it won’t expire. When you’re ready, you can then select one of the above options for the expense at a later time.
-### [Approve expenses] How do I approve expense reports?
-1. Go to your Inbox and select the report requiring approval.
-2. Review the receipts and expense details.
-3. Click **Approve** or **Reject**.
+#### [Split an Expense] How do I split an expense with others?
+Splitting an expense allows the person who paid the bill to request money from multiple people who will split the cost with them. To split an expense:
+1. Press the **+** icon and select **Split Expense**.
+2. Upload a photo of your receipt or manually enter the total bill amount.
+3. Press **Next**.
+4. Enter the names, email addresses, or phone numbers for the people you want to request money from. Note: You can select multiple people.
+5. Press **Next**.
+6. (Optional) Enter a reason for the request in the Description field.
+7. (Optional) If you manually entered the bill amount, add the merchant and date of purchase.
+8. Press **Split**.
+
+Each person will receive an email or text with the details of the request. You can also chat with them about the expense in Expensify Chat, and you can receive payments through your Expensify Wallet or outside of Expensify.
+
+### Manage Report Fields
+#### [Enable Report Fields] How do I enable report fields on a workspace?
+To enable report fields on a workspace:
+1. Press your profile image or icon in the bottom left menu.
+2. Press **Workspaces** in the left menu.
+3. Select the workspace you want to enable report fields for.
+4. Press **More features** and toggle **Report Fields** to enable them.
+
+#### [Create Report Fields] How do I create new report fields?
+To create new report fields:
+1. Press your profile image or icon in the bottom left menu.
+2. Press **Workspaces** in the left menu.
+3. Select the workspace you want to create report fields on.
+4. Press **Report Fields** in the left menu.
+5. Press **Add Field** in the top right corner to create a new field.
+6. Enter a name for your report field and select the field type (Text, Date, or List).
+7. Press **Save** to finalize the new field.
+
+#### [Edit or Delete Report Fields] How do I edit or delete existing report fields?
+To edit or delete existing report fields:
+1. Press your profile image or icon in the bottom left menu.
+2. Press **Workspaces** in the left menu.
+3. Select the workspace with the report fields you want to edit or delete.
+4. Press **Report Fields** in the left menu.
+5. Select the report field you wish to edit or delete.
+6. Make the required edits in the right-hand panel, or press **Delete**.
+
+### Accounting Integrations
+#### [Connect to QuickBooks Online] How do I connect Expensify to QuickBooks Online?
+To integrate with QuickBooks Online:
+1. Press your profile image or icon in the bottom left menu to access settings.
+2. Press **Workspaces** and select the workspace you want to connect to QuickBooks Online.
+3. Press **More features** and enable the Accounting toggle.
+4. Press **Accounting** and then **Set up** next to QuickBooks Online.
+5. Enter your Intuit login details to import your settings.
+
+#### [Configure QuickBooks Online] How do I configure QuickBooks Online settings in Expensify?
+Configuring QuickBooks Online involves setting import, export, and advanced settings for seamless integration with Expensify.
+
+1. **Import Settings**:
+ - Under Accounting, select **Import** under QuickBooks Online.
+ - Review settings for Chart of Accounts, Classes, Customers/Projects, Locations, and Taxes.
+
+2. **Export Settings**:
+ - Under Accounting, select **Export** for QuickBooks Online.
+ - Review settings for Preferred Exporter, Export Out-of-Pocket Expenses, and Invoices.
+
+3. **Advanced Settings**:
+ - Select **Advanced** under QuickBooks Online.
+ - Set options for Auto-sync, Invite Employees, Automatically Create Entities, and Sync Reimbursed Reports.
+
+#### [Connect to Xero] How do I connect Expensify to Xero?
+To integrate with Xero:
+1. Press your profile image or icon in the bottom left menu to access settings.
+2. Press **Workspaces** and select your desired workspace.
+3. Press **More features** and enable the Accounting toggle.
+4. Press **Accounting** and then **Set up** next to Xero.
+5. Enter your Xero login details to import your settings.
+
+#### [Configure Xero] How do I configure Xero settings in Expensify?
+To configure Xero settings:
+1. Under the Accounting settings for your workspace, press **Import** under the Xero connection.
+2. Select options for settings like Xero organization, Chart of Accounts, Tracking Categories, Re-bill Customers, and Taxes.
+3. Under the Accounting settings, press **Export** for Xero connection configuration.
+4. Review export settings like Preferred Exporter, Export Out-of-Pocket Expenses, and Xero Bank Account.
+5. Press **Advanced** under Xero connection to set Auto-sync, Set Purchase Bill Status, Sync Reimbursed Reports, and other advanced settings.
+
+#### [Connect to Sage Intacct] How do I connect Expensify to Sage Intacct?
+To integrate with Sage Intacct:
+1. In Expensify, go to **Settings > Workspaces > [Workspace Name] > Accounting**.
+2. Press **Set up** next to Sage Intacct and enter your credentials.
+3. Press **Confirm** to finalize the setup.
+
+#### [Configure Sage Intacct] How do I configure Sage Intacct settings in Expensify?
+To configure Sage Intacct:
+1. Navigate to **Accounting settings** and select **Entity** under Sage Intacct to choose the entity.
+2. Press **Import** to set preferences for categories, expenses, and dimensions.
+3. Press **Export** to choose exporter and methods for expenses.
+4. Press **Advanced** to enable features like auto-sync.
+
+#### [Connect to NetSuite] How do I connect Expensify to NetSuite?
+To integrate with NetSuite:
+1. Log into Expensify as a workspace admin and press your profile image or icon in the bottom left menu.
+2. Scroll down and press **Workspaces** and select the workspace you want to connect to NetSuite.
+3. Press **More features** and enable the Accounting toggle.
+4. Press **Accounting** and then **Set up** next to NetSuite.
+5. Enter your NetSuite Account ID, Token ID, and Token Secret. These can be found in NetSuite under **Setup > Integration > Web Services Preferences**.
+6. Press **Confirm** to complete the setup.
+
+#### [Configure NetSuite] How do I configure NetSuite settings in Expensify?
+To configure NetSuite settings:
+1. Ensure the Expensify Bundle is installed in NetSuite by going to **Customization > SuiteBundler > Search & Install Bundles**.
+2. Enable Token-Based Authentication in NetSuite under **Setup > Company > Enable Features > SuiteCloud > Manage Authentication**.
+3. Add the Expensify Integration Role to a user in NetSuite under **Lists > Employees** and manage access.
+4. Create Access Tokens in NetSuite by entering "page: tokens" in the Global Search and selecting **New Access Token**.
+5. Confirm Expense Categories and Reports are enabled in NetSuite under **Setup > Accounting** and **Employees**.
+6. Follow the detailed steps for ensuring transaction forms are properly configured in NetSuite for Expense Reports, Journal Entries, Vendor Bills, and Credits.
+
+### Exporting Data
+#### [Export Expenses] How do I export expenses to a CSV file?
+To export your expense data to a CSV file:
+1. Press the **Search** tab in the bottom left menu to view your expenses.
+2. Select the checkbox next to the expenses or reports you wish to export.
+3. Press **# selected** at the top-right and select **Download** to export.
+
+ The CSV download will save locally to your device with the file naming prefix "Expensify." This file includes data such as Date, Merchant, Description, From, To, Category, Tag, Tax, Amount, Currency, Type, and Receipt URL.
+
+#### [Exporting Reports to Xero] How do I export reports to Xero manually?
+If an error occurs during an automatic export to Xero:
+1. Check your email or the related Workspace Chat for error notifications.
+2. Resolve the issue by opening the expense and making necessary changes.
+3. Ensure the report is in the Approved, Closed, or Reimbursed state.
+4. An admin must press the heading at the top of the expense, select **Export**, and then choose **Xero**.
+
+#### [Exporting Reports to QuickBooks Online] How do I manually export reports to QuickBooks Online?
+If an error occurs during an automatic export to QuickBooks Online:
+1. Check your email or the related Workspace Chat for error notifications.
+2. Open the expense and make necessary changes.
+3. Ensure the report is in the Approved, Closed, or Reimbursed state.
+4. An admin must press the heading at the top of the expense, select **Export**, and then choose **QuickBooks Online**.
+
+#### [QuickBooks Online Manual Export Troubleshooting] Why can't I manually export a report to QuickBooks Online?
+To export a report to QuickBooks Online, the report must be in the Approved, Closed, or Reimbursed state. If the report is in the Open state, pressing **Export** will lead to an empty page. Ensure the report is submitted or approved if it's in the Processing state. Once these changes are made, an admin can manually export the report to QuickBooks Online.
## FAQ
-### Why should I use Expensify Expense for my business?
-Expensify Expense automates time-consuming processes like receipt capture, approval workflows, and reimbursement, saving you time and improving accuracy.
+### General Inquiries
+#### Why should I use Expensify Expense for my business?
+Expensify Expense automates processes like receipt capture, workflows, and reimbursement, saving time and improving accuracy.
+
+#### How do SmartScan limits work?
+SmartScan allows you to scan a set number of receipts each month for free, with more available under paid plans.
+
+#### Can I use Expensify Expense for free?
+Yes, Expensify Expense offers a free plan with basic features, with advanced plans for larger business needs.
+
+#### How does Expensify support multi-currency expenses?
+Expensify converts expenses to your preferred currency and supports global reimbursement.
+
+### Workflow Management
+#### [Delayed Submission and Approvals] If I have delayed submission and an approver, what should I expect with a report?
+When Add Approver is enabled with Delay Submission, expense reports go from Open > Processing > Approved. If delayed submission is disabled, expense reports go from Processing > Approved.
+
+#### Can an employee have more than one approval workflow?
+No, each employee can have only one approval workflow.
+
+### Integration and Export
+#### [Disconnect from Xero] How do I disconnect Xero from Expensify?
+To disconnect Xero:
+1. Press your profile image or icon in the bottom left menu.
+2. Press **Workspaces** and select your workspace.
+3. Press **Accounting**.
+4. Press the three-dot menu next to Xero and select **Disconnect**.
+5. Press **Disconnect** again to confirm.
+
+You will no longer see the imported options from Xero.
+
+#### [Xero Export Confirmation] How do I know if a report successfully exported to Xero?
+When a report exports successfully, a message is posted in the related Expensify Chat room.
+
+#### [Duplicate Report Handling] What happens if I manually export a report that has already been exported?
+When an admin manually exports a report, Expensify will warn them if the report has already been exported. If the admin chooses to export it again, it will create a duplicate report in Xero. You will need to delete the duplicate entries from within Xero.
+
+#### [Auto Sync Impact] What happens to existing reports that have already been approved and reimbursed if I enable Auto Sync?
+- If Auto Sync was disabled when your Workspace was linked to Xero, enabling it won’t impact existing reports that haven’t been exported.
+- If a report has been exported and reimbursed via ACH, it will be automatically marked as paid in Xero during the next sync.
+- If a report has been exported and marked as paid in Xero, it will be automatically marked as reimbursed in Expensify during the next sync.
+- If a report has not yet been exported to Xero, it won’t be automatically exported.
+
+#### [Report Export to Sage Intacct] Why wasn't my report automatically exported to Sage Intacct?
+There are a number of factors that can cause auto-export to fail. If this happens, you will find the specific export error in the report comments for the report that failed to export. Once you’ve resolved any errors, you can manually export the report to Sage Intacct.
+
+#### [Negative Expenses to Sage Intacct] Can I export negative expenses to Sage Intacct?
+Yes, you can export negative expenses to Sage Intacct. If you are exporting out-of-pocket expenses as expense reports, then the total of each exported report cannot be negative.
+
+#### [NetSuite Plan Requirement] What type of Expensify plan is required to connect to NetSuite?
+You need a Control workspace to integrate with NetSuite. If you have a Collect workspace, you will need to upgrade to Control.
+
+#### [NetSuite Page Size] What should I set my page size to in NetSuite for importing customers and vendors?
+Make sure your page size is set to 1000 in NetSuite for importing your customers and vendors. Go to **Setup > Integration > Web Services Preferences** and search **Page Size** to determine your page size.
+
+#### [NetSuite Export Options] What are the export options for NetSuite?
+You can export out-of-pocket expenses and company card expenses as Expense Reports, Vendor Bills, or Journal Entries in NetSuite. For invoices, select an Accounts Receivable account. Export settings can be configured to choose the date for records, export foreign currency amounts, and export to the next open period if a period is closed.
+
+#### [QuickBooks Online Error Resolution] Why do I see a red dot next to my QuickBooks Online connection?
+If there is an error with your connection, you’ll see a red dot next to Accounting in the left menu. When you press Accounting, you’ll also see a red dot displayed next to the QuickBooks Online connection card. This may occur if you incorrectly enter your QuickBooks Online login information when trying to establish the connection. To resubmit your login details:
+1. Press the three-dot menu to the right of the QuickBooks Online connection.
+2. Press **Enter credentials**.
+3. Enter your Intuit login details to establish the connection.
+
+#### [QuickBooks Online Export Confirmation] How do I know if a report is successfully exported to QuickBooks Online?
+When a report exports successfully, a message is posted in the expense’s related chat room.
+
+#### [Duplicate Report Handling in QuickBooks Online] What happens if I manually export a report that has already been exported?
+When an admin manually exports a report, Expensify will notify them if the report has already been exported. Exporting the data again will create a duplicate report in QuickBooks Online.
+
+#### [Auto Sync Impact for QuickBooks Online] What happens to existing approved and reimbursed reports if I enable Auto Sync?
+- If Auto Sync was disabled when your Workspace was linked to QuickBooks Online, enabling it won’t impact existing reports that haven’t been exported.
+- If a report has been exported and reimbursed via ACH, it will be automatically marked as paid in QuickBooks Online during the next sync.
+- If a report has been exported and marked as paid in QuickBooks Online, it will be automatically marked as reimbursed in Expensify during the next sync.
+
+Reports that have yet to be exported to QuickBooks Online won’t be automatically exported.
+
+#### [Report Exporting to Xero Troubleshooting] Why can't I manually export a report to Xero?
+To export a report to Xero, it must be in the Approved, Closed, or Reimbursed state. If it is in the Open state, pressing **Export** will lead to a notification that the data is not yet available for export. Make sure the report is submitted or approved if it's in the Processing state. Once these changes are made, an admin can manually export the report to Xero.
+
+### Exporting and Downloading Options
+#### [CSV Export Options] Can I export in a different format, like PDF or XLS?
+No, currently Expensify supports CSV export only.
+
+#### [CSV Customization] Can I add columns to the CSV download to capture additional data points?
+No, the CSV template cannot be customized.
+
+#### [Bulk Selection] Can I select expenses or reports in bulk for exporting?
+Yes, you can select expenses or reports in bulk by using the **Select multiple** or **Select all** option. To display these options on the mobile app, simply long press an item.
+
+### Invoicing and Payment
+#### [Workspace Requirement] Why do I need to create a workspace to send an invoice?
+A workspace is a configuration of settings related to your business. Since invoicing is considered a business feature, you must have a workspace to configure and use invoicing.
+
+#### [Invoice Communication] How do I communicate with the sender/recipient about the invoice?
+Expensify will automatically notify the invoice recipient about the new invoice via email, SMS, and a mobile app notification, along with instructions on how to pay it. Daily reminders will be sent until the invoice is paid. Additionally, an invoice chat room will be automatically created in Expensify between the invoice sender, their workspace admins, and the payer. You can use this chat to discuss anything related to the invoice.
+
+#### [Invoice Export] Can you export invoices between an accounting integration?
+Yes, you can export invoices between Expensify and your connected accounting integration.
+
+#### [Invoice Permissions] Who can send and pay an invoice?
+All workspace admins will be able to send and pay invoices. Invoices can also be paid by anyone, including recipients without an Expensify account.
+
+#### [Disable Invoicing] What happens if I disable invoicing in the future?
+When invoicing is disabled, all previously created invoice rooms and historical invoices will remain unaffected and continue to exist. However, all workspace admins will no longer have the option to send an invoice.
+
+#### [Business Bank Account Error] Why am I getting an error after I enter my website when connecting a business bank account?
+We can only accept a private domain website to ensure the security of your business. If you receive an error when entering your website, it is likely because the domain is not recognized as private. Make sure you are using a business email with a private domain. If you continue to experience issues, contact our support team at concierge@expensify.com for further assistance.
+
+### Duplicate Handling
+#### [Duplicate Expense Handling] What should I do if an expense is flagged as a duplicate?
+If an expense is flagged as a duplicate, you can review and resolve it by selecting to keep all duplicates or only one. Adjust and confirm any discrepancies before finalizing your choice.
+
+#### [Duplicate Detection Criteria] When are expenses flagged as duplicates?
+Expenses are flagged as duplicates if they have the same date and amount unless:
+- They were split from a single expense.
+- They were imported from a credit card.
+- Matching email receipts were received with different timestamps.
+
+#### [Concierge Duplicate Alert] What should I do if Concierge flags a receipt as a duplicate?
+If Concierge flags a receipt as a duplicate, scanning the receipt again will trigger the same alert. You can review these in the deleted filter on Expensify Classic.
+
+#### [Edit Duplicate Requests] Can I edit a duplicate request once resolved?
+Yes, you can edit a duplicate request after it has been resolved, but ensure the hold is first removed.
+
+#### [Review Discarded Duplicates] Can I review a discarded duplicate later?
+Yes, approvers can review discarded duplicates to ensure accuracy and prevent fraud.
+
+### Invoice Payment Options
+#### [Invoice Payment Options] What are the payment options for invoices in Expensify?
+When paying an invoice, you can choose to pay as an individual or as a business. You can add a bank account or use a debit or credit card to issue payment. Only the person who received the invoice will see the option to pay it. If you want to pay an invoice outside of Expensify, you will need to coordinate with the vendor to discuss alternative payment options.
+
+#### [Adding Payment Methods] Can I add additional payment methods for paying invoices?
+Yes, you can add additional payment methods to your Expensify Wallet. To do this, go to Account Settings > Wallet, then press Add Bank Account. This allows you to choose a payment method when paying future invoices.
+
+#### [Invoice Sending Limitations] Can anyone send an invoice through Expensify?
+Only Expensify customers can send an invoice. This feature is designed to ensure that businesses using Expensify can manage their invoice billing processes efficiently while providing flexibility for their customers to make payments.
+
+#### [Invoice Visibility] Can someone other than the recipient pay an invoice?
+No, only the person who received the invoice will see the option to pay it. This ensures secure and accurate processing of invoice payments.
+
+#### [Unpaid Invoices] How can I view unpaid invoices?
+To view all unpaid invoices, search for the sender’s email or phone number on the left-hand side of the app. Invoices awaiting your payment will have a green dot.
+
+#### [Invoice Chat Communication] How can I communicate about an invoice?
+You can chat directly with your vendor at expensify.com in the designated invoice room to discuss invoice-related matters.
+
+### Bank Account Requirements
+#### [Business Bank Account Requirements] What are the general requirements for adding a business bank account?
+To add a business bank account to issue reimbursements via ACH (US) or to issue Expensify Cards:
+- Enter a physical address for yourself, any Beneficial Owner (if one exists), and the business associated with the bank account. We cannot accept a PO Box or MailDrop location.
+- We are required by law to verify your identity. Part of this process requires you to verify a US-issued photo ID. Your ID must be issued by the United States to use features related to US ACH. You and any Beneficial Owner (if one exists) must also have a US address.
+
+#### [Beneficial Owner Definition] What is a Beneficial Owner?
+A Beneficial Owner refers to an **individual** who owns 25% or more of the business. If no individual owns 25% or more of the business, the company does not have a Beneficial Owner.
+
+#### [Beneficial Owner Details] What do I do if the Beneficial Owner section only asks for personal details, but my organization is owned by another company?
+Please indicate you have a Beneficial Owner only if it is an individual who owns 25% or more of the business.
+
+#### [Address and ID Verification] Why can’t I input my address or upload my ID?
+When adding a verified business bank account in Expensify, the individual adding the account and any beneficial owner (if one exists) are required to have a US address, US photo ID, and a US SSN. If you do not meet these requirements, you’ll need to have another admin add the bank account and then share access with you once it is verified.
+
+#### [Document Requests] Why am I asked for documents when adding my bank account?
+When a bank account is added to Expensify, we complete a series of checks to verify the information provided to us. We conduct these checks to comply with both our sponsor bank's requirements and federal government regulations, specifically the Bank Secrecy Act / Anti-Money Laundering (BSA / AML) laws. Expensify also has anti-fraud measures in place.
+
+If automatic verification fails, we may request manual verification, which could involve documents such as address verification for your business, a letter from your bank confirming bank account ownership, etc.
+
+If you have any questions regarding the documentation request you received, please contact Concierge and they will be happy to assist.
+
+### Bank Account Validation
+#### [Microtransaction Validation] I don’t see all three microtransactions I need to validate my bank account. What should I do?
+Wait until the end of the second business day. If you still don’t see them, please contact your bank and ask them to whitelist our ACH IDs **1270239450**, **4270239450**, and **2270239450**. Expensify’s ACH Originator Name is "Expensify."
+
+Once that's all set, make sure to contact your account manager or concierge, and our team will be able to re-trigger those three test transactions!
+
+#### [Test Deposits for Validation] How many test deposits will I receive when validating my business bank account?
+You will receive two withdrawals and one deposit in your business bank account to complete the validation process.
+
+#### [Missing Test Deposits] What should I do if I don't see the test deposits in my business bank account after two business days?
+If the test deposits are not visible after two business days, it may be due to direct debits not being enabled on your bank account. In such cases, provide your bank with the following details:
+- ACH CompanyIDs: 1270239450, 4270239450, 2270239450
+- ACH Originator Name: Expensify
+
+If the issue persists, please contact Expensify Support for further assistance.
+
+### Sage Intacct Integration
+#### [Configure Sage Intacct] How do I set up and configure Sage Intacct in Expensify?
+To connect and configure Sage Intacct:
+1. **Connect to Sage Intacct**: Go to **Settings > Workspaces > [Workspace Name] > Accounting** and press **Set up** next to Sage Intacct, then enter your credentials to complete the setup.
+2. **Select Entity**: Choose the Sage Intacct entity to connect each Expensify workspace to, especially for multi-entity setups.
+3. **Import Settings**: Navigate to Accounting settings, press **Import** under Sage Intacct, and set preferences for expense types, categories, dimensions, customers/projects, and tax.
+4. **Export Settings**: Access export options under **Export**, choosing your preferred exporter and export methods for out-of-pocket and company card expenses.
+5. **Advanced Settings**: Enable auto-sync, invite employees, and configure reimbursement sync under **Advanced** settings to ensure seamless integration.
-### How do SmartScan limits work?
-SmartScan allows you to scan a set number of receipts each month for free, with additional scans available under paid plans.
+#### [Frequently Asked Questions] What are common questions about using Sage Intacct with Expensify?
+Some common concerns include:
+- **Auto-sync**: Only newly approved reports will be auto-exported to Sage Intacct. Existing approved reports must be manually exported.
+- **Negative Expenses**: Negative expenses can be exported, but out-of-pocket expense reports cannot be entirely negative.
+- **Export Errors**: If auto-export fails, check report comments for specific errors and resolve them before attempting manual export.
-### Can I use Expensify Expense for free?
-Yes, Expensify Expense offers a free plan with basic features, and advanced plans are available for businesses with larger needs.
+### Sage Intacct Tutorials
+#### [Configure Import Settings] How do I configure import settings for Sage Intacct?
+To configure import settings:
+1. Under Accounting settings, press **Import** for Sage Intacct.
+2. Choose how to import categories, dimensions, customers/projects, and tax.
+3. Configure expense types and chart of accounts based on how you plan to export expenses.
+4. Set up mapping for billable expenses by enabling necessary permissions in Sage Intacct.
-### How does Expensify support multi-currency expenses?
-Expensify automatically converts expenses to your preferred currency and supports global reimbursement.
+#### [Configure Export Settings] How do I configure export settings for Sage Intacct?
+To configure export settings:
+1. In Accounting settings, press **Export** under Sage Intacct.
+2. Choose the preferred exporter and export date options.
+3. Decide whether to export out-of-pocket expenses as expense reports or vendor bills.
+4. Set export preferences for company card expenses, selecting between credit card charges or vendor bills.
+#### [Manage Advanced Settings] How do I manage advanced settings for Sage Intacct?
+To manage advanced settings:
+1. Navigate to **Settings > Workspaces > [Workspace name] > Accounting** and press **Advanced** under Sage Intacct.
+2. Enable auto-sync for daily updates and automatic export of expenses.
+3. Use the invite employees feature to add Sage Intacct users to Expensify.
+4. Configure reimbursement sync to reflect accurate status between Expensify and Sage Intacct.
\ No newline at end of file
diff --git a/help/index.md b/help/index.md
index dde0e97da851..45366fecae11 100644
--- a/help/index.md
+++ b/help/index.md
@@ -3,558 +3,503 @@ layout: product
title: Expensify
---
## Introduction
-The Expensify Superapp packs the full power of 6 world-class business, finance, and collaboration products into a single app that works identically on desktop and mobile, efficiently with your colleagues, and seamlessly with your customers, vendors, family, and friends.
+The Expensify Superapp combines 6 world-class business, finance, and collaboration products into one app. It works identically on desktop and mobile, with colleagues and customers, and for personal use.
-### [Main uses] When should I use Expensify?
+### Main uses
Expensify can do a lot. You should check us out whenever you need to:
-* **Track and manage expenses** - Whether you are reimbursing employee receipts, deducting personal expenses, or just splitting the bill, Expensify Expense is for you.
-* **Issue corporate cards** - Skip the reimbursement and capture receipts electronically in real-time by issuing the Expensify Card to yourself and your employees.
-* **Book and manage travel** - If you are booking your own business trip, arranging a trip for a colleague, or managing the travel of your whole company, Expensify Travel has got you covered.
-* **Chat with friends and coworkers** - Whether it's collaborating with your team, supporting your client, negotiating with your vendor, or just saying Hi to a friend, Expensify Chat connects you with anyone with an email address or SMS number.
-* **Collect invoice payments online** - Expensify Invoice allows you to collect online payments from consumers and businesses alike – anyone with an email address or SMS number.
-* **Approve and pay bills online** - Scan, process, and approve bills online using Expensify Billpay, then we'll pay them electronically or via check, whatever they prefer.
-
-If you send, receive, or spend money – or even just talk to literally anyone, about literally anything – Expensify is the tool for you.
-
-### [Core users] Who uses Expensify?
-Expensify offers something for everyone. Some people who commonly use us include:
-* **Individuals** - Millions of individuals use Expensify to track personal expenses to maximize their tax deductions, stay within personal budgets, or just see where their money is going.
-* **Friends** - Expensify is a great way to split bills with friends, whether it's monthly rent and household expenses, a big-ticket bachelorette party, or just grabbing drinks with friends.
-* **Employees** - Road warriors and desk jockeys alike count on Expensify to reimburse expense reports they create in international airports, swanky hotels, imposing conference centers, quaint coffee shops, and boring office supply stores around the world.
-* **Managers** - Bosses manage corporate spend with Expensify to empower their best (and keep tabs on their… not-so-best), staying ahead of schedule and under budget.
-* **Accountants** - Internal accountants, fractional CFOs, CAS practices – you name it, they use Expensify to Invoice customers, process vendor bills, capture eReceipts, manage corporate spend: the whole shebang. If you're an accountant, we're already best friends.
-* **Travel managers** - Anyone looking to manage employee travel has come to the right place.
-
-If you are a person online who does basically anything, you can probably do it with Expensify.
-
-### [Key advantages] Why should I use Expensify?
-Though we do a lot, you've got a lot of options for everything we do. But you should use us because we are:
-* **Simple enough for individuals** - We've worked extremely hard to make a product that strips out all the complex jargon and enterprise baggage, and gives you a simple tool that doesn't overwhelm you with functionality and language you don't understand.
-* **Powerful enough for enterprises** - We've worked extremely hard to make a product that "scales up" to reveal increasingly sophisticated features, but only to those who need it, and only when they need it. Expensify is used by public companies, multinational companies, companies with tens of thousands of employees, non-profits, investment firms, accounting firms, manufacturers, and basically every industry in every currency and in every country around the world. If you are a company, we can support your needs, no matter how big or small.
-* **6 products for the price of 1** - Do you pay for an expense management system? A corporate card? A travel management platform? An enterprise chat tool? An invoicing tool? A billpay tool? Now you don't need to. Expensify's superapp design allows us to offer ALL these features on a single platform, at probably less than what you pay for any of them individually.
-* **Supports everyone everywhere** - Expensify works on iPhones and Androids, desktops and browsers. We support every currency and can reimburse to almost any country. You don't need to be an IT wizard – if you can type in their email address or SMS number, you can do basically everything with them.
-* **You get paid to use it** - Do you spend money? Spend it on the Expensify Card and we pay you up to 2% cashback. It's your money after all.
-* **Revenue share for accountants** - Do you manage the books for a bunch of clients? Become an Expensify Approved Accountant and take home 0.5% revenue share. Or share it with your clients as a discount, up to you!
-
-You are in the driver's seat; we're here to earn your business. But we're going to work harder for you than the other guys, and you won't be disappointed.
+* **Track and manage expenses** - Whether reimbursing employee receipts, deducting personal expenses, or splitting a bill, Expensify Expense is for you.
+* **Issue corporate cards** - Skip reimbursement and capture receipts in real-time by issuing the Expensify Card to yourself and employees.
+* **Book and manage travel** - If booking your own trip, arranging for a colleague, or managing company travel, Expensify Travel has you covered.
+* **Chat with friends and coworkers** - Collaborate with your team, support clients, negotiate with vendors, or just say Hi with Expensify Chat.
+* **Collect invoice payments online** - Expensify Invoice lets you collect online payments from anyone with an email or SMS number.
+* **Approve and pay bills online** - Scan, process, and approve bills online with Expensify Billpay, and we'll pay them electronically or via check.
+
+If you send, receive, or spend money – or talk to anyone about anything – Expensify is for you.
+
+### Core users
+Expensify offers something for everyone. Common users include:
+* **Individuals** - Millions track personal expenses to maximize deductions, stay within budgets, or see where money goes.
+* **Friends** - Split bills with friends for rent, parties, or drinks.
+* **Employees** - Reimburse expense reports from airports, hotels, conference centers, or coffee shops.
+* **Managers** - Manage corporate spend, empowering the best and keeping tabs on the rest, staying on schedule and budget.
+* **Accountants** - Internal accountants, CFOs, CAS practices use Expensify to invoice customers, process vendor bills, and manage spend.
+* **Travel managers** - Manage employee travel easily with Expensify.
+
+If you're online doing anything, Expensify can probably help.
+
+### Key advantages
+You've got options, but use Expensify because it is:
+* **Simple enough for individuals** - A simple tool without overwhelming functionality or language.
+* **Powerful enough for enterprises** - It scales up to reveal sophisticated features only when needed. Used by public companies, multinationals, and more.
+* **6 products for the price of 1** - Offers expense management, corporate cards, travel management, chat, invoicing, and billpay in one platform.
+* **Supports everyone everywhere** - Works on iPhones, Androids, desktops, and browsers, supporting every currency and reimbursing to almost any country.
+* **You get paid to use it** - Spend on the Expensify Card and earn up to 2% cashback.
+* **Revenue share for accountants** - Manage client books and earn or share a 0.5% revenue share.
+
+You are in the driver's seat, and we're here to earn your business.
## Concepts
-The Expensify Superapp has a lot of moving pieces, so let's break them down one by one.
-
-### [Superapp] What makes Expensify a superapp?
-A "superapp" is a single app that combines multiple products into one seamlessly interconnected experience. Expensify isn't a "suite" of separate products linked through a single account – Expensify is a single app with a single core design that can perform multiple product functions. The secret to making such a seamless experience is that we build all product functions atop the same common core:
-* **App** - The basis of the superapp experience is the actual app itself, which runs on your mobile phone or desktop computer.
-* **Chats** - Even if you don't plan on using Expensify Chat for enterprise-grade workspace collaboration, chat is infused through the entire product.
-* **Expense** - Even if you aren't actively managing your expenses, you've still got them. Every product that deals with money is ultimately dealing with expenses of some kind.
-* **Workspace** - Though Expensify works great for our millions of individual members, every product really shines when used between groups of members sharing a "workspace."
-* **Domain** - To support more advanced security features, many products provide extra functionality to members who are on the same email "domain."
-
-These are the foundational concepts you'll see again and again that underpin the superapp as a whole.
-
-### [App screens] What is the Expensify app?
-Just like your eyes are a window to your soul, the Expensify App is the doorway through which you experience the entire global world of interconnected chat-centric collaborative data that comprises the Expensify network. The main tools of this app consist of:
-* **Inbox** - The main screen of the app is the Inbox, which highlights exactly what you should do next, consolidated across all products.
-* **Search** - The next major screen is Search, which as you'd expect, lets you search everything across all products, from one convenient and powerful place.
-* **Settings** - Settings wraps up all your personal, workspace, and domain configuration options, all in one helpful space.
-* **Create** - Finally, the big green plus button is the Create button, which lets you create pretty much anything, across all the products.
-
-It's a deceptively simple app, with a few very familiar-looking screens and buttons that unlock an incredible range of sophisticated multi-product power.
-
-### [Platforms] Where can I use the Expensify app?
-The Expensify app comes in three flavors:
-* **Expensify web app** - The Expensify web app is what you would access at new.expensify.com. You can access the web app via a mobile web browser or a desktop web browser – it's optimized to work on both.
-* **Expensify mobile app** - The Expensify mobile app works more or less identically to the Expensify web app (when opened in a mobile browser), but is more reliable, higher performance, has better support for notifications.
-* **Expensify desktop app** - The Expensify desktop app works more or less identically to the Expensify web app (when opened in a desktop browser), but is more reliable, higher performance, and has better support for notifications.
-
-Whatever computer or phone you use, Expensify will work on it.
-
-### [Workspace] What is a workspace?
-A workspace groups members together to enable secure sharing and real-time collaboration. Every product adds features to the workspace, but all share the same common baseline:
-* **Name** - You can name your workspace anything. Names are not globally unique, but even if every other Alice has their own "Alice's Apples" workspace, yours is definitely the most special.
-* **Profile photo** - Give your workspace a great headshot (or logo), or just stick with the beautiful one it is randomly assigned.
-* **Description** - Help your members out by giving a good description to your workspace containing copious links and details.
-* **Currency** - Though every workspace can support expenses in every currency, for convenience they are all converted into a single currency of your choosing.
-* **Headquarters** - Workspaces work great for virtual teams, but some products deal with the physical world and need to know where you are headquartered.
-* **Members** - Though there are many situations in which you might want a workspace just for personal use, in general, workspaces work best when they have many members.
-* **Admins** - All members have some common elements of access, but "admin" members have enhanced privileges to manage the workspace overall.
-* **Rooms** - Every workspace has a series of chat rooms, some of which are built in automatically and some of which are created manually.
-* **Plan** - Workspaces come in two flavors, depending on the functionality you need:
- * **Collect** - The Collect workspace is optimized for businesses with simpler requirements looking for basic expense management, Expensify Card, invoice collections, and bill pay functionality.
- * **Control** - The Control workspace is built for more advanced companies with more powerful needs, such as multi-level approval, advanced domain control, enterprise accounting integrations, and so on.
-
-Workspaces make up the backbone of Expensify's collaboration features.
-
-### [Domain] What is a domain?
-A domain is a secondary way of grouping users, generally for more advanced security purposes. Unlike a workspace, which can contain anybody with any email address or SMS number, you join a domain by validating your email address and then optionally "claiming" it as your own.
-* **Name** - Each domain corresponds to the "domain name" of your email address (eg, cathy@croissants.com would have the domain of `croissants.com`). Unlike a workspace, you can't rename your domain.
-* **Members** - A domain is similar to a workspace in that it represents a group of users. Unlike a workspace, however, domain members are generally limited to those who have validated email contact methods on this domain.
-* **Group** - Every member of the domain is a member of exactly one group on the domain. This domain group sets various security rules for that member, such as setting their "preferred workspace."
-
-Domains allow for more advanced management and top-down control of Expensify members.
-
-### [Inbox] What does the Inbox do?
-Given Expensify's chat-centric design, that makes Expensify in effect a superpowered chat app – and in any chat app, the most important page is the Inbox. The Inbox does a real-time search across all products to highlight exactly what you should do *right now*. A few key features of the Inbox include:
-* **Green dot** - Whenever someone is waiting on you to do something – such as an expense you need to reimburse or a booking you need to approve – that thing's chat will be put to the top of the list with a little green dot next to it.
-* **Red dot** - Anything you need to finish to accomplish something you started – such as fixing a violation before an expense can be submitted – will also be put to the top of the list with a little red dot next to it.
-* **Pinned** - Anything you want to pay special attention to can be manually "pinned" to the top of the Inbox so it stays top of mind.
-* **Priority mode** - Though everyone's work style is unique to them, the Expensify app is organized around two modes of prioritization:
- * **Most recent mode** - The default mode for new users is to sort the Inbox to put whatever chat was most recently modified at the top. This works particularly well for those engaged in rapid-fire collaboration who want to "go where the action's at."
- * **Focus mode** - When the Inbox gets over 30 rows, it automatically switches to "focus mode," which alphabetically organizes the chats and only shows those that are "unread" (ie, have comments you haven't read yet), have a green or red dot, or are pinned. This works well for those engaged in many large group conversations that you might want to monitor, but not necessarily engage with immediately.
-
-The Inbox is the most powerful page in the app, and where you will spend the bulk of your time.
-
-### [Search] What does Search do?
-By and large, pretty much anything. Expensify has a "universal search" design that brings all data objects into a single place, and then lets you search all those objects using an incredibly flexible and powerful search engine. Search consists of the following main pieces:
-* **Query** - At the top of the search page is the "query," which formally describes what you are searching for.
-* **Datatype selector** - By default, we will search all datatypes simultaneously, but you can narrow the results to a single type.
-* **Filters** - Similarly, each datatype has its own properties (eg, an expense has an amount, a trip has a destination), and you can filter on each.
-* **Saved searches** - If you dial in a search you intend to do again and again, you can save it for future reuse.
-
-The Inbox's job is to push information in your direction, but the Search page exists to help you find anything you're looking for.
-
-### Settings
-Every product will generally have its own distinct settings, but all settings are conveniently grouped into three main categories:
-* **Account** - Every user has an "account" that stores all data owned by that user. Each individual person has a single user account, though that account can be associated with many contact methods (ie, email addresses and SMS numbers).
-* **Workspace** - Group functionality across all products is organized into "workspaces," which allow secure sharing of data and settings between multiple members.
-* **Domain** - Many users sign up with an email address, and the end of that address (ie, @company.com) corresponds to the "domain" that user is a member of. Domains are another way to group accounts and securely share data between the domain members.
-
-Every product adds its own layers of sophistication and power onto the common foundation of this shared superapp core.
-
-#### [Account] What are my account settings?
-Your account contains the sum total of all data you own or shared with you, across all products. But all products rely upon the same common set of account properties:
-* **Profile** - Your profile allows you to introduce and uniquely identify yourself to everyone else.
-* **Wallet** - Your wallet organizes the various financial payment tools (such as the Expensify Card) and bank accounts associated with your account.
-* **Preferences** - Your preferences configure high-level settings on how you are notified and how data is presented to you.
-
-Your personal account contains all the details that make you, you.
-
-#### [Profile] What are my profile settings?
-Your "profile" is how you identify yourself, both publicly and privately:
-* **Your public details** - As the name implies, your public details can be seen by other users. These include:
- * **Profile photo** - Your profile photo is the image that is shown next to your name wherever you appear. You can customize this however you please, or a random "avatar" image will be picked for you.
- * **Display name** - Your display name is the name that is generally shown next to your photo. If you don't have a display name, then your primary contact method will be shown instead.
- * **Contact methods** - Your contact methods are all the email addresses and SMS numbers associated with your account. All contact methods allow you to sign in and associate any email receipts with your account.
- * **Primary contact method** - This is the contact method that is highlighted on your profile, and to which all communications are sent. If you are an employee of a business, your primary contact method will typically be your company email address.
- * **Secondary contact method** - You can add any number of "secondary" contact methods. These are not shown on your profile, but do allow you to sign into your account. It's helpful to have multiple secondary contact methods (such as a personal email address and personal phone number) to ensure you can access your account if you lose access to your primary contact method (such as your work address).
- * **Status** - Your status is an expiring optional icon and message you can set that appears next to your name, such as to hint that you are on vacation or in a meeting, etc.
- * **Pronouns** - Your pronouns are an optional tool for allowing you to indicate how you would like to be addressed by others.
- * **Timezone** - Your timezone reflects the timezone in which you are currently located. This will generally be set automatically as you travel around the world, but can be manually set as well.
-
-* **Your private details** - Also as the name implies, your private details are not shown to others but might be required to enable certain functionality:
- * **Legal name** - Your legal name is what appears on your government ID, which might differ from how you like to be addressed on a daily basis (ie, your display name). By default, your legal name is assumed to be your display name, but if that is not the case, you can easily correct this.
- * **Date of birth** - Your date of birth is the birthday listed on your government ID.
- * **Address** - Your address reflects where you would like us to contact you via mail, in the event we ever need to do so (such as to ship you an Expensify Card).
-
-The combination of your public and private profile gives you the tools to introduce yourself to the world and to us.
-
-#### [Wallet] What are my wallet settings?
-Your wallet is your one-stop shop for all things banking and payment card-related. The major items in your wallet include:
-* **Cash** - Just like a regular wallet that has a mix of cash and cards, your Expensify wallet is also able to hold electronic cash you receive from others.
-* **Cards** - This contains a central list of every card associated with your Expensify account:
- * **Expensify Cards** - Your employer can assign you an Expensify Card that gives you access to company credit for business purchases.
- * **Imported cards** - You can import the transactions from your personal or corporate card into Expensify to submit to your company for approval or reimbursement or just to manage for your own needs.
- * **Payment** - You can link a credit card to your account for paying your Expensify subscription or to fund your wallet's cash balance.
-* **Bank accounts** - This contains a link of bank accounts associated with your Expensify account:
- * **Personal bank account** - You can like a personal bank account to either receive company reimbursements or fund your wallet's cash balance.
- * **Business bank account** - You can connect your business's bank account to reimburse expenses, issue Expensify Cards, collect online invoice payments, pay bills, and more!
-
-Just like your normal wallet, a lot can be stuffed into your Expensify wallet, and all of it is priceless.
-
-#### [Preferences] What are my preferences?
-Your preferences are personal settings that affect how we display information to you:
-* **Training and marketing** - We, in general, like to occasionally reach out with new information about features, changes, or offers to help – but only if you like.
-* **App sounds** - We've worked hard to come up with some subtle audio cues that hint when certain actions happen in the app, but they are entirely optional.
-* **Priority mode** - This is how you specify which Inbox priority mode you prefer.
-* **Language** - Everybody in the world can use Expensify, and we are supporting an increasing number of languages natively.
-* **Theme** - Give into the dark side or stay in the light, we won't judge!
-* **Two-factor authentication** - We strongly recommend everyone enable two-factor authentication to secure access to your account.
-
-Everybody likes things their own way, and preferences are how you make the Expensify app your own.
-
-#### [Subscription] What are my subscription settings?
-Most of Expensify is completely free to use, and millions of members use Expensify without paying anything at all. To unlock our more powerful functionality, create a workspace and pick which products you need – each can be adopted independently, but all are included in the base price (though some products have slightly different nuances: Expensify Card cashback deducts from the bill, Expensify Travel booking fees add to the bill, etc). Regardless of which products you enable, all are billed together via the same subscription. Your subscription consists of the following:
-* **Billing card** - Pick a credit or debit card from your wallet to pay your subscription.
-* **Subscription length** - Expensify has options for everyone depending on your specific needs, allowing you to balance cost versus commitment:
- * **Pay-per-use** - By default, your Expensify account starts with zero-risk, zero-commitment: just use Expensify to your heart's content, and you will be billed for as much or as little as you use the next month.
- * **Annual plan** - Once you know how much Expensify you need, lock in a 50% annual plan discount by committing to a certain number of seats for 12 months. The annual plan is configured as follows:
- * **Subscription size** - This is the number of seats you commit to purchasing for the next 12 months (billed monthly), at a 50% discounted rate. Any active seats billed at the end of the month in excess of the subscription size are billed at the pay-per-use rate (ie, without the 50% discount).
- * **Auto-renew** - Whether to automatically renew this subscription at the end of 12 months, or revert back to pay-per-use (giving up the 50% discount).
- * **Auto-increase annual seats** - Whether to automatically increase the number of annual seats you commit to based on the number of seats used. This avoids being accidentally billed for any pay-per-use seats.
-
-Pick the plan that works for you, and feel free to change as you need.
-
-#### [Price] What is the price of Expensify?
-For most users, Expensify is completely free. For business users, the price of Expensify depends on which features are enabled – and with Expensify Card cashback, you can actually be paid to use Expensify! The major variables going into the price of Expensify for your specific needs include the following:
-* **Personal use** - Most users enjoy Expensify free of charge, as there is a huge range of free features designed for use by yourself and with your friends.
-* **Active seats** - Our paid functionality is largely contained within workspaces and billed on an "active seat" basis. This means at the end of the month, we look over the activity of each workspace member to determine if they used any paid functionality or merely free features:
- * **Paid seat** - A workspace member who uses any paid functionality (ie, submitting, approving, or paying expenses) requires a "paid seat."
- * **Free seat** - A workspace member who only used free functionality (ie, viewing expenses, chatting outside of an expense report) only requires a "free seat."
-* **Paid seat price** - Once we determine how many paid seats you require in a given month, we initially set the price per paid seat at $20/seat/mo for Collect workspaces and $36/seat/mo for Control.
-* **Expensify Card discount** - The first modification to the base seat price is to assess how much total spend was approved on the workspace, versus how much of it was spent on the Expensify Card. This will generate a sliding discount ranging from 0% (if you aren't using the card at all) to 50% (if you have used the Expensify Card for at least 50% of your company's spend). The Expensify Card discount is applied to the seat price, which can reduce it down to $10/seat/mo for Collect workspaces or $18/seat/mo for Control. For example:
- * If your company spends 0% of the total approved spend on the Expensify Card, you receive no discount.
- * If your company spends 25% of the total approved spend on the Expensify Card, you receive a 25% discount off each seat.
- * If your company spends 75% of the total approved spend on the Expensify card, you receive a 50% discount off each seat.
-* **Annual plan discount** - Next, we determine how many seats you have committed to in your annual plan subscription size and apply an additional 50% discount to those seats – bringing the price down to $5/seat/mo for Collect workspaces, or $9/seat/mo for Control.
-* **Expensify Card cashback** - Finally, we calculate how much cashback you earned from spending on the Expensify Card and apply that to the bill, reducing the price further. In many cases, the cashback is larger than the Expensify bill itself, meaning our so-called "paid" features could not only be free, *you can actually be paid to use them.*
-
-Long story short, depending upon which features you use, you might pay us, it might be free, or we might even pay you. There are a lot of variables involved, so please check out our savings calculator to understand how this will shake out for you.
-
-#### [Save the world] What the heck is "Save the world"?
-Expensify.org’s mission is to empower individuals and communities to eliminate injustice around the world by making giving and volunteering more convenient, meaningful, and collaborative. We simplify full transparency for all, allowing our donors and volunteers to connect and make positive permanent changes. The foundation of Expensify.org was built on applying our expertise in expense management to increase the transparency of how funds are used, the convenience of how donations are gathered, and — most importantly — the human connection between donors, volunteers, and recipients.
-
-Please note that our funding model is not in the form of a grant given to a nonprofit organization. Instead, we're looking to help amplify the work of individuals who are directly absorbing the costs.
-
-### [Global create] What does the big green Create button do?
-Saving the best for last is the big green "global create" button. As the name suggests, this allows you to create basically anything your account is allowed to create. The exact options will depend on which products are configured in your workspace, but it can be any of the following:
-* **Start chat** - Begins a new chat with one or more users.
-* **Track expense** - Tracks an expense for personal use.
-* **Submit expense** - Submits an expense to another user for payment.
-* **Split expense** - Splits an expense with one or more other users for shared payments.
-* **Pay someone** - Sends money to another user from your Expensify wallet balance.
-* **Send invoice** - Sends an invoice from a workspace to a customer for online payment.
-* **Assign task** - Creates a new task and assigns it to yourself or another user for completion.
-* **Book travel** - Books a flight, hotel reservation, or car rental.
-* **Quick action** - Repeats the last action you took, most commonly to scan a receipt and submit it via a particular workspace all in a single button.
-
-As you can see, there's a lot packed into that big button – press it and see what happens!
-## Tutorials
-The Expensify superapp has a lot of moving parts, what specifically are you trying to do? Let's point you in the right direction with some step-by-step guides.
-
-### Role
-
-#### [Individual] How do I use Expensify as an individual?
-Expensify is designed to be flexible for a wide range of individual use cases. As an individual, you can:
-1. Track personal expenses
-2. Split bills with friends
-3. Collect receipts and categorize them
-4. Use Expensify Card for cashback and simplified reimbursement
-
-Simply log in, navigate to the expense section, and use the Create button to start organizing your expenses.
-
-#### [Friends] How do I use Expensify with my friends?
-You can use Expensify to settle shared expenses between friends, such as splitting the bill at a restaurant. Here's how:
-1. Create an expense and enter the total amount.
-2. Choose **Split Expense** and add your friends by entering their email addresses.
-3. Expensify will calculate each person's share, and you can easily send a request to them to settle the balance.
-
-#### [Employee] How do I use Expensify as an employee?
-As an employee, Expensify can help you:
-1. Submit expense reports for approval.
-2. Use the Expensify Card for company expenses.
-3. Book travel and manage expenses during work trips.
-4. Communicate with colleagues through integrated chat features.
-
-After logging in, create an expense report, attach receipts, and submit it for approval through your workspace.
-
-#### [Manager] How do I use Expensify as a manager?
-Managers can use Expensify to:
-1. Approve or reject expense reports from their team.
-2. Monitor corporate spending in real-time.
-3. Issue Expensify Cards to employees.
-4. Set up advanced approval workflows for multi-level reviews.
-
-Use the Inbox and Workspace features to manage team expenses and approvals efficiently.
-
-#### [Accountant] How do I use Expensify as an accountant?
-Accountants can:
-1. Manage multiple clients’ expense workflows through different workspaces.
-2. Create invoices and collect payments.
-3. Export data directly to accounting software for tax purposes.
-4. Benefit from revenue-sharing programs by becoming an Expensify Approved Accountant.
-
-You can use the Invoice and Bill Pay tools to manage clients' billing, and track expenses for tax reporting.
-
-#### [Travel manager] How do I use Expensify as a travel manager?
-Travel managers can:
-1. Book and manage employee travel.
-2. Track expenses related to flights, hotels, and car rentals.
-3. Issue Expensify Cards for travel-related spending.
-4. Approve travel expenses before they are reimbursed.
-
-Simply navigate to the Travel section, where you can manage travel bookings and expense submissions in one place.
-
-### Platforms
-
-#### [Web] How do I access Expensify on the web?
-To visit the Expensify website:
-1. Go to www.expensify.com, either on a desktop or mobile browser.
-
-#### [Mobile] How do I install the Expensify mobile app?
-To install the Expensify mobile app:
-1. Visit the Expensify for iOS or Expensify for Android app stores.
-2. Press **Install**.
-3. Follow the prompts to install.
-4. Press the Expensify icon in your phone's app list to start.
-
-#### [Desktop] How do I install the Expensify desktop app?
-To install the Expensify desktop app on MacOS:
-1. Download the Expensify for MacOS or Expensify for Windows installer.
-2. Double-click on the installer to open it.
-3. Click the Expensify icon on the taskbar to start.
-
-#### [Sign in] How do I sign up or sign in to my Expensify account?
-Signing up for a new account works the same as signing into an existing account, as follows:
-1. Install or access Expensify on any platform:
- * Access Expensify on the web.
- * Install the Expensify mobile app.
- * Install the Expensify desktop app.
-2. Choose how you want to connect and press Next:
- * Press **Email** and enter your email address, or
- * Press **Phone Number** and enter your SMS-compatible phone number.
- * Press **Google** and sign in to your Google account, or
- * Press **Apple** and sign into your Apple account.
-3. If asked to validate your email address, check your email inbox for a magic link and press it.
-4. If asked to join, this means that this is the first time you are signing in with this email address or phone number; press **Join** to confirm you entered it correctly.
-
-#### [Magic link] How do I use a magic link?
-Magic links are used for secure login without passwords. When prompted:
-1. Check your email for the Expensify Magic Link.
-2. Click the link in your email, and it will log you in to Expensify without needing to enter a password.
-
-#### [Sign out] How do I sign out?
-To sign out of Expensify:
-1. Press **Settings** in the Expensify app.
-2. Scroll to the bottom and press **Sign Out**.
-
-#### [Two factor] How do I secure my account with two-factor authentication?
-To enable two-factor authentication:
-1. Press **Settings**.
-2. Press **Security**.
-3. Press **Two-factor authentication**.
-4. Follow the steps to link your mobile phone for 2FA.
-
-#### [Close account] How do I close my account?
-To close your account:
-1. Press **Settings**.
-2. Press **Security**.
-3. Press **Close account**.
-4. Confirm by following the prompts to complete the process.
+### Superapp Fundamentals
+#### [Superapp Introduction] What is a superapp?
+A superapp is a single app combining multiple products into one interconnected experience. Expensify isn't a "suite" of separate products but a single app performing multiple functions. Built on a common core:
+* **App** - The superapp experience runs on your mobile phone or desktop computer.
+* **Chats** - Chat is infused through the entire product, even if not used for enterprise-grade collaboration.
+* **Expense** - All products dealing with money ultimately deal with expenses.
+
+#### [Domain Introduction] What is a domain?
+A domain groups users for advanced security. Join by validating your email:
+* **Name** - Corresponds to the "domain name" of your email address.
+* **Members** - Represents users with validated email contact methods.
+* **Group** - Each member belongs to one group, setting security rules.
+
+### Expensify Tools
+#### [Tools Introduction] What are the main tools in the Expensify App?
+The Expensify App is your window to the connected world of Expensify:
+* **Inbox** - Highlights what you should do next, across all products.
+* **Search** - Lets you search everything across all products from one place.
+* **Settings** - Wraps up personal, workspace, and domain configuration options.
+* **Create** - The big green plus button to create anything across all products.
+
+#### [Workspace Introduction] What is a workspace?
+A workspace groups members for secure sharing and collaboration. Features include:
+* **Name** - Name your workspace anything, it's not globally unique.
+* **Profile photo** - Use a headshot or logo, or the assigned one.
+* **Description** - Provide details for members with links and information.
+* **Currency** - Supports expenses in every currency, converted to one of your choice.
+* **Headquarters** - Some products need to know your physical location.
+* **Members** - Workspaces work best with many members.
+* **Admins** - Admins have enhanced privileges to manage the workspace.
+* **Rooms** - Contains chat rooms built in automatically or created manually.
+* **Plan** - Workspaces come in two flavors:
+ * **Collect** - Optimized for businesses with simpler requirements.
+ * **Control** - Built for companies with more powerful needs.
+
+### App Platforms and Search
+#### [Platforms Introduction] Where can I use the Expensify App?
+The Expensify app is available in three forms:
+* **Expensify web app** - Accessed at new.expensify.com via mobile or desktop web browser.
+* **Expensify mobile app** - Works like the web app but is more reliable and supports notifications.
+* **Expensify desktop app** - Similar to the web app but optimized for desktops and supports notifications.
+
+Expensify works on any computer or phone.
+
+#### [Search Introduction] What does Expensify's "universal search" do?
+Expensify's "universal search" brings all data into one place. Search components include:
+* **Query** - Describes what you are searching for.
+* **Datatype selector** - Narrow results to a single type.
+* **Filters** - Filter by datatype properties.
+* **Saved searches** - Save searches for future use.
+
+The Search page helps you find anything you're looking for.
+
+### Inbox and Communication
+#### [Inbox Introduction] What makes Expensify's Inbox powerful?
+Expensify's chat-centric design makes it a superpowered chat app. The Inbox highlights what you should do now:
+* **Green dot** - Indicates someone is waiting on you.
+* **Red dot** - Shows what you need to finish.
+* **Pinned** - Manually pin important items.
+* **Priority mode** - Organized by two modes:
+ * **Most recent mode** - Sorts Inbox by recent activity.
+ * **Focus mode** - Shows unread, green/red dot, or pinned chats.
+
+The Inbox is the most powerful page, where you'll spend most of your time.
+
+### Security and Data Protection
+#### [Security Overview] What security measures does Expensify implement?
+Expensify takes security seriously, aligning its measures with those used by banks to protect sensitive financial data. Regular testing and updates ensure security stays ahead of potential threats. Expensify also undergoes daily checks by McAfee for added protection against hackers. Users can verify Expensify's security at the McAfee SECURE site.
+
+#### [Security Standards] What are Expensify's security standards?
+Expensify adheres to the Payment Card Industry Data Security Standard (PCI-DSS), a high security standard used by major companies like PayPal and Visa to protect online credit card information. Additionally, Expensify is compliant with SSAE 16 and undergoes an annual SSAE-18 SOC 1 Type 2 audit by independent third-party auditors.
+
+#### [Data Encryption] How does Expensify encrypt data and passwords?
+Expensify employs data encryption to protect information. Upon submission, data is transformed into a secret code to ensure security during transit between your device and Expensify's servers, as well as within the server network. Expensify uses HTTPS+TLS for all web connections, ensuring data is encrypted at every stage.
+
+#### [GDPR Compliance] How does Expensify comply with GDPR?
+Expensify is committed to the General Data Protection Regulation (GDPR), which strengthens data protection for EU individuals. Key compliance measures include:
+- Participation in the EU-US and Swiss-US Privacy Shield Frameworks.
+- Annual SSAE-18 SOC 1 Type 2 audits.
+- Maintaining PCI-DSS compliance.
+- Annual penetration tests by third-party experts.
+- Background checks and security training for employees and contractors.
+- Appointing a dedicated Data Protection Officer reachable at [privacy@expensify.com](mailto:privacy@expensify.com).
+- Signing Data Processing Addendums with vendors.
+- Transparency about sub-processors on the website.
+- User tools for data export, preference management, and account closure.
+
+**Disclaimer**: This information is not legal advice. Consult legal counsel for specific GDPR applicability.
-### Profile
+## Tutorials
-#### [Photo] How do I set my profile photo?
-To set your profile photo:
-1. Press **Settings**.
-2. Press the **pencil icon** next to your existing profile photo.
-3. Press **Upload** photo.
-4. Follow the prompts on your platform to select your photo from local storage.
+### Getting Started
+#### [Web Access Guide] How do I access Expensify on the web?
+Visit the Expensify website:
+1. Go to www.expensify.com on a browser.
-#### [Display name] How do I change my display name?
-To change your display name:
-1. Press **Settings**.
+#### [Mobile App Installation] How do I install the Expensify mobile app?
+Install the Expensify mobile app:
+1. Visit iOS or Android app stores.
+2. Press **Install**.
+3. Follow prompts to install.
+4. Press the Expensify icon to start.
+
+#### [Desktop App Installation] How do I install the Expensify desktop app?
+Install the Expensify desktop app:
+1. Download the MacOS or Windows installer.
+2. Double-click the installer.
+3. Click the Expensify icon to start.
+
+#### [Join a Workspace] How do I join my company's workspace?
+Welcome to Expensify! If you received an invitation to join your company's Expensify workspace, follow these steps:
+
+1. Download the Expensify mobile app to upload expenses and check reports from your phone.
+2. Press your profile image or icon in the bottom menu, then press the **pencil icon** next to your photo to upload an image from your saved files.
+3. Press **Profile** to edit details like Display Name, Contact Method, Status, Pronouns, and Timezone.
+4. Meet **Concierge**, your personal assistant, to get reminders and alerts.
+5. Learn to add an expense by SmartScanning a receipt or entering it manually.
+6. Secure your account by enabling two-factor authentication through the **Security** settings.
+
+#### [Create a Company Workspace] How do I create a workspace for my company?
+Creating a workspace in Expensify is your first step to organizing your company's expenses. Here's how to do it:
+
+1. Press your **profile photo** or icon in the bottom menu to open the settings.
+2. Scroll and press **Workspaces**.
+3. Press **New workspace** to start creating your workspace.
+4. Press the **Edit pencil icon** next to your workspace image to upload a custom image.
+5. Press **Name** to set the workspace's name.
+6. Press **Default Currency** to choose the currency for all expenses.
+
+Invite team members to collaborate efficiently.
+
+#### [Manage a Copilot] How do I add, remove, or act as a Copilot?
+Manage your Copilot settings:
+
+1. To add a Copilot:
+ 1. Press your **profile icon** in the bottom left corner to open **Settings**.
+ 2. Press **Security**.
+ 3. Under Copilot: Delegated Access, press **Add Copilot**.
+ 4. Search for the user you'd like to add using their name or email address.
+ 5. Select **Full** or **Limited** access and press **Add Copilot**.
+
+2. To remove a Copilot:
+ 1. Press your **profile icon** in the bottom left corner to open **Settings**.
+ 2. Press **Security**.
+ 3. Under Copilot: Delegated Access, press the three vertical dots next to the Copilot and press **Remove Copilot**.
+
+3. To act as a Copilot:
+ 1. Press your **profile icon** in the bottom left corner to open **Settings**.
+ 2. Press the up-down arrow next to your profile name in the top left corner to access the account switcher.
+ 3. Select the account and level of access.
+
+#### [Name Update Process] How do I update my display or legal name?
+Update your display or legal name:
+1. Press your **profile icon** to open **Settings**.
2. Press **Profile**.
-3. Press **Display name**.
-4. Enter your first and last name.
-5. Press **Save**.
+3. Edit your name:
+ - **Display name**: Press **Display Name**, enter your first name (or nickname) and last name, then press **Save**.
+ - **Legal name**: Scroll to the Private Details section, press **Legal Name**, enter your legal first and last name, and press **Save**.
-#### [Secondary contact] How do I add a secondary contact method?
-To add a secondary contact method:
-1. Press **Settings**.
-2. Press **Profile**.
-3. Scroll to **Contact Methods**.
-4. Press **Add Secondary Contact** and enter your additional email or phone number.
+#### [Update Notification Preferences] How do I update my notification preferences?
+Customize how you receive email and in-app notifications from Expensify:
-#### [Primary contact] How do I change my primary contact method?
-To change your primary contact method:
-1. Add a new secondary contact method.
-2. Press **Make primary** to make it the new primary contact method.
+1. Press your profile image or icon in the bottom menu.
+2. Press **Preferences**.
+3. Enable or disable the toggles under Notifications:
+ - **Receive relevant feature updates and Expensify news**: If enabled, you will receive emails and in-app notifications from Expensify about new product and company updates.
+ - **Mute all sounds from Expensify**: If enabled, all in-app notification sounds will be silenced.
-#### [Remove contact] How do I remove a contact method?
-To remove a contact method:
-1. Press **Settings**.
-2. Go to **Profile** and navigate to **Contact Methods**.
-3. Select the contact method to remove and press **Remove**.
+#### [Email Address Management] How do I change or add an email address on my Expensify account?
+To change or add an email address on your Expensify account:
-#### [Pronouns] How do I set my pronouns?
-To change your pronouns:
-1. Press **Settings**.
+1. Press your profile image or icon.
2. Press **Profile**.
-3. Press **Pronouns**.
-4. Start typing your preferred pronouns.
-5. Choose your preferred set from the list.
-
-#### [Timezone] How do I change my timezone?
-By default, your timezone will be set automatically to match your system settings. To instead set it manually:
-1. Press **Settings**.
+3. Press **Contact Method**.
+4. Press **New Contact Method**.
+5. Enter the email address or phone number you want to use.
+6. Press **Add**.
+7. A verification code will be sent to your email. Enter it in Expensify and press **Verify**.
+
+You can press any email address in your list to set it as the default, remove it, or verify it.
+
+#### [Switch Theme] How do I switch between light and dark mode in Expensify?
+Change the appearance of Expensify by selecting a theme:
+
+1. Press your **profile image or icon** in the bottom menu.
+2. Press **Preferences**.
+3. Press the **Theme** option and select the desired theme:
+ - **Dark mode**: The app will appear with a dark background.
+ - **Light mode**: The app will appear with a light background.
+ - **Use Device settings**: Expensify will automatically use your device’s default theme.
+
+#### [Switch Language to Spanish] How do I switch my account language to Spanish?
+Change your account language to Spanish:
+
+1. Press your **profile image or icon** in the bottom menu.
+2. Press **Preferences**.
+3. Press the **Language** option and select **Spanish**.
+
+#### [Timezone Adjustment] How do I change my timezone?
+Change your timezone:
+1. Press your profile image or icon in the bottom menu.
2. Press **Profile**.
-3. Press **Timezone**.
-4. Disable **Automatically determine your location**.
-5. Press **Timezone**.
-6. Choose your preferred timezone from the list.
+3. Press **Timezone** to select your timezone.
-#### [Status] How do I set my status?
-To set your status:
-1. Press **Settings**.
-2. Press **Profile**.
-3. Press **Status**.
-4. Enter your custom status message and choose an emoji (optional).
-5. Press **Save**.
+#### [Pronouns Update] How do I update my pronouns?
+Update your pronouns to display them on your account:
-#### [Legal name] How do I change my legal name?
-To change your legal name:
-1. Press **Settings**.
+1. Press your profile image or icon.
2. Press **Profile**.
-3. Press **Legal Name**.
-4. Enter your updated legal name.
-5. Press **Save**.
-
-#### [Date of birth] How do I change my date of birth?
-To change your date of birth:
+3. Press **Pronouns** to select your pronouns. Type any letter into the field to see a list of available options.
+
+### Troubleshooting
+#### [Feature Issues] What should I do if I'm facing issues with a specific feature?
+If you're experiencing problems with a specific feature, refer to the respective section of the help docs for common errors and troubleshooting steps. If the issue persists, reach out to Concierge via in-product chat or by emailing concierge@expensify.com.
+
+#### [Local Issues] How do I troubleshoot local issues with my webpage?
+If your webpage isn't loading properly, try these steps:
+1. Press [here](https://www.expensify.com/signout.php?clean=true) to force a clean sign-out from the site, which can help remove stale data causing issues.
+2. Clear cookies and cache on your browser.
+3. Use an Incognito or Private browsing window.
+4. Try accessing the site on a different browser.
+
+#### [JavaScript Console Access] How do I access the JavaScript console on my browser or application?
+A developer console logs backend operations of sites and applications, providing information that can help developers solve your issues. To provide a screenshot of your developer console, follow the instructions for your browser or application:
+
+- **Chrome**: Press Cmd + Option + J on Mac, or Ctrl + Shift + J on Windows; or navigate through View > Developer > JavaScript Console.
+- **Firefox**: Press Cmd + Option + K on Mac, or Ctrl + Shift + J on Windows; or go through Menu Bar > More Tools > Web Developer Tools > Console tab.
+- **Safari**: Enable the console in Safari by selecting "Show features for web developers" in Safari Menu > Settings > Advanced. Then, press Cmd + Option + C or use the Develop Menu > Show JavaScript Console.
+- **Microsoft Edge**: Press Cmd + Option + J on Mac, or Ctrl + Shift + J on Windows; or right-click a webpage and select Inspect > Console.
+
+### Account Management
+#### [Sign In Process] How do I sign up or sign in?
+Sign up or sign in:
+1. Install or access Expensify on any platform.
+2. Choose connection method and press Next.
+3. Validate your email address and press **Join** if first time signing in.
+
+#### [Magic Link Login] How do I use a magic link for secure login?
+Use a magic link for secure login:
+1. Check email for Expensify Magic Link.
+2. Click link to log in without a password.
+
+#### [Sign Out Process] How do I sign out of Expensify?
+Sign out of Expensify:
1. Press **Settings**.
-2. Press **Profile**.
-3. Press **Date of Birth**.
-4. Update your birth date and press **Save**.
+2. Scroll and press **Sign Out**.
-#### [Address] How do I change my address?
-To change your address:
+#### [Close Account Process] How do I close my account?
+Close your account:
+1. Press your profile image or icon in the bottom menu.
+2. Press **Security**.
+3. Press **Close account**.
+4. Provide answers to the questions and confirm closure by pressing **Close Account**.
+
+### Subscription Management
+#### [Manage Subscription] How do I manage my subscription?
+To manage your subscription in New Expensify:
+1. Open the app on your device.
+2. Press your profile icon in the bottom-left corner.
+3. Navigate to the **Workspaces** section.
+4. Press **Subscription** under Workspaces to view your subscription details.
+
+#### [Add Payment Card] How do I add a payment card for billing?
+To add a payment card for billing:
+1. Locate the **Add Payment Card** option within your subscription settings.
+2. Enter your payment card details securely to maintain uninterrupted service.
+
+#### [Understand Subscription Details] What subscription details can I view?
+Within your subscription overview, you can view:
+- **Plan details**: See the number of seats, billing information, and renewal date.
+- **Auto-renew settings**: Check when your subscription will renew automatically.
+- **Auto-increase seats**: Discover potential savings by automatically increasing seats for team members exceeding the subscription size.
+
+#### [Request Early Cancellation] How can I request an early cancellation of my subscription?
+To request an early cancellation:
+1. Access the **Request Early Cancellation** option in the Subscriptions section.
+Note: Early cancellation might not be available for all customers.
+
+#### [Pricing Information] Where can I find more details on pricing plans?
+For detailed pricing plans, visit the billing page [coming soon].
+
+### Security and Customization
+#### [Enable 2FA Security] How do I secure my account with two-factor authentication?
+Secure your account with two-factor authentication:
1. Press **Settings**.
-2. Press **Profile**.
-3. Press **Address**.
-4. Enter your new address and press **Save**.
+2. Press **Security**.
+3. Press **Two-factor authentication**.
+4. Follow steps to link your phone.
-### Workspace
+#### [Additional Security with 2FA] How do I add an extra layer of security with 2FA?
+Adding an extra layer of security can help protect your financial data. To enable two-factor authentication (2FA):
-#### [Create] How do I create a workspace?
-To create a workspace:
+1. Press your profile image or icon in the bottom menu.
+2. Press **Security**.
+3. Under Security Options, press **Two Factor Authentication**.
+4. Save a copy of your backup codes. This is critical to avoid losing access if you cannot use your authenticator app.
+ - Press **Download** to save the backup codes to your device.
+ - Press **Copy** to paste the codes into a secure location.
+5. Press **Next**.
+6. Download or open your preferred authenticator app and connect it to Expensify by scanning the QR code or entering the code manually.
+7. Enter the 6-digit code from your authenticator app into Expensify and press **Verify**.
+
+When you log in to Expensify in the future, you'll need to use a magic code from your email and a 6-digit code from your authenticator app. If you lose access to your authenticator app, use your recovery codes as you would the authenticator code.
+
+### Profile and Contact Methods
+#### [Profile Photo Setup] How do I set my profile photo?
+Set your profile photo:
+1. Press your profile image or icon in the bottom menu.
+2. Press the **pencil icon** next to your photo.
+3. Press **Upload Image** to select a photo from your saved files.
+
+#### [Display Name Modification] How do I change my display name?
+Change your display name:
1. Press **Settings**.
-2. Press **Workspaces**.
-3. Press **Create Workspace**.
-4. Follow the steps to name and configure your new workspace.
+2. Press **Profile**.
+3. Press **Display name**.
+4. Enter your name and press **Save**.
-#### [Rename] How do I rename my workspace?
-To rename your workspace:
-1. Press **Settings**.
-2. Press **Workspaces**.
-3. Select your workspace and press **Edit**.
-4. Change the name and press **Save**.
+#### [Status Update] How do I set my status?
+Set your status:
+1. Press your profile image or icon in the bottom menu.
+2. Press **Profile**.
+3. Press **Status**.
+4. (Optional) Press the **emoji icon** to add an emoji.
+5. Enter a status message, such as "out of office" or "in a meeting."
+6. Press **Clear After** to select when the status should expire.
+7. Press **Save**.
-#### [Photo] How do I change the profile photo of my workspace?
-To change your workspace's profile photo:
+#### [Add Secondary Contact] How do I add a secondary contact method?
+Add a secondary contact method:
1. Press **Settings**.
-2. Press **Workspaces**.
-3. Select the workspace and press **Profile Photo**.
-4. Upload a new photo and press **Save**.
+2. Press **Profile**.
+3. Scroll to **Contact Methods**.
+4. Press **Add Secondary Contact** and enter details.
-#### [Description] How do I change the description of my workspace?
-To update your workspace description:
-1. Press **Settings**.
-2. Press **Workspaces**.
-3. Select the workspace and press **Description**.
-4. Update the text and press **Save**.
+#### [Change Primary Contact] How do I change my primary contact method?
+Change your primary contact method:
+1. Add a new secondary contact method.
+2. Press **Make primary** to set it as primary.
-#### [Currency] How do I change the currency of my workspace?
-To change your workspace currency:
+### Private Details and Regional Settings
+#### [Remove Contact Method] How do I remove a contact method?
+Remove a contact method:
1. Press **Settings**.
-2. Press **Workspaces**.
-3. Select the workspace and press **Currency**.
-4. Choose a new default currency and press **Save**.
+2. Go to **Profile** and **Contact Methods**.
+3. Select and press **Remove**.
-#### [Headquarters] How do I change the headquarters of my workspace?
-To change your workspace's headquarters location:
-1. Press **Settings**.
-2. Press **Workspaces**.
-3. Select the workspace and press **Headquarters**.
-4. Update the address and press **Save**.
+#### [Set Pronouns] How do I set my pronouns?
+Set your pronouns:
+1. Press your profile image or icon in the bottom menu.
+2. Press **Profile**.
+3. Press **Pronouns**.
+4. Type any letter to see a list of available pronouns and select your preferred set.
-#### [Invite member] How do I add or invite someone to my workspace?
-To invite a new member:
-1. Press **Settings**.
-2. Press **Workspaces**.
-3. Select the workspace and press **Members**.
-4. Press **Add Member** and enter the email addresses of the new members.
-5. Press **Invite**.
+#### [Timezone Adjustment] How do I change my timezone?
+Change your timezone:
+1. Press your profile image or icon in the bottom menu.
+2. Press **Profile**.
+3. Press **Timezone** to select your timezone.
-#### [Remove member] How do I remove someone from my workspace?
-To remove a member from your workspace:
+#### [Legal Name Update] How do I change my legal name?
+Change your legal name:
1. Press **Settings**.
-2. Press **Workspaces**.
-3. Select the workspace and press **Members**.
-4. Choose the member to remove and press **Remove Member**.
+2. Press **Profile**.
+3. Scroll to the Private Details section and press **Legal Name**.
+4. Enter updated name and press **Save**.
-#### [Add admin] How do I make someone an admin of my workspace?
-To promote a member to an admin:
+#### [Date of Birth Adjustment] How do I change my date of birth?
+Change your date of birth:
1. Press **Settings**.
-2. Press **Workspaces**.
-3. Select the workspace and press **Members**.
-4. Select the member and press **Make Admin**.
+2. Press **Profile**.
+3. Scroll to the Private Details section and press **Date of Birth**.
+4. Update birth date and press **Save**.
-#### [Remove admin] How do I remove an admin from my workspace?
-To remove admin privileges:
+### Address and Workspace Management
+#### [Address Update] How do I change my address?
+Change your address:
1. Press **Settings**.
-2. Press **Workspaces**.
-3. Select the workspace and press **Members**.
-4. Choose the admin and press **Remove Admin**.
+2. Press **Profile**.
+3. Scroll to the Private Details section and press **Address**.
+4. Enter new address and press **Save**.
-#### [More features] How do I enable features on my workspace?
-To enable features:
-1. Press **Settings**.
-2. Press **Workspaces**.
-3. Select the workspace and press **Features**.
-4. Toggle on the desired features and press **Save**.
+### Theme Preferences
+#### [Theme Preference Setup] How do I set my theme preference in New Expensify?
+Customize your theme preference in New Expensify to enhance your experience:
-#### [Upgrade plan] How do I upgrade my workspace?
-To upgrade a workspace to the Control plan:
-1. Press **Settings**.
-2. Press **Workspaces**.
-3. Select your workspace and press **Upgrade to Control**.
-4. Follow the steps to finalize the upgrade.
+1. Press your **profile image or icon** in the bottom menu.
+2. Press **Preferences**.
+3. Tap on **Theme**.
+4. Choose your preferred theme:
+ - **Dark mode**: Provides a dark background for a sleek look.
+ - **Light mode**: Offers a bright background for a classic appearance.
+ - **Use Device settings**: Aligns with your device's theme settings, adjusting automatically as your device changes.
-#### [Delete] How do I delete my workspace?
-To delete a workspace:
-1. Press **Settings**.
-2. Press **Workspaces**.
-3. Select the workspace and press **Delete Workspace**.
-4. Confirm the deletion.
+The default setting is **Use Device Settings**, which matches your device's theme transitions. Your selected theme will sync across all Expensify platforms you use.
## FAQ
You've got questions? We've got answers!
-### App
+### App and Messaging
+#### [Passwordless Authentication] Why don't I set a password?
+Expensify uses a "passwordless" design, sending a "magic link" to your contact method for secure authentication. Once signed in, you remain signed in until you sign out.
+
+#### [Infinite Sessions] Why am I never asked to sign in?
+Expensify uses "infinite sessions," keeping you signed in indefinitely until you sign out.
-#### Why don't I set a password?
-Expensify uses a "passwordless" design, where each time you sign in, we send a "magic link" to your contact method. This securely authenticates you based on your ability to receive the magic link to the contact method associated with your account. Once signed into a device, you remain signed into that account until you ask to sign out.
+#### [Messaging Closed Accounts] Why can others message me even if my account is closed?
+Expensify is a communications platform allowing messaging with valid email or SMS numbers, even if you don't use Expensify.
-#### Why am I never asked to sign in?
-Expensify uses an "infinite sessions" design, where after you sign in on a particular device, you remain signed in indefinitely, until you explicitly sign out.
+#### [Messaging User Blocking] Why can't I block users from messaging me using Expensify?
+Like Gmail or iMessage, Expensify allows messaging with valid emails or SMS numbers, without blocking all users.
-#### Why can others message me even if my account is closed?
-Like Gmail or iMessage, Expensify is a communications platform designed to let you message anyone with a valid email address or SMS number – whether or not they also use Gmail or iMessage. Accordingly, even if you don't use Expensify (or if you did use it but have since closed your account), other users can still message you using Expensify.
+### Profile and Legal Information
+#### [Display and Legal Names] Why do I have both a display name and legal name?
+Your display name shows how you'd like to be identified. Your legal name is used for documentation like billing or tax-related matters.
-#### Why can't I block users from messaging me using Expensify?
-Similar to how you can't ask Gmail to stop all Gmail users from emailing you, or ask iMessage to stop all iMessage users from texting you, you can't ask Expensify to stop all Expensify users from emailing you. Gmail, iMessage, and Expensify are all tools designed to enable the user to email and SMS other users.
+#### [Need for Legal Name] Why do you need my legal name?
+Your legal name is for identity verification when issuing payment cards and processing reimbursements.
-### Profile
+#### [Birth Date Requirement] Why do you need my date of birth?
+Your birth date verifies identity for financial products, ensuring compliance with regulations.
-#### Why do I have both a display name and legal name?
-You have a display name to show how you'd like to be publicly identified. Your legal name is used for documentation purposes, such as for billing or tax-related matters, which require your formal identification.
+#### [Home Address Requirement] Why do you need my home address?
+We need your address for shipping items and identity verification when processing payments.
-#### Why do you need my legal name?
-Your legal name is necessary for identity verification when issuing payment cards, processing reimbursements, and fulfilling regulatory requirements.
+### Workspace and Copilot
+#### [Workspace Address Requirement] Why do you need the address of my workspace's headquarters?
+We need the address to process transactions, apply local taxes, and comply with regional laws.
-#### Why do you need my date of birth?
-Your date of birth is used for verifying your identity when issuing financial products like the Expensify Card. It helps ensure compliance with regulatory requirements.
+#### [Copilot Permissions] As a Copilot, can I add or remove other Copilots?
+No. Copilots are restricted from adding or removing Copilots from other accounts. Only the account owner can add or remove Copilots from their own account. The only exception is that Copilots can remove themselves from another user's account.
-#### Why do you need my home address?
-We need your home address for shipping physical items like the Expensify Card and for identity verification when processing reimbursements or payments.
+#### [Copilot Action Identification] How can I tell which actions were taken by a Copilot?
+Any action taken by a Copilot will be displayed as being taken by the Copilot on behalf of the account owner.
-### Workspace
+#### [Multiple Copilots] Can I have more than one Copilot?
+You can assign as many Copilots as you need—there is no limit. However, you can only add one Copilot per minute.
-#### Why do you need the address of my workspace's headquarters?
-We need the headquarters' address to correctly process transactions, apply any local taxes, and ensure compliance with regional laws.
+### Account Closure and Pricing
+#### [Account Closure Issues] Why can't I close my account?
+There are several reasons you might be unable to close your account. If your account has an outstanding balance or if you have been assigned a role under a company’s Expensify workspace, you may encounter an error message during the account closure process, or the Close Account button may not be available. Here are the steps to follow for each scenario:
+- **Account Under a Validated Domain**: A Domain Admin must remove your account from the domain. Then you will be able to successfully close your account.
+- **Sole Domain Admin**: If you are the only Domain Admin for a company’s domain, you must assign a new Domain Admin before you can close your account.
+- **Workspace Billing Owner with an annual subscription**: You must downgrade from the annual subscription before closing the account. Alternatively, you can have another user take over billing for your workspaces.
+- **Company Workspace Owner**: You must assign a new workspace owner before you can close your account.
+- **Account has an outstanding balance**: You must make a payment to resolve the outstanding balance before you can close your account.
+- **Preferred Exporter for a workspace integration**: You must assign a new Preferred Exporter before closing your account.
+- **Verified Business Account that is locked**: You must unlock the account.
+- **Verified Business Account that has an outstanding balance**: You must make a payment to settle any outstanding balances before the account can be closed.
+- **Unverified account**: You must first verify your account before it can be closed.
-### Pricing
+#### [Workspace Member Pricing] Which active workspace members require paid seats?
+Workspace members billed for a paid seat if they submit, approve, pay, export, or chat on expenses.
-#### Which active workspace members require paid seats?
-If a workspace member takes any of the following actions inside of a workspace, you will be billed at the end of the month for a paid seat:
-* Submit an expense
-* Approve an expense
-* Pay an expense
-* Export an expense
-* Chat on an expense report
-* and so on
+#### [Member Double Billing] Why do some workspace members using paid features not require paid seats?
+Members using paid functionality on multiple workspaces in a month aren't billed twice – no "double dipping."
-In general, any action that modifies financial data or participates in a financial workflow is billable activity.
+### Billing and Subscriptions
+#### [Billing Page] What is the status of the billing page?
+The billing page is currently under development and will be available soon. Stay tuned for updates on how to access and use the new billing features.
-#### Why do some workspace members using paid features not require paid seats?
-In general, any workspace member that uses paid functionality will require a paid seat. However, if you own two or more workspaces with the same member, and the member uses paid functionality on multiple workspaces in a given month (ie, an admin approving expense reports on two different workspaces), you will not be billed twice for the same member – there is no "double dipping."
\ No newline at end of file
+#### [Recovery Codes Usage] How do I use my recovery codes if I lose access to my authenticator app?
+Your recovery codes work the same way as your authenticator codes. Just enter a recovery code as you would the authenticator code.
\ No newline at end of file
diff --git a/help/map.md b/help/map.md
new file mode 100644
index 000000000000..eb218e67dcc0
--- /dev/null
+++ b/help/map.md
@@ -0,0 +1,371 @@
+---
+layout: product
+title: Application Map
+---
+
+## Application Map
+Lost in the app? Let this map guide you!
+
+* Inbox
+ * Workspace selector
+ * Chat selector
+ * Special chats:
+ * Concierge
+ * Workspace chat
+ * #announce
+ * #admins
+ * Personal chat
+ * Chat modifiers:
+ * Pin
+ * Green dot
+ * Red dot
+ * Unread
+ * Current chat
+ * Chat header
+ * Profile image
+ * Name
+ * Description
+ * Pin / Unpin
+ * Share shortcut
+ * Members
+ * Invite member
+ * Bulk actions
+ * Find a member
+ * Member list
+ * Select all
+ * Member row
+ * Profile image
+ * Name
+ * Remove from chat
+ * Profile link
+ * Profile image
+ * Message
+ * Email
+ * Preferred pronouns
+ * Local time
+ * Settings
+ * Notify me about new messages
+ * Who can post
+ * Visibility
+ * Private notes
+ * Leave
+ * Message list
+ * Message actions
+ * Add reaction
+ * Reply in thread
+ * Mark as unread
+ * Join thread
+ * Copy link
+ * Flag as offensive
+ * Download
+ * Message composer
+ * Attach
+ * Split expense
+ * Assign task
+ * Add attachment
+ * Write something
+ * Emoji
+ * Send
+* Search
+ * Type selector
+ * State selector
+ * Filters
+ * Search results table
+ * Select all
+ * Search results row
+* Settings
+ * Status shortcut
+ * Profile
+ * Public
+ * Display name
+ * Contact method
+ * Status
+ * Emoji
+ * Message
+ * Clear after
+ * Pronouns
+ * Timezone
+ * Automatically determine your location
+ * Timezone
+ * Share
+ * QR Code
+ * Copy URL
+ * Get $250
+ * Private
+ * Legal name
+ * Date of birth
+ * Phone number
+ * Address
+ * Wallet
+ * Bank accounts
+ * Assigned cards
+ * Send and receive money with friends
+ * Preferences
+ * Notifications
+ * Receive relevant feature updates and Expensify news
+ * Mute all sounds from Expensify
+ * Priority mode
+ * Language
+ * Theme
+ * Security
+ * Two-factor authentication
+ * Close account
+ * Workspaces
+ * Profile
+ * Profile image
+ * Name
+ * Description
+ * Default currency
+ * Company address
+ * Share
+ * Delete
+ * Members
+ * Bulk actions
+ * Remove members
+ * Make member
+ * Make admin
+ * Make auditor
+ * Profile image
+ * Name
+ * Remove from workspace
+ * Role
+ * Profile shortcut
+ * Invoices
+ * Invoice balance
+ * Bank accounts
+ * Bank account
+ * Make default payment method
+ * Delete
+ * Add bank account
+ * Invoicing details
+ * Company name
+ * Company website
+ * Invoicing details
+ * Distance rates
+ * Add rate
+ * Bulk actions
+ * Settings
+ * Rate table
+ * Rate column
+ * Status column
+ * Rate row
+ * Enable rate
+ * Rate
+ * Delete
+ * Expensify Card
+ * Issue new card
+ * Workflows
+ * Delay submissions
+ * Submission frequency
+ * Add approvals
+ * Approvals
+ * Expenses from
+ * Approver
+ * Add approval workflow
+ * Make or track payments
+ * Connect bank account
+ * Connect online with Plaid
+ * Connect manually
+ * Rules
+ * Expenses
+ * Receipt required amount
+ * Max expense amount
+ * Max expense age
+ * Billable default
+ * eReceipts
+ * Expense reports
+ * Custom report names
+ * Prevent self-approvals
+ * Auto-approve compliant reports
+ * Auto-pay approved reports
+ * Categories
+ * Add category
+ * Bulk actions
+ * Delete categories
+ * Enable categories
+ * Settings
+ * Members must categorize all expenses -- Why not in Rules?
+ * Default spend categories
+ * Three dots menu
+ * Import spreadsheet
+ * Download CSV
+ * Category table
+ * Name column
+ * Status column
+ * Category row
+ * Enable category
+ * Name
+ * GL code
+ * Payroll code
+ * Category rules:
+ * Require description
+ * Default tax rate
+ * Flag amounts over
+ * Require receipts over
+ * Delete
+ * Tags
+ * Add tag
+ * Bulk actions
+ * Delete tag
+ * Disable tag
+ * Settings
+ * Custom tag name
+ * Members must tag all expenses
+ * Track billable expenses
+ * Three dots menu
+ * Import spreadsheet
+ * Download CSV
+ * Tag table
+ * Name column
+ * Status column
+ * Tag row
+ * Enable tag
+ * Name
+ * GL code
+ * Delete
+ * Taxes
+ * Add rate
+ * Bulk actions
+ * Delete rate
+ * Disable rate
+ * Settings
+ * Custom tax name
+ * Workspace currency default
+ * Foreign currency default
+ * Tax table
+ * Name
+ * Status
+ * Tax row
+ * Enable rate
+ * Name
+ * Value
+ * Tax code
+ * Report fields
+ * Add field
+ * Bulk actions
+ * Delete field
+ * Field table
+ * Name column
+ * Type column
+ * Field row
+ * Name
+ * Type
+ * Initial value
+ * Delete
+ * Accounting
+ * Connections list
+ * Quickbooks Online Connect
+ * Quickbooks Desktop Connect
+ * Xero
+ * NetSuite
+ * Sage Intacct
+ * More features
+ * Spend
+ * Distance rates
+ * Expensify Card
+ * Manage
+ * Workflows
+ * Rules
+ * Earn
+ * Invoices
+ * Organize
+ * Categories
+ * Tags
+ * Taxes
+ * Report fields
+ * Integrate
+ * Accounting
+ * Subscription
+ * Payment
+ * View payment history
+ * Request refund
+ * Your plan
+ * Subscription details
+ * Annual subscription
+ * Pay-per-user
+ * Three dot menu
+ * Request tax exempt status
+ * Domains
+ * Help
+ * Switch to Expensify Classic
+ * About
+ * App download links
+ * View keyboard shortcuts
+ * View the code
+ * View open jobs
+ * Report a bug
+ * Troubleshoot
+ * Client side logging
+ * Mask fragile user data wile exporting Onyx state
+ * Import Onyx state
+ * Export Onyx state
+ * Clear cache and restart
+ * Testing preferences
+ * Debug mode
+ * Use Staging server
+ * Force offline
+ * Simulate failing network requests
+ * Authentication status
+ * Device credentials
+ * Save the world
+ * Teachers Unite
+ * I know a teacher
+ * I am a teacher
+ * Sign out
+* Search router
+ * Search for something
+ * Recent searches
+ * Recent chats
+* Global Create
+ * Start chat
+ * Chat
+ * Name, email, or phone number
+ * Recents
+ * Contacts
+ * Add to group
+ * Room
+ * Room name
+ * Room description
+ * Workspace
+ * Visibility
+ * Track expense
+ 1. Choose type:
+ * Manual
+ * Amount
+ * Currency
+ * Scan
+ * Choose file
+ * Camera
+ * Distance
+ * Start
+ * Stop
+ 2. Code the expense
+ * Amount
+ * Description
+ * Show more
+ * Merchant
+ * Date
+ * Submit expense
+ 1. Choose type:
+ * Manual
+ * Amount
+ * Currency
+ * Scan
+ * Choose file
+ * Camera
+ * Distance
+ * Start
+ * Stop
+ 2. Choose who to submit to
+ * Name, email, or phone number
+ * Recents
+ * Contacts
+ 3. Code the expense
+ * Amount
+ * Description
+ * Show more
+ * Merchant
+ * Date
+ * Book travel
+ * Quick Action Button
+* Magic link page
diff --git a/help/travel.md b/help/travel.md
index 43e082896ce4..351f83f90ba4 100644
--- a/help/travel.md
+++ b/help/travel.md
@@ -7,7 +7,7 @@ Expensify Travel is a comprehensive travel management platform integrated direct
### [Main uses] When should I use Expensify Travel?
Expensify Travel is perfect for any situation involving corporate or personal travel, including:
-* **Booking business travel** - Book flights, hotels, and car rentals in a few clicks, all within the Expensify platform.
+* **Booking business travel** - Book flights, hotels, car rentals, and train travel in a few presses, all within the Expensify platform.
* **Tracking travel expenses** - Automatically capture travel-related expenses such as airfare, lodging, and meals, ensuring everything is logged without manual input.
* **Managing employee travel** - Empower managers to oversee travel bookings, set travel policies, and approve expenses in real time.
* **Ensuring compliance with travel policies** - Use travel policies to enforce company rules around budgets, preferred vendors, and travel categories.
@@ -38,59 +38,104 @@ Expensify Travel integrates a seamless booking experience directly into the app:
* **Flights** - Search for and book flights, choosing from corporate-approved airlines or vendors.
* **Hotels** - Book hotels using preferred vendor rates or select your own accommodations, with policy checks to ensure compliance.
* **Car rentals** - Rent vehicles from top providers, with automatic receipt tracking and expense capture.
-* **All in one place** - View and manage your full itinerary (flights, hotels, cars) from a single interface.
+* **Trains** - Book train travel alongside other modes of transportation.
+* **All in one place** - View and manage your full itinerary (flights, hotels, cars, trains) from a single interface.
-### [Travel policies] How do I enforce company travel policies?
+### Travel Policies
Corporate travel policies can be configured in Expensify Travel to ensure compliance:
* **Budgets** - Set maximum budgets for flights, hotels, and other travel-related expenses.
* **Preferred vendors** - Require employees to book through specific airlines, hotel chains, or rental agencies to take advantage of corporate rates.
* **Approval workflows** - Ensure all travel plans are reviewed and approved by the appropriate managers before booking.
* **Expense categories** - Automatically categorize travel expenses in line with company accounting policies.
-### [Approvals] How does the travel approval process work?
-Travel approvals in Expensify are designed to ensure compliance before any bookings are confirmed:
-1. **Request travel** - Employees submit travel requests, including flights, hotels, and car rentals, directly in the app.
-2. **Automatic policy checks** - Expensify automatically flags any out-of-policy bookings or expenses for manager review.
-3. **Manager approval** - Managers can approve or reject travel requests with one click, ensuring compliance before the trip is booked.
-4. **Track approval status** - Both employees and managers can monitor the status of a travel request in real time.
+### Approval Methods
+Expensify Travel offers three approval methods to accommodate different organizational needs: Soft Approval, Hard Approval, and Passive Approval.
-### [Expense integration] How does Expensify Travel integrate with Expensify Expense?
-Expensify Travel works seamlessly with Expensify Expense to automate the handling of travel expenses:
-* **Automatic expense capture** - Travel-related expenses (flights, hotels, meals) are automatically imported into Expensify Expense for easy tracking and reimbursement.
-* **Real-time tracking** - Travel expenses appear in your expense report as soon as they are incurred, providing real-time visibility into costs.
-* **One-click submission** - Employees can submit all travel expenses in a single report, and managers can approve them in bulk.
+- **Soft Approval**: Bookings are automatically approved unless a manager declines them within 24 hours. If not declined, the arrangements proceed even if they are out of policy.
+- **Hard Approval**: Bookings are automatically canceled if not approved within 24 hours.
+- **Passive Approval**: Managers are notified of out-of-policy travel, but no action is required.
-### [Corporate cards] Can I use Expensify Cards with Expensify Travel?
-Yes, Expensify Travel integrates with Expensify Cards:
-* **Automatic e-receipts** - Travel purchases made with an Expensify Card automatically generate e-receipts, eliminating the need for paper receipts.
-* **Real-time expense tracking** - Expenses made with the Expensify Card are logged in real-time and categorized according to your travel policies.
-* **Spend controls** - Set card limits and track spend in real-time to ensure that employees stay within budget.
-
-## Platforms
-Expensify Travel is accessible from all platforms, making it easy to manage travel from anywhere:
-* **Web app** - Manage your travel plans from your desktop via the Expensify web app.
-* **Mobile app** - Book travel and track expenses on the go using the Expensify mobile app for iOS and Android.
-* **Desktop app** - Use the Expensify desktop app for Mac or Windows to access the full range of travel and expense management features.
+### Travel Member Roles
+Assign roles to manage travel permissions within Expensify Travel:
+* **Traveler** - Can only book travel for themselves.
+* **Travel Arranger** - Can book travel for themselves and for other workspace members. Arrangers can be set to arrange travel for everyone in the workspace or for specific individuals only.
+* **Company Admin** - Can book travel for themselves as well as any other workspace members. They can also access administrative features to define travel policies, add or remove users, configure corporate cards as payment methods, view analytics and metrics, and use the Safety feature.
## Tutorials
-### [Book travel] How do I book a flight, hotel, or car rental?
-1. Navigate to the **Travel** section in the Expensify app.
-2. Select **Book Flight**, **Book Hotel**, or **Book Car Rental**.
-3. Enter your travel dates, destination, and any other required details.
-4. Select a flight, hotel, or car from the available options.
-5. Confirm your booking and add it to your travel itinerary.
-
-### [Submit travel request] How do I submit a travel request for approval?
+### [Book Travel] How do I book a flight, hotel, or car rental?
+To book travel from the Expensify app, follow these steps:
+1. Press the **Travel** tab.
+2. Press **Book or manage travel**.
+3. Use the icons at the top to select the type of travel arrangement you want to book: flights, hotels, cars, or trains.
+4. Enter the travel information relevant to the selected arrangement (destination, dates of travel, etc.).
+5. Select all the details for the arrangement you wish to book.
+6. Review the booking details and press **Book Flight / Book Hotel / Book Car / Book Rail** to complete the booking.
+
+The traveler is emailed an itinerary of the booking. Additionally,
+- Their travel details are added to a Trip chat room under their primary workspace.
+- An expense report for the trip is created.
+- If booked with an Expensify Card, the trip is automatically reconciled.
+
+### [Submit Travel Request] How do I submit a travel request for approval?
+To submit a travel request:
1. Go to **Create** > **Travel Request**.
2. Enter the details of your trip, including flights, hotels, and rental cars.
3. Review your travel options and ensure they are within policy.
4. Submit the request to your manager for approval.
-### [Approve travel] How do I approve a travel request?
+### [Approve Travel] How do I approve a travel request?
+To approve a travel request:
1. Go to your **Inbox** and find the travel request awaiting approval.
2. Review the trip details, including any out-of-policy flags.
-3. Click **Approve** or **Reject** as appropriate.
+3. Press **Approve** or **Reject** as appropriate.
+
+### [Edit or Cancel Travel Arrangements] How do I modify or cancel a travel booking?
+If you need to edit or cancel your travel arrangements, you can do so through the Expensify app:
+
+1. Open the Trip chat in your inbox to review your travel arrangements.
+2. Press your profile image or icon in the bottom left menu.
+3. Scroll down and press **Workspaces** in the left menu.
+4. Select the workspace the travel is booked under.
+5. Tap into the booking to see more details.
+6. Press **Trip Support** for assistance.
+
+If there are unexpected changes to your itinerary, such as a flight cancellation, Expensify’s travel partner **Spotnana** will reach out to provide updates. Note that any modifications, exchanges, or cancellations made through support will incur a $25 booking change fee.
+
+### [Configure Travel Policy] How do I set up a travel policy for my workspace?
+Workspace admins can create and update travel policies to establish travel rules for different groups of travelers. To configure a travel policy:
+
+1. Press the **Travel** tab and select **Book or manage travel**.
+2. Select the **Program** tab and choose **Policies**.
+3. Under Employee or Non-employee, press **Add new** to create a new policy.
+4. In the **Edit members** section, select the group of employees for the policy.
+5. Choose travel preferences to modify: General, flight, hotel, car, or rail.
+6. Press the paperclip icon next to each setting to de-couple it from the default policy.
+7. Update the desired settings and save changes.
+
+### [Demo Video] How can I watch a demo of Expensify Travel?
+To see how Expensify Travel works, watch the demo video:
+- The video provides a comprehensive overview of using Expensify Travel for booking and managing travel.
+
+### [Set Approval Method] How do I set the approval method for travel expenses?
+To configure the approval method for travel expenses in Expensify:
+1. Press the **Travel** tab and choose **Book or manage travel**.
+2. Navigate to the **Program** tab and select **Policies**.
+3. Under the General section, select the approval methods for Flights, Hotels, Cars, and Rail, choosing between Soft Approval, Hard Approval, or Passive Approval.
+
+### [Manage Travel Member Roles] How do I assign roles to travel members?
+To manage travel member roles within Expensify:
+1. Press the **Travel** tab and select **Book or manage travel**.
+2. Select the **Program** tab and choose **Users**.
+3. Press the name of the member whose role you wish to update.
+4. Press the **Roles** tab and select the desired role.
+5. Press **Save** to confirm the changes.
+
+### [Approve Travel Booking] How do I approve or decline a travel booking?
+To manage travel booking approvals effectively:
+1. Once an employee books a trip, you will receive an email notification with booking details.
+2. For **Soft Approval**, no action is required to approve, but to decline, follow the email prompt within 24 hours and press **Decline booking**, then **Deny Booking**.
+3. For **Hard Approval**, press **Approve booking** to confirm or **Decline booking** to reject, then follow the respective prompts.
## FAQ
@@ -109,3 +154,23 @@ Yes, Expensify Travel supports international bookings and expense tracking in mu
### How do I integrate Expensify Travel with my company’s existing travel policies?
You can configure travel policies directly in Expensify by setting budgets, preferred vendors, and approval workflows. These policies will automatically be enforced whenever employees book travel.
+### Are extended approval windows given for trips booked over the weekend or during company holidays?
+No, the approval window is fixed at 24 hours from when the trip is booked.
+
+### How does Expensify Travel handle approvals when the assigned approver is out of office?
+It is recommended to have multiple approvers set up for travel, as there is no delegated approval for out-of-office scenarios.
+
+### Can travelers upload a document when submitting a trip for approval?
+Travelers cannot upload a document at the time of trip submission, but companies can use a 'reason code' in the Out of Policy rules, which travelers complete at checkout. Documents can then be added to the expense report during submission in Expensify.
+
+### [Expense Integration] How do I use Expensify Travel with Expensify Expense?
+Expensify Travel works seamlessly with Expensify Expense to automate the handling of travel expenses:
+* **Automatic expense capture** - Travel-related expenses (flights, hotels, meals) are automatically imported into Expensify Expense for easy tracking and reimbursement.
+* **Real-time tracking** - Travel expenses appear in your expense report as soon as they are incurred, providing real-time visibility into costs.
+* **One-click submission** - Employees can submit all travel expenses in a single report, and managers can approve them in bulk.
+
+### [Corporate Cards] Can I use Expensify Cards with Expensify Travel?
+Yes, Expensify Travel integrates with Expensify Cards:
+* **Automatic e-receipts** - Travel purchases made with an Expensify Card automatically generate e-receipts, eliminating the need for paper receipts.
+* **Real-time expense tracking** - Expenses made with the Expensify Card are logged in real time and categorized according to your travel policies.
+* **Spend controls** - Set card limits and track spend in real time to ensure that employees stay within budget.
\ No newline at end of file
diff --git a/ios/GoogleService-Info-DEV.plist b/ios/GoogleService-Info-DEV.plist
new file mode 100644
index 000000000000..5bfb1a332dfc
--- /dev/null
+++ b/ios/GoogleService-Info-DEV.plist
@@ -0,0 +1,38 @@
+
+
+
+
+ CLIENT_ID
+ 921154746561-8niu5ba8g4dgsqsqso3lugdhe6vikqpq.apps.googleusercontent.com
+ REVERSED_CLIENT_ID
+ com.googleusercontent.apps.921154746561-8niu5ba8g4dgsqsqso3lugdhe6vikqpq
+ ANDROID_CLIENT_ID
+ 921154746561-cbegir0tnc2gan6k1gre5vtn75p60hom.apps.googleusercontent.com
+ API_KEY
+ AIzaSyA9Qn7q5Iw26gTzjI7012C4PaFrFagpC_I
+ GCM_SENDER_ID
+ 921154746561
+ PLIST_VERSION
+ 1
+ BUNDLE_ID
+ com.expensify.chat.dev
+ PROJECT_ID
+ expensify-chat
+ STORAGE_BUCKET
+ expensify-chat.appspot.com
+ IS_ADS_ENABLED
+
+ IS_ANALYTICS_ENABLED
+
+ IS_APPINVITE_ENABLED
+
+ IS_GCM_ENABLED
+
+ IS_SIGNIN_ENABLED
+
+ GOOGLE_APP_ID
+ 1:921154746561:ios:12c3a0b9276d7d2f027c40
+ DATABASE_URL
+ https://expensify-chat.firebaseio.com
+
+
diff --git a/ios/GoogleService-Info.plist b/ios/GoogleService-Info.plist
index 147bec8c2875..e8549ed328fd 100644
--- a/ios/GoogleService-Info.plist
+++ b/ios/GoogleService-Info.plist
@@ -6,6 +6,8 @@
921154746561-s3uqn2oe4m85tufi6mqflbfbuajrm2i3.apps.googleusercontent.comREVERSED_CLIENT_IDcom.googleusercontent.apps.921154746561-s3uqn2oe4m85tufi6mqflbfbuajrm2i3
+ ANDROID_CLIENT_ID
+ 921154746561-cbegir0tnc2gan6k1gre5vtn75p60hom.apps.googleusercontent.comAPI_KEYAIzaSyA9Qn7q5Iw26gTzjI7012C4PaFrFagpC_IGCM_SENDER_ID
@@ -21,7 +23,7 @@
IS_ADS_ENABLEDIS_ANALYTICS_ENABLED
-
+ IS_APPINVITE_ENABLEDIS_GCM_ENABLED
@@ -33,4 +35,4 @@
DATABASE_URLhttps://expensify-chat.firebaseio.com
-
\ No newline at end of file
+
diff --git a/ios/NewExpensify.xcodeproj/project.pbxproj b/ios/NewExpensify.xcodeproj/project.pbxproj
index b3ec8febb1df..d8eceab72b95 100644
--- a/ios/NewExpensify.xcodeproj/project.pbxproj
+++ b/ios/NewExpensify.xcodeproj/project.pbxproj
@@ -18,7 +18,6 @@
0CDA8E38287DD6A0004ECBEC /* Images.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 0CDA8E36287DD6A0004ECBEC /* Images.xcassets */; };
0DFC45942C884E0A00B56C91 /* RCTShortcutManagerModule.m in Sources */ = {isa = PBXBuildFile; fileRef = 0DFC45932C884E0A00B56C91 /* RCTShortcutManagerModule.m */; };
0DFC45952C884E0A00B56C91 /* RCTShortcutManagerModule.m in Sources */ = {isa = PBXBuildFile; fileRef = 0DFC45932C884E0A00B56C91 /* RCTShortcutManagerModule.m */; };
- 0F5BE0CE252686330097D869 /* GoogleService-Info.plist in Resources */ = {isa = PBXBuildFile; fileRef = 0F5BE0CD252686320097D869 /* GoogleService-Info.plist */; };
0F5E5350263B73FD004CA14F /* EnvironmentChecker.m in Sources */ = {isa = PBXBuildFile; fileRef = 0F5E534F263B73FD004CA14F /* EnvironmentChecker.m */; };
0F5E5351263B73FD004CA14F /* EnvironmentChecker.m in Sources */ = {isa = PBXBuildFile; fileRef = 0F5E534F263B73FD004CA14F /* EnvironmentChecker.m */; };
1246A3EF20E54E7A9494C8B9 /* ExpensifyNeue-Regular.otf in Resources */ = {isa = PBXBuildFile; fileRef = F4F8A052A22040339996324B /* ExpensifyNeue-Regular.otf */; };
@@ -34,6 +33,9 @@
70CF6E82262E297300711ADC /* BootSplash.storyboard in Resources */ = {isa = PBXBuildFile; fileRef = 70CF6E81262E297300711ADC /* BootSplash.storyboard */; };
7F5E81F06BCCF61AD02CEA06 /* ExpoModulesProvider.swift in Sources */ = {isa = PBXBuildFile; fileRef = BCD444BEDDB0AF1745B39049 /* ExpoModulesProvider.swift */; };
7F9DD8DA2B2A445B005E3AFA /* ExpError.swift in Sources */ = {isa = PBXBuildFile; fileRef = 7F9DD8D92B2A445B005E3AFA /* ExpError.swift */; };
+ 7FB680AE2CC94EDA006693CF /* GoogleService-Info.plist in Resources */ = {isa = PBXBuildFile; fileRef = 7FB680AD2CC94EDA006693CF /* GoogleService-Info.plist */; };
+ 7FB680AF2CC94EDA006693CF /* GoogleService-Info.plist in Resources */ = {isa = PBXBuildFile; fileRef = 7FB680AD2CC94EDA006693CF /* GoogleService-Info.plist */; };
+ 7FB680B02CC94EDA006693CF /* GoogleService-Info.plist in Resources */ = {isa = PBXBuildFile; fileRef = 7FB680AD2CC94EDA006693CF /* GoogleService-Info.plist */; };
7FD73C9E2B23CE9500420AF3 /* NotificationService.swift in Sources */ = {isa = PBXBuildFile; fileRef = 7FD73C9D2B23CE9500420AF3 /* NotificationService.swift */; };
7FD73CA22B23CE9500420AF3 /* NotificationServiceExtension.appex in Embed Foundation Extensions */ = {isa = PBXBuildFile; fileRef = 7FD73C9B2B23CE9500420AF3 /* NotificationServiceExtension.appex */; settings = {ATTRIBUTES = (RemoveHeadersOnCopy, ); }; };
8744C5400E24E379441C04A4 /* libPods-NewExpensify.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 59A21B2405370FDDD847C813 /* libPods-NewExpensify.a */; };
@@ -43,7 +45,7 @@
D27CE6B77196EF3EF450EEAC /* PrivacyInfo.xcprivacy in Resources */ = {isa = PBXBuildFile; fileRef = 0D3F9E814828D91464DF9D35 /* PrivacyInfo.xcprivacy */; };
DD79042B2792E76D004484B4 /* RCTBootSplash.mm in Sources */ = {isa = PBXBuildFile; fileRef = DD79042A2792E76D004484B4 /* RCTBootSplash.mm */; };
DDCB2E57F334C143AC462B43 /* ExpoModulesProvider.swift in Sources */ = {isa = PBXBuildFile; fileRef = 4D20D83B0E39BA6D21761E72 /* ExpoModulesProvider.swift */; };
- E51DC681C7DEE40AEBDDFBFE /* BuildFile in Frameworks */ = {isa = PBXBuildFile; };
+ E51DC681C7DEE40AEBDDFBFE /* (null) in Frameworks */ = {isa = PBXBuildFile; };
E9DF872D2525201700607FDC /* AirshipConfig.plist in Resources */ = {isa = PBXBuildFile; fileRef = E9DF872C2525201700607FDC /* AirshipConfig.plist */; };
ED222ED90E074A5481A854FA /* ExpensifyNeue-BoldItalic.otf in Resources */ = {isa = PBXBuildFile; fileRef = 8B28D84EF339436DBD42A203 /* ExpensifyNeue-BoldItalic.otf */; };
F0C450EA2705020500FD2970 /* colors.json in Resources */ = {isa = PBXBuildFile; fileRef = F0C450E92705020500FD2970 /* colors.json */; };
@@ -94,7 +96,6 @@
0D3F9E814828D91464DF9D35 /* PrivacyInfo.xcprivacy */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xml; name = PrivacyInfo.xcprivacy; path = NewExpensify/PrivacyInfo.xcprivacy; sourceTree = ""; };
0DFC45922C884D7900B56C91 /* RCTShortcutManagerModule.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = RCTShortcutManagerModule.h; sourceTree = ""; };
0DFC45932C884E0A00B56C91 /* RCTShortcutManagerModule.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = RCTShortcutManagerModule.m; sourceTree = ""; };
- 0F5BE0CD252686320097D869 /* GoogleService-Info.plist */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.plist.xml; path = "GoogleService-Info.plist"; sourceTree = ""; };
0F5E534E263B73D5004CA14F /* EnvironmentChecker.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = EnvironmentChecker.h; sourceTree = ""; };
0F5E534F263B73FD004CA14F /* EnvironmentChecker.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = EnvironmentChecker.m; sourceTree = ""; };
13B07F961A680F5B00A75B9A /* New Expensify Dev.app */ = {isa = PBXFileReference; explicitFileType = wrapper.application; includeInIndex = 0; path = "New Expensify Dev.app"; sourceTree = BUILT_PRODUCTS_DIR; };
@@ -133,6 +134,7 @@
7F3784A72C75131000063508 /* NewExpensifyReleaseProduction.entitlements */ = {isa = PBXFileReference; lastKnownFileType = text.plist.entitlements; name = NewExpensifyReleaseProduction.entitlements; path = NewExpensify/NewExpensifyReleaseProduction.entitlements; sourceTree = ""; };
7F9C91352CA5EC4900FC4DC1 /* NotificationServiceExtension.entitlements */ = {isa = PBXFileReference; lastKnownFileType = text.plist.entitlements; path = NotificationServiceExtension.entitlements; sourceTree = ""; };
7F9DD8D92B2A445B005E3AFA /* ExpError.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ExpError.swift; sourceTree = ""; };
+ 7FB680AD2CC94EDA006693CF /* GoogleService-Info.plist */ = {isa = PBXFileReference; lastKnownFileType = text.plist.xml; path = "GoogleService-Info.plist"; sourceTree = ""; };
7FD73C9B2B23CE9500420AF3 /* NotificationServiceExtension.appex */ = {isa = PBXFileReference; explicitFileType = "wrapper.app-extension"; includeInIndex = 0; path = NotificationServiceExtension.appex; sourceTree = BUILT_PRODUCTS_DIR; };
7FD73C9D2B23CE9500420AF3 /* NotificationService.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = NotificationService.swift; sourceTree = ""; };
7FD73C9F2B23CE9500420AF3 /* Info.plist */ = {isa = PBXFileReference; lastKnownFileType = text.plist.xml; path = Info.plist; sourceTree = ""; };
@@ -176,8 +178,8 @@
buildActionMask = 2147483647;
files = (
383643682B6D4AE2005BB9AE /* DeviceCheck.framework in Frameworks */,
- E51DC681C7DEE40AEBDDFBFE /* BuildFile in Frameworks */,
- E51DC681C7DEE40AEBDDFBFE /* BuildFile in Frameworks */,
+ E51DC681C7DEE40AEBDDFBFE /* (null) in Frameworks */,
+ E51DC681C7DEE40AEBDDFBFE /* (null) in Frameworks */,
8744C5400E24E379441C04A4 /* libPods-NewExpensify.a in Frameworks */,
);
runOnlyForDeploymentPostprocessing = 0;
@@ -212,13 +214,13 @@
13B07FAE1A68108700A75B9A /* NewExpensify */ = {
isa = PBXGroup;
children = (
+ 7FB680AD2CC94EDA006693CF /* GoogleService-Info.plist */,
7F3784A72C75131000063508 /* NewExpensifyReleaseProduction.entitlements */,
7F3784A62C7512D900063508 /* NewExpensifyReleaseAdHoc.entitlements */,
7F3784A52C7512CF00063508 /* NewExpensifyReleaseDevelopment.entitlements */,
7F3784A42C7512BF00063508 /* NewExpensifyDebugProduction.entitlements */,
7F3784A32C75129D00063508 /* NewExpensifyDebugAdHoc.entitlements */,
7F3784A22C75103800063508 /* NewExpensifyDebugDevelopment.entitlements */,
- 0F5BE0CD252686320097D869 /* GoogleService-Info.plist */,
E9DF872C2525201700607FDC /* AirshipConfig.plist */,
0CDA8E36287DD6A0004ECBEC /* Images.xcassets */,
008F07F21AC5B25A0029DE68 /* main.jsbundle */,
@@ -500,6 +502,7 @@
buildActionMask = 2147483647;
files = (
0CDA8E38287DD6A0004ECBEC /* Images.xcassets in Resources */,
+ 7FB680B02CC94EDA006693CF /* GoogleService-Info.plist in Resources */,
);
runOnlyForDeploymentPostprocessing = 0;
};
@@ -507,7 +510,6 @@
isa = PBXResourcesBuildPhase;
buildActionMask = 2147483647;
files = (
- 0F5BE0CE252686330097D869 /* GoogleService-Info.plist in Resources */,
E9DF872D2525201700607FDC /* AirshipConfig.plist in Resources */,
F0C450EA2705020500FD2970 /* colors.json in Resources */,
083353EB2B5AB22A00C603C0 /* attention.mp3 in Resources */,
@@ -519,6 +521,7 @@
083353EE2B5AB22A00C603C0 /* success.mp3 in Resources */,
0C7C65547D7346EB923BE808 /* ExpensifyMono-Regular.otf in Resources */,
2A9F8CDA983746B0B9204209 /* ExpensifyNeue-Bold.otf in Resources */,
+ 7FB680AE2CC94EDA006693CF /* GoogleService-Info.plist in Resources */,
083353EC2B5AB22A00C603C0 /* done.mp3 in Resources */,
083353ED2B5AB22A00C603C0 /* receive.mp3 in Resources */,
ED222ED90E074A5481A854FA /* ExpensifyNeue-BoldItalic.otf in Resources */,
@@ -532,6 +535,7 @@
isa = PBXResourcesBuildPhase;
buildActionMask = 2147483647;
files = (
+ 7FB680AF2CC94EDA006693CF /* GoogleService-Info.plist in Resources */,
);
runOnlyForDeploymentPostprocessing = 0;
};
diff --git a/ios/NewExpensify.xcodeproj/xcshareddata/xcschemes/New Expensify Dev.xcscheme b/ios/NewExpensify.xcodeproj/xcshareddata/xcschemes/New Expensify Dev.xcscheme
index 93d775217f11..f9acbe8abe4f 100644
--- a/ios/NewExpensify.xcodeproj/xcshareddata/xcschemes/New Expensify Dev.xcscheme
+++ b/ios/NewExpensify.xcodeproj/xcshareddata/xcschemes/New Expensify Dev.xcscheme
@@ -60,6 +60,16 @@
ReferencedContainer = "container:NewExpensify.xcodeproj">
+
+
+
+
+
+ CFBundlePackageType
APPLCFBundleShortVersionString
- 9.0.54
+ 9.0.59CFBundleSignature????CFBundleURLTypes
@@ -40,7 +40,7 @@
CFBundleVersion
- 9.0.54.1
+ 9.0.59.0FullStoryOrgId
diff --git a/ios/NewExpensifyTests/Info.plist b/ios/NewExpensifyTests/Info.plist
index cb867d7af0b5..96070daa066c 100644
--- a/ios/NewExpensifyTests/Info.plist
+++ b/ios/NewExpensifyTests/Info.plist
@@ -15,10 +15,10 @@
CFBundlePackageTypeBNDLCFBundleShortVersionString
- 9.0.54
+ 9.0.59CFBundleSignature????CFBundleVersion
- 9.0.54.1
+ 9.0.59.0
diff --git a/ios/NotificationServiceExtension/Info.plist b/ios/NotificationServiceExtension/Info.plist
index c7c9879bb2ab..e0bef4291004 100644
--- a/ios/NotificationServiceExtension/Info.plist
+++ b/ios/NotificationServiceExtension/Info.plist
@@ -11,9 +11,9 @@
CFBundleName$(PRODUCT_NAME)CFBundleShortVersionString
- 9.0.54
+ 9.0.59CFBundleVersion
- 9.0.54.1
+ 9.0.59.0NSExtensionNSExtensionPointIdentifier
diff --git a/ios/Podfile.lock b/ios/Podfile.lock
index 9a706cc4e8aa..5268e5e9fb24 100644
--- a/ios/Podfile.lock
+++ b/ios/Podfile.lock
@@ -2329,10 +2329,6 @@ PODS:
- ReactCommon/turbomodule/bridging
- ReactCommon/turbomodule/core
- Yoga
- - RNDevMenu (4.1.1):
- - React-Core
- - React-Core/DevSupport
- - React-RCTNetwork
- RNFBAnalytics (12.9.3):
- Firebase/Analytics (= 8.8.0)
- React-Core
@@ -2395,7 +2391,7 @@ PODS:
- RNGoogleSignin (10.0.1):
- GoogleSignIn (~> 7.0)
- React-Core
- - RNLiveMarkdown (0.1.176):
+ - RNLiveMarkdown (0.1.180):
- DoubleConversion
- glog
- hermes-engine
@@ -2415,9 +2411,9 @@ PODS:
- ReactCodegen
- ReactCommon/turbomodule/bridging
- ReactCommon/turbomodule/core
- - RNLiveMarkdown/newarch (= 0.1.176)
+ - RNLiveMarkdown/newarch (= 0.1.180)
- Yoga
- - RNLiveMarkdown/newarch (0.1.176):
+ - RNLiveMarkdown/newarch (0.1.180):
- DoubleConversion
- glog
- hermes-engine
@@ -2507,7 +2503,7 @@ PODS:
- ReactCommon/turbomodule/bridging
- ReactCommon/turbomodule/core
- Yoga
- - RNReanimated (3.15.1):
+ - RNReanimated (3.15.3):
- DoubleConversion
- glog
- hermes-engine
@@ -2527,10 +2523,10 @@ PODS:
- ReactCodegen
- ReactCommon/turbomodule/bridging
- ReactCommon/turbomodule/core
- - RNReanimated/reanimated (= 3.15.1)
- - RNReanimated/worklets (= 3.15.1)
+ - RNReanimated/reanimated (= 3.15.3)
+ - RNReanimated/worklets (= 3.15.3)
- Yoga
- - RNReanimated/reanimated (3.15.1):
+ - RNReanimated/reanimated (3.15.3):
- DoubleConversion
- glog
- hermes-engine
@@ -2551,7 +2547,7 @@ PODS:
- ReactCommon/turbomodule/bridging
- ReactCommon/turbomodule/core
- Yoga
- - RNReanimated/worklets (3.15.1):
+ - RNReanimated/worklets (3.15.3):
- DoubleConversion
- glog
- hermes-engine
@@ -2824,7 +2820,6 @@ DEPENDENCIES:
- "RNCClipboard (from `../node_modules/@react-native-clipboard/clipboard`)"
- "RNCPicker (from `../node_modules/@react-native-picker/picker`)"
- RNDeviceInfo (from `../node_modules/react-native-device-info`)
- - RNDevMenu (from `../node_modules/react-native-dev-menu`)
- "RNFBAnalytics (from `../node_modules/@react-native-firebase/analytics`)"
- "RNFBApp (from `../node_modules/@react-native-firebase/app`)"
- "RNFBCrashlytics (from `../node_modules/@react-native-firebase/crashlytics`)"
@@ -3085,8 +3080,6 @@ EXTERNAL SOURCES:
:path: "../node_modules/@react-native-picker/picker"
RNDeviceInfo:
:path: "../node_modules/react-native-device-info"
- RNDevMenu:
- :path: "../node_modules/react-native-dev-menu"
RNFBAnalytics:
:path: "../node_modules/@react-native-firebase/analytics"
RNFBApp:
@@ -3263,7 +3256,6 @@ SPEC CHECKSUMS:
RNCClipboard: c84275d07e3f73ff296b17e6c27e9ccdc194a0bb
RNCPicker: 21ae0659666767a5c1253aef985ee5b7c527e345
RNDeviceInfo: 130237d8e97a89b68f2202d5dd18ac6bb68e7648
- RNDevMenu: 72807568fe4188bd4c40ce32675d82434b43c45d
RNFBAnalytics: f76bfa164ac235b00505deb9fc1776634056898c
RNFBApp: 729c0666395b1953198dc4a1ec6deb8fbe1c302e
RNFBCrashlytics: 2061ca863e8e2fa1aae9b12477d7dfa8e88ca0f9
@@ -3272,12 +3264,12 @@ SPEC CHECKSUMS:
RNFS: 4ac0f0ea233904cb798630b3c077808c06931688
RNGestureHandler: 8781e2529230a1bc3ea8d75e5c3cd071b6c6aed7
RNGoogleSignin: ccaa4a81582cf713eea562c5dd9dc1961a715fd0
- RNLiveMarkdown: 0b8756147a5e8eeea98d3e1187c0c27d5a96d1ff
+ RNLiveMarkdown: fc07b203a3ed832e2e5d3950e69cd4fc3b0568b6
RNLocalize: d4b8af4e442d4bcca54e68fc687a2129b4d71a81
rnmapbox-maps: 460d6ff97ae49c7d5708c3212c6521697c36a0c4
RNPermissions: 0b1429b55af59d1d08b75a8be2459f65a8ac3f28
RNReactNativeHapticFeedback: 73756a3477a5a622fa16862a3ab0d0fc5e5edff5
- RNReanimated: 76901886830e1032f16bbf820153f7dc3f02d51d
+ RNReanimated: f46df3b08d5d59cd83c47bb6697ce88e565e0dc7
RNScreens: de6e57426ba0e6cbc3fb5b4f496e7f08cb2773c2
RNShare: bd4fe9b95d1ee89a200778cc0753ebe650154bb0
RNSound: 6c156f925295bdc83e8e422e7d8b38d33bc71852
diff --git a/package-lock.json b/package-lock.json
index 7202ef76ab66..594888c76972 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,17 +1,17 @@
{
"name": "new.expensify",
- "version": "9.0.54-1",
+ "version": "9.0.59-0",
"lockfileVersion": 3,
"requires": true,
"packages": {
"": {
"name": "new.expensify",
- "version": "9.0.54-1",
+ "version": "9.0.59-0",
"hasInstallScript": true,
"license": "MIT",
"dependencies": {
"@dotlottie/react-player": "^1.6.3",
- "@expensify/react-native-live-markdown": "0.1.176",
+ "@expensify/react-native-live-markdown": "0.1.180",
"@expo/metro-runtime": "~3.2.3",
"@firebase/app": "^0.10.10",
"@firebase/performance": "^0.6.8",
@@ -51,7 +51,7 @@
"date-fns-tz": "^3.2.0",
"dom-serializer": "^0.2.2",
"domhandler": "^4.3.0",
- "expensify-common": "2.0.100",
+ "expensify-common": "2.0.106",
"expo": "51.0.31",
"expo-av": "14.0.7",
"expo-image": "1.12.15",
@@ -77,11 +77,10 @@
"react-map-gl": "^7.1.3",
"react-native": "0.75.2",
"react-native-android-location-enabler": "^2.0.1",
- "react-native-app-logs": "git+https://github.com/margelo/react-native-app-logs#7e9c311bffdc6a9eeb69d90d30ead47e01c3552a",
+ "react-native-app-logs": "0.3.1",
"react-native-blob-util": "0.19.4",
"react-native-collapsible": "^1.6.2",
"react-native-config": "1.5.3",
- "react-native-dev-menu": "^4.1.1",
"react-native-device-info": "10.3.1",
"react-native-document-picker": "^9.3.1",
"react-native-draggable-flatlist": "^4.0.1",
@@ -96,7 +95,7 @@
"react-native-launch-arguments": "^4.0.2",
"react-native-localize": "^2.2.6",
"react-native-modal": "^13.0.0",
- "react-native-onyx": "2.0.73",
+ "react-native-onyx": "2.0.78",
"react-native-pager-view": "6.4.1",
"react-native-pdf": "6.7.3",
"react-native-performance": "^5.1.0",
@@ -105,7 +104,7 @@
"react-native-plaid-link-sdk": "11.11.0",
"react-native-qrcode-svg": "6.3.11",
"react-native-quick-sqlite": "git+https://github.com/margelo/react-native-quick-sqlite#99f34ebefa91698945f3ed26622e002bd79489e0",
- "react-native-reanimated": "3.15.1",
+ "react-native-reanimated": "3.15.3",
"react-native-release-profiler": "^0.2.1",
"react-native-render-html": "6.3.1",
"react-native-safe-area-context": "4.10.9",
@@ -117,7 +116,7 @@
"react-native-url-polyfill": "^2.0.0",
"react-native-view-shot": "3.8.0",
"react-native-vision-camera": "4.0.0-beta.13",
- "react-native-web": "^0.19.12",
+ "react-native-web": "0.19.13",
"react-native-webview": "13.8.6",
"react-plaid-link": "3.3.2",
"react-web-config": "^1.0.0",
@@ -157,6 +156,7 @@
"@perf-profiler/profiler": "^0.10.10",
"@perf-profiler/reporter": "^0.9.0",
"@perf-profiler/types": "^0.8.0",
+ "@pmmmwh/react-refresh-webpack-plugin": "^0.5.15",
"@react-native-community/eslint-config": "3.2.0",
"@react-native/babel-preset": "0.75.2",
"@react-native/metro-config": "0.75.2",
@@ -219,7 +219,7 @@
"electron-builder": "25.0.0",
"eslint": "^8.57.0",
"eslint-config-airbnb-typescript": "^18.0.0",
- "eslint-config-expensify": "^2.0.66",
+ "eslint-config-expensify": "^2.0.73",
"eslint-config-prettier": "^9.1.0",
"eslint-plugin-deprecation": "^3.0.0",
"eslint-plugin-jest": "^28.6.0",
@@ -252,6 +252,7 @@
"react-compiler-runtime": "^19.0.0-beta-8a03594-20241020",
"react-is": "^18.3.1",
"react-native-clean-project": "^4.0.0-alpha4.0",
+ "react-refresh": "^0.14.2",
"react-test-renderer": "18.3.1",
"reassure": "^1.0.0-rc.4",
"semver": "7.5.2",
@@ -3630,9 +3631,9 @@
}
},
"node_modules/@expensify/react-native-live-markdown": {
- "version": "0.1.176",
- "resolved": "https://registry.npmjs.org/@expensify/react-native-live-markdown/-/react-native-live-markdown-0.1.176.tgz",
- "integrity": "sha512-0IS0Rfl0qYqrE2V8jsVX58c4K/zxeNC7o1CAL9Xu+HTbTtD58Yu5gOOwp5AljkS2qdPR86swGRZyLXGkGRKkPg==",
+ "version": "0.1.180",
+ "resolved": "https://registry.npmjs.org/@expensify/react-native-live-markdown/-/react-native-live-markdown-0.1.180.tgz",
+ "integrity": "sha512-toyFMl5nXQiC2lY6x/bGagsXaeCevZjVuebnClwVZskrPMI65o8OH/Y1VvTly9eNWD04Br++ANmOPJZYMisEiQ==",
"license": "MIT",
"workspaces": [
"parser",
@@ -7431,6 +7432,85 @@
"node": ">=14"
}
},
+ "node_modules/@pmmmwh/react-refresh-webpack-plugin": {
+ "version": "0.5.15",
+ "resolved": "https://registry.npmjs.org/@pmmmwh/react-refresh-webpack-plugin/-/react-refresh-webpack-plugin-0.5.15.tgz",
+ "integrity": "sha512-LFWllMA55pzB9D34w/wXUCf8+c+IYKuJDgxiZ3qMhl64KRMBHYM1I3VdGaD2BV5FNPV2/S2596bppxHbv2ZydQ==",
+ "dev": true,
+ "dependencies": {
+ "ansi-html": "^0.0.9",
+ "core-js-pure": "^3.23.3",
+ "error-stack-parser": "^2.0.6",
+ "html-entities": "^2.1.0",
+ "loader-utils": "^2.0.4",
+ "schema-utils": "^4.2.0",
+ "source-map": "^0.7.3"
+ },
+ "engines": {
+ "node": ">= 10.13"
+ },
+ "peerDependencies": {
+ "@types/webpack": "4.x || 5.x",
+ "react-refresh": ">=0.10.0 <1.0.0",
+ "sockjs-client": "^1.4.0",
+ "type-fest": ">=0.17.0 <5.0.0",
+ "webpack": ">=4.43.0 <6.0.0",
+ "webpack-dev-server": "3.x || 4.x || 5.x",
+ "webpack-hot-middleware": "2.x",
+ "webpack-plugin-serve": "0.x || 1.x"
+ },
+ "peerDependenciesMeta": {
+ "@types/webpack": {
+ "optional": true
+ },
+ "sockjs-client": {
+ "optional": true
+ },
+ "type-fest": {
+ "optional": true
+ },
+ "webpack-dev-server": {
+ "optional": true
+ },
+ "webpack-hot-middleware": {
+ "optional": true
+ },
+ "webpack-plugin-serve": {
+ "optional": true
+ }
+ }
+ },
+ "node_modules/@pmmmwh/react-refresh-webpack-plugin/node_modules/ajv-keywords": {
+ "version": "5.1.0",
+ "resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-5.1.0.tgz",
+ "integrity": "sha512-YCS/JNFAUyr5vAuhk1DWm1CBxRHW9LbJ2ozWeemrIqpbsqKjHVxYPyi5GC0rjZIT5JxJ3virVTS8wk4i/Z+krw==",
+ "dev": true,
+ "dependencies": {
+ "fast-deep-equal": "^3.1.3"
+ },
+ "peerDependencies": {
+ "ajv": "^8.8.2"
+ }
+ },
+ "node_modules/@pmmmwh/react-refresh-webpack-plugin/node_modules/schema-utils": {
+ "version": "4.2.0",
+ "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-4.2.0.tgz",
+ "integrity": "sha512-L0jRsrPpjdckP3oPug3/VxNKt2trR8TcabrM6FOAAlvC/9Phcmm+cuAgTlxBqdBR1WJx7Naj9WHw+aOmheSVbw==",
+ "dev": true,
+ "dependencies": {
+ "@types/json-schema": "^7.0.9",
+ "ajv": "^8.9.0",
+ "ajv-formats": "^2.1.1",
+ "ajv-keywords": "^5.1.0"
+ },
+ "engines": {
+ "node": ">= 12.13.0"
+ },
+ "funding": {
+ "type": "opencollective",
+ "url": "https://opencollective.com/webpack"
+ }
+ },
"node_modules/@polka/url": {
"version": "1.0.0-next.25",
"resolved": "https://registry.npmjs.org/@polka/url/-/url-1.0.0-next.25.tgz",
@@ -17361,6 +17441,18 @@
"node": ">=6"
}
},
+ "node_modules/ansi-html": {
+ "version": "0.0.9",
+ "resolved": "https://registry.npmjs.org/ansi-html/-/ansi-html-0.0.9.tgz",
+ "integrity": "sha512-ozbS3LuenHVxNRh/wdnN16QapUHzauqSomAl1jwwJRRsGwFwtj644lIhxfWu0Fy0acCij2+AEgHvjscq3dlVXg==",
+ "dev": true,
+ "engines": [
+ "node >= 0.8.0"
+ ],
+ "bin": {
+ "ansi-html": "bin/ansi-html"
+ }
+ },
"node_modules/ansi-html-community": {
"version": "0.0.8",
"dev": true,
@@ -20713,6 +20805,17 @@
"url": "https://opencollective.com/core-js"
}
},
+ "node_modules/core-js-pure": {
+ "version": "3.38.1",
+ "resolved": "https://registry.npmjs.org/core-js-pure/-/core-js-pure-3.38.1.tgz",
+ "integrity": "sha512-BY8Etc1FZqdw1glX0XNOq2FDwfrg/VGqoZOZCdaL+UmdaqDwQwYXkMJT4t6In+zfEfOJDcM9T0KdbBeJg8KKCQ==",
+ "dev": true,
+ "hasInstallScript": true,
+ "funding": {
+ "type": "opencollective",
+ "url": "https://opencollective.com/core-js"
+ }
+ },
"node_modules/core-util-is": {
"version": "1.0.2",
"license": "MIT"
@@ -22800,10 +22903,11 @@
}
},
"node_modules/eslint-config-expensify": {
- "version": "2.0.66",
- "resolved": "https://registry.npmjs.org/eslint-config-expensify/-/eslint-config-expensify-2.0.66.tgz",
- "integrity": "sha512-6L9EIAiOxZnqOcFEsIwEUmX0fvglvboyqQh7LTqy+1O2h2W3mmrMSx87ymXeyFMg1nJQtqkFnrLv5ENGS0QC3Q==",
+ "version": "2.0.73",
+ "resolved": "https://registry.npmjs.org/eslint-config-expensify/-/eslint-config-expensify-2.0.73.tgz",
+ "integrity": "sha512-LHHyujwjTBizm9mIQMv6g/MsAbYdeOLZrOBdFqY/LyGPUJxOr9jt22xlmTFSdKhieLrbDwkcgkXjM38Z46Nb9A==",
"dev": true,
+ "license": "ISC",
"dependencies": {
"@babel/eslint-parser": "^7.25.7",
"@lwc/eslint-plugin-lwc": "^1.7.2",
@@ -24050,9 +24154,10 @@
}
},
"node_modules/expensify-common": {
- "version": "2.0.100",
- "resolved": "https://registry.npmjs.org/expensify-common/-/expensify-common-2.0.100.tgz",
- "integrity": "sha512-mektI+OuTywYU47Valjsn2+kLQ1/Wc9sWCY1/a0Vo8IHTXroQWvbKs5IXlkiqODi4SRonVZwOL3ha/oJD7o7nQ==",
+ "version": "2.0.106",
+ "resolved": "https://registry.npmjs.org/expensify-common/-/expensify-common-2.0.106.tgz",
+ "integrity": "sha512-KmxKvglbIUJb0sAcmNxb/AXYAqa3GIZfu3MbmtlYDNJx24mjDjtbGkKhm+16TICDoPj2PDRNogIqgUGWmSSZFQ==",
+ "license": "MIT",
"dependencies": {
"awesome-phonenumber": "^5.4.0",
"classnames": "2.5.0",
@@ -34477,13 +34582,6 @@
}
}
},
- "node_modules/react-native-dev-menu": {
- "version": "4.1.1",
- "license": "MIT",
- "peerDependencies": {
- "react-native": ">=0.61.0"
- }
- },
"node_modules/react-native-device-info": {
"version": "10.3.1",
"license": "MIT",
@@ -35406,9 +35504,10 @@
}
},
"node_modules/react-native-onyx": {
- "version": "2.0.73",
- "resolved": "https://registry.npmjs.org/react-native-onyx/-/react-native-onyx-2.0.73.tgz",
- "integrity": "sha512-ZgzTS9TV3wIh6cYfBM5sXrYz5A37x47a61n07e24p22gr7DosBX6J8ixaVCkC25G58A+2A+jRfzdtwRC5yW34A==",
+ "version": "2.0.78",
+ "resolved": "https://registry.npmjs.org/react-native-onyx/-/react-native-onyx-2.0.78.tgz",
+ "integrity": "sha512-YL6Zk470TOjhpccf2wqAi4bvvJyDrQccTAYsz+woZu+rKr74UX693U2EhP8ncZ7+dzgfS7zGKep2mwKVesfiWw==",
+ "license": "MIT",
"dependencies": {
"ascii-table": "0.0.9",
"fast-equals": "^4.0.3",
@@ -35528,9 +35627,10 @@
}
},
"node_modules/react-native-reanimated": {
- "version": "3.15.1",
- "resolved": "https://registry.npmjs.org/react-native-reanimated/-/react-native-reanimated-3.15.1.tgz",
- "integrity": "sha512-DbBeUUExtJ1x1nfE94I8qgDgWjq5ztM3IO/+XFO+agOkPeVpBs5cRnxHfJKrjqJ2MgwhJOUDmtHxo+tDsoeitg==",
+ "version": "3.15.3",
+ "resolved": "https://registry.npmjs.org/react-native-reanimated/-/react-native-reanimated-3.15.3.tgz",
+ "integrity": "sha512-5QBk/7PZvZ98Adxm4MRyglwzsRzReTQIe4Hd2wbBBAZ68IC4OYKvsc8cPEjgx3/1mG8HgHFYhbcDe5U2RjeFqw==",
+ "license": "MIT",
"dependencies": {
"@babel/plugin-transform-arrow-functions": "^7.0.0-0",
"@babel/plugin-transform-class-properties": "^7.0.0-0",
@@ -35726,8 +35826,9 @@
}
},
"node_modules/react-native-web": {
- "version": "0.19.12",
- "license": "MIT",
+ "version": "0.19.13",
+ "resolved": "https://registry.npmjs.org/react-native-web/-/react-native-web-0.19.13.tgz",
+ "integrity": "sha512-etv3bN8rJglrRCp/uL4p7l8QvUNUC++QwDbdZ8CB7BvZiMvsxfFIRM1j04vxNldG3uo2puRd6OSWR3ibtmc29A==",
"dependencies": {
"@babel/runtime": "^7.18.6",
"@react-native/normalize-colors": "^0.74.1",
@@ -36745,7 +36846,8 @@
},
"node_modules/react-refresh": {
"version": "0.14.2",
- "license": "MIT",
+ "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.14.2.tgz",
+ "integrity": "sha512-jCvmsr+1IUSMUyzOkRcvnVbX3ZYC6g9TDrDbFuFmRDq7PD4yaGbLKNQL6k2jnArV8hjYxh7hVhAZB6s9HDGpZA==",
"engines": {
"node": ">=0.10.0"
}
diff --git a/package.json b/package.json
index f0425a747967..a7f306235c0f 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "new.expensify",
- "version": "9.0.54-1",
+ "version": "9.0.59-0",
"author": "Expensify, Inc.",
"homepage": "https://new.expensify.com",
"description": "New Expensify is the next generation of Expensify: a reimagination of payments based atop a foundation of chat.",
@@ -33,6 +33,7 @@
"ios-build": "bundle exec fastlane ios build_unsigned",
"android-build": "bundle exec fastlane android build_local",
"test": "TZ=utc NODE_OPTIONS=--experimental-vm-modules jest",
+ "perf-test": "NODE_OPTIONS=--experimental-vm-modules npx reassure",
"typecheck": "NODE_OPTIONS=--max_old_space_size=8192 tsc",
"lint": "NODE_OPTIONS=--max_old_space_size=8192 eslint . --max-warnings=0 --cache --cache-location=node_modules/.cache/eslint",
"lint-changed": "NODE_OPTIONS=--max_old_space_size=8192 eslint --max-warnings=0 --config ./.eslintrc.changed.js $(git diff --diff-filter=AM --name-only origin/main HEAD -- \"*.ts\" \"*.tsx\")",
@@ -67,7 +68,7 @@
},
"dependencies": {
"@dotlottie/react-player": "^1.6.3",
- "@expensify/react-native-live-markdown": "0.1.176",
+ "@expensify/react-native-live-markdown": "0.1.180",
"@expo/metro-runtime": "~3.2.3",
"@firebase/app": "^0.10.10",
"@firebase/performance": "^0.6.8",
@@ -107,7 +108,7 @@
"date-fns-tz": "^3.2.0",
"dom-serializer": "^0.2.2",
"domhandler": "^4.3.0",
- "expensify-common": "2.0.100",
+ "expensify-common": "2.0.106",
"expo": "51.0.31",
"expo-av": "14.0.7",
"expo-image": "1.12.15",
@@ -133,11 +134,10 @@
"react-map-gl": "^7.1.3",
"react-native": "0.75.2",
"react-native-android-location-enabler": "^2.0.1",
- "react-native-app-logs": "git+https://github.com/margelo/react-native-app-logs#7e9c311bffdc6a9eeb69d90d30ead47e01c3552a",
+ "react-native-app-logs": "0.3.1",
"react-native-blob-util": "0.19.4",
"react-native-collapsible": "^1.6.2",
"react-native-config": "1.5.3",
- "react-native-dev-menu": "^4.1.1",
"react-native-device-info": "10.3.1",
"react-native-document-picker": "^9.3.1",
"react-native-draggable-flatlist": "^4.0.1",
@@ -152,7 +152,7 @@
"react-native-launch-arguments": "^4.0.2",
"react-native-localize": "^2.2.6",
"react-native-modal": "^13.0.0",
- "react-native-onyx": "2.0.73",
+ "react-native-onyx": "2.0.78",
"react-native-pager-view": "6.4.1",
"react-native-pdf": "6.7.3",
"react-native-performance": "^5.1.0",
@@ -161,7 +161,7 @@
"react-native-plaid-link-sdk": "11.11.0",
"react-native-qrcode-svg": "6.3.11",
"react-native-quick-sqlite": "git+https://github.com/margelo/react-native-quick-sqlite#99f34ebefa91698945f3ed26622e002bd79489e0",
- "react-native-reanimated": "3.15.1",
+ "react-native-reanimated": "3.15.3",
"react-native-release-profiler": "^0.2.1",
"react-native-render-html": "6.3.1",
"react-native-safe-area-context": "4.10.9",
@@ -173,7 +173,7 @@
"react-native-url-polyfill": "^2.0.0",
"react-native-view-shot": "3.8.0",
"react-native-vision-camera": "4.0.0-beta.13",
- "react-native-web": "^0.19.12",
+ "react-native-web": "0.19.13",
"react-native-webview": "13.8.6",
"react-plaid-link": "3.3.2",
"react-web-config": "^1.0.0",
@@ -213,6 +213,7 @@
"@perf-profiler/profiler": "^0.10.10",
"@perf-profiler/reporter": "^0.9.0",
"@perf-profiler/types": "^0.8.0",
+ "@pmmmwh/react-refresh-webpack-plugin": "^0.5.15",
"@react-native-community/eslint-config": "3.2.0",
"@react-native/babel-preset": "0.75.2",
"@react-native/metro-config": "0.75.2",
@@ -275,7 +276,7 @@
"electron-builder": "25.0.0",
"eslint": "^8.57.0",
"eslint-config-airbnb-typescript": "^18.0.0",
- "eslint-config-expensify": "^2.0.66",
+ "eslint-config-expensify": "^2.0.73",
"eslint-config-prettier": "^9.1.0",
"eslint-plugin-deprecation": "^3.0.0",
"eslint-plugin-jest": "^28.6.0",
@@ -308,6 +309,7 @@
"react-compiler-runtime": "^19.0.0-beta-8a03594-20241020",
"react-is": "^18.3.1",
"react-native-clean-project": "^4.0.0-alpha4.0",
+ "react-refresh": "^0.14.2",
"react-test-renderer": "18.3.1",
"reassure": "^1.0.0-rc.4",
"semver": "7.5.2",
@@ -367,13 +369,11 @@
},
"electronmon": {
"patterns": [
- "!node_modules",
- "!node_modules/**/*",
- "!**/*.map",
+ "!src/**",
"!ios/**",
"!android/**",
- "*.test.*",
- "*.spec.*"
+ "!tests/**",
+ "*.test.*"
]
},
"engines": {
diff --git a/patches/react-native+0.75.2+012+Add-onPaste-to-TextInput.patch b/patches/react-native+0.75.2+012+Add-onPaste-to-TextInput.patch
index 55657e61dc09..e5ddeee282fb 100644
--- a/patches/react-native+0.75.2+012+Add-onPaste-to-TextInput.patch
+++ b/patches/react-native+0.75.2+012+Add-onPaste-to-TextInput.patch
@@ -1,8 +1,8 @@
diff --git a/node_modules/react-native/Libraries/Components/TextInput/AndroidTextInputNativeComponent.js b/node_modules/react-native/Libraries/Components/TextInput/AndroidTextInputNativeComponent.js
-index a77e5b4..5e58ec4 100644
+index 6c4bbb2..770dfee 100644
--- a/node_modules/react-native/Libraries/Components/TextInput/AndroidTextInputNativeComponent.js
+++ b/node_modules/react-native/Libraries/Components/TextInput/AndroidTextInputNativeComponent.js
-@@ -455,6 +455,21 @@ export type NativeProps = $ReadOnly<{|
+@@ -462,6 +462,21 @@ export type NativeProps = $ReadOnly<{|
|}>,
>,
@@ -24,7 +24,7 @@ index a77e5b4..5e58ec4 100644
/**
* The string that will be rendered before text input has been entered.
*/
-@@ -658,6 +673,9 @@ export const __INTERNAL_VIEW_CONFIG: PartialViewConfig = {
+@@ -668,6 +683,9 @@ export const __INTERNAL_VIEW_CONFIG: PartialViewConfig = {
topScroll: {
registrationName: 'onScroll',
},
@@ -34,7 +34,7 @@ index a77e5b4..5e58ec4 100644
},
validAttributes: {
maxFontSizeMultiplier: true,
-@@ -711,6 +729,7 @@ export const __INTERNAL_VIEW_CONFIG: PartialViewConfig = {
+@@ -722,6 +740,7 @@ export const __INTERNAL_VIEW_CONFIG: PartialViewConfig = {
secureTextEntry: true,
textBreakStrategy: true,
onScroll: true,
@@ -43,7 +43,7 @@ index a77e5b4..5e58ec4 100644
disableFullscreenUI: true,
includeFontPadding: true,
diff --git a/node_modules/react-native/Libraries/Components/TextInput/RCTTextInputViewConfig.js b/node_modules/react-native/Libraries/Components/TextInput/RCTTextInputViewConfig.js
-index 3bfe22c..1cb122f 100644
+index 8326797..dbfe5d5 100644
--- a/node_modules/react-native/Libraries/Components/TextInput/RCTTextInputViewConfig.js
+++ b/node_modules/react-native/Libraries/Components/TextInput/RCTTextInputViewConfig.js
@@ -88,6 +88,9 @@ const RCTTextInputViewConfig = {
@@ -56,7 +56,7 @@ index 3bfe22c..1cb122f 100644
},
validAttributes: {
fontSize: true,
-@@ -153,6 +156,7 @@ const RCTTextInputViewConfig = {
+@@ -154,6 +157,7 @@ const RCTTextInputViewConfig = {
onSelectionChange: true,
onContentSizeChange: true,
onScroll: true,
@@ -170,7 +170,7 @@ index a94fb19..8cfde15 100644
* The string that will be rendered before text input has been entered.
*/
diff --git a/node_modules/react-native/Libraries/Text/TextInput/Multiline/RCTUITextView.mm b/node_modules/react-native/Libraries/Text/TextInput/Multiline/RCTUITextView.mm
-index d5e2e22..a11679a 100644
+index d5e2e22..065a819 100644
--- a/node_modules/react-native/Libraries/Text/TextInput/Multiline/RCTUITextView.mm
+++ b/node_modules/react-native/Libraries/Text/TextInput/Multiline/RCTUITextView.mm
@@ -13,6 +13,10 @@
@@ -184,7 +184,7 @@ index d5e2e22..a11679a 100644
@implementation RCTUITextView {
UILabel *_placeholderView;
UITextView *_detachedTextView;
-@@ -172,7 +176,32 @@ - (void)scrollRangeToVisible:(NSRange)range
+@@ -172,7 +176,31 @@ - (void)scrollRangeToVisible:(NSRange)range
- (void)paste:(id)sender
{
_textWasPasted = YES;
@@ -197,8 +197,7 @@ index d5e2e22..a11679a 100644
+ if (UTTypeConformsTo((__bridge CFStringRef)identifier, kUTTypeImage)) {
+ NSString *MIMEType = (__bridge_transfer NSString *)UTTypeCopyPreferredTagWithClass((__bridge CFStringRef)identifier, kUTTagClassMIMEType);
+ NSString *fileExtension = (__bridge_transfer NSString *)UTTypeCopyPreferredTagWithClass((__bridge CFStringRef)identifier, kUTTagClassFilenameExtension);
-+ NSString *fileName = [NSString stringWithFormat:@"%@.%@", [[NSUUID UUID] UUIDString], fileExtension];
-+ NSString *filePath = [NSTemporaryDirectory() stringByAppendingPathComponent:fileName];
++ NSString *filePath = RCTTempFilePath(fileExtension, nil);
+ NSURL *fileURL = [NSURL fileURLWithPath:filePath];
+ NSData *fileData = [clipboard dataForPasteboardType:identifier];
+ [fileData writeToFile:filePath atomically:YES];
@@ -218,7 +217,7 @@ index d5e2e22..a11679a 100644
}
// Turn off scroll animation to fix flaky scrolling.
-@@ -264,6 +293,10 @@ - (BOOL)canPerformAction:(SEL)action withSender:(id)sender
+@@ -264,6 +292,10 @@ - (BOOL)canPerformAction:(SEL)action withSender:(id)sender
return NO;
}
@@ -346,7 +345,7 @@ index f58f147..e367394 100644
RCT_EXPORT_VIEW_PROPERTY(mostRecentEventCount, NSInteger)
diff --git a/node_modules/react-native/Libraries/Text/TextInput/Singleline/RCTUITextField.mm b/node_modules/react-native/Libraries/Text/TextInput/Singleline/RCTUITextField.mm
-index 0318671..bb165d7 100644
+index 0318671..667e646 100644
--- a/node_modules/react-native/Libraries/Text/TextInput/Singleline/RCTUITextField.mm
+++ b/node_modules/react-native/Libraries/Text/TextInput/Singleline/RCTUITextField.mm
@@ -12,6 +12,10 @@
@@ -371,7 +370,7 @@ index 0318671..bb165d7 100644
return [super canPerformAction:action withSender:sender];
}
-@@ -222,7 +230,32 @@ - (void)scrollRangeToVisible:(NSRange)range
+@@ -222,7 +230,31 @@ - (void)scrollRangeToVisible:(NSRange)range
- (void)paste:(id)sender
{
_textWasPasted = YES;
@@ -384,8 +383,7 @@ index 0318671..bb165d7 100644
+ if (UTTypeConformsTo((__bridge CFStringRef)identifier, kUTTypeImage)) {
+ NSString *MIMEType = (__bridge_transfer NSString *)UTTypeCopyPreferredTagWithClass((__bridge CFStringRef)identifier, kUTTagClassMIMEType);
+ NSString *fileExtension = (__bridge_transfer NSString *)UTTypeCopyPreferredTagWithClass((__bridge CFStringRef)identifier, kUTTagClassFilenameExtension);
-+ NSString *fileName = [NSString stringWithFormat:@"%@.%@", [[NSUUID UUID] UUIDString], fileExtension];
-+ NSString *filePath = [NSTemporaryDirectory() stringByAppendingPathComponent:fileName];
++ NSString *filePath = RCTTempFilePath(fileExtension, nil);
+ NSURL *fileURL = [NSURL fileURLWithPath:filePath];
+ NSData *fileData = [clipboard dataForPasteboardType:identifier];
+ [fileData writeToFile:filePath atomically:YES];
diff --git a/patches/react-native+0.75.2+018+android-keyboard-avoiding-view.patch b/patches/react-native+0.75.2+018+android-keyboard-avoiding-view.patch
new file mode 100644
index 000000000000..27fa6074e6ce
--- /dev/null
+++ b/patches/react-native+0.75.2+018+android-keyboard-avoiding-view.patch
@@ -0,0 +1,26 @@
+diff --git a/node_modules/react-native/ReactAndroid/src/main/java/com/facebook/react/ReactRootView.java b/node_modules/react-native/ReactAndroid/src/main/java/com/facebook/react/ReactRootView.java
+index ed1aba8..0a9284f 100644
+--- a/node_modules/react-native/ReactAndroid/src/main/java/com/facebook/react/ReactRootView.java
++++ b/node_modules/react-native/ReactAndroid/src/main/java/com/facebook/react/ReactRootView.java
+@@ -891,7 +891,9 @@ public class ReactRootView extends FrameLayout implements RootView, ReactRoot {
+ sendEvent(
+ "keyboardDidHide",
+ createKeyboardEventPayload(
+- PixelUtil.toDIPFromPixel(mVisibleViewArea.height()),
++ // Use mLastHeight to account for the translucent status bar, and fall back to getMeasuredHeight() on Bridgeless mode.
++ // Remove this patch once the upstream fix for https://github.com/facebook/react-native/issues/47140 is released.
++ PixelUtil.toDIPFromPixel(mWasMeasured ? mLastHeight : getMeasuredHeight()),
+ 0,
+ PixelUtil.toDIPFromPixel(mVisibleViewArea.width()),
+ 0));
+@@ -940,7 +942,9 @@ public class ReactRootView extends FrameLayout implements RootView, ReactRoot {
+ sendEvent(
+ "keyboardDidHide",
+ createKeyboardEventPayload(
+- PixelUtil.toDIPFromPixel(mVisibleViewArea.height()),
++ // Use mLastHeight to account for the translucent status bar, and fall back to getMeasuredHeight() on Bridgeless mode.
++ // Remove this patch once the upstream fix for https://github.com/facebook/react-native/issues/47140 is released.
++ PixelUtil.toDIPFromPixel(mWasMeasured ? mLastHeight : getMeasuredHeight()),
+ 0,
+ PixelUtil.toDIPFromPixel(mVisibleViewArea.width()),
+ 0));
diff --git a/patches/react-native+0.75.2+019+Android-onHostResume-resume-frame-callback.patch b/patches/react-native+0.75.2+019+Android-onHostResume-resume-frame-callback.patch
new file mode 100644
index 000000000000..3bea9012e9d5
--- /dev/null
+++ b/patches/react-native+0.75.2+019+Android-onHostResume-resume-frame-callback.patch
@@ -0,0 +1,23 @@
+diff --git a/node_modules/react-native/ReactAndroid/src/main/java/com/facebook/react/uimanager/events/FabricEventDispatcher.java b/node_modules/react-native/ReactAndroid/src/main/java/com/facebook/react/uimanager/events/FabricEventDispatcher.java
+index ce8520e..e2b22b0 100644
+--- a/node_modules/react-native/ReactAndroid/src/main/java/com/facebook/react/uimanager/events/FabricEventDispatcher.java
++++ b/node_modules/react-native/ReactAndroid/src/main/java/com/facebook/react/uimanager/events/FabricEventDispatcher.java
+@@ -122,6 +122,7 @@ public class FabricEventDispatcher implements EventDispatcher, LifecycleEventLis
+ @Override
+ public void onHostResume() {
+ maybePostFrameCallbackFromNonUI();
++ mCurrentFrameCallback.resume();
+ }
+
+ @Override
+@@ -190,6 +191,10 @@ public class FabricEventDispatcher implements EventDispatcher, LifecycleEventLis
+ mShouldStop = true;
+ }
+
++ public void resume() {
++ mShouldStop = false;
++ }
++
+ public void maybePost() {
+ if (!mIsPosted) {
+ mIsPosted = true;
diff --git a/patches/react-native-reanimated+3.15.1+001+hybrid-app.patch b/patches/react-native-reanimated+3.15.3+001+hybrid-app.patch
similarity index 100%
rename from patches/react-native-reanimated+3.15.1+001+hybrid-app.patch
rename to patches/react-native-reanimated+3.15.3+001+hybrid-app.patch
diff --git a/patches/react-native-reanimated+3.15.1+002+dontWhitelistTextProp.patch b/patches/react-native-reanimated+3.15.3+002+dontWhitelistTextProp.patch
similarity index 100%
rename from patches/react-native-reanimated+3.15.1+002+dontWhitelistTextProp.patch
rename to patches/react-native-reanimated+3.15.3+002+dontWhitelistTextProp.patch
diff --git a/patches/react-native-reanimated+3.15.1+003+fixNullViewTag.patch b/patches/react-native-reanimated+3.15.3+003+fixNullViewTag.patch
similarity index 100%
rename from patches/react-native-reanimated+3.15.1+003+fixNullViewTag.patch
rename to patches/react-native-reanimated+3.15.3+003+fixNullViewTag.patch
diff --git a/patches/react-native-web+0.19.12+001+initial.patch b/patches/react-native-web+0.19.13+001+initial.patch
similarity index 95%
rename from patches/react-native-web+0.19.12+001+initial.patch
rename to patches/react-native-web+0.19.13+001+initial.patch
index c77cfc7829ed..75efdf4da117 100644
--- a/patches/react-native-web+0.19.12+001+initial.patch
+++ b/patches/react-native-web+0.19.13+001+initial.patch
@@ -1,8 +1,8 @@
diff --git a/node_modules/react-native-web/dist/vendor/react-native/VirtualizedList/index.js b/node_modules/react-native-web/dist/vendor/react-native/VirtualizedList/index.js
-index e137def..c3e5054 100644
+index 1f52b73..53b1a83 100644
--- a/node_modules/react-native-web/dist/vendor/react-native/VirtualizedList/index.js
+++ b/node_modules/react-native-web/dist/vendor/react-native/VirtualizedList/index.js
-@@ -285,7 +285,7 @@ class VirtualizedList extends StateSafePureComponent {
+@@ -287,7 +287,7 @@ class VirtualizedList extends StateSafePureComponent {
// REACT-NATIVE-WEB patch to preserve during future RN merges: Support inverted wheel scroller.
constructor(_props) {
@@ -11,7 +11,7 @@ index e137def..c3e5054 100644
super(_props);
this._getScrollMetrics = () => {
return this._scrollMetrics;
-@@ -520,6 +520,11 @@ class VirtualizedList extends StateSafePureComponent {
+@@ -522,6 +522,11 @@ class VirtualizedList extends StateSafePureComponent {
visibleLength,
zoomScale
};
@@ -23,7 +23,7 @@ index e137def..c3e5054 100644
this._updateViewableItems(this.props, this.state.cellsAroundViewport);
if (!this.props) {
return;
-@@ -569,7 +574,7 @@ class VirtualizedList extends StateSafePureComponent {
+@@ -571,7 +576,7 @@ class VirtualizedList extends StateSafePureComponent {
this._updateCellsToRender = () => {
this._updateViewableItems(this.props, this.state.cellsAroundViewport);
this.setState((state, props) => {
@@ -32,7 +32,7 @@ index e137def..c3e5054 100644
var renderMask = VirtualizedList._createRenderMask(props, cellsAroundViewport, this._getNonViewportRenderRegions(props));
if (cellsAroundViewport.first === state.cellsAroundViewport.first && cellsAroundViewport.last === state.cellsAroundViewport.last && renderMask.equals(state.renderMask)) {
return null;
-@@ -589,7 +594,7 @@ class VirtualizedList extends StateSafePureComponent {
+@@ -591,7 +596,7 @@ class VirtualizedList extends StateSafePureComponent {
return {
index,
item,
@@ -41,7 +41,7 @@ index e137def..c3e5054 100644
isViewable
};
};
-@@ -621,12 +626,10 @@ class VirtualizedList extends StateSafePureComponent {
+@@ -623,12 +628,10 @@ class VirtualizedList extends StateSafePureComponent {
};
this._getFrameMetrics = (index, props) => {
var data = props.data,
@@ -55,7 +55,7 @@ index e137def..c3e5054 100644
if (!frame || frame.index !== index) {
if (getItemLayout) {
/* $FlowFixMe[prop-missing] (>=0.63.0 site=react_native_fb) This comment
-@@ -650,7 +653,7 @@ class VirtualizedList extends StateSafePureComponent {
+@@ -652,7 +655,7 @@ class VirtualizedList extends StateSafePureComponent {
// The last cell we rendered may be at a new index. Bail if we don't know
// where it is.
@@ -64,7 +64,7 @@ index e137def..c3e5054 100644
return [];
}
var first = focusedCellIndex;
-@@ -690,9 +693,15 @@ class VirtualizedList extends StateSafePureComponent {
+@@ -692,9 +695,15 @@ class VirtualizedList extends StateSafePureComponent {
}
}
var initialRenderRegion = VirtualizedList._initialRenderRegion(_props);
@@ -81,7 +81,7 @@ index e137def..c3e5054 100644
};
// REACT-NATIVE-WEB patch to preserve during future RN merges: Support inverted wheel scroller.
-@@ -748,6 +757,26 @@ class VirtualizedList extends StateSafePureComponent {
+@@ -750,6 +759,26 @@ class VirtualizedList extends StateSafePureComponent {
}
}
}
@@ -108,7 +108,7 @@ index e137def..c3e5054 100644
static _createRenderMask(props, cellsAroundViewport, additionalRegions) {
var itemCount = props.getItemCount(props.data);
invariant(cellsAroundViewport.first >= 0 && cellsAroundViewport.last >= cellsAroundViewport.first - 1 && cellsAroundViewport.last < itemCount, "Invalid cells around viewport \"[" + cellsAroundViewport.first + ", " + cellsAroundViewport.last + "]\" was passed to VirtualizedList._createRenderMask");
-@@ -796,7 +825,7 @@ class VirtualizedList extends StateSafePureComponent {
+@@ -798,7 +827,7 @@ class VirtualizedList extends StateSafePureComponent {
}
}
}
@@ -117,7 +117,7 @@ index e137def..c3e5054 100644
var data = props.data,
getItemCount = props.getItemCount;
var onEndReachedThreshold = onEndReachedThresholdOrDefault(props.onEndReachedThreshold);
-@@ -819,17 +848,9 @@ class VirtualizedList extends StateSafePureComponent {
+@@ -821,17 +850,9 @@ class VirtualizedList extends StateSafePureComponent {
last: Math.min(cellsAroundViewport.last + renderAhead, getItemCount(data) - 1)
};
} else {
@@ -138,7 +138,7 @@ index e137def..c3e5054 100644
return cellsAroundViewport.last >= getItemCount(data) ? VirtualizedList._constrainToItemCount(cellsAroundViewport, props) : cellsAroundViewport;
}
newCellsAroundViewport = computeWindowedRenderLimits(props, maxToRenderPerBatchOrDefault(props.maxToRenderPerBatch), windowSizeOrDefault(props.windowSize), cellsAroundViewport, this.__getFrameMetricsApprox, this._scrollMetrics);
-@@ -902,16 +923,36 @@ class VirtualizedList extends StateSafePureComponent {
+@@ -904,16 +925,36 @@ class VirtualizedList extends StateSafePureComponent {
}
}
static getDerivedStateFromProps(newProps, prevState) {
@@ -177,7 +177,7 @@ index e137def..c3e5054 100644
};
}
_pushCells(cells, stickyHeaderIndices, stickyIndicesFromProps, first, last, inversionStyle) {
-@@ -934,7 +975,7 @@ class VirtualizedList extends StateSafePureComponent {
+@@ -936,7 +977,7 @@ class VirtualizedList extends StateSafePureComponent {
last = Math.min(end, last);
var _loop = function _loop() {
var item = getItem(data, ii);
@@ -186,7 +186,7 @@ index e137def..c3e5054 100644
_this._indicesToKeys.set(ii, key);
if (stickyIndicesFromProps.has(ii + stickyOffset)) {
stickyHeaderIndices.push(cells.length);
-@@ -969,20 +1010,23 @@ class VirtualizedList extends StateSafePureComponent {
+@@ -971,20 +1012,23 @@ class VirtualizedList extends StateSafePureComponent {
}
static _constrainToItemCount(cells, props) {
var itemCount = props.getItemCount(props.data);
@@ -216,8 +216,8 @@ index e137def..c3e5054 100644
if (props.keyExtractor != null) {
return props.keyExtractor(item, index);
}
-@@ -1022,7 +1066,12 @@ class VirtualizedList extends StateSafePureComponent {
- cells.push( /*#__PURE__*/React.createElement(VirtualizedListCellContextProvider, {
+@@ -1024,7 +1068,12 @@ class VirtualizedList extends StateSafePureComponent {
+ cells.push(/*#__PURE__*/React.createElement(VirtualizedListCellContextProvider, {
cellKey: this._getCellKey() + '-header',
key: "$header"
- }, /*#__PURE__*/React.createElement(View, {
@@ -230,7 +230,7 @@ index e137def..c3e5054 100644
onLayout: this._onLayoutHeader,
style: [inversionStyle, this.props.ListHeaderComponentStyle]
},
-@@ -1124,7 +1173,11 @@ class VirtualizedList extends StateSafePureComponent {
+@@ -1126,7 +1175,11 @@ class VirtualizedList extends StateSafePureComponent {
// TODO: Android support
invertStickyHeaders: this.props.invertStickyHeaders !== undefined ? this.props.invertStickyHeaders : this.props.inverted,
stickyHeaderIndices,
@@ -243,7 +243,7 @@ index e137def..c3e5054 100644
});
this._hasMore = this.state.cellsAroundViewport.last < itemCount - 1;
var innerRet = /*#__PURE__*/React.createElement(VirtualizedListContextProvider, {
-@@ -1317,8 +1370,12 @@ class VirtualizedList extends StateSafePureComponent {
+@@ -1319,8 +1372,12 @@ class VirtualizedList extends StateSafePureComponent {
onStartReached = _this$props8.onStartReached,
onStartReachedThreshold = _this$props8.onStartReachedThreshold,
onEndReached = _this$props8.onEndReached,
@@ -258,7 +258,7 @@ index e137def..c3e5054 100644
var _this$_scrollMetrics2 = this._scrollMetrics,
contentLength = _this$_scrollMetrics2.contentLength,
visibleLength = _this$_scrollMetrics2.visibleLength,
-@@ -1358,16 +1415,10 @@ class VirtualizedList extends StateSafePureComponent {
+@@ -1360,16 +1417,10 @@ class VirtualizedList extends StateSafePureComponent {
// and call onStartReached only once for a given content length,
// and only if onEndReached is not being executed
else if (onStartReached != null && this.state.cellsAroundViewport.first === 0 && isWithinStartThreshold && this._scrollMetrics.contentLength !== this._sentStartForContentLength) {
@@ -279,7 +279,7 @@ index e137def..c3e5054 100644
}
// If the user scrolls away from the start or end and back again,
-@@ -1433,6 +1484,11 @@ class VirtualizedList extends StateSafePureComponent {
+@@ -1435,6 +1486,11 @@ class VirtualizedList extends StateSafePureComponent {
*/
_updateViewableItems(props, cellsAroundViewport) {
diff --git a/patches/react-native-web+0.19.12+002+fixLastSpacer.patch b/patches/react-native-web+0.19.13+002+fixLastSpacer.patch
similarity index 94%
rename from patches/react-native-web+0.19.12+002+fixLastSpacer.patch
rename to patches/react-native-web+0.19.13+002+fixLastSpacer.patch
index 581298613492..c400dcfc8cca 100644
--- a/patches/react-native-web+0.19.12+002+fixLastSpacer.patch
+++ b/patches/react-native-web+0.19.13+002+fixLastSpacer.patch
@@ -1,5 +1,5 @@
diff --git a/node_modules/react-native-web/dist/modules/AccessibilityUtil/propsToAccessibilityComponent.js b/node_modules/react-native-web/dist/modules/AccessibilityUtil/propsToAccessibilityComponent.js
-index 9c9a533..7794181 100644
+index 7d1d587..de51afe 100644
--- a/node_modules/react-native-web/dist/modules/AccessibilityUtil/propsToAccessibilityComponent.js
+++ b/node_modules/react-native-web/dist/modules/AccessibilityUtil/propsToAccessibilityComponent.js
@@ -27,7 +27,8 @@ var roleComponents = {
@@ -13,7 +13,7 @@ index 9c9a533..7794181 100644
var emptyObject = {};
var propsToAccessibilityComponent = function propsToAccessibilityComponent(props) {
diff --git a/node_modules/react-native-web/dist/vendor/react-native/VirtualizedList/index.js b/node_modules/react-native-web/dist/vendor/react-native/VirtualizedList/index.js
-index 7f6c880..b05da08 100644
+index 53b1a83..5689220 100644
--- a/node_modules/react-native-web/dist/vendor/react-native/VirtualizedList/index.js
+++ b/node_modules/react-native-web/dist/vendor/react-native/VirtualizedList/index.js
@@ -78,14 +78,6 @@ function scrollEventThrottleOrDefault(scrollEventThrottle) {
@@ -31,7 +31,7 @@ index 7f6c880..b05da08 100644
/**
* Base implementation for the more convenient [``](https://reactnative.dev/docs/flatlist)
-@@ -1107,7 +1099,8 @@ class VirtualizedList extends StateSafePureComponent {
+@@ -1109,7 +1101,8 @@ class VirtualizedList extends StateSafePureComponent {
_keylessItemComponentName = '';
var spacerKey = this._getSpacerKey(!horizontal);
var renderRegions = this.state.renderMask.enumerateRegions();
diff --git a/patches/react-native-web+0.19.12+003+image-header-support.patch b/patches/react-native-web+0.19.13+003+image-header-support.patch
similarity index 95%
rename from patches/react-native-web+0.19.12+003+image-header-support.patch
rename to patches/react-native-web+0.19.13+003+image-header-support.patch
index d0a490a4ed70..15e83ce31f8a 100644
--- a/patches/react-native-web+0.19.12+003+image-header-support.patch
+++ b/patches/react-native-web+0.19.13+003+image-header-support.patch
@@ -1,8 +1,8 @@
diff --git a/node_modules/react-native-web/dist/exports/Image/index.js b/node_modules/react-native-web/dist/exports/Image/index.js
-index 9649d27..66ef95c 100644
+index 348831d..ca40ee8 100644
--- a/node_modules/react-native-web/dist/exports/Image/index.js
+++ b/node_modules/react-native-web/dist/exports/Image/index.js
-@@ -135,7 +135,22 @@ function resolveAssetUri(source) {
+@@ -137,7 +137,22 @@ function resolveAssetUri(source) {
}
return uri;
}
@@ -13,7 +13,7 @@ index 9649d27..66ef95c 100644
+ if (onError) {
+ onError({
+ nativeEvent: {
-+ error: "Failed to load resource " + uri + " (404)"
++ error: "Failed to load resource " + uri
+ }
+ });
+ }
@@ -26,14 +26,14 @@ index 9649d27..66ef95c 100644
var _ariaLabel = props['aria-label'],
accessibilityLabel = props.accessibilityLabel,
blurRadius = props.blurRadius,
-@@ -238,16 +253,10 @@ var Image = /*#__PURE__*/React.forwardRef((props, ref) => {
+@@ -240,16 +255,10 @@ var Image = /*#__PURE__*/React.forwardRef((props, ref) => {
}
}, function error() {
updateState(ERRORED);
- if (onError) {
- onError({
- nativeEvent: {
-- error: "Failed to load resource " + uri + " (404)"
+- error: "Failed to load resource " + uri
- }
- });
- }
@@ -47,7 +47,7 @@ index 9649d27..66ef95c 100644
});
}
function abortPendingRequest() {
-@@ -279,10 +288,79 @@ var Image = /*#__PURE__*/React.forwardRef((props, ref) => {
+@@ -281,10 +290,79 @@ var Image = /*#__PURE__*/React.forwardRef((props, ref) => {
suppressHydrationWarning: true
}), hiddenImage, createTintColorSVG(tintColor, filterRef.current));
});
diff --git a/patches/react-native-web+0.19.12+004+fixPointerEventDown.patch b/patches/react-native-web+0.19.13+004+fixPointerEventDown.patch
similarity index 100%
rename from patches/react-native-web+0.19.12+004+fixPointerEventDown.patch
rename to patches/react-native-web+0.19.13+004+fixPointerEventDown.patch
diff --git a/patches/react-native-web+0.19.12+005+osr-improvement.patch b/patches/react-native-web+0.19.13+005+osr-improvement.patch
similarity index 94%
rename from patches/react-native-web+0.19.12+005+osr-improvement.patch
rename to patches/react-native-web+0.19.13+005+osr-improvement.patch
index b1afa699e7a2..d0a952172768 100644
--- a/patches/react-native-web+0.19.12+005+osr-improvement.patch
+++ b/patches/react-native-web+0.19.13+005+osr-improvement.patch
@@ -1,8 +1,8 @@
diff --git a/node_modules/react-native-web/dist/vendor/react-native/VirtualizedList/index.js b/node_modules/react-native-web/dist/vendor/react-native/VirtualizedList/index.js
-index bede95b..2aef4c6 100644
+index 5689220..df40877 100644
--- a/node_modules/react-native-web/dist/vendor/react-native/VirtualizedList/index.js
+++ b/node_modules/react-native-web/dist/vendor/react-native/VirtualizedList/index.js
-@@ -332,7 +332,7 @@ class VirtualizedList extends StateSafePureComponent {
+@@ -334,7 +334,7 @@ class VirtualizedList extends StateSafePureComponent {
zoomScale: 1
};
this._scrollRef = null;
@@ -11,7 +11,7 @@ index bede95b..2aef4c6 100644
this._sentEndForContentLength = 0;
this._totalCellLength = 0;
this._totalCellsMeasured = 0;
-@@ -684,16 +684,18 @@ class VirtualizedList extends StateSafePureComponent {
+@@ -686,16 +686,18 @@ class VirtualizedList extends StateSafePureComponent {
});
}
}
@@ -32,7 +32,7 @@ index bede95b..2aef4c6 100644
};
// REACT-NATIVE-WEB patch to preserve during future RN merges: Support inverted wheel scroller.
-@@ -919,13 +921,13 @@ class VirtualizedList extends StateSafePureComponent {
+@@ -921,13 +923,13 @@ class VirtualizedList extends StateSafePureComponent {
// first and last could be stale (e.g. if a new, shorter items props is passed in), so we make
// sure we're rendering a reasonable range here.
var itemCount = newProps.getItemCount(newProps.data);
@@ -48,7 +48,7 @@ index bede95b..2aef4c6 100644
if (newProps.maintainVisibleContentPosition != null && prevFirstVisibleItemKey != null && newFirstVisibleItemKey != null) {
if (newFirstVisibleItemKey !== prevFirstVisibleItemKey) {
// Fast path if items were added at the start of the list.
-@@ -944,7 +946,8 @@ class VirtualizedList extends StateSafePureComponent {
+@@ -946,7 +948,8 @@ class VirtualizedList extends StateSafePureComponent {
cellsAroundViewport: constrainedCells,
renderMask: VirtualizedList._createRenderMask(newProps, constrainedCells),
firstVisibleItemKey: newFirstVisibleItemKey,
@@ -58,7 +58,7 @@ index bede95b..2aef4c6 100644
};
}
_pushCells(cells, stickyHeaderIndices, stickyIndicesFromProps, first, last, inversionStyle) {
-@@ -1220,7 +1223,7 @@ class VirtualizedList extends StateSafePureComponent {
+@@ -1222,7 +1225,7 @@ class VirtualizedList extends StateSafePureComponent {
return ret;
}
}
@@ -67,7 +67,7 @@ index bede95b..2aef4c6 100644
var _this$props7 = this.props,
data = _this$props7.data,
extraData = _this$props7.extraData;
-@@ -1244,6 +1247,11 @@ class VirtualizedList extends StateSafePureComponent {
+@@ -1246,6 +1249,11 @@ class VirtualizedList extends StateSafePureComponent {
if (hiPriInProgress) {
this._hiPriInProgress = false;
}
@@ -79,7 +79,7 @@ index bede95b..2aef4c6 100644
}
// Used for preventing scrollToIndex from being called multiple times for initialScrollIndex
-@@ -1407,8 +1415,8 @@ class VirtualizedList extends StateSafePureComponent {
+@@ -1409,8 +1417,8 @@ class VirtualizedList extends StateSafePureComponent {
// Next check if the user just scrolled within the start threshold
// and call onStartReached only once for a given content length,
// and only if onEndReached is not being executed
@@ -90,7 +90,7 @@ index bede95b..2aef4c6 100644
onStartReached({
distanceFromStart
});
-@@ -1417,7 +1425,7 @@ class VirtualizedList extends StateSafePureComponent {
+@@ -1419,7 +1427,7 @@ class VirtualizedList extends StateSafePureComponent {
// If the user scrolls away from the start or end and back again,
// cause onStartReached or onEndReached to be triggered again
else {
@@ -100,7 +100,7 @@ index bede95b..2aef4c6 100644
}
}
diff --git a/node_modules/react-native-web/src/vendor/react-native/VirtualizedList/index.js b/node_modules/react-native-web/src/vendor/react-native/VirtualizedList/index.js
-index 459f017..d20115c 100644
+index 459f017..fb2d269 100644
--- a/node_modules/react-native-web/src/vendor/react-native/VirtualizedList/index.js
+++ b/node_modules/react-native-web/src/vendor/react-native/VirtualizedList/index.js
@@ -79,6 +79,7 @@ type State = {
diff --git a/patches/react-native-web+0.19.12+006+remove focus trap from modal.patch b/patches/react-native-web+0.19.13+006+remove-focus-trap-from-modal.patch
similarity index 88%
rename from patches/react-native-web+0.19.12+006+remove focus trap from modal.patch
rename to patches/react-native-web+0.19.13+006+remove-focus-trap-from-modal.patch
index 14dbc88b0b1c..eac73db57e35 100644
--- a/patches/react-native-web+0.19.12+006+remove focus trap from modal.patch
+++ b/patches/react-native-web+0.19.13+006+remove-focus-trap-from-modal.patch
@@ -1,8 +1,8 @@
diff --git a/node_modules/react-native-web/dist/exports/Modal/index.js b/node_modules/react-native-web/dist/exports/Modal/index.js
-index d5df021..e2c46cf 100644
+index a9a7c36..522ef93 100644
--- a/node_modules/react-native-web/dist/exports/Modal/index.js
+++ b/node_modules/react-native-web/dist/exports/Modal/index.js
-@@ -86,13 +86,11 @@ var Modal = /*#__PURE__*/React.forwardRef((props, forwardedRef) => {
+@@ -88,13 +88,11 @@ var Modal = /*#__PURE__*/React.forwardRef((props, forwardedRef) => {
onDismiss: onDismissCallback,
onShow: onShowCallback,
visible: visible
diff --git a/patches/react-native-web+0.19.12+007+fix-scrollable-overflown-text.patch b/patches/react-native-web+0.19.13+007+fix-scrollable-overflown-text.patch
similarity index 84%
rename from patches/react-native-web+0.19.12+007+fix-scrollable-overflown-text.patch
rename to patches/react-native-web+0.19.13+007+fix-scrollable-overflown-text.patch
index 11b85afcf86c..304a57ad0657 100644
--- a/patches/react-native-web+0.19.12+007+fix-scrollable-overflown-text.patch
+++ b/patches/react-native-web+0.19.13+007+fix-scrollable-overflown-text.patch
@@ -1,8 +1,8 @@
diff --git a/node_modules/react-native-web/dist/exports/Text/index.js b/node_modules/react-native-web/dist/exports/Text/index.js
-index 8c5f79b..4a47f80 100644
+index 4130386..1076f55 100644
--- a/node_modules/react-native-web/dist/exports/Text/index.js
+++ b/node_modules/react-native-web/dist/exports/Text/index.js
-@@ -166,7 +166,7 @@ var styles = StyleSheet.create({
+@@ -176,7 +176,7 @@ var styles = StyleSheet.create({
textMultiLine: {
display: '-webkit-box',
maxWidth: '100%',
@@ -12,10 +12,10 @@ index 8c5f79b..4a47f80 100644
WebkitBoxOrient: 'vertical'
},
diff --git a/node_modules/react-native-web/src/exports/Text/index.js b/node_modules/react-native-web/src/exports/Text/index.js
-index 071ae10..e43042c 100644
+index f79e82c..f27ccec 100644
--- a/node_modules/react-native-web/src/exports/Text/index.js
+++ b/node_modules/react-native-web/src/exports/Text/index.js
-@@ -219,7 +219,7 @@ const styles = StyleSheet.create({
+@@ -223,7 +223,7 @@ const styles = StyleSheet.create({
textMultiLine: {
display: '-webkit-box',
maxWidth: '100%',
diff --git a/src/App.tsx b/src/App.tsx
index 177cc00c7dee..643e2146e501 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -50,6 +50,8 @@ LogBox.ignoreLogs([
// the timer is lost. Currently Expensify is using a 30 minutes interval to refresh personal details.
// More details here: https://git.io/JJYeb
'Setting a timer for a long period of time',
+ // We are not using expo-const, so ignore the warning.
+ 'No native ExponentConstants module found',
]);
const fill = {flex: 1};
diff --git a/src/CONFIG.ts b/src/CONFIG.ts
index d82a261c2ec6..8a30c8bf57c2 100644
--- a/src/CONFIG.ts
+++ b/src/CONFIG.ts
@@ -97,9 +97,9 @@ export default {
},
GCP_GEOLOCATION_API_KEY: googleGeolocationAPIKey,
FIREBASE_WEB_CONFIG: {
- apiKey: get(Config, 'FB_API_KEY', 'AIzaSyDxzigVLZl4G8MP7jACQ0qpmADMzmrrON0'),
- appId: get(Config, 'FB_APP_ID', '1:921154746561:web:7b8213357d07d6e4027c40'),
- projectId: get(Config, 'FB_PROJECT_ID', 'expensify-chat'),
+ apiKey: get(Config, 'FB_API_KEY', 'AIzaSyBrLKgCuo6Vem6Xi5RPokdumssW8HaWBow'),
+ appId: get(Config, 'FB_APP_ID', '1:1008697809946:web:ca25268d2645fc285445a3'),
+ projectId: get(Config, 'FB_PROJECT_ID', 'expensify-mobile-app'),
},
// to read more about StrictMode see: contributingGuides/STRICT_MODE.md
USE_REACT_STRICT_MODE_IN_DEV: false,
diff --git a/src/CONST.ts b/src/CONST.ts
index dd048f95d374..e95e3d4a5603 100755
--- a/src/CONST.ts
+++ b/src/CONST.ts
@@ -20,6 +20,7 @@ const CLOUDFRONT_DOMAIN = 'cloudfront.net';
const CLOUDFRONT_URL = `https://d2k5nsl2zxldvw.${CLOUDFRONT_DOMAIN}`;
const ACTIVE_EXPENSIFY_URL = Url.addTrailingForwardSlash(Config?.NEW_EXPENSIFY_URL ?? 'https://new.expensify.com');
const USE_EXPENSIFY_URL = 'https://use.expensify.com';
+const EXPENSIFY_URL = 'https://www.expensify.com';
const PLATFORM_OS_MACOS = 'Mac OS';
const PLATFORM_IOS = 'iOS';
const ANDROID_PACKAGE_NAME = 'com.expensify.chat';
@@ -77,12 +78,25 @@ const onboardingChoices = {
...backendOnboardingChoices,
} as const;
+const combinedTrackSubmitOnboardingChoices = {
+ PERSONAL_SPEND: selectableOnboardingChoices.PERSONAL_SPEND,
+ EMPLOYER: selectableOnboardingChoices.EMPLOYER,
+ SUBMIT: backendOnboardingChoices.SUBMIT,
+} as const;
+
const signupQualifiers = {
INDIVIDUAL: 'individual',
VSB: 'vsb',
SMB: 'smb',
} as const;
+const selfGuidedTourTask: OnboardingTaskType = {
+ type: 'viewTour',
+ autoCompleted: false,
+ title: 'Take a 2-minute tour',
+ description: ({navatticURL}) => `[Take a self-guided product tour](${navatticURL}) and learn about everything Expensify has to offer.`,
+};
+
const onboardingEmployerOrSubmitMessage: OnboardingMessageType = {
message: 'Getting paid back is as easy as sending a message. Let’s go over the basics.',
video: {
@@ -93,6 +107,7 @@ const onboardingEmployerOrSubmitMessage: OnboardingMessageType = {
height: 960,
},
tasks: [
+ selfGuidedTourTask,
{
type: 'submitExpense',
autoCompleted: false,
@@ -127,6 +142,95 @@ const onboardingEmployerOrSubmitMessage: OnboardingMessageType = {
],
};
+const combinedTrackSubmitOnboardingEmployerOrSubmitMessage: OnboardingMessageType = {
+ ...onboardingEmployerOrSubmitMessage,
+ tasks: [
+ {
+ type: 'submitExpense',
+ autoCompleted: false,
+ title: 'Submit an expense',
+ description:
+ '*Submit an expense* by entering an amount or scanning a receipt.\n' +
+ '\n' +
+ 'Here’s how to submit an expense:\n' +
+ '\n' +
+ '1. Click the green *+* button.\n' +
+ '2. Choose *Create expense*.\n' +
+ '3. Enter an amount or scan a receipt.\n' +
+ '4. Add your reimburser to the request.\n' +
+ '5. Click *Submit*.\n' +
+ '\n' +
+ 'And you’re done! Now wait for that sweet “Cha-ching!” when it’s complete.',
+ },
+ {
+ type: 'addBankAccount',
+ autoCompleted: false,
+ title: 'Add personal bank account',
+ description:
+ 'You’ll need to add your personal bank account to get paid back. Don’t worry, it’s easy!\n' +
+ '\n' +
+ 'Here’s how to set up your bank account:\n' +
+ '\n' +
+ '1. Click your profile picture.\n' +
+ '2. Click *Wallet* > *Bank accounts* > *+ Add bank account*.\n' +
+ '3. Connect your bank account.\n' +
+ '\n' +
+ 'Once that’s done, you can request money from anyone and get paid back right into your personal bank account.',
+ },
+ ],
+};
+
+const onboardingPersonalSpendMessage: OnboardingMessageType = {
+ message: 'Here’s how to track your spend in a few clicks.',
+ video: {
+ url: `${CLOUDFRONT_URL}/videos/guided-setup-track-personal-v2.mp4`,
+ thumbnailUrl: `${CLOUDFRONT_URL}/images/guided-setup-track-personal.jpg`,
+ duration: 55,
+ width: 1280,
+ height: 960,
+ },
+ tasks: [
+ {
+ type: 'trackExpense',
+ autoCompleted: false,
+ title: 'Track an expense',
+ description:
+ '*Track an expense* in any currency, whether you have a receipt or not.\n' +
+ '\n' +
+ 'Here’s how to track an expense:\n' +
+ '\n' +
+ '1. Click the green *+* button.\n' +
+ '2. Choose *Track expense*.\n' +
+ '3. Enter an amount or scan a receipt.\n' +
+ '4. Click *Track*.\n' +
+ '\n' +
+ 'And you’re done! Yep, it’s that easy.',
+ },
+ ],
+};
+const combinedTrackSubmitOnboardingPersonalSpendMessage: OnboardingMessageType = {
+ ...onboardingPersonalSpendMessage,
+ tasks: [
+ {
+ type: 'trackExpense',
+ autoCompleted: false,
+ title: 'Track an expense',
+ description:
+ '*Track an expense* in any currency, whether you have a receipt or not.\n' +
+ '\n' +
+ 'Here’s how to track an expense:\n' +
+ '\n' +
+ '1. Click the green *+* button.\n' +
+ '2. Choose *Create expense*.\n' +
+ '3. Enter an amount or scan a receipt.\n' +
+ '4. Click "Just track it (don\'t submit it)".\n' +
+ '5. Click *Track*.\n' +
+ '\n' +
+ 'And you’re done! Yep, it’s that easy.',
+ },
+ ],
+};
+
type OnboardingPurposeType = ValueOf;
type OnboardingCompanySizeType = ValueOf;
@@ -152,8 +256,26 @@ type OnboardingInviteType = ValueOf;
type OnboardingTaskType = {
type: string;
autoCompleted: boolean;
- title: string;
- description: string | ((params: Partial<{adminsRoomLink: string; workspaceCategoriesLink: string; workspaceMoreFeaturesLink: string; workspaceMembersLink: string}>) => string);
+ title:
+ | string
+ | ((
+ params: Partial<{
+ integrationName: string;
+ }>,
+ ) => string);
+ description:
+ | string
+ | ((
+ params: Partial<{
+ adminsRoomLink: string;
+ workspaceCategoriesLink: string;
+ workspaceMoreFeaturesLink: string;
+ workspaceMembersLink: string;
+ integrationName: string;
+ workspaceAccountingLink: string;
+ navatticURL: string;
+ }>,
+ ) => string);
};
type OnboardingMessageType = {
@@ -353,6 +475,7 @@ const CONST = {
OLD_DOT_ANDROID: 'https://play.google.com/store/apps/details?id=org.me.mobiexpensifyg&hl=en_US&pli=1',
OLD_DOT_IOS: 'https://apps.apple.com/us/app/expensify-expense-tracker/id471713959',
},
+ COMPANY_WEBSITE_DEFAULT_SCHEME: 'http',
DATE: {
SQL_DATE_TIME: 'YYYY-MM-DD HH:mm:ss',
FNS_FORMAT_STRING: 'yyyy-MM-dd',
@@ -475,6 +598,9 @@ const CONST = {
},
},
NON_USD_BANK_ACCOUNT: {
+ ALLOWED_FILE_TYPES: ['pdf', 'jpg', 'jpeg', 'png'],
+ FILE_LIMIT: 10,
+ TOTAL_FILES_SIZE_LIMIT: 5242880,
STEP: {
COUNTRY: 'CountryStep',
BANK_INFO: 'BankInfoStep',
@@ -505,11 +631,9 @@ const CONST = {
COMPANY_CARD_FEEDS: 'companyCardFeeds',
DIRECT_FEEDS: 'directFeeds',
NETSUITE_USA_TAX: 'netsuiteUsaTax',
- NEW_DOT_COPILOT: 'newDotCopilot',
- WORKSPACE_RULES: 'workspaceRules',
COMBINED_TRACK_SUBMIT: 'combinedTrackSubmit',
CATEGORY_AND_TAG_APPROVERS: 'categoryAndTagApprovers',
- NEW_DOT_QBD: 'quickbooksDesktopOnNewDot',
+ PER_DIEM: 'newDotPerDiem',
},
BUTTON_STATES: {
DEFAULT: 'default',
@@ -542,6 +666,7 @@ const CONST = {
ANDROID: 'android',
WEB: 'web',
DESKTOP: 'desktop',
+ MOBILEWEB: 'mobileweb',
},
PLATFORM_SPECIFIC_KEYS: {
CTRL: {
@@ -708,6 +833,7 @@ const CONST = {
EMPTY_ARRAY,
EMPTY_OBJECT,
USE_EXPENSIFY_URL,
+ EXPENSIFY_URL,
GOOGLE_MEET_URL_ANDROID: 'https://meet.google.com',
GOOGLE_DOC_IMAGE_LINK_MATCH: 'googleusercontent.com',
IMAGE_BASE64_MATCH: 'base64',
@@ -720,13 +846,14 @@ const CONST = {
UPWORK_URL: 'https://github.com/Expensify/App/issues?q=is%3Aopen+is%3Aissue+label%3A%22Help+Wanted%22',
DEEP_DIVE_EXPENSIFY_CARD: 'https://community.expensify.com/discussion/4848/deep-dive-expensify-card-and-quickbooks-online-auto-reconciliation-how-it-works',
DEEP_DIVE_ERECEIPTS: 'https://community.expensify.com/discussion/5542/deep-dive-what-are-ereceipts/',
+ DEEP_DIVE_PER_DIEM: 'https://community.expensify.com/discussion/4772/how-to-add-a-single-rate-per-diem',
GITHUB_URL: 'https://github.com/Expensify/App',
- TERMS_URL: `${USE_EXPENSIFY_URL}/terms`,
- PRIVACY_URL: `${USE_EXPENSIFY_URL}/privacy`,
+ TERMS_URL: `${EXPENSIFY_URL}/terms`,
+ PRIVACY_URL: `${EXPENSIFY_URL}/privacy`,
LICENSES_URL: `${USE_EXPENSIFY_URL}/licenses`,
- ACH_TERMS_URL: `${USE_EXPENSIFY_URL}/achterms`,
- WALLET_AGREEMENT_URL: `${USE_EXPENSIFY_URL}/walletagreement`,
- BANCORP_WALLET_AGREEMENT_URL: `${USE_EXPENSIFY_URL}/bancorp-bank-wallet-terms-of-service`,
+ ACH_TERMS_URL: `${EXPENSIFY_URL}/achterms`,
+ WALLET_AGREEMENT_URL: `${EXPENSIFY_URL}/expensify-payments-wallet-terms-of-service`,
+ BANCORP_WALLET_AGREEMENT_URL: `${EXPENSIFY_URL}/bancorp-bank-wallet-terms-of-service`,
HELP_LINK_URL: `${USE_EXPENSIFY_URL}/usa-patriot-act`,
ELECTRONIC_DISCLOSURES_URL: `${USE_EXPENSIFY_URL}/esignagreement`,
GITHUB_RELEASE_URL: 'https://api.github.com/repos/expensify/app/releases/latest',
@@ -739,7 +866,6 @@ const CONST = {
NEWHELP_URL: 'https://help.expensify.com',
INTERNAL_DEV_EXPENSIFY_URL: 'https://www.expensify.com.dev',
STAGING_EXPENSIFY_URL: 'https://staging.expensify.com',
- EXPENSIFY_URL: 'https://www.expensify.com',
BANK_ACCOUNT_PERSONAL_DOCUMENTATION_INFO_URL:
'https://community.expensify.com/discussion/6983/faq-why-do-i-need-to-provide-personal-documentation-when-setting-up-updating-my-bank-account',
PERSONAL_DATA_PROTECTION_INFO_URL: 'https://community.expensify.com/discussion/5677/deep-dive-security-how-expensify-protects-your-information',
@@ -747,7 +873,7 @@ const CONST = {
ONFIDO_PRIVACY_POLICY_URL: 'https://onfido.com/privacy/',
ONFIDO_TERMS_OF_SERVICE_URL: 'https://onfido.com/terms-of-service/',
LIST_OF_RESTRICTED_BUSINESSES: 'https://community.expensify.com/discussion/6191/list-of-restricted-businesses',
- TRAVEL_TERMS_URL: `${USE_EXPENSIFY_URL}/travelterms`,
+ TRAVEL_TERMS_URL: `${EXPENSIFY_URL}/travelterms`,
EXPENSIFY_PACKAGE_FOR_SAGE_INTACCT: 'https://www.expensify.com/tools/integrations/downloadPackage',
EXPENSIFY_PACKAGE_FOR_SAGE_INTACCT_FILE_NAME: 'ExpensifyPackageForSageIntacct',
SAGE_INTACCT_INSTRUCTIONS: 'https://help.expensify.com/articles/expensify-classic/integrations/accounting-integrations/Sage-Intacct',
@@ -764,8 +890,10 @@ const CONST = {
// Use Environment.getEnvironmentURL to get the complete URL with port number
DEV_NEW_EXPENSIFY_URL: 'https://dev.new.expensify.com:',
NAVATTIC: {
- ADMIN_TOUR: 'https://expensify.navattic.com/kh204a7',
- EMPLOYEE_TOUR: 'https://expensify.navattic.com/35609gb',
+ ADMIN_TOUR_PRODUCTION: 'https://expensify.navattic.com/kh204a7',
+ ADMIN_TOUR_STAGING: 'https://expensify.navattic.com/3i300k18',
+ EMPLOYEE_TOUR_PRODUCTION: 'https://expensify.navattic.com/35609gb',
+ EMPLOYEE_TOUR_STAGING: 'https://expensify.navattic.com/cf15002s',
},
OLDDOT_URLS: {
@@ -1099,6 +1227,7 @@ const CONST = {
MODAL_TYPE: {
CONFIRM: 'confirm',
CENTERED: 'centered',
+ CENTERED_SWIPABLE_TO_RIGHT: 'centered_swipable_to_right',
CENTERED_UNSWIPEABLE: 'centered_unswipeable',
CENTERED_SMALL: 'centered_small',
BOTTOM_DOCKED: 'bottom_docked',
@@ -1146,11 +1275,9 @@ const CONST = {
SEARCH_OPTION_LIST_DEBOUNCE_TIME: 300,
RESIZE_DEBOUNCE_TIME: 100,
UNREAD_UPDATE_DEBOUNCE_TIME: 300,
- SEARCH_CONVERT_SEARCH_VALUES: 'search_convert_search_values',
- SEARCH_MAKE_TREE: 'search_make_tree',
- SEARCH_BUILD_TREE: 'search_build_tree',
SEARCH_FILTER_OPTIONS: 'search_filter_options',
USE_DEBOUNCED_STATE_DELAY: 300,
+ LIST_SCROLLING_DEBOUNCE_TIME: 200,
},
PRIORITY_MODE: {
GSD: 'gsd',
@@ -1182,7 +1309,13 @@ const CONST = {
PENDING: 'Pending',
POSTED: 'Posted',
},
+ STATE: {
+ CURRENT: 'current',
+ DRAFT: 'draft',
+ BACKUP: 'backup',
+ },
},
+
MCC_GROUPS: {
AIRLINES: 'Airlines',
COMMUTER: 'Commuter',
@@ -1480,6 +1613,7 @@ const CONST = {
CONTRIBUTORS: 'contributors@expensify.com',
FIRST_RESPONDER: 'firstresponders@expensify.com',
GUIDES_DOMAIN: 'team.expensify.com',
+ QA_DOMAIN: 'applause.expensifail.com',
HELP: 'help@expensify.com',
INTEGRATION_TESTING_CREDS: 'integrationtestingcreds@expensify.com',
NOTIFICATIONS: 'notifications@expensify.com',
@@ -2334,6 +2468,7 @@ const CONST = {
ARE_INVOICES_ENABLED: 'areInvoicesEnabled',
ARE_TAXES_ENABLED: 'tax',
ARE_RULES_ENABLED: 'areRulesEnabled',
+ ARE_PER_DIEM_RATES_ENABLED: 'arePerDiemRatesEnabled',
},
DEFAULT_CATEGORIES: [
'Advertising',
@@ -2500,6 +2635,7 @@ const CONST = {
CUSTOM_UNITS: {
NAME_DISTANCE: 'Distance',
+ NAME_PER_DIEM_INTERNATIONAL: 'Per Diem International',
DISTANCE_UNIT_MILES: 'mi',
DISTANCE_UNIT_KILOMETERS: 'km',
MILEAGE_IRS_RATE: 0.67,
@@ -2564,6 +2700,7 @@ const CONST = {
STEP: {
ASSIGNEE: 'Assignee',
CARD: 'Card',
+ CARD_NAME: 'CardName',
TRANSACTION_START_DATE: 'TransactionStartDate',
CONFIRMATION: 'Confirmation',
},
@@ -2580,6 +2717,11 @@ const CONST = {
INDIVIDUAL: 'individual',
NONE: 'none',
},
+ VERIFICATION_STATE: {
+ LOADING: 'loading',
+ VERIFIED: 'verified',
+ ON_WAITLIST: 'onWaitlist',
+ },
STATE: {
STATE_NOT_ISSUED: 2,
OPEN: 3,
@@ -2594,6 +2736,7 @@ const CONST = {
MONTHLY: 'monthly',
FIXED: 'fixed',
},
+ LIMIT_VALUE: 21474836,
STEP_NAMES: ['1', '2', '3', '4', '5', '6'],
STEP: {
ASSIGNEE: 'Assignee',
@@ -2611,7 +2754,6 @@ const CONST = {
DAILY: 'daily',
MONTHLY: 'monthly',
},
- CARD_TITLE_INPUT_LIMIT: 255,
MANAGE_EXPENSIFY_CARDS_ARTICLE_LINK: 'https://help.expensify.com/articles/new-expensify/expensify-card/Manage-Expensify-Cards',
},
COMPANY_CARDS: {
@@ -2664,6 +2806,7 @@ const CONST = {
RESTRICT: 'corporate',
ALLOW: 'personal',
},
+ CARD_LIST_THRESHOLD: 8,
EXPORT_CARD_TYPES: {
/**
* Name of Card NVP for QBO custom export accounts
@@ -2841,6 +2984,7 @@ const CONST = {
SHORT_MENTION: new RegExp(`@[\\w\\-\\+\\'#@]+(?:\\.[\\w\\-\\'\\+]+)*(?![^\`]*\`)`, 'gim'),
REPORT_ID_FROM_PATH: /\/r\/(\d+)/,
DISTANCE_MERCHANT: /^[0-9.]+ \w+ @ (-|-\()?[^0-9.\s]{1,3} ?[0-9.]+\)? \/ \w+$/,
+ WHITESPACE: /\s+/g,
get EXPENSIFY_POLICY_DOMAIN_NAME() {
return new RegExp(`${EXPENSIFY_POLICY_DOMAIN}([a-zA-Z0-9]+)\\${EXPENSIFY_POLICY_DOMAIN_EXTENSION}`);
@@ -2914,10 +3058,6 @@ const CONST = {
get RESTRICTED_ACCOUNT_IDS() {
return [this.ACCOUNT_ID.NOTIFICATIONS];
},
- // Account IDs that can't be added as a group member
- get NON_ADDABLE_ACCOUNT_IDS() {
- return [this.ACCOUNT_ID.NOTIFICATIONS, this.ACCOUNT_ID.CHRONOS];
- },
// Auth limit is 60k for the column but we store edits and other metadata along the html so let's use a lower limit to accommodate for it.
MAX_COMMENT_LENGTH: 10000,
@@ -2929,6 +3069,8 @@ const CONST = {
// Character Limits
FORM_CHARACTER_LIMIT: 50,
+ STANDARD_LENGTH_LIMIT: 100,
+ STANDARD_LIST_ITEM_LIMIT: 8,
LEGAL_NAMES_CHARACTER_LIMIT: 150,
LOGIN_CHARACTER_LIMIT: 254,
CATEGORY_NAME_LIMIT: 256,
@@ -3002,8 +3144,8 @@ const CONST = {
EXPENSIFY_APPROVED_URL: `${USE_EXPENSIFY_URL}/accountants`,
PRESS_KIT_URL: 'https://we.are.expensify.com/press-kit',
SUPPORT_URL: `${USE_EXPENSIFY_URL}/support`,
- COMMUNITY_URL: 'https://community.expensify.com/',
- PRIVACY_URL: `${USE_EXPENSIFY_URL}/privacy`,
+ TERMS_URL: `${EXPENSIFY_URL}/terms`,
+ PRIVACY_URL: `${EXPENSIFY_URL}/privacy`,
ABOUT_URL: 'https://we.are.expensify.com/how-we-got-here',
BLOG_URL: 'https://blog.expensify.com/',
JOBS_URL: 'https://we.are.expensify.com/apply',
@@ -3325,6 +3467,63 @@ const CONST = {
ZW: 'Zimbabwe',
},
+ ALL_EUROPEAN_COUNTRIES: {
+ AL: 'Albania',
+ AD: 'Andorra',
+ AT: 'Austria',
+ BY: 'Belarus',
+ BE: 'Belgium',
+ BA: 'Bosnia & Herzegovina',
+ BG: 'Bulgaria',
+ HR: 'Croatia',
+ CY: 'Cyprus',
+ CZ: 'Czech Republic',
+ DK: 'Denmark',
+ EE: 'Estonia',
+ FO: 'Faroe Islands',
+ FI: 'Finland',
+ FR: 'France',
+ GE: 'Georgia',
+ DE: 'Germany',
+ GI: 'Gibraltar',
+ GR: 'Greece',
+ GL: 'Greenland',
+ HU: 'Hungary',
+ IS: 'Iceland',
+ IE: 'Ireland',
+ IM: 'Isle of Man',
+ IT: 'Italy',
+ JE: 'Jersey',
+ XK: 'Kosovo',
+ LV: 'Latvia',
+ LI: 'Liechtenstein',
+ LT: 'Lithuania',
+ LU: 'Luxembourg',
+ MT: 'Malta',
+ MD: 'Moldova',
+ MC: 'Monaco',
+ ME: 'Montenegro',
+ NL: 'Netherlands',
+ MK: 'North Macedonia',
+ NO: 'Norway',
+ PL: 'Poland',
+ PT: 'Portugal',
+ RO: 'Romania',
+ RU: 'Russia',
+ SM: 'San Marino',
+ RS: 'Serbia',
+ SK: 'Slovakia',
+ SI: 'Slovenia',
+ ES: 'Spain',
+ SJ: 'Svalbard & Jan Mayen',
+ SE: 'Sweden',
+ CH: 'Switzerland',
+ TR: 'Turkey',
+ UA: 'Ukraine',
+ GB: 'United Kingdom',
+ VA: 'Vatican City',
+ },
+
// Sources: https://github.com/Expensify/App/issues/14958#issuecomment-1442138427
// https://github.com/Expensify/App/issues/14958#issuecomment-1456026810
COUNTRY_ZIP_REGEX_DATA: {
@@ -4186,6 +4385,7 @@ const CONST = {
// The attribute used in the SelectionScraper.js helper to query all the DOM elements
// that should be removed from the copied contents in the getHTMLOfSelection() method
SELECTION_SCRAPER_HIDDEN_ELEMENT: 'selection-scrapper-hidden-element',
+ INNER_BOX_SHADOW_ELEMENT: 'inner-box-shadow-element',
MODERATION: {
MODERATOR_DECISION_PENDING: 'pending',
MODERATOR_DECISION_PENDING_HIDE: 'pendingHide',
@@ -4619,6 +4819,7 @@ const CONST = {
ONBOARDING_INTRODUCTION: 'Let’s get you set up 🔧',
ONBOARDING_CHOICES: {...onboardingChoices},
SELECTABLE_ONBOARDING_CHOICES: {...selectableOnboardingChoices},
+ COMBINED_TRACK_SUBMIT_ONBOARDING_CHOICES: {...combinedTrackSubmitOnboardingChoices},
ONBOARDING_SIGNUP_QUALIFIERS: {...signupQualifiers},
ONBOARDING_INVITE_TYPES: {...onboardingInviteTypes},
ONBOARDING_COMPANY_SIZE: {...onboardingCompanySize},
@@ -4662,7 +4863,13 @@ const CONST = {
'\n' +
"We'll send a request to each person so they can pay you back. Let me know if you have any questions!",
},
-
+ ONBOARDING_ACCOUNTING_MAPPING: {
+ quickbooksOnline: 'QuickBooks Online',
+ xero: 'Xero',
+ netsuite: 'NetSuite',
+ intacct: 'Sage Intacct',
+ quickbooksDesktop: 'QuickBooks Desktop',
+ },
ONBOARDING_MESSAGES: {
[onboardingChoices.EMPLOYER]: onboardingEmployerOrSubmitMessage,
[onboardingChoices.SUBMIT]: onboardingEmployerOrSubmitMessage,
@@ -4690,6 +4897,7 @@ const CONST = {
'\n' +
'*Your new workspace is ready! It’ll keep all of your spend (and chats) in one place.*',
},
+ selfGuidedTourTask,
{
type: 'meetGuide',
autoCompleted: false,
@@ -4774,36 +4982,30 @@ const CONST = {
'\n' +
`[Take me to workspace members](${workspaceMembersLink}). That’s it, happy expensing! :)`,
},
- ],
- },
- [onboardingChoices.PERSONAL_SPEND]: {
- message: 'Here’s how to track your spend in a few clicks.',
- video: {
- url: `${CLOUDFRONT_URL}/videos/guided-setup-track-personal-v2.mp4`,
- thumbnailUrl: `${CLOUDFRONT_URL}/images/guided-setup-track-personal.jpg`,
- duration: 55,
- width: 1280,
- height: 960,
- },
- tasks: [
{
- type: 'trackExpense',
+ type: 'addAccountingIntegration',
autoCompleted: false,
- title: 'Track an expense',
- description:
- '*Track an expense* in any currency, whether you have a receipt or not.\n' +
+ title: ({integrationName}) => `Connect to ${integrationName}`,
+ description: ({integrationName, workspaceAccountingLink}) =>
+ `Connect to ${integrationName} for automatic expense coding and syncing that makes month-end close a breeze.\n` +
'\n' +
- 'Here’s how to track an expense:\n' +
+ `Here’s how to connect to ${integrationName}:\n` +
'\n' +
- '1. Click the green *+* button.\n' +
- '2. Choose *Track expense*.\n' +
- '3. Enter an amount or scan a receipt.\n' +
- '4. Click *Track*.\n' +
+ '1. Click your profile photo.\n' +
+ '2. Go to Workspaces.\n' +
+ '3. Select your workspace.\n' +
+ '4. Click Accounting.\n' +
+ `5. Find ${integrationName}.\n` +
+ '6. Click Connect.\n' +
'\n' +
- 'And you’re done! Yep, it’s that easy.',
+ `[Take me to Accounting!](${workspaceAccountingLink})`,
},
],
},
+ [onboardingChoices.PERSONAL_SPEND]: {
+ ...onboardingPersonalSpendMessage,
+ tasks: [selfGuidedTourTask, ...onboardingPersonalSpendMessage.tasks],
+ },
[onboardingChoices.CHAT_SPLIT]: {
message: 'Splitting bills with friends is as easy as sending a message. Here’s how.',
video: {
@@ -4814,6 +5016,7 @@ const CONST = {
height: 960,
},
tasks: [
+ selfGuidedTourTask,
{
type: 'startChat',
autoCompleted: false,
@@ -4872,6 +5075,12 @@ const CONST = {
},
} satisfies Record,
+ COMBINED_TRACK_SUBMIT_ONBOARDING_MESSAGES: {
+ [combinedTrackSubmitOnboardingChoices.PERSONAL_SPEND]: combinedTrackSubmitOnboardingPersonalSpendMessage,
+ [combinedTrackSubmitOnboardingChoices.EMPLOYER]: combinedTrackSubmitOnboardingEmployerOrSubmitMessage,
+ [combinedTrackSubmitOnboardingChoices.SUBMIT]: combinedTrackSubmitOnboardingEmployerOrSubmitMessage,
+ } satisfies Record, OnboardingMessageType>,
+
REPORT_FIELD_TITLE_FIELD_ID: 'text_title',
MOBILE_PAGINATION_SIZE: 15,
@@ -5631,6 +5840,7 @@ const CONST = {
MAX_TAX_RATE_INTEGER_PLACES: 4,
MAX_TAX_RATE_DECIMAL_PLACES: 4,
+ MIN_TAX_RATE_DECIMAL_PLACES: 2,
DOWNLOADS_PATH: '/Downloads',
DOWNLOADS_TIMEOUT: 5000,
@@ -5746,6 +5956,11 @@ const CONST = {
IN: 'in',
},
EMPTY_VALUE: 'none',
+ SEARCH_ROUTER_ITEM_TYPE: {
+ CONTEXTUAL_SUGGESTION: 'contextualSuggestion',
+ AUTOCOMPLETE_SUGGESTION: 'autocompleteSuggestion',
+ SEARCH: 'searchItem',
+ },
},
REFERRER: {
@@ -5886,6 +6101,14 @@ const CONST = {
description: 'workspace.upgrade.rules.description' as const,
icon: 'Rules',
},
+ perDiem: {
+ id: 'perDiem' as const,
+ alias: 'per-diem',
+ name: 'Per diem',
+ title: 'workspace.upgrade.perDiem.title' as const,
+ description: 'workspace.upgrade.perDiem.description' as const,
+ icon: 'PerDiem',
+ },
};
},
REPORT_FIELD_TYPES: {
@@ -5960,6 +6183,7 @@ const CONST = {
HAS_WALLET_TERMS_ERRORS: 'hasWalletTermsErrors',
HAS_LOGIN_LIST_INFO: 'hasLoginListInfo',
HAS_SUBSCRIPTION_INFO: 'hasSubscriptionInfo',
+ HAS_PHONE_NUMBER_ERROR: 'hasPhoneNumberError',
},
DEBUG: {
diff --git a/src/ONYXKEYS.ts b/src/ONYXKEYS.ts
index 427e05052ae3..c5ec21b8b1c2 100755
--- a/src/ONYXKEYS.ts
+++ b/src/ONYXKEYS.ts
@@ -1,6 +1,7 @@
import type {ValueOf} from 'type-fest';
import type CONST from './CONST';
import type {OnboardingCompanySizeType, OnboardingPurposeType} from './CONST';
+import type Platform from './libs/getPlatform/types';
import type * as FormTypes from './types/form';
import type * as OnyxTypes from './types/onyx';
import type {Attendee} from './types/onyx/IOU';
@@ -122,6 +123,9 @@ const ONYXKEYS = {
/** This NVP contains data associated with HybridApp */
NVP_TRYNEWDOT: 'nvp_tryNewDot',
+ /** Contains the platforms for which the user muted the sounds */
+ NVP_MUTED_PLATFORMS: 'nvp_mutedPlatforms',
+
/** Contains the user preference for the LHN priority mode */
NVP_PRIORITY_MODE: 'nvp_priorityMode',
@@ -445,9 +449,15 @@ const ONYXKEYS = {
/** Stores recently used currencies */
RECENTLY_USED_CURRENCIES: 'nvp_recentlyUsedCurrencies',
+ /** States whether we transitioned from OldDot to show only certain group of screens. It should be undefined on pure NewDot. */
+ IS_SINGLE_NEW_DOT_ENTRY: 'isSingleNewDotEntry',
+
/** Company cards custom names */
NVP_EXPENSIFY_COMPANY_CARDS_CUSTOM_NAMES: 'nvp_expensify_ccCustomNames',
+ /** The user's Concierge reportID */
+ CONCIERGE_REPORT_ID: 'conciergeReportID',
+
/** Collection Keys */
COLLECTION: {
DOWNLOAD: 'download_',
@@ -527,6 +537,9 @@ const ONYXKEYS = {
/** Currently displaying feed */
LAST_SELECTED_FEED: 'lastSelectedFeed_',
+
+ /** Whether the bank account chosen for Expensify Card in on verification waitlist */
+ NVP_EXPENSIFY_ON_CARD_WAITLIST: 'nvp_expensify_onCardWaitlist_',
},
/** List of Form ids */
@@ -857,6 +870,7 @@ type OnyxCollectionValuesMapping = {
[ONYXKEYS.COLLECTION.EXPENSIFY_CARD_CONTINUOUS_RECONCILIATION_CONNECTION]: OnyxTypes.PolicyConnectionName;
[ONYXKEYS.COLLECTION.EXPENSIFY_CARD_USE_CONTINUOUS_RECONCILIATION]: boolean;
[ONYXKEYS.COLLECTION.LAST_SELECTED_FEED]: OnyxTypes.CompanyCardFeed;
+ [ONYXKEYS.COLLECTION.NVP_EXPENSIFY_ON_CARD_WAITLIST]: OnyxTypes.CardOnWaitlist;
};
type OnyxValuesMapping = {
@@ -903,6 +917,7 @@ type OnyxValuesMapping = {
[ONYXKEYS.USER_METADATA]: OnyxTypes.UserMetadata;
[ONYXKEYS.STASHED_SESSION]: OnyxTypes.Session;
[ONYXKEYS.BETAS]: OnyxTypes.Beta[];
+ [ONYXKEYS.NVP_MUTED_PLATFORMS]: Partial>;
[ONYXKEYS.NVP_PRIORITY_MODE]: ValueOf;
[ONYXKEYS.NVP_BLOCKED_FROM_CONCIERGE]: OnyxTypes.BlockedFromConcierge;
@@ -1009,9 +1024,11 @@ type OnyxValuesMapping = {
[ONYXKEYS.APPROVAL_WORKFLOW]: OnyxTypes.ApprovalWorkflowOnyx;
[ONYXKEYS.IMPORTED_SPREADSHEET]: OnyxTypes.ImportedSpreadsheet;
[ONYXKEYS.LAST_ROUTE]: string;
+ [ONYXKEYS.IS_SINGLE_NEW_DOT_ENTRY]: boolean | undefined;
[ONYXKEYS.IS_USING_IMPORTED_STATE]: boolean;
[ONYXKEYS.SHOULD_SHOW_SAVED_SEARCH_RENAME_TOOLTIP]: boolean;
[ONYXKEYS.NVP_EXPENSIFY_COMPANY_CARDS_CUSTOM_NAMES]: Record;
+ [ONYXKEYS.CONCIERGE_REPORT_ID]: string;
};
type OnyxValues = OnyxValuesMapping & OnyxCollectionValuesMapping & OnyxFormValuesMapping & OnyxFormDraftValuesMapping;
diff --git a/src/ROUTES.ts b/src/ROUTES.ts
index c346da6cadcb..cd94035e0fff 100644
--- a/src/ROUTES.ts
+++ b/src/ROUTES.ts
@@ -208,6 +208,7 @@ const ROUTES = {
},
SETTINGS_LEGAL_NAME: 'settings/profile/legal-name',
SETTINGS_DATE_OF_BIRTH: 'settings/profile/date-of-birth',
+ SETTINGS_PHONE_NUMBER: 'settings/profile/phone',
SETTINGS_ADDRESS: 'settings/profile/address',
SETTINGS_ADDRESS_COUNTRY: {
route: 'settings/profile/address/country',
@@ -950,6 +951,10 @@ const ROUTES = {
getRoute: (policyID: string, featureName: string, backTo?: string) =>
getUrlWithBackToParam(`settings/workspaces/${policyID}/upgrade/${encodeURIComponent(featureName)}` as const, backTo),
},
+ WORKSPACE_DOWNGRADE: {
+ route: 'settings/workspaces/:policyID/downgrade/',
+ getRoute: (policyID: string) => `settings/workspaces/${policyID}/downgrade/` as const,
+ },
WORKSPACE_CATEGORIES_SETTINGS: {
route: 'settings/workspaces/:policyID/categories/settings',
getRoute: (policyID: string) => `settings/workspaces/${policyID}/categories/settings` as const,
@@ -1268,6 +1273,10 @@ const ROUTES = {
route: 'settings/workspaces/:policyID/distance-rates/:rateID/tax-rate/edit',
getRoute: (policyID: string, rateID: string) => `settings/workspaces/${policyID}/distance-rates/${rateID}/tax-rate/edit` as const,
},
+ WORKSPACE_PER_DIEM: {
+ route: 'settings/workspaces/:policyID/per-diem',
+ getRoute: (policyID: string) => `settings/workspaces/${policyID}/per-diem` as const,
+ },
RULES_CUSTOM_NAME: {
route: 'settings/workspaces/:policyID/rules/name',
getRoute: (policyID: string) => `settings/workspaces/${policyID}/rules/name` as const,
diff --git a/src/SCREENS.ts b/src/SCREENS.ts
index 2e44c5ed5695..9b8fe54111cf 100644
--- a/src/SCREENS.ts
+++ b/src/SCREENS.ts
@@ -84,6 +84,7 @@ const SCREENS = {
TIMEZONE_SELECT: 'Settings_Timezone_Select',
LEGAL_NAME: 'Settings_LegalName',
DATE_OF_BIRTH: 'Settings_DateOfBirth',
+ PHONE_NUMBER: 'Settings_PhoneNumber',
ADDRESS: 'Settings_Address',
ADDRESS_COUNTRY: 'Settings_Address_Country',
ADDRESS_STATE: 'Settings_Address_State',
@@ -531,6 +532,7 @@ const SCREENS = {
DISTANCE_RATE_TAX_RECLAIMABLE_ON_EDIT: 'Distance_Rate_Tax_Reclaimable_On_Edit',
DISTANCE_RATE_TAX_RATE_EDIT: 'Distance_Rate_Tax_Rate_Edit',
UPGRADE: 'Workspace_Upgrade',
+ DOWNGRADE: 'Workspace_Downgrade',
RULES: 'Policy_Rules',
RULES_CUSTOM_NAME: 'Rules_Custom_Name',
RULES_AUTO_APPROVE_REPORTS_UNDER: 'Rules_Auto_Approve_Reports_Under',
@@ -540,6 +542,7 @@ const SCREENS = {
RULES_MAX_EXPENSE_AMOUNT: 'Rules_Max_Expense_Amount',
RULES_MAX_EXPENSE_AGE: 'Rules_Max_Expense_Age',
RULES_BILLABLE_DEFAULT: 'Rules_Billable_Default',
+ PER_DIEM: 'Per_Diem',
},
EDIT_REQUEST: {
diff --git a/src/components/AccountSwitcher.tsx b/src/components/AccountSwitcher.tsx
index 8ccab44a2cb9..9a90de17595d 100644
--- a/src/components/AccountSwitcher.tsx
+++ b/src/components/AccountSwitcher.tsx
@@ -5,7 +5,6 @@ import {useOnyx} from 'react-native-onyx';
import useCurrentUserPersonalDetails from '@hooks/useCurrentUserPersonalDetails';
import useLocalize from '@hooks/useLocalize';
import useNetwork from '@hooks/useNetwork';
-import usePermissions from '@hooks/usePermissions';
import useResponsiveLayout from '@hooks/useResponsiveLayout';
import useTheme from '@hooks/useTheme';
import useThemeStyles from '@hooks/useThemeStyles';
@@ -34,7 +33,6 @@ function AccountSwitcher() {
const theme = useTheme();
const {translate} = useLocalize();
const {isOffline} = useNetwork();
- const {canUseNewDotCopilot} = usePermissions();
const {shouldUseNarrowLayout} = useResponsiveLayout();
const [account] = useOnyx(ONYXKEYS.ACCOUNT);
const [session] = useOnyx(ONYXKEYS.SESSION);
@@ -47,7 +45,7 @@ function AccountSwitcher() {
const delegators = account?.delegatedAccess?.delegators ?? [];
const isActingAsDelegate = !!account?.delegatedAccess?.delegate ?? false;
- const canSwitchAccounts = canUseNewDotCopilot && (delegators.length > 0 || isActingAsDelegate);
+ const canSwitchAccounts = delegators.length > 0 || isActingAsDelegate;
const createBaseMenuItem = (
personalDetails: PersonalDetails | undefined,
@@ -87,7 +85,7 @@ function AccountSwitcher() {
}
const delegatePersonalDetails = PersonalDetailsUtils.getPersonalDetailByEmail(delegateEmail);
- const error = ErrorUtils.getLatestErrorField(account?.delegatedAccess, 'connect');
+ const error = ErrorUtils.getLatestError(account?.delegatedAccess?.errorFields?.disconnect);
return [
createBaseMenuItem(delegatePersonalDetails, error, {
@@ -105,8 +103,9 @@ function AccountSwitcher() {
const delegatorMenuItems: PopoverMenuItem[] = delegators
.filter(({email}) => email !== currentUserPersonalDetails.login)
- .map(({email, role, errorFields}) => {
- const error = ErrorUtils.getLatestErrorField({errorFields}, 'connect');
+ .map(({email, role}) => {
+ const errorFields = account?.delegatedAccess?.errorFields ?? {};
+ const error = ErrorUtils.getLatestError(errorFields?.connect?.[email]);
const personalDetails = PersonalDetailsUtils.getPersonalDetailByEmail(email);
return createBaseMenuItem(personalDetails, error, {
badgeText: translate('delegate.role', {role}),
@@ -152,7 +151,7 @@ function AccountSwitcher() {
>
{currentUserPersonalDetails?.displayName}
- {canSwitchAccounts && (
+ {!!canSwitchAccounts && (
- {canSwitchAccounts && (
+ {!!canSwitchAccounts && (
{
diff --git a/src/components/AddPaymentCard/PaymentCardForm.tsx b/src/components/AddPaymentCard/PaymentCardForm.tsx
index f38ea60f1aad..5aaa23b238f7 100644
--- a/src/components/AddPaymentCard/PaymentCardForm.tsx
+++ b/src/components/AddPaymentCard/PaymentCardForm.tsx
@@ -177,18 +177,26 @@ function PaymentCardForm({
};
const onChangeCardNumber = useCallback((newValue: string) => {
- // replace all characters that are not spaces or digits
+ // Replace all characters that are not spaces or digits
let validCardNumber = newValue.replace(/[^\d ]/g, '');
- // gets only the first 16 digits if the inputted number have more digits than that
+ // Gets only the first 16 digits if the inputted number have more digits than that
validCardNumber = validCardNumber.match(/(?:\d *){1,16}/)?.[0] ?? '';
- // add the spacing between every 4 digits
- validCardNumber =
- validCardNumber
- .replace(/ /g, '')
- .match(/.{1,4}/g)
- ?.join(' ') ?? '';
+ // Remove all spaces to simplify formatting
+ const cleanedNumber = validCardNumber.replace(/ /g, '');
+
+ // Check if the number is a potential Amex card (starts with 34 or 37 and has up to 15 digits)
+ const isAmex = /^3[47]\d{0,13}$/.test(cleanedNumber);
+
+ // Format based on Amex or standard 4-4-4-4 pattern
+ if (isAmex) {
+ // Format as 4-6-5 for Amex
+ validCardNumber = cleanedNumber.replace(/(\d{1,4})(\d{1,6})?(\d{1,5})?/, (match, p1, p2, p3) => [p1, p2, p3].filter(Boolean).join(' '));
+ } else {
+ // Format as 4-4-4-4 for non-Amex
+ validCardNumber = cleanedNumber.match(/.{1,4}/g)?.join(' ') ?? '';
+ }
setCardNumber(validCardNumber);
}, []);
diff --git a/src/components/AddressSearch/index.tsx b/src/components/AddressSearch/index.tsx
index 9c72b371c40f..f4067d357c9d 100644
--- a/src/components/AddressSearch/index.tsx
+++ b/src/components/AddressSearch/index.tsx
@@ -63,6 +63,7 @@ function AddressSearch(
onBlur,
onInputChange,
onPress,
+ onCountryChange,
predefinedPlaces = [],
preferredLocale,
renamedInputKeys = {
@@ -195,7 +196,7 @@ function AddressSearch(
// If the address is not in the US, use the full length state name since we're displaying the address's
// state / province in a TextInput instead of in a picker.
- if (country !== CONST.COUNTRY.US) {
+ if (country !== CONST.COUNTRY.US && country !== CONST.COUNTRY.CA) {
values.state = longStateName;
}
@@ -244,6 +245,7 @@ function AddressSearch(
onInputChange?.(values);
}
+ onCountryChange?.(values.country);
onPress?.(values);
};
diff --git a/src/components/AddressSearch/types.ts b/src/components/AddressSearch/types.ts
index b654fcad99da..daa28c3d69af 100644
--- a/src/components/AddressSearch/types.ts
+++ b/src/components/AddressSearch/types.ts
@@ -87,6 +87,9 @@ type AddressSearchProps = {
/** The user's preferred locale e.g. 'en', 'es-ES' */
preferredLocale?: Locale;
+
+ /** Callback to be called when the country is changed */
+ onCountryChange?: (country: unknown) => void;
};
type IsCurrentTargetInsideContainerType = (event: FocusEvent | NativeSyntheticEvent, containerRef: RefObject) => boolean;
diff --git a/src/components/AmountForm.tsx b/src/components/AmountForm.tsx
index 4848577bdea0..a230dfa1af8d 100644
--- a/src/components/AmountForm.tsx
+++ b/src/components/AmountForm.tsx
@@ -1,6 +1,6 @@
import type {ForwardedRef} from 'react';
import React, {forwardRef, useCallback, useEffect, useMemo, useRef, useState} from 'react';
-import type {NativeSyntheticEvent, TextInputSelectionChangeEventData} from 'react-native';
+import type {NativeSyntheticEvent} from 'react-native';
import {View} from 'react-native';
import useLocalize from '@hooks/useLocalize';
import useThemeStyles from '@hooks/useThemeStyles';
@@ -16,7 +16,7 @@ import TextInput from './TextInput';
import isTextInputFocused from './TextInput/BaseTextInput/isTextInputFocused';
import type {BaseTextInputProps, BaseTextInputRef} from './TextInput/BaseTextInput/types';
import TextInputWithCurrencySymbol from './TextInputWithCurrencySymbol';
-import type TextInputWithCurrencySymbolProps from './TextInputWithCurrencySymbol/types';
+import type BaseTextInputWithCurrencySymbolProps from './TextInputWithCurrencySymbol/types';
type AmountFormProps = {
/** Amount supplied by the FormProvider */
@@ -51,7 +51,7 @@ type AmountFormProps = {
/** Number of decimals to display */
fixedDecimals?: number;
-} & Pick &
+} & Pick &
Pick;
/**
@@ -290,11 +290,11 @@ function AmountForm(
}}
selectedCurrencyCode={currency}
selection={selection}
- onSelectionChange={(e: NativeSyntheticEvent) => {
+ onSelectionChange={(start, end) => {
if (!shouldUpdateSelection) {
return;
}
- setSelection(e.nativeEvent.selection);
+ setSelection({start, end});
}}
onKeyPress={textInputKeyPress}
isCurrencyPressable={isCurrencyPressable}
diff --git a/src/components/AttachmentPicker/index.native.tsx b/src/components/AttachmentPicker/index.native.tsx
index d3a51c7fc0f0..70966a05b918 100644
--- a/src/components/AttachmentPicker/index.native.tsx
+++ b/src/components/AttachmentPicker/index.native.tsx
@@ -16,6 +16,8 @@ import useArrowKeyFocusManager from '@hooks/useArrowKeyFocusManager';
import useKeyboardShortcut from '@hooks/useKeyboardShortcut';
import useLocalize from '@hooks/useLocalize';
import useResponsiveLayout from '@hooks/useResponsiveLayout';
+import useStyleUtils from '@hooks/useStyleUtils';
+import useTheme from '@hooks/useTheme';
import useThemeStyles from '@hooks/useThemeStyles';
import * as FileUtils from '@libs/fileDownload/FileUtils';
import CONST from '@src/CONST';
@@ -33,46 +35,46 @@ type Item = {
pickAttachment: () => Promise;
};
-/**
- * See https://github.com/react-native-image-picker/react-native-image-picker/#options
- * for ImagePicker configuration options
- */
-const imagePickerOptions: Partial = {
- includeBase64: false,
- saveToPhotos: false,
- selectionLimit: 1,
- includeExtra: false,
- assetRepresentationMode: 'current',
-};
-
/**
* Return imagePickerOptions based on the type
*/
-const getImagePickerOptions = (type: string): CameraOptions => {
+const getImagePickerOptions = (type: string, fileLimit: number): CameraOptions | ImageLibraryOptions => {
// mediaType property is one of the ImagePicker configuration to restrict types'
const mediaType = type === CONST.ATTACHMENT_PICKER_TYPE.IMAGE ? 'photo' : 'mixed';
+
+ /**
+ * See https://github.com/react-native-image-picker/react-native-image-picker/#options
+ * for ImagePicker configuration options
+ */
return {
mediaType,
- ...imagePickerOptions,
+ includeBase64: false,
+ saveToPhotos: false,
+ includeExtra: false,
+ assetRepresentationMode: 'current',
+ selectionLimit: fileLimit,
};
};
/**
* Return documentPickerOptions based on the type
* @param {String} type
+ * @param {Number} fileLimit
* @returns {Object}
*/
-const getDocumentPickerOptions = (type: string): DocumentPickerOptions => {
+const getDocumentPickerOptions = (type: string, fileLimit: number): DocumentPickerOptions => {
if (type === CONST.ATTACHMENT_PICKER_TYPE.IMAGE) {
return {
type: [RNDocumentPicker.types.images],
copyTo: 'cachesDirectory',
+ allowMultiSelection: fileLimit !== 1,
};
}
return {
type: [RNDocumentPicker.types.allFiles],
copyTo: 'cachesDirectory',
+ allowMultiSelection: fileLimit !== 1,
};
};
@@ -111,13 +113,16 @@ function AttachmentPicker({
type = CONST.ATTACHMENT_PICKER_TYPE.FILE,
children,
shouldHideCameraOption = false,
- shouldHideGalleryOption = false,
shouldValidateImage = true,
+ shouldHideGalleryOption = false,
+ fileLimit = 1,
}: AttachmentPickerProps) {
const styles = useThemeStyles();
const [isVisible, setIsVisible] = useState(false);
+ const StyleUtils = useStyleUtils();
+ const theme = useTheme();
- const completeAttachmentSelection = useRef<(data: FileObject) => void>(() => {});
+ const completeAttachmentSelection = useRef<(data: FileObject[]) => void>(() => {});
const onModalHide = useRef<() => void>();
const onCanceled = useRef<() => void>(() => {});
const popoverRef = useRef(null);
@@ -143,7 +148,7 @@ function AttachmentPicker({
const showImagePicker = useCallback(
(imagePickerFunc: (options: CameraOptions, callback: Callback) => Promise): Promise =>
new Promise((resolve, reject) => {
- imagePickerFunc(getImagePickerOptions(type), (response: ImagePickerResponse) => {
+ imagePickerFunc(getImagePickerOptions(type, fileLimit), (response: ImagePickerResponse) => {
if (response.didCancel) {
// When the user cancelled resolve with no attachment
return resolve();
@@ -200,7 +205,7 @@ function AttachmentPicker({
}
});
}),
- [showGeneralAlert, type],
+ [fileLimit, showGeneralAlert, type],
);
/**
* Launch the DocumentPicker. Results are in the same format as ImagePicker
@@ -209,7 +214,7 @@ function AttachmentPicker({
*/
const showDocumentPicker = useCallback(
(): Promise =>
- RNDocumentPicker.pick(getDocumentPickerOptions(type)).catch((error: Error) => {
+ RNDocumentPicker.pick(getDocumentPickerOptions(type, fileLimit)).catch((error: Error) => {
if (RNDocumentPicker.isCancel(error)) {
return;
}
@@ -217,7 +222,7 @@ function AttachmentPicker({
showGeneralAlert(error.message);
throw error;
}),
- [showGeneralAlert, type],
+ [fileLimit, showGeneralAlert, type],
);
const menuItemData: Item[] = useMemo(() => {
@@ -261,7 +266,7 @@ function AttachmentPicker({
* @param onPickedHandler A callback that will be called with the selected attachment
* @param onCanceledHandler A callback that will be called without a selected attachment
*/
- const open = (onPickedHandler: (file: FileObject) => void, onCanceledHandler: () => void = () => {}) => {
+ const open = (onPickedHandler: (files: FileObject[]) => void, onCanceledHandler: () => void = () => {}) => {
// eslint-disable-next-line react-compiler/react-compiler
completeAttachmentSelection.current = onPickedHandler;
onCanceled.current = onCanceledHandler;
@@ -286,7 +291,7 @@ function AttachmentPicker({
}
return getDataForUpload(fileData)
.then((result) => {
- completeAttachmentSelection.current(result);
+ completeAttachmentSelection.current([result]);
})
.catch((error: Error) => {
showGeneralAlert(error.message);
@@ -301,63 +306,78 @@ function AttachmentPicker({
* sends the selected attachment to the caller (parent component)
*/
const pickAttachment = useCallback(
- (attachments: Asset[] | DocumentPickerResponse[] | void = []): Promise | undefined => {
+ (attachments: Asset[] | DocumentPickerResponse[] | void = []): Promise | undefined => {
if (!attachments || attachments.length === 0) {
onCanceled.current();
- return Promise.resolve();
+ return Promise.resolve([]);
}
- const fileData = attachments[0];
- if (!fileData) {
- onCanceled.current();
- return Promise.resolve();
- }
- /* eslint-disable @typescript-eslint/prefer-nullish-coalescing */
- const fileDataName = ('fileName' in fileData && fileData.fileName) || ('name' in fileData && fileData.name) || '';
- const fileDataUri = ('fileCopyUri' in fileData && fileData.fileCopyUri) || ('uri' in fileData && fileData.uri) || '';
-
- const fileDataObject: FileResponse = {
- name: fileDataName ?? '',
- uri: fileDataUri,
- size: ('size' in fileData && fileData.size) || ('fileSize' in fileData && fileData.fileSize) || null,
- type: fileData.type ?? '',
- width: ('width' in fileData && fileData.width) || undefined,
- height: ('height' in fileData && fileData.height) || undefined,
- };
+ const filesToProcess = attachments.map((fileData) => {
+ if (!fileData) {
+ onCanceled.current();
+ return Promise.resolve();
+ }
- if (!shouldValidateImage && fileDataName && Str.isImage(fileDataName)) {
- ImageSize.getSize(fileDataUri)
- .then(({width, height}) => {
- fileDataObject.width = width;
- fileDataObject.height = height;
- return fileDataObject;
- })
- .then((file) => {
- getDataForUpload(file)
- .then((result) => {
- completeAttachmentSelection.current(result);
- })
- .catch((error: Error) => {
- showGeneralAlert(error.message);
- throw error;
- });
- });
- return;
- }
- /* eslint-enable @typescript-eslint/prefer-nullish-coalescing */
- if (fileDataName && Str.isImage(fileDataName)) {
- ImageSize.getSize(fileDataUri)
- .then(({width, height}) => {
- fileDataObject.width = width;
- fileDataObject.height = height;
- validateAndCompleteAttachmentSelection(fileDataObject);
- })
- .catch(() => showImageCorruptionAlert());
- } else {
+ /* eslint-disable @typescript-eslint/prefer-nullish-coalescing */
+ const fileDataName = ('fileName' in fileData && fileData.fileName) || ('name' in fileData && fileData.name) || '';
+ const fileDataUri = ('fileCopyUri' in fileData && fileData.fileCopyUri) || ('uri' in fileData && fileData.uri) || '';
+
+ const fileDataObject: FileResponse = {
+ name: fileDataName ?? '',
+ uri: fileDataUri,
+ size: ('size' in fileData && fileData.size) || ('fileSize' in fileData && fileData.fileSize) || null,
+ type: fileData.type ?? '',
+ width: ('width' in fileData && fileData.width) || undefined,
+ height: ('height' in fileData && fileData.height) || undefined,
+ };
+
+ if (!shouldValidateImage && fileDataName && Str.isImage(fileDataName)) {
+ return ImageSize.getSize(fileDataUri)
+ .then(({width, height}) => {
+ fileDataObject.width = width;
+ fileDataObject.height = height;
+ return fileDataObject;
+ })
+ .then((file) => {
+ return getDataForUpload(file)
+ .then((result) => completeAttachmentSelection.current([result]))
+ .catch((error) => {
+ if (error instanceof Error) {
+ showGeneralAlert(error.message);
+ } else {
+ showGeneralAlert('An unknown error occurred');
+ }
+ throw error;
+ });
+ })
+ .catch(() => {
+ showImageCorruptionAlert();
+ });
+ }
+
+ if (fileDataName && Str.isImage(fileDataName)) {
+ return ImageSize.getSize(fileDataUri)
+ .then(({width, height}) => {
+ fileDataObject.width = width;
+ fileDataObject.height = height;
+
+ if (fileDataObject.width <= 0 || fileDataObject.height <= 0) {
+ showImageCorruptionAlert();
+ return Promise.resolve(); // Skip processing this corrupted file
+ }
+
+ return validateAndCompleteAttachmentSelection(fileDataObject);
+ })
+ .catch(() => {
+ showImageCorruptionAlert();
+ });
+ }
return validateAndCompleteAttachmentSelection(fileDataObject);
- }
+ });
+
+ return Promise.all(filesToProcess);
},
- [validateAndCompleteAttachmentSelection, showImageCorruptionAlert, shouldValidateImage, showGeneralAlert],
+ [shouldValidateImage, validateAndCompleteAttachmentSelection, showGeneralAlert, showImageCorruptionAlert],
);
/**
@@ -428,6 +448,7 @@ function AttachmentPicker({
title={translate(item.textTranslationKey)}
onPress={() => selectItem(item)}
focused={focusedIndex === menuIndex}
+ wrapperStyle={StyleUtils.getItemBackgroundColorStyle(false, focusedIndex === menuIndex, false, theme.activeComponentBG, theme.hoverComponentBG)}
/>
))}
diff --git a/src/components/AttachmentPicker/index.tsx b/src/components/AttachmentPicker/index.tsx
index f3c880fcb835..2484198d3916 100644
--- a/src/components/AttachmentPicker/index.tsx
+++ b/src/components/AttachmentPicker/index.tsx
@@ -1,5 +1,6 @@
import React, {useRef} from 'react';
import type {ValueOf} from 'type-fest';
+import type {FileObject} from '@components/AttachmentModal';
import * as Browser from '@libs/Browser';
import Visibility from '@libs/Visibility';
import CONST from '@src/CONST';
@@ -42,9 +43,9 @@ function getAcceptableFileTypesFromAList(fileTypes: Array(null);
- const onPicked = useRef<(file: File) => void>(() => {});
+ const onPicked = useRef<(files: FileObject[]) => void>(() => {});
const onCanceled = useRef<() => void>(() => {});
return (
@@ -62,7 +63,7 @@ function AttachmentPicker({children, type = CONST.ATTACHMENT_PICKER_TYPE.FILE, a
if (file) {
file.uri = URL.createObjectURL(file);
- onPicked.current(file);
+ onPicked.current([file]);
}
// Cleanup after selecting a file to start from a fresh state
@@ -97,6 +98,7 @@ function AttachmentPicker({children, type = CONST.ATTACHMENT_PICKER_TYPE.FILE, a
);
}}
accept={acceptedFileTypes ? getAcceptableFileTypesFromAList(acceptedFileTypes) : getAcceptableFileTypes(type)}
+ multiple={allowMultiple}
/>
{/* eslint-disable-next-line react-compiler/react-compiler */}
{children({
diff --git a/src/components/AttachmentPicker/types.ts b/src/components/AttachmentPicker/types.ts
index ee9d39aabef3..1e2e65761527 100644
--- a/src/components/AttachmentPicker/types.ts
+++ b/src/components/AttachmentPicker/types.ts
@@ -4,8 +4,8 @@ import type {FileObject} from '@components/AttachmentModal';
import type CONST from '@src/CONST';
type PickerOptions = {
- /** A callback that will be called with the selected attachment. */
- onPicked: (file: FileObject) => void;
+ /** A callback that will be called with the selected attachments. */
+ onPicked: (files: FileObject[]) => void;
/** A callback that will be called without a selected attachment. */
onCanceled?: () => void;
};
@@ -49,6 +49,12 @@ type AttachmentPickerProps = {
/** Whether to validate the image and show the alert or not. */
shouldValidateImage?: boolean;
+
+ /** Allow multiple file selection */
+ allowMultiple?: boolean;
+
+ /** Whether to allow multiple files to be selected. */
+ fileLimit?: number;
};
export default AttachmentPickerProps;
diff --git a/src/components/Attachments/AttachmentCarousel/CarouselItem.tsx b/src/components/Attachments/AttachmentCarousel/CarouselItem.tsx
index 103abb2df1bb..4de43a763231 100644
--- a/src/components/Attachments/AttachmentCarousel/CarouselItem.tsx
+++ b/src/components/Attachments/AttachmentCarousel/CarouselItem.tsx
@@ -86,7 +86,7 @@ function CarouselItem({item, onPress, isFocused, isModalHovered}: CarouselItemPr
/>
- {item.hasBeenFlagged && (
+ {!!item.hasBeenFlagged && (
{({safeAreaPaddingBottomStyle}) => {renderButton([styles.m4, styles.alignSelfCenter])}}
diff --git a/src/components/Attachments/AttachmentView/DefaultAttachmentView/index.tsx b/src/components/Attachments/AttachmentView/DefaultAttachmentView/index.tsx
index 23e13833df64..8f149182d9a6 100644
--- a/src/components/Attachments/AttachmentView/DefaultAttachmentView/index.tsx
+++ b/src/components/Attachments/AttachmentView/DefaultAttachmentView/index.tsx
@@ -47,7 +47,7 @@ function DefaultAttachmentView({fileName = '', shouldShowLoadingSpinnerIcon = fa
{fileName}
- {!shouldShowLoadingSpinnerIcon && shouldShowDownloadIcon && (
+ {!shouldShowLoadingSpinnerIcon && !!shouldShowDownloadIcon && (
- {report && !!title && (
+ {!!report && !!title && (
void;
+ onPicked: (image: FileObject[]) => void;
};
type OpenPicker = (args: OpenPickerParams) => void;
@@ -278,7 +278,7 @@ function AvatarWithImagePicker({
return;
}
openPicker({
- onPicked: showAvatarCropModal,
+ onPicked: (data) => showAvatarCropModal(data.at(0) ?? {}),
});
},
shouldCallAfterModalHide: true,
@@ -324,7 +324,7 @@ function AvatarWithImagePicker({
}
if (isUsingDefaultAvatar) {
openPicker({
- onPicked: showAvatarCropModal,
+ onPicked: (data) => showAvatarCropModal(data.at(0) ?? {}),
});
return;
}
@@ -426,7 +426,7 @@ function AvatarWithImagePicker({
// by the user on Safari.
if (index === 0 && Browser.isSafari()) {
openPicker({
- onPicked: showAvatarCropModal,
+ onPicked: (data) => showAvatarCropModal(data.at(0) ?? {}),
});
}
}}
@@ -443,7 +443,7 @@ function AvatarWithImagePicker({
)}
- {errorData.validationError && (
+ {!!errorData.validationError && (
- {icon && (
+ {!!icon && (
- {shouldShowIcon && icon && (
+ {shouldShowIcon && !!icon && (
(
<>
- {subtitle && (
+ {!!subtitle && (
- {animation && (
+ {!!animation && (
)}
- {icon && (
+ {!!icon && (
- {icon && (
+ {!!icon && (
)}
@@ -312,6 +312,7 @@ function Button(
small={small}
medium={medium}
large={large}
+ isButtonIcon
/>
) : (
)}
diff --git a/src/components/ButtonWithDropdownMenu/index.tsx b/src/components/ButtonWithDropdownMenu/index.tsx
index c44054c15445..f86e0c2da999 100644
--- a/src/components/ButtonWithDropdownMenu/index.tsx
+++ b/src/components/ButtonWithDropdownMenu/index.tsx
@@ -190,7 +190,7 @@ function ButtonWithDropdownMenu({
enterKeyEventListenerPriority={enterKeyEventListenerPriority}
/>
)}
- {(shouldAlwaysShowDropdownMenu || options.length > 1) && popoverAnchorPosition && (
+ {(shouldAlwaysShowDropdownMenu || options.length > 1) && !!popoverAnchorPosition && (
{
diff --git a/src/components/CheckboxWithLabel.tsx b/src/components/CheckboxWithLabel.tsx
index db62aa9e1441..0647b495bd33 100644
--- a/src/components/CheckboxWithLabel.tsx
+++ b/src/components/CheckboxWithLabel.tsx
@@ -95,8 +95,8 @@ function CheckboxWithLabel(
style={[styles.flexRow, styles.alignItemsCenter, styles.noSelect, styles.w100]}
wrapperStyle={[styles.ml3, styles.pr2, styles.w100, styles.flexWrap, styles.flexShrink1]}
>
- {label && {label}}
- {LabelComponent && }
+ {!!label && {label}}
+ {!!LabelComponent && }
diff --git a/src/components/CollapsibleSection/index.tsx b/src/components/CollapsibleSection/index.tsx
index d339f005e3d3..3776dfa2cf9b 100644
--- a/src/components/CollapsibleSection/index.tsx
+++ b/src/components/CollapsibleSection/index.tsx
@@ -63,7 +63,7 @@ function CollapsibleSection({title, children, titleStyle, textStyle, wrapperStyl
src={src}
/>
- {shouldShowSectionBorder && }
+ {!!shouldShowSectionBorder && }
{children}
diff --git a/src/components/ConfirmContent.tsx b/src/components/ConfirmContent.tsx
index bda78b9b320d..cb0fc6e8e8cb 100644
--- a/src/components/ConfirmContent.tsx
+++ b/src/components/ConfirmContent.tsx
@@ -168,7 +168,7 @@ function ConfirmContent({
)}
- {iconSource && (
+ {!!iconSource && (
- {title && {titleAlreadyTranslated ?? translate(title)}}
+ {!!title && {titleAlreadyTranslated ?? translate(title)}}
{children}
);
diff --git a/src/components/CountryPicker/CountrySelectorModal.tsx b/src/components/CountryPicker/CountrySelectorModal.tsx
index 76fd53138019..2daa74dcb4e8 100644
--- a/src/components/CountryPicker/CountrySelectorModal.tsx
+++ b/src/components/CountryPicker/CountrySelectorModal.tsx
@@ -7,8 +7,8 @@ import RadioListItem from '@components/SelectionList/RadioListItem';
import useDebouncedState from '@hooks/useDebouncedState';
import useLocalize from '@hooks/useLocalize';
import useThemeStyles from '@hooks/useThemeStyles';
-import searchCountryOptions from '@libs/searchCountryOptions';
-import type {CountryData} from '@libs/searchCountryOptions';
+import searchOptions from '@libs/searchOptions';
+import type {Option} from '@libs/searchOptions';
import StringUtils from '@libs/StringUtils';
import CONST from '@src/CONST';
import type {TranslationPaths} from '@src/languages/types';
@@ -27,7 +27,7 @@ type CountrySelectorModalProps = {
currentCountry: string;
/** Function to call when the user selects a country */
- onCountrySelected: (value: CountryData) => void;
+ onCountrySelected: (value: Option) => void;
/** Function to call when the user presses on the modal backdrop */
onBackdropPress?: () => void;
@@ -52,7 +52,7 @@ function CountrySelectorModal({isVisible, currentCountry, onCountrySelected, onC
[translate, currentCountry],
);
- const searchResults = searchCountryOptions(debouncedSearchValue, countries);
+ const searchResults = searchOptions(debouncedSearchValue, countries);
const headerMessage = debouncedSearchValue.trim() && !searchResults.length ? translate('common.noResultsFound') : '';
const styles = useThemeStyles();
diff --git a/src/components/CountryPicker/index.tsx b/src/components/CountryPicker/index.tsx
index cc51b3c5f537..3f30fcbafb75 100644
--- a/src/components/CountryPicker/index.tsx
+++ b/src/components/CountryPicker/index.tsx
@@ -2,7 +2,7 @@ import React, {useState} from 'react';
import MenuItemWithTopDescription from '@components/MenuItemWithTopDescription';
import useLocalize from '@hooks/useLocalize';
import Navigation from '@libs/Navigation/Navigation';
-import type {CountryData} from '@libs/searchCountryOptions';
+import type {Option} from '@libs/searchOptions';
import CONST from '@src/CONST';
import type {TranslationPaths} from '@src/languages/types';
import CountrySelectorModal from './CountrySelectorModal';
@@ -26,7 +26,7 @@ function CountryPicker({value, errorText, onInputChange = () => {}}: CountryPick
setIsPickerVisible(false);
};
- const updateInput = (item: CountryData) => {
+ const updateInput = (item: Option) => {
onInputChange?.(item.value);
hidePickerModal();
};
diff --git a/src/components/CustomDevMenu/index.native.tsx b/src/components/CustomDevMenu/index.native.tsx
index 968f97b9e91f..55ab64205587 100644
--- a/src/components/CustomDevMenu/index.native.tsx
+++ b/src/components/CustomDevMenu/index.native.tsx
@@ -1,12 +1,12 @@
import {useEffect} from 'react';
-import DevMenu from 'react-native-dev-menu';
+import {DevSettings} from 'react-native';
import toggleTestToolsModal from '@userActions/TestTool';
import type CustomDevMenuElement from './types';
const CustomDevMenu: CustomDevMenuElement = Object.assign(
() => {
useEffect(() => {
- DevMenu.addItem('Open Test Preferences', toggleTestToolsModal);
+ DevSettings.addMenuItem('Open Test Preferences', toggleTestToolsModal);
}, []);
// eslint-disable-next-line react/jsx-no-useless-fragment
return <>;
diff --git a/src/components/DatePicker/CalendarPicker/index.tsx b/src/components/DatePicker/CalendarPicker/index.tsx
index 287ec3359175..9906f9b04c3c 100644
--- a/src/components/DatePicker/CalendarPicker/index.tsx
+++ b/src/components/DatePicker/CalendarPicker/index.tsx
@@ -1,6 +1,6 @@
import {addMonths, endOfDay, endOfMonth, format, getYear, isSameDay, parseISO, setDate, setYear, startOfDay, startOfMonth, subMonths} from 'date-fns';
import {Str} from 'expensify-common';
-import React, {useState} from 'react';
+import React, {useRef, useState} from 'react';
import {View} from 'react-native';
import PressableWithFeedback from '@components/Pressable/PressableWithFeedback';
import PressableWithoutFeedback from '@components/Pressable/PressableWithoutFeedback';
@@ -51,6 +51,7 @@ function CalendarPicker({
const themeStyles = useThemeStyles();
const StyleUtils = useStyleUtils();
const {preferredLocale, translate} = useLocalize();
+ const pressableRef = useRef(null);
const [currentDateView, setCurrentDateView] = useState(getInitialCurrentDateView(value, minDate, maxDate));
@@ -148,7 +149,11 @@ function CalendarPicker({
dataSet={{[CONST.SELECTION_SCRAPER_HIDDEN_ELEMENT]: true}}
>
setIsYearPickerVisible(true)}
+ onPress={() => {
+ pressableRef?.current?.blur();
+ setIsYearPickerVisible(true);
+ }}
+ ref={pressableRef}
style={[themeStyles.alignItemsCenter, themeStyles.flexRow, themeStyles.flex1, themeStyles.justifyContentStart]}
wrapperStyle={[themeStyles.alignItemsCenter]}
hoverDimmingValue={1}
diff --git a/src/components/DecisionModal.tsx b/src/components/DecisionModal.tsx
index a9bd0b204d79..927ba1ecab11 100644
--- a/src/components/DecisionModal.tsx
+++ b/src/components/DecisionModal.tsx
@@ -55,7 +55,7 @@ function DecisionModal({title, prompt = '', firstOptionText, secondOptionText, o
{prompt}
- {firstOptionText && (
+ {!!firstOptionText && (
- {isReceiptThumbnail && fileExtension && (
+ {isReceiptThumbnail && !!fileExtension && (
{
+ setFilteredEmojis(emojiData);
+ setHeaderIndices(headerData);
+
+ InteractionManager.runAfterInteractions(() => {
+ requestAnimationFrame(() => {
+ emojiListRef.current?.scrollToOffset({offset: 0, animated: false});
+ });
+ });
+ };
+
/**
* Filter the entire list of emojis to only emojis that have the search term in their keywords
*/
const filterEmojis = lodashDebounce((searchTerm: string) => {
const [normalizedSearchTerm, newFilteredEmojiList] = suggestEmojis(searchTerm);
- if (emojiListRef.current) {
- emojiListRef.current.scrollToOffset({offset: 0, animated: false});
- }
-
if (normalizedSearchTerm === '') {
- setFilteredEmojis(allEmojis);
- setHeaderIndices(headerRowIndices);
-
- return;
+ updateEmojiList(allEmojis, headerRowIndices);
+ } else {
+ updateEmojiList(newFilteredEmojiList ?? [], []);
}
-
- setFilteredEmojis(newFilteredEmojiList ?? []);
- setHeaderIndices([]);
}, 300);
const scrollToHeader = (headerIndex: number) => {
diff --git a/src/components/EmojiPicker/EmojiPickerMenu/index.tsx b/src/components/EmojiPicker/EmojiPickerMenu/index.tsx
index afcea4f3856a..e79863c7a527 100755
--- a/src/components/EmojiPicker/EmojiPickerMenu/index.tsx
+++ b/src/components/EmojiPicker/EmojiPickerMenu/index.tsx
@@ -119,6 +119,7 @@ function EmojiPickerMenu({onEmojiSelected, activeEmoji}: EmojiPickerMenuProps, r
setFilteredEmojis(allEmojis);
setHeaderIndices(headerRowIndices);
setFocusedIndex(-1);
+ setHighlightFirstEmoji(false);
setHighlightEmoji(false);
return;
}
@@ -139,14 +140,6 @@ function EmojiPickerMenu({onEmojiSelected, activeEmoji}: EmojiPickerMenuProps, r
return;
}
- if (!isEnterWhileComposition(keyBoardEvent) && keyBoardEvent.key === CONST.KEYBOARD_SHORTCUTS.ENTER.shortcutKey) {
- // On web, avoid this Enter default input action; otherwise, it will add a new line in the subsequently focused composer.
- keyBoardEvent.preventDefault();
- // On mWeb, avoid propagating this Enter keystroke to Pressable child component; otherwise, it will trigger the onEmojiSelected callback again.
- keyBoardEvent.stopPropagation();
- return;
- }
-
// Enable keyboard movement if tab or enter is pressed or if shift is pressed while the input
// is not focused, so that the navigation and tab cycling can be done using the keyboard without
// interfering with the input behaviour.
@@ -182,9 +175,13 @@ function EmojiPickerMenu({onEmojiSelected, activeEmoji}: EmojiPickerMenuProps, r
if ('types' in item || 'name' in item) {
const emoji = typeof preferredSkinTone === 'number' && preferredSkinTone !== -1 && item?.types?.at(preferredSkinTone) ? item.types.at(preferredSkinTone) : item.code;
onEmojiSelected(emoji ?? '', item);
+ // On web, avoid this Enter default input action; otherwise, it will add a new line in the subsequently focused composer.
+ keyBoardEvent.preventDefault();
+ // On mWeb, avoid propagating this Enter keystroke to Pressable child component; otherwise, it will trigger the onEmojiSelected callback again.
+ keyBoardEvent.stopPropagation();
}
},
- {shouldPreventDefault: true, shouldStopPropagation: true},
+ {shouldPreventDefault: false},
);
/**
@@ -239,8 +236,9 @@ function EmojiPickerMenu({onEmojiSelected, activeEmoji}: EmojiPickerMenuProps, r
const calculatedOffset = Math.floor(headerIndex / CONST.EMOJI_NUM_PER_ROW) * CONST.EMOJI_PICKER_HEADER_HEIGHT;
emojiListRef.current?.scrollToOffset({offset: calculatedOffset, animated: true});
+ setFocusedIndex(headerIndex);
},
- [emojiListRef],
+ [emojiListRef, setFocusedIndex],
);
/**
diff --git a/src/components/EmojiPicker/EmojiPickerMenuItem/index.tsx b/src/components/EmojiPicker/EmojiPickerMenuItem/index.tsx
index 8aaf4a14e560..1629089dace5 100644
--- a/src/components/EmojiPicker/EmojiPickerMenuItem/index.tsx
+++ b/src/components/EmojiPicker/EmojiPickerMenuItem/index.tsx
@@ -68,8 +68,7 @@ function EmojiPickerMenuItem({
ref.current = el ?? null;
}}
style={({pressed}) => [
- isFocused ? themeStyles.emojiItemKeyboardHighlighted : {},
- isHovered || isHighlighted ? themeStyles.emojiItemHighlighted : {},
+ isFocused || isHovered || isHighlighted ? themeStyles.emojiItemHighlighted : {},
Browser.isMobile() && StyleUtils.getButtonBackgroundColorStyle(getButtonState(false, pressed)),
themeStyles.emojiItem,
]}
diff --git a/src/components/FeatureList.tsx b/src/components/FeatureList.tsx
index fe209e90eb70..70c56ad5d963 100644
--- a/src/components/FeatureList.tsx
+++ b/src/components/FeatureList.tsx
@@ -131,7 +131,7 @@ function FeatureList({
large
/>
)}
- {ctaErrorMessage && (
+ {!!ctaErrorMessage && (
{
+ const newErrors = {...errors};
+ delete newErrors[inputID];
+ FormActions.setErrors(formID, newErrors as Errors);
+ setErrors(newErrors);
+ },
+ [errors, formID],
+ );
+
useImperativeHandle(forwardedRef, () => ({
resetForm,
resetErrors,
+ resetFormFieldError,
}));
const registerInput = useCallback(
diff --git a/src/components/Form/types.ts b/src/components/Form/types.ts
index 4ddd816af423..ab9260a6b5d9 100644
--- a/src/components/Form/types.ts
+++ b/src/components/Form/types.ts
@@ -6,6 +6,7 @@ import type AddressSearch from '@components/AddressSearch';
import type AmountForm from '@components/AmountForm';
import type AmountPicker from '@components/AmountPicker';
import type AmountTextInput from '@components/AmountTextInput';
+import type {FileObject} from '@components/AttachmentModal';
import type CheckboxWithLabel from '@components/CheckboxWithLabel';
import type CountryPicker from '@components/CountryPicker';
import type CountrySelector from '@components/CountrySelector';
@@ -14,6 +15,7 @@ import type DatePicker from '@components/DatePicker';
import type EmojiPickerButtonDropdown from '@components/EmojiPicker/EmojiPickerButtonDropdown';
import type PercentageForm from '@components/PercentageForm';
import type Picker from '@components/Picker';
+import type PushRowWithModal from '@components/PushRowWithModal';
import type RadioButtons from '@components/RadioButtons';
import type RoomNameInput from '@components/RoomNameInput';
import type SingleChoiceQuestion from '@components/SingleChoiceQuestion';
@@ -21,6 +23,7 @@ import type StatePicker from '@components/StatePicker';
import type StateSelector from '@components/StateSelector';
import type TextInput from '@components/TextInput';
import type TextPicker from '@components/TextPicker';
+import type UploadFile from '@components/UploadFile';
import type ValuePicker from '@components/ValuePicker';
import type ConstantSelector from '@pages/Debug/ConstantSelector';
import type BusinessTypePicker from '@pages/ReimbursementAccount/BusinessInfo/substeps/TypeBusiness/BusinessTypePicker';
@@ -30,6 +33,7 @@ import type NetSuiteCustomListPicker from '@pages/workspace/accounting/netsuite/
import type NetSuiteMenuWithTopDescriptionForm from '@pages/workspace/accounting/netsuite/import/NetSuiteImportCustomFieldNew/NetSuiteMenuWithTopDescriptionForm';
import type {Country} from '@src/CONST';
import type {OnyxFormKey, OnyxValues} from '@src/ONYXKEYS';
+import type {Form} from '@src/types/form';
import type {BaseForm} from '@src/types/form/Form';
/**
@@ -63,9 +67,11 @@ type ValidInputs =
| typeof NetSuiteMenuWithTopDescriptionForm
| typeof CountryPicker
| typeof StatePicker
- | typeof ConstantSelector;
+ | typeof ConstantSelector
+ | typeof UploadFile
+ | typeof PushRowWithModal;
-type ValueTypeKey = 'string' | 'boolean' | 'date' | 'country' | 'reportFields' | 'disabledListValues';
+type ValueTypeKey = 'string' | 'boolean' | 'date' | 'country' | 'reportFields' | 'disabledListValues' | 'entityChart';
type ValueTypeMap = {
string: string;
boolean: boolean;
@@ -73,6 +79,7 @@ type ValueTypeMap = {
country: Country | '';
reportFields: string[];
disabledListValues: boolean[];
+ entityChart: FileObject[];
};
type FormValue = ValueOf;
@@ -158,6 +165,7 @@ type FormProps = {
type FormRef = {
resetForm: (optionalValue: FormOnyxValues) => void;
resetErrors: () => void;
+ resetFormFieldError: (fieldID: keyof Form) => void;
};
type InputRefs = Record>;
diff --git a/src/components/HTMLEngineProvider/HTMLRenderers/MentionReportRenderer/index.tsx b/src/components/HTMLEngineProvider/HTMLRenderers/MentionReportRenderer/index.tsx
index 3ab907dc767d..94a46d861dde 100644
--- a/src/components/HTMLEngineProvider/HTMLRenderers/MentionReportRenderer/index.tsx
+++ b/src/components/HTMLEngineProvider/HTMLRenderers/MentionReportRenderer/index.tsx
@@ -10,10 +10,14 @@ import Text from '@components/Text';
import useCurrentReportID from '@hooks/useCurrentReportID';
import useStyleUtils from '@hooks/useStyleUtils';
import useThemeStyles from '@hooks/useThemeStyles';
-import Navigation from '@navigation/Navigation';
+import getTopmostCentralPaneRoute from '@libs/Navigation/getTopmostCentralPaneRoute';
+import type {RootStackParamList, State} from '@libs/Navigation/types';
+import Navigation, {navigationRef} from '@navigation/Navigation';
import CONST from '@src/CONST';
import ONYXKEYS from '@src/ONYXKEYS';
import ROUTES from '@src/ROUTES';
+import type {Route} from '@src/ROUTES';
+import SCREENS from '@src/SCREENS';
import type {Report} from '@src/types/onyx';
import {isEmptyObject} from '@src/types/utils/EmptyObject';
import MentionReportContext from './MentionReportContext';
@@ -69,7 +73,12 @@ function MentionReportRenderer({style, tnode, TDefaultRenderer, ...defaultRender
}
const {reportID, mentionDisplayText} = mentionDetails;
- const navigationRoute = reportID ? ROUTES.REPORT_WITH_ID.getRoute(reportID) : undefined;
+ let navigationRoute: Route | undefined = reportID ? ROUTES.REPORT_WITH_ID.getRoute(reportID) : undefined;
+ const topmostCentralPaneRoute = getTopmostCentralPaneRoute(navigationRef.getRootState() as State);
+ const backTo = Navigation.getActiveRoute();
+ if (topmostCentralPaneRoute?.name === SCREENS.SEARCH.CENTRAL_PANE) {
+ navigationRoute = reportID ? ROUTES.SEARCH_REPORT.getRoute({reportID, backTo}) : undefined;
+ }
const isCurrentRoomMention = reportID === currentReportIDValue;
const flattenStyle = StyleSheet.flatten(style as TextStyle);
diff --git a/src/components/HeaderWithBackButton/index.tsx b/src/components/HeaderWithBackButton/index.tsx
index b71f4db246a8..0d307aa8728d 100755
--- a/src/components/HeaderWithBackButton/index.tsx
+++ b/src/components/HeaderWithBackButton/index.tsx
@@ -1,5 +1,5 @@
import React, {useMemo} from 'react';
-import {Keyboard, StyleSheet, View} from 'react-native';
+import {ActivityIndicator, Keyboard, StyleSheet, View} from 'react-native';
import Avatar from '@components/Avatar';
import AvatarWithDisplayName from '@components/AvatarWithDisplayName';
import Header from '@components/Header';
@@ -39,6 +39,7 @@ function HeaderWithBackButton({
shouldShowBorderBottom = false,
shouldShowCloseButton = false,
shouldShowDownloadButton = false,
+ isDownloading = false,
shouldShowGetAssistanceButton = false,
shouldDisableGetAssistanceButton = false,
shouldShowPinButton = false,
@@ -173,7 +174,7 @@ function HeaderWithBackButton({
)}
- {icon && (
+ {!!icon && (
)}
- {policyAvatar && (
+ {!!policyAvatar && (
{children}
- {shouldShowDownloadButton && (
-
- {
- // Blur the pressable in case this button triggers a Growl notification
- // We do not want to overlap Growl with the Tooltip (#15271)
- (event?.currentTarget as HTMLElement)?.blur();
+ {shouldShowDownloadButton &&
+ (!isDownloading ? (
+
+ {
+ // Blur the pressable in case this button triggers a Growl notification
+ // We do not want to overlap Growl with the Tooltip (#15271)
+ (event?.currentTarget as HTMLElement)?.blur();
- if (!isDownloadButtonActive) {
- return;
- }
+ if (!isDownloadButtonActive) {
+ return;
+ }
- onDownloadButtonPress();
- temporarilyDisableDownloadButton();
- }}
+ onDownloadButtonPress();
+ temporarilyDisableDownloadButton();
+ }}
+ style={[styles.touchableButtonImage]}
+ role="button"
+ accessibilityLabel={translate('common.download')}
+ >
+
+
+
+ ) : (
+
-
-
-
- )}
+ size="small"
+ color={theme.spinner}
+ />
+ ))}
{shouldShowGetAssistanceButton && (
& {
/** Whether we should show a download button */
shouldShowDownloadButton?: boolean;
+ /** Whether we should show a loading indicator replacing the download button */
+ isDownloading?: boolean;
+
/** Whether we should show a get assistance (question mark) button */
shouldShowGetAssistanceButton?: boolean;
diff --git a/src/components/Hoverable/ActiveHoverable.tsx b/src/components/Hoverable/ActiveHoverable.tsx
index 9bc0e846aaf1..eda42a703d65 100644
--- a/src/components/Hoverable/ActiveHoverable.tsx
+++ b/src/components/Hoverable/ActiveHoverable.tsx
@@ -81,7 +81,7 @@ function ActiveHoverable({onHoverIn, onHoverOut, shouldHandleScroll, shouldFreez
setIsHovered(false);
};
- document.addEventListener('mouseover', unsetHoveredIfOutside);
+ document.addEventListener('mouseover', unsetHoveredIfOutside, true);
return () => document.removeEventListener('mouseover', unsetHoveredIfOutside);
}, [isHovered, elementRef, shouldFreezeCapture]);
@@ -126,13 +126,13 @@ function ActiveHoverable({onHoverIn, onHoverOut, shouldHandleScroll, shouldFreez
(event: MouseEvent) => {
// Check if the blur event occurred due to clicking outside the element
// and the wrapperView contains the element that caused the blur and reset isHovered
- if (!elementRef.current?.contains(event.target as Node) && !elementRef.current?.contains(event.relatedTarget as Node)) {
+ if (!elementRef.current?.contains(event.target as Node) && !elementRef.current?.contains(event.relatedTarget as Node) && !shouldFreezeCapture) {
setIsHovered(false);
}
onBlur?.(event);
},
- [onBlur],
+ [onBlur, shouldFreezeCapture],
);
const handleAndForwardOnMouseMove = useCallback(
diff --git a/src/components/Icon/Expensicons.ts b/src/components/Icon/Expensicons.ts
index 90f0e0d8a151..fa531ce34adf 100644
--- a/src/components/Icon/Expensicons.ts
+++ b/src/components/Icon/Expensicons.ts
@@ -23,6 +23,7 @@ import Bed from '@assets/images/bed.svg';
import Bell from '@assets/images/bell.svg';
import BellSlash from '@assets/images/bellSlash.svg';
import Bill from '@assets/images/bill.svg';
+import Binoculars from '@assets/images/binoculars.svg';
import Bolt from '@assets/images/bolt.svg';
import Bookmark from '@assets/images/bookmark.svg';
import Box from '@assets/images/box.svg';
@@ -223,6 +224,7 @@ export {
Bill,
Bell,
BellSlash,
+ Binoculars,
Bolt,
Box,
Briefcase,
diff --git a/src/components/Icon/Illustrations.ts b/src/components/Icon/Illustrations.ts
index 18ae1792686f..991aaea86513 100644
--- a/src/components/Icon/Illustrations.ts
+++ b/src/components/Icon/Illustrations.ts
@@ -54,6 +54,7 @@ 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 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';
import Accounting from '@assets/images/simple-illustrations/simple-illustration__accounting.svg';
import Alert from '@assets/images/simple-illustrations/simple-illustration__alert.svg';
@@ -100,6 +101,7 @@ import MoneyWings from '@assets/images/simple-illustrations/simple-illustration_
import OpenSafe from '@assets/images/simple-illustrations/simple-illustration__opensafe.svg';
import PalmTree from '@assets/images/simple-illustrations/simple-illustration__palmtree.svg';
import Pencil from '@assets/images/simple-illustrations/simple-illustration__pencil.svg';
+import PerDiem from '@assets/images/simple-illustrations/simple-illustration__perdiem.svg';
import PiggyBank from '@assets/images/simple-illustrations/simple-illustration__piggybank.svg';
import Profile from '@assets/images/simple-illustrations/simple-illustration__profile.svg';
import QRCode from '@assets/images/simple-illustrations/simple-illustration__qr-code.svg';
@@ -200,6 +202,7 @@ export {
TrashCan,
TeleScope,
Profile,
+ Puzzle,
PalmTree,
LockClosed,
Gears,
@@ -262,4 +265,5 @@ export {
OtherCompanyCardDetail,
StripeCompanyCardDetail,
WellsFargoCompanyCardDetail,
+ PerDiem,
};
diff --git a/src/components/Icon/index.tsx b/src/components/Icon/index.tsx
index b4da5c0b0fa2..4ec4556e1c86 100644
--- a/src/components/Icon/index.tsx
+++ b/src/components/Icon/index.tsx
@@ -40,9 +40,6 @@ type IconProps = {
/** Is icon pressed */
pressed?: boolean;
- /** Is icon will be used with text */
- hasText?: boolean;
-
/** Additional styles to add to the Icon */
additionalStyles?: StyleProp;
@@ -51,6 +48,9 @@ type IconProps = {
/** Determines how the image should be resized to fit its container */
contentFit?: ImageContentFit;
+
+ /** Determines whether the icon is being used within a button. The icon size will remain the same for both icon-only buttons and buttons with text. */
+ isButtonIcon?: boolean;
};
function Icon({
@@ -59,7 +59,6 @@ function Icon({
height = variables.iconSizeNormal,
fill = undefined,
small = false,
- hasText = false,
large = false,
medium = false,
inline = false,
@@ -68,10 +67,11 @@ function Icon({
pressed = false,
testID = '',
contentFit = 'cover',
+ isButtonIcon = false,
}: IconProps) {
const StyleUtils = useStyleUtils();
const styles = useThemeStyles();
- const {width: iconWidth, height: iconHeight} = StyleUtils.getIconWidthAndHeightStyle(small, medium, large, width, height, hasText);
+ const {width: iconWidth, height: iconHeight} = StyleUtils.getIconWidthAndHeightStyle(small, medium, large, width, height, isButtonIcon);
const iconStyles = [StyleUtils.getWidthAndHeightStyle(width ?? 0, height), IconWrapperStyles, styles.pAbsolute, additionalStyles];
if (inline) {
diff --git a/src/components/ImportOnyxState/BaseImportOnyxState.tsx b/src/components/ImportOnyxState/BaseImportOnyxState.tsx
index c6c80d03b58f..3362bc764446 100644
--- a/src/components/ImportOnyxState/BaseImportOnyxState.tsx
+++ b/src/components/ImportOnyxState/BaseImportOnyxState.tsx
@@ -39,7 +39,7 @@ function BaseImportOnyxState({
wrapperStyle={[styles.sectionMenuItemTopDescription]}
onPress={() => {
openPicker({
- onPicked: onFileRead,
+ onPicked: (data) => onFileRead(data.at(0) ?? {}),
});
}}
/>
diff --git a/src/components/InitialURLContextProvider.tsx b/src/components/InitialURLContextProvider.tsx
index 85ad54ca6c94..adf361a2573d 100644
--- a/src/components/InitialURLContextProvider.tsx
+++ b/src/components/InitialURLContextProvider.tsx
@@ -26,14 +26,15 @@ type InitialURLContextProviderProps = {
};
function InitialURLContextProvider({children, url}: InitialURLContextProviderProps) {
- const [initialURL, setInitialURL] = useState(url);
+ const [initialURL, setInitialURL] = useState();
const {setSplashScreenState} = useSplashScreenStateContext();
useEffect(() => {
if (url) {
- const route = signInAfterTransitionFromOldDot(url);
- setInitialURL(route);
- setSplashScreenState(CONST.BOOT_SPLASH_STATE.READY_TO_BE_HIDDEN);
+ signInAfterTransitionFromOldDot(url).then((route) => {
+ setInitialURL(route);
+ setSplashScreenState(CONST.BOOT_SPLASH_STATE.READY_TO_BE_HIDDEN);
+ });
return;
}
Linking.getInitialURL().then((initURL) => {
diff --git a/src/components/InlineCodeBlock/WrappedText.tsx b/src/components/InlineCodeBlock/WrappedText.tsx
index 00ab8ec20906..9e7c7291a9a6 100644
--- a/src/components/InlineCodeBlock/WrappedText.tsx
+++ b/src/components/InlineCodeBlock/WrappedText.tsx
@@ -1,9 +1,11 @@
-import React, {Fragment} from 'react';
+import React, {Fragment, useMemo} from 'react';
import type {StyleProp, TextStyle, ViewStyle} from 'react-native';
import {View} from 'react-native';
import Text from '@components/Text';
import useThemeStyles from '@hooks/useThemeStyles';
+import useWindowDimensions from '@hooks/useWindowDimensions';
import {containsOnlyEmojis} from '@libs/EmojiUtils';
+import variables from '@styles/variables';
import CONST from '@src/CONST';
import type ChildrenProps from '@src/types/utils/ChildrenProps';
@@ -40,15 +42,59 @@ function containsEmoji(text: string): boolean {
return CONST.REGEX.EMOJIS.test(text);
}
+/**
+ * Takes a long word and splits it into an array of sub-strings.
+ *
+ * The function tests whether the length of the provided word exceeds the provided maximum length.
+ * If the word's length is less than or equal to `maxLength`, it returns an array with the original word.
+ * If the word's length exceeds 'maxLength', it utilizes a regular expression to split the word into
+ * substrings with a specified 'maxLength' and returns them as an array of strings.
+ *
+ * @param word The original word to be split.
+ * @param maxLength The maximum length of each substring.
+ * @return An array of substrings derived from the original word.
+ *
+ * @example
+ * splitLongWord('longteststring', 4);
+ * // Output: ['long', 'test', 'stri', 'ng']
+ */
+function splitLongWord(word: string, maxLength: number): string[] {
+ if (word.length <= maxLength) {
+ return [word];
+ }
+
+ return word.match(new RegExp(`.{1,${maxLength}}`, 'g')) ?? [];
+}
+
+function getFontSizeFromStyles(textStyles: StyleProp): number {
+ if (Array.isArray(textStyles)) {
+ for (const style of textStyles) {
+ if (style && 'fontSize' in style && style.fontSize) {
+ return style.fontSize;
+ }
+ }
+ } else if (textStyles && 'fontSize' in textStyles && textStyles.fontSize) {
+ return textStyles.fontSize;
+ }
+
+ // if we cannot infer fontSize from styles, a default value is returned
+ return variables.fontSizeLabel;
+}
+
function WrappedText({children, wordStyles, textStyles}: WrappedTextProps) {
const styles = useThemeStyles();
+ const {windowWidth} = useWindowDimensions();
+
+ const fontSize = useMemo(() => getFontSizeFromStyles(textStyles), [textStyles]);
+ const childrenString = typeof children === 'string' ? children : '';
+ const charsPerLine = useMemo(() => Math.floor(windowWidth / (fontSize * variables.fontSizeToWidthRatio)), [windowWidth, fontSize]);
+
+ const textMatrix = getTextMatrix(childrenString).map((row) => row.flatMap((word) => splitLongWord(word, charsPerLine)));
if (typeof children !== 'string') {
return null;
}
- const textMatrix = getTextMatrix(children);
-
return textMatrix.map((rowText, rowIndex) => (
;
};
-function InteractiveStepWrapper({children, wrapperID, handleBackButtonPress, headerTitle, startStepIndex, stepNames}: InteractiveStepWrapperProps) {
+function InteractiveStepWrapper(
+ {
+ children,
+ wrapperID,
+ handleBackButtonPress,
+ headerTitle,
+ headerSubtitle,
+ startStepIndex,
+ stepNames,
+ shouldEnableMaxHeight,
+ shouldShowOfflineIndicator,
+ shouldEnablePickerAvoiding = false,
+ guidesCallTaskID,
+ offlineIndicatorStyle,
+ }: InteractiveStepWrapperProps,
+ ref: React.ForwardedRef,
+) {
const styles = useThemeStyles();
return (
- {stepNames && (
+ {!!stepNames && (
{}, opti
ReportUtils.isSystemChat(report)
}
/>
- {ReportUtils.isChatUsedForOnboarding(report) && }
+ {ReportUtils.isChatUsedForOnboarding(report) && }
{isStatusVisible && (
{}, opti
/>
)}
- {hasDraftComment && optionItem.isAllowedToComment && (
+ {hasDraftComment && !!optionItem.isAllowedToComment && (
{}, opti
/>
)}
- {!shouldShowGreenDotIndicator && !hasBrickError && optionItem.isPinned && (
+ {!shouldShowGreenDotIndicator && !hasBrickError && !!optionItem.isPinned && (
))}
- {errorText && (
+ {!!errorText && (
- {coordinates && (
+ {!!coordinates && (
(
- ({accessToken, style, mapPadding, userLocation, styleURL, pitchEnabled, initialState, waypoints, directionCoordinates, onMapReady, interactive = true}, ref) => {
+const MapView = forwardRef(
+ ({accessToken, style, mapPadding, styleURL, pitchEnabled, initialState, waypoints, directionCoordinates, onMapReady, interactive = true}, ref) => {
+ const [userLocation] = useOnyx(ONYXKEYS.USER_LOCATION);
const navigation = useNavigation();
const {isOffline} = useNetwork();
const {translate} = useLocalize();
@@ -275,7 +275,7 @@ const MapView = forwardRef(
);
})}
- {directionCoordinates && }
+ {!!directionCoordinates && }
{interactive && (
@@ -298,8 +298,4 @@ const MapView = forwardRef(
},
);
-export default withOnyx({
- userLocation: {
- key: ONYXKEYS.USER_LOCATION,
- },
-})(memo(MapView));
+export default memo(MapView);
diff --git a/src/components/MapView/MapView.website.tsx b/src/components/MapView/MapView.website.tsx
index 3a28943b575a..b89bfa19e98e 100644
--- a/src/components/MapView/MapView.website.tsx
+++ b/src/components/MapView/MapView.website.tsx
@@ -4,11 +4,10 @@ import useLocalize from '@hooks/useLocalize';
import useNetwork from '@hooks/useNetwork';
import usePrevious from '@hooks/usePrevious';
import useThemeStyles from '@hooks/useThemeStyles';
-import type {MapViewHandle} from './MapViewTypes';
+import type {MapViewHandle, MapViewProps} from './MapViewTypes';
import PendingMapView from './PendingMapView';
-import type {ComponentProps} from './types';
-const MapView = forwardRef((props, ref) => {
+const MapView = forwardRef((props, ref) => {
const {isOffline} = useNetwork();
const {translate} = useLocalize();
const styles = useThemeStyles();
@@ -51,7 +50,6 @@ const MapView = forwardRef((props, ref) => {
}
>
(
+const MapViewImpl = forwardRef(
(
{
style,
@@ -40,13 +39,14 @@ const MapViewImpl = forwardRef(
waypoints,
mapPadding,
accessToken,
- userLocation,
directionCoordinates,
initialState = {location: CONST.MAPBOX.DEFAULT_COORDINATE, zoom: CONST.MAPBOX.DEFAULT_ZOOM},
interactive = true,
},
ref,
) => {
+ const [userLocation] = useOnyx(ONYXKEYS.USER_LOCATION);
+
const {isOffline} = useNetwork();
const {translate} = useLocalize();
@@ -272,7 +272,7 @@ const MapViewImpl = forwardRef(
);
})}
- {directionCoordinates && }
+ {!!directionCoordinates && }
{interactive && (
@@ -295,8 +295,4 @@ const MapViewImpl = forwardRef(
},
);
-export default withOnyx({
- userLocation: {
- key: ONYXKEYS.USER_LOCATION,
- },
-})(MapViewImpl);
+export default MapViewImpl;
diff --git a/src/components/MapView/types.ts b/src/components/MapView/types.ts
deleted file mode 100644
index a0494a9ac499..000000000000
--- a/src/components/MapView/types.ts
+++ /dev/null
@@ -1,11 +0,0 @@
-import type {OnyxEntry} from 'react-native-onyx';
-import type * as OnyxTypes from '@src/types/onyx';
-import type {MapViewProps} from './MapViewTypes';
-
-type MapViewOnyxProps = {
- userLocation: OnyxEntry;
-};
-
-type ComponentProps = MapViewProps & MapViewOnyxProps;
-
-export type {MapViewOnyxProps, ComponentProps};
diff --git a/src/components/MentionSuggestions.tsx b/src/components/MentionSuggestions.tsx
index 142813355118..524029fbc536 100644
--- a/src/components/MentionSuggestions.tsx
+++ b/src/components/MentionSuggestions.tsx
@@ -88,7 +88,7 @@ function MentionSuggestions({
return (
- {item.icons && !!item.icons.length && (
+ {!!item.icons && !!item.icons.length && (
}
disabledStyle={shouldUseDefaultCursorWhenDisabled && [styles.cursorDefault]}
@@ -639,7 +643,7 @@ function MenuItem(
]}
/>
)}
- {icon && !Array.isArray(icon) && (
+ {!!icon && !Array.isArray(icon) && (
))}
- {icon && iconType === CONST.ICON_TYPE_WORKSPACE && (
+ {!!icon && iconType === CONST.ICON_TYPE_WORKSPACE && (
)}
- {secondaryIcon && (
+ {!!secondaryIcon && (
)}
- {shouldShowTitleIcon && titleIcon && (
+ {!!shouldShowTitleIcon && !!titleIcon && (
- {badgeText && (
+ {!!badgeText && (
)}
{/* Since subtitle can be of type number, we should allow 0 to be shown */}
- {(subtitle === 0 || subtitle) && (
+ {(subtitle === 0 || !!subtitle) && (
{subtitle}
)}
- {floatRightAvatars?.length > 0 && firstIcon && (
+ {floatRightAvatars?.length > 0 && !!firstIcon && (
{shouldShowSubscriptRightAvatar ? (
{}, type, onModalShow = (
const showModal = () => {
const statusBarColor = StatusBar.getBackgroundColor() ?? theme.appBG;
- const isFullScreenModal = type === CONST.MODAL.MODAL_TYPE.CENTERED || type === CONST.MODAL.MODAL_TYPE.CENTERED_UNSWIPEABLE || type === CONST.MODAL.MODAL_TYPE.RIGHT_DOCKED;
+ const isFullScreenModal =
+ type === CONST.MODAL.MODAL_TYPE.CENTERED ||
+ type === CONST.MODAL.MODAL_TYPE.CENTERED_UNSWIPEABLE ||
+ type === CONST.MODAL.MODAL_TYPE.RIGHT_DOCKED ||
+ CONST.MODAL.MODAL_TYPE.CENTERED_SWIPABLE_TO_RIGHT;
if (statusBarColor) {
setPreviousStatusBarColor(statusBarColor);
diff --git a/src/components/MoneyReportHeader.tsx b/src/components/MoneyReportHeader.tsx
index 680a38843f24..8bf07e2d3a02 100644
--- a/src/components/MoneyReportHeader.tsx
+++ b/src/components/MoneyReportHeader.tsx
@@ -134,7 +134,7 @@ function MoneyReportHeader({policy, report: moneyRequestReport, transactionThrea
const shouldShowPayButton = canIOUBePaid || onlyShowPayElsewhere;
- const shouldShowApproveButton = useMemo(() => IOU.canApproveIOU(moneyRequestReport, policy), [moneyRequestReport, policy]);
+ const shouldShowApproveButton = useMemo(() => IOU.canApproveIOU(moneyRequestReport, policy) && !hasOnlyPendingTransactions, [moneyRequestReport, policy, hasOnlyPendingTransactions]);
const shouldDisableApproveButton = shouldShowApproveButton && !ReportUtils.isAllowedToApproveExpenseReport(moneyRequestReport);
@@ -177,7 +177,7 @@ function MoneyReportHeader({policy, report: moneyRequestReport, transactionThrea
const [isNoDelegateAccessMenuVisible, setIsNoDelegateAccessMenuVisible] = useState(false);
const isReportInRHP = isReportOpenInRHP(navigationRef?.getRootState());
- const shouldDisplaySearchRouter = !isReportInRHP;
+ const shouldDisplaySearchRouter = !isReportInRHP || isSmallScreenWidth;
const confirmPayment = useCallback(
(type?: PaymentMethodType | undefined, payAsBusiness?: boolean) => {
@@ -379,7 +379,7 @@ function MoneyReportHeader({policy, report: moneyRequestReport, transactionThrea
/>
)}
- {shouldShowExportIntegrationButton && !shouldUseNarrowLayout && (
+ {!!shouldShowExportIntegrationButton && !shouldUseNarrowLayout && (
)}
- {isMoreContentShown && (
+ {!!isMoreContentShown && (
{isDuplicate && shouldUseNarrowLayout && (
@@ -443,7 +443,7 @@ function MoneyReportHeader({policy, report: moneyRequestReport, transactionThrea
isLoading={!isOffline && !canAllowSettlement}
/>
)}
- {shouldShowExportIntegrationButton && shouldUseNarrowLayout && (
+ {!!shouldShowExportIntegrationButton && shouldUseNarrowLayout && (
{shouldShowNextStep && }
- {statusBarProps && (
+ {!!statusBarProps && (
(null);
+ const amountRef = useRef(undefined);
+
const decimals = CurrencyUtils.getCurrencyDecimals(currency);
const selectedAmountAsString = amount ? onFormatAmount(amount, currency) : '';
@@ -172,8 +174,9 @@ function MoneyRequestAmountInput(
willSelectionBeUpdatedManually.current = true;
let hasSelectionBeenSet = false;
+ const strippedAmount = MoneyRequestUtils.stripCommaFromAmount(finalAmount);
+ amountRef.current = strippedAmount;
setCurrentAmount((prevAmount) => {
- const strippedAmount = MoneyRequestUtils.stripCommaFromAmount(finalAmount);
const isForwardDelete = prevAmount.length > strippedAmount.length && forwardDeletePressedRef.current;
if (!hasSelectionBeenSet) {
hasSelectionBeenSet = true;
@@ -304,7 +307,7 @@ function MoneyRequestAmountInput(
}}
selectedCurrencyCode={currency}
selection={selection}
- onSelectionChange={(e: NativeSyntheticEvent) => {
+ onSelectionChange={(selectionStart, selectionEnd) => {
if (shouldIgnoreSelectionWhenUpdatedManually && willSelectionBeUpdatedManually.current) {
willSelectionBeUpdatedManually.current = false;
return;
@@ -312,9 +315,12 @@ function MoneyRequestAmountInput(
if (!shouldUpdateSelection) {
return;
}
- const maxSelection = formattedAmount.length;
- const start = Math.min(e.nativeEvent.selection.start, maxSelection);
- const end = Math.min(e.nativeEvent.selection.end, maxSelection);
+
+ // When the amount is updated in setNewAmount on iOS, in onSelectionChange formattedAmount stores the value before the update. Using amountRef allows us to read the updated value
+ const maxSelection = amountRef.current?.length ?? formattedAmount.length;
+ amountRef.current = undefined;
+ const start = Math.min(selectionStart, maxSelection);
+ const end = Math.min(selectionEnd, maxSelection);
setSelection({start, end});
}}
onKeyPress={textInputKeyPress}
diff --git a/src/components/MoneyRequestConfirmationList.tsx b/src/components/MoneyRequestConfirmationList.tsx
index 0eccd9834baf..3d8f2a6bed33 100755
--- a/src/components/MoneyRequestConfirmationList.tsx
+++ b/src/components/MoneyRequestConfirmationList.tsx
@@ -2,19 +2,17 @@ import {useFocusEffect, useIsFocused} from '@react-navigation/native';
import lodashIsEqual from 'lodash/isEqual';
import React, {memo, useCallback, useEffect, useMemo, useRef, useState} from 'react';
import {InteractionManager, View} from 'react-native';
-import {withOnyx} from 'react-native-onyx';
import type {OnyxEntry} from 'react-native-onyx';
+import {useOnyx} from 'react-native-onyx';
import useCurrentUserPersonalDetails from '@hooks/useCurrentUserPersonalDetails';
import useDebouncedState from '@hooks/useDebouncedState';
import useLocalize from '@hooks/useLocalize';
import {MouseProvider} from '@hooks/useMouseContext';
-import usePermissions from '@hooks/usePermissions';
import usePrevious from '@hooks/usePrevious';
import useThemeStyles from '@hooks/useThemeStyles';
import blurActiveElement from '@libs/Accessibility/blurActiveElement';
import * as CurrencyUtils from '@libs/CurrencyUtils';
import DistanceRequestUtils from '@libs/DistanceRequestUtils';
-import type {MileageRate} from '@libs/DistanceRequestUtils';
import * as IOUUtils from '@libs/IOUUtils';
import Log from '@libs/Log';
import * as MoneyRequestUtils from '@libs/MoneyRequestUtils';
@@ -49,33 +47,7 @@ import UserListItem from './SelectionList/UserListItem';
import SettlementButton from './SettlementButton';
import Text from './Text';
-type MoneyRequestConfirmationListOnyxProps = {
- /** Collection of categories attached to a policy */
- policyCategories: OnyxEntry;
-
- /** Collection of draft categories attached to a policy */
- policyCategoriesDraft: OnyxEntry;
-
- /** Collection of tags attached to a policy */
- policyTags: OnyxEntry;
-
- /** The policy of the report */
- policy: OnyxEntry;
-
- /** The draft policy of the report */
- policyDraft: OnyxEntry;
-
- /** Mileage rate default for the policy */
- defaultMileageRate: OnyxEntry;
-
- /** Last selected distance rates */
- lastSelectedDistanceRates: OnyxEntry>;
-
- /** List of currencies */
- currencyList: OnyxEntry;
-};
-
-type MoneyRequestConfirmationListProps = MoneyRequestConfirmationListOnyxProps & {
+type MoneyRequestConfirmationListProps = {
/** Callback to inform parent modal of success */
onConfirm?: (selectedParticipants: Participant[]) => void;
@@ -178,23 +150,18 @@ function MoneyRequestConfirmationList({
onConfirm,
iouType = CONST.IOU.TYPE.SUBMIT,
iouAmount,
- policyCategories: policyCategoriesReal,
- policyCategoriesDraft,
isDistanceRequest = false,
- policy: policyReal,
- policyDraft,
isPolicyExpenseChat = false,
iouCategory = '',
shouldShowSmartScanFields = true,
isEditingSplitBill,
- policyTags,
iouCurrencyCode,
iouMerchant,
selectedParticipants: selectedParticipantsProp,
payeePersonalDetails: payeePersonalDetailsProp,
isReadOnly = false,
bankAccountRoute = '',
- policyID = '',
+ policyID,
reportID = '',
receiptPath = '',
iouAttendees,
@@ -205,21 +172,28 @@ function MoneyRequestConfirmationList({
onToggleBillable,
hasSmartScanFailed,
reportActionID,
- defaultMileageRate,
- lastSelectedDistanceRates,
action = CONST.IOU.ACTION.CREATE,
- currencyList,
shouldDisplayReceipt = false,
shouldPlaySound = true,
isConfirmed,
}: MoneyRequestConfirmationListProps) {
+ const [policyCategoriesReal] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY_CATEGORIES}${policyID ?? '-1'}`);
+ const [policyTags] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY_TAGS}${policyID ?? '-1'}`);
+ const [policyReal] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY}${policyID ?? '-1'}`);
+ const [policyDraft] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY_DRAFTS}${policyID ?? '-1'}`);
+ const [defaultMileageRate] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY_DRAFTS}${policyID ?? '-1'}`, {
+ selector: (selectedPolicy) => DistanceRequestUtils.getDefaultMileageRate(selectedPolicy),
+ });
+ const [policyCategoriesDraft] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY_CATEGORIES_DRAFT}${policyID ?? '-1'}`);
+ const [lastSelectedDistanceRates] = useOnyx(ONYXKEYS.NVP_LAST_SELECTED_DISTANCE_RATES);
+ const [currencyList] = useOnyx(ONYXKEYS.CURRENCY_LIST);
+
const policy = policyReal ?? policyDraft;
const policyCategories = policyCategoriesReal ?? policyCategoriesDraft;
const styles = useThemeStyles();
const {translate, toLocaleDigit} = useLocalize();
const currentUserPersonalDetails = useCurrentUserPersonalDetails();
- const {canUseP2PDistanceRequests} = usePermissions(iouType);
const isTypeRequest = iouType === CONST.IOU.TYPE.SUBMIT;
const isTypeSplit = iouType === CONST.IOU.TYPE.SPLIT;
@@ -238,9 +212,9 @@ function MoneyRequestConfirmationList({
const defaultRate = defaultMileageRate?.customUnitRateID ?? '';
const lastSelectedRate = lastSelectedDistanceRates?.[policy?.id ?? ''] ?? defaultRate;
- const rateID = canUseP2PDistanceRequests ? lastSelectedRate : defaultRate;
+ const rateID = lastSelectedRate;
IOU.setCustomUnitRateID(transactionID, rateID);
- }, [defaultMileageRate, customUnitRateID, lastSelectedDistanceRates, policy?.id, canUseP2PDistanceRequests, transactionID, isDistanceRequest]);
+ }, [defaultMileageRate, customUnitRateID, lastSelectedDistanceRates, policy?.id, transactionID, isDistanceRequest]);
const mileageRate = DistanceRequestUtils.getRate({transaction, policy, policyDraft});
const rate = mileageRate.rate;
@@ -329,6 +303,8 @@ function MoneyRequestConfirmationList({
return false;
};
+ const routeError = Object.values(transaction?.errorFields?.route ?? {}).at(0);
+
useEffect(() => {
if (shouldDisplayFieldError && didConfirmSplit) {
setFormError('iou.error.genericSmartscanFailureMessage');
@@ -597,7 +573,7 @@ function MoneyRequestConfirmationList({
() => (
{translate('iou.participants')}
- {!shouldShowReadOnlySplits && isSplitModified && (
+ {!shouldShowReadOnlySplits && !!isSplitModified && (
{
IOU.resetSplitShares(transaction);
@@ -743,6 +719,9 @@ function MoneyRequestConfirmationList({
*/
const confirm = useCallback(
(paymentMethod: PaymentMethodType | undefined) => {
+ if (routeError) {
+ return;
+ }
if (iouType === CONST.IOU.TYPE.INVOICE && !hasInvoicingDetails(policy)) {
Navigation.navigate(ROUTES.MONEY_REQUEST_STEP_COMPANY_INFO.getRoute(iouType, transactionID, reportID, Navigation.getActiveRouteWithoutParams()));
return;
@@ -815,6 +794,7 @@ function MoneyRequestConfirmationList({
transactionID,
reportID,
policy,
+ routeError,
],
);
@@ -830,6 +810,16 @@ function MoneyRequestConfirmationList({
}, []),
);
+ const errorMessage = useMemo(() => {
+ if (routeError) {
+ return routeError;
+ }
+ if (isTypeSplit && !shouldShowReadOnlySplits) {
+ return debouncedFormError && translate(debouncedFormError);
+ }
+ return formError && translate(formError);
+ }, [routeError, isTypeSplit, shouldShowReadOnlySplits, debouncedFormError, formError, translate]);
+
const footerContent = useMemo(() => {
if (isReadOnly) {
return;
@@ -872,38 +862,22 @@ function MoneyRequestConfirmationList({
return (
<>
- {!!formError && (
+ {!!errorMessage && (
)}
{button}
);
- }, [
- isReadOnly,
- isTypeSplit,
- iouType,
- confirm,
- bankAccountRoute,
- iouCurrencyCode,
- policyID,
- splitOrRequestOptions,
- formError,
- styles.ph1,
- styles.mb2,
- shouldShowReadOnlySplits,
- debouncedFormError,
- translate,
- ]);
+ }, [isReadOnly, iouType, confirm, bankAccountRoute, iouCurrencyCode, policyID, splitOrRequestOptions, styles.ph1, styles.mb2, errorMessage]);
const listFooterContent = (
({
- policyCategories: {
- key: ({policyID}) => `${ONYXKEYS.COLLECTION.POLICY_CATEGORIES}${policyID}`,
- },
- policyCategoriesDraft: {
- key: ({policyID}) => `${ONYXKEYS.COLLECTION.POLICY_CATEGORIES_DRAFT}${policyID}`,
- },
- policyTags: {
- key: ({policyID}) => `${ONYXKEYS.COLLECTION.POLICY_TAGS}${policyID}`,
- },
- defaultMileageRate: {
- key: ({policyID}) => `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
- selector: DistanceRequestUtils.getDefaultMileageRate,
- },
- policy: {
- key: ({policyID}) => `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
- },
- policyDraft: {
- key: ({policyID}) => `${ONYXKEYS.COLLECTION.POLICY_DRAFTS}${policyID}`,
- },
- lastSelectedDistanceRates: {
- key: ONYXKEYS.NVP_LAST_SELECTED_DISTANCE_RATES,
- },
- currencyList: {
- key: ONYXKEYS.CURRENCY_LIST,
- },
-})(
- memo(
- MoneyRequestConfirmationList,
- (prevProps, nextProps) =>
- lodashIsEqual(prevProps.transaction, nextProps.transaction) &&
- prevProps.onSendMoney === nextProps.onSendMoney &&
- prevProps.onConfirm === nextProps.onConfirm &&
- prevProps.iouType === nextProps.iouType &&
- prevProps.iouAmount === nextProps.iouAmount &&
- prevProps.isDistanceRequest === nextProps.isDistanceRequest &&
- prevProps.isPolicyExpenseChat === nextProps.isPolicyExpenseChat &&
- prevProps.iouCategory === nextProps.iouCategory &&
- prevProps.shouldShowSmartScanFields === nextProps.shouldShowSmartScanFields &&
- prevProps.isEditingSplitBill === nextProps.isEditingSplitBill &&
- prevProps.iouCurrencyCode === nextProps.iouCurrencyCode &&
- prevProps.iouMerchant === nextProps.iouMerchant &&
- lodashIsEqual(prevProps.selectedParticipants, nextProps.selectedParticipants) &&
- lodashIsEqual(prevProps.payeePersonalDetails, nextProps.payeePersonalDetails) &&
- prevProps.isReadOnly === nextProps.isReadOnly &&
- prevProps.bankAccountRoute === nextProps.bankAccountRoute &&
- prevProps.policyID === nextProps.policyID &&
- prevProps.reportID === nextProps.reportID &&
- prevProps.receiptPath === nextProps.receiptPath &&
- prevProps.iouAttendees === nextProps.iouAttendees &&
- prevProps.iouComment === nextProps.iouComment &&
- prevProps.receiptFilename === nextProps.receiptFilename &&
- prevProps.iouCreated === nextProps.iouCreated &&
- prevProps.iouIsBillable === nextProps.iouIsBillable &&
- prevProps.onToggleBillable === nextProps.onToggleBillable &&
- prevProps.hasSmartScanFailed === nextProps.hasSmartScanFailed &&
- prevProps.reportActionID === nextProps.reportActionID &&
- lodashIsEqual(prevProps.defaultMileageRate, nextProps.defaultMileageRate) &&
- lodashIsEqual(prevProps.lastSelectedDistanceRates, nextProps.lastSelectedDistanceRates) &&
- lodashIsEqual(prevProps.action, nextProps.action) &&
- lodashIsEqual(prevProps.currencyList, nextProps.currencyList) &&
- prevProps.shouldDisplayReceipt === nextProps.shouldDisplayReceipt,
- ),
+export default memo(
+ MoneyRequestConfirmationList,
+ (prevProps, nextProps) =>
+ lodashIsEqual(prevProps.transaction, nextProps.transaction) &&
+ prevProps.onSendMoney === nextProps.onSendMoney &&
+ prevProps.onConfirm === nextProps.onConfirm &&
+ prevProps.iouType === nextProps.iouType &&
+ prevProps.iouAmount === nextProps.iouAmount &&
+ prevProps.isDistanceRequest === nextProps.isDistanceRequest &&
+ prevProps.isPolicyExpenseChat === nextProps.isPolicyExpenseChat &&
+ prevProps.iouCategory === nextProps.iouCategory &&
+ prevProps.shouldShowSmartScanFields === nextProps.shouldShowSmartScanFields &&
+ prevProps.isEditingSplitBill === nextProps.isEditingSplitBill &&
+ prevProps.iouCurrencyCode === nextProps.iouCurrencyCode &&
+ prevProps.iouMerchant === nextProps.iouMerchant &&
+ lodashIsEqual(prevProps.selectedParticipants, nextProps.selectedParticipants) &&
+ lodashIsEqual(prevProps.payeePersonalDetails, nextProps.payeePersonalDetails) &&
+ prevProps.isReadOnly === nextProps.isReadOnly &&
+ prevProps.bankAccountRoute === nextProps.bankAccountRoute &&
+ prevProps.policyID === nextProps.policyID &&
+ prevProps.reportID === nextProps.reportID &&
+ prevProps.receiptPath === nextProps.receiptPath &&
+ prevProps.iouAttendees === nextProps.iouAttendees &&
+ prevProps.iouComment === nextProps.iouComment &&
+ prevProps.receiptFilename === nextProps.receiptFilename &&
+ prevProps.iouCreated === nextProps.iouCreated &&
+ prevProps.iouIsBillable === nextProps.iouIsBillable &&
+ prevProps.onToggleBillable === nextProps.onToggleBillable &&
+ prevProps.hasSmartScanFailed === nextProps.hasSmartScanFailed &&
+ prevProps.reportActionID === nextProps.reportActionID &&
+ lodashIsEqual(prevProps.action, nextProps.action) &&
+ prevProps.shouldDisplayReceipt === nextProps.shouldDisplayReceipt,
);
diff --git a/src/components/MoneyRequestConfirmationListFooter.tsx b/src/components/MoneyRequestConfirmationListFooter.tsx
index dcfe72369651..fe04fea81e71 100644
--- a/src/components/MoneyRequestConfirmationListFooter.tsx
+++ b/src/components/MoneyRequestConfirmationListFooter.tsx
@@ -42,9 +42,6 @@ type MoneyRequestConfirmationListFooterProps = {
/** The action to perform */
action: IOUAction;
- /** Flag indicating if P2P distance requests can be used */
- canUseP2PDistanceRequests: boolean | undefined;
-
/** The currency of the transaction */
currency: string;
@@ -105,9 +102,6 @@ type MoneyRequestConfirmationListFooterProps = {
/** Flag indicating if the merchant is required */
isMerchantRequired: boolean | undefined;
- /** Flag indicating if the transaction is moved from track expense */
- isMovingTransactionFromTrackExpense: boolean;
-
/** Flag indicating if it is a policy expense chat */
isPolicyExpenseChat: boolean;
@@ -177,7 +171,6 @@ type MoneyRequestConfirmationListFooterProps = {
function MoneyRequestConfirmationListFooter({
action,
- canUseP2PDistanceRequests,
currency,
didConfirm,
distance,
@@ -198,7 +191,6 @@ function MoneyRequestConfirmationListFooter({
isEditingSplitBill,
isMerchantEmpty,
isMerchantRequired,
- isMovingTransactionFromTrackExpense,
isPolicyExpenseChat,
isReadOnly,
isTypeInvoice,
@@ -349,24 +341,6 @@ function MoneyRequestConfirmationListFooter({
shouldShow: true,
isSupplementary: false,
},
- {
- item: (
- Navigation.navigate(ROUTES.MONEY_REQUEST_STEP_DISTANCE.getRoute(action, iouType, transactionID, reportID, Navigation.getActiveRouteWithoutParams()))}
- disabled={didConfirm}
- // todo: handle edit for transaction while moving from track expense
- interactive={!isReadOnly && !isMovingTransactionFromTrackExpense}
- />
- ),
- shouldShow: isDistanceRequest && !canUseP2PDistanceRequests,
- isSupplementary: false,
- },
{
item: (
),
- shouldShow: isDistanceRequest && canUseP2PDistanceRequests,
+ shouldShow: isDistanceRequest,
isSupplementary: false,
},
{
@@ -398,7 +372,7 @@ function MoneyRequestConfirmationListFooter({
interactive={!!rate && !isReadOnly && isPolicyExpenseChat}
/>
),
- shouldShow: isDistanceRequest && canUseP2PDistanceRequests,
+ shouldShow: isDistanceRequest,
isSupplementary: false,
},
{
@@ -692,7 +666,6 @@ export default memo(
MoneyRequestConfirmationListFooter,
(prevProps, nextProps) =>
lodashIsEqual(prevProps.action, nextProps.action) &&
- prevProps.canUseP2PDistanceRequests === nextProps.canUseP2PDistanceRequests &&
prevProps.currency === nextProps.currency &&
prevProps.didConfirm === nextProps.didConfirm &&
prevProps.distance === nextProps.distance &&
@@ -711,7 +684,6 @@ export default memo(
prevProps.isEditingSplitBill === nextProps.isEditingSplitBill &&
prevProps.isMerchantEmpty === nextProps.isMerchantEmpty &&
prevProps.isMerchantRequired === nextProps.isMerchantRequired &&
- prevProps.isMovingTransactionFromTrackExpense === nextProps.isMovingTransactionFromTrackExpense &&
prevProps.isPolicyExpenseChat === nextProps.isPolicyExpenseChat &&
prevProps.isReadOnly === nextProps.isReadOnly &&
prevProps.isTypeInvoice === nextProps.isTypeInvoice &&
diff --git a/src/components/MoneyRequestHeader.tsx b/src/components/MoneyRequestHeader.tsx
index 377062d432ad..93ac363cff62 100644
--- a/src/components/MoneyRequestHeader.tsx
+++ b/src/components/MoneyRequestHeader.tsx
@@ -66,7 +66,7 @@ function MoneyRequestHeader({report, parentReportAction, policy, onBackButtonPre
const reportID = report?.reportID;
const isReportInRHP = isReportOpenInRHP(navigationRef?.getRootState());
- const shouldDisplaySearchRouter = !isReportInRHP;
+ const shouldDisplaySearchRouter = !isReportInRHP || isSmallScreenWidth;
const hasAllPendingRTERViolations = TransactionUtils.allHavePendingRTERViolation([transaction?.transactionID ?? '-1']);
@@ -204,7 +204,7 @@ function MoneyRequestHeader({report, parentReportAction, policy, onBackButtonPre
/>
)}
- {statusBarProps && (
+ {!!statusBarProps && (
void;
/** Flag to check if the options are initialized */
areOptionsInitialized: boolean;
+ /** Function to reset the options */
+ resetOptions: () => void;
};
-type OptionsListProviderOnyxProps = {
- /** Collection of reports */
- reports: OnyxCollection;
-};
-
-type OptionsListProviderProps = OptionsListProviderOnyxProps & {
+type OptionsListProviderProps = {
/** Actual content wrapped by this component */
children: React.ReactNode;
};
@@ -36,6 +32,7 @@ const OptionsListContext = createContext({
},
initializeOptions: () => {},
areOptionsInitialized: false,
+ resetOptions: () => {},
});
const isEqualPersonalDetail = (prevPersonalDetail: PersonalDetails | null, personalDetail: PersonalDetails | null) =>
@@ -44,12 +41,13 @@ const isEqualPersonalDetail = (prevPersonalDetail: PersonalDetails | null, perso
prevPersonalDetail?.login === personalDetail?.login &&
prevPersonalDetail?.displayName === personalDetail?.displayName;
-function OptionsListContextProvider({reports, children}: OptionsListProviderProps) {
+function OptionsListContextProvider({children}: OptionsListProviderProps) {
const areOptionsInitialized = useRef(false);
const [options, setOptions] = useState({
reports: [],
personalDetails: [],
});
+ const [reports] = useOnyx(ONYXKEYS.COLLECTION.REPORT);
const personalDetails = usePersonalDetails() || CONST.EMPTY_OBJECT;
const prevPersonalDetails = usePrevious(personalDetails);
@@ -144,9 +142,22 @@ function OptionsListContextProvider({reports, children}: OptionsListProviderProp
areOptionsInitialized.current = true;
}, [loadOptions]);
+ const resetOptions = useCallback(() => {
+ if (!areOptionsInitialized.current) {
+ return;
+ }
+
+ areOptionsInitialized.current = false;
+ setOptions({
+ reports: [],
+ personalDetails: [],
+ });
+ }, []);
+
return (
- // eslint-disable-next-line react-compiler/react-compiler
- ({options, initializeOptions, areOptionsInitialized: areOptionsInitialized.current}), [options, initializeOptions])}>
+ ({options, initializeOptions, areOptionsInitialized: areOptionsInitialized.current, resetOptions}), [options, initializeOptions, resetOptions])}
+ >
{children}
);
@@ -157,7 +168,7 @@ const useOptionsListContext = () => useContext(OptionsListContext);
// Hook to use the OptionsListContext with an initializer to load the options
const useOptionsList = (options?: {shouldInitialize: boolean}) => {
const {shouldInitialize = true} = options ?? {};
- const {initializeOptions, options: optionsList, areOptionsInitialized} = useOptionsListContext();
+ const {initializeOptions, options: optionsList, areOptionsInitialized, resetOptions} = useOptionsListContext();
useEffect(() => {
if (!shouldInitialize || areOptionsInitialized) {
@@ -171,13 +182,10 @@ const useOptionsList = (options?: {shouldInitialize: boolean}) => {
initializeOptions,
options: optionsList,
areOptionsInitialized,
+ resetOptions,
};
};
-export default withOnyx({
- reports: {
- key: ONYXKEYS.COLLECTION.REPORT,
- },
-})(OptionsListContextProvider);
+export default OptionsListContextProvider;
export {useOptionsListContext, useOptionsList, OptionsListContext};
diff --git a/src/components/OptionsList/BaseOptionsList.tsx b/src/components/OptionsList/BaseOptionsList.tsx
index 31f7f9d1d552..1e2f2f5c515a 100644
--- a/src/components/OptionsList/BaseOptionsList.tsx
+++ b/src/components/OptionsList/BaseOptionsList.tsx
@@ -219,7 +219,7 @@ function BaseOptionsList(
// So be aware that if you adjust the content of the section header (for example, change the font size), you may need to adjust this explicit height as well.
{title}
- {shouldShowActionButton && (
+ {!!shouldShowActionButton && (
(
hasError && styles.borderColorDanger,
]}
>
- {label && {label}}
+ {!!label && {label}}
& {
shouldUpdateFocusedIndex?: boolean;
};
+const renderWithConditionalWrapper = (shouldUseScrollView: boolean, contentContainerStyle: StyleProp, children: ReactNode): React.JSX.Element => {
+ if (shouldUseScrollView) {
+ return {children};
+ }
+ // eslint-disable-next-line react/jsx-no-useless-fragment
+ return <>{children};
+};
+
function PopoverMenu({
menuItems,
onItemSelected,
@@ -160,6 +169,7 @@ function PopoverMenu({
}: PopoverMenuProps) {
const styles = useThemeStyles();
const theme = useTheme();
+ const StyleUtils = useStyleUtils();
// We need to use isSmallScreenWidth instead of shouldUseNarrowLayout to apply correct popover styles
// eslint-disable-next-line rulesdir/prefer-shouldUseNarrowLayout-instead-of-isSmallScreenWidth
const {isSmallScreenWidth} = useResponsiveLayout();
@@ -169,7 +179,6 @@ function PopoverMenu({
const {windowHeight} = useWindowDimensions();
const [focusedIndex, setFocusedIndex] = useArrowKeyFocusManager({initialFocusedIndex: currentMenuItemsFocusedIndex, maxIndex: currentMenuItems.length - 1, isActive: isVisible});
- const WrapComponent = shouldUseScrollView ? ScrollView : Fragment;
const selectItem = (index: number) => {
const selectedItem = currentMenuItems.at(index);
@@ -233,6 +242,44 @@ function PopoverMenu({
);
};
+ const renderedMenuItems = currentMenuItems.map((item, menuIndex) => {
+ const {text, onSelected, subMenuItems, shouldCallAfterModalHide, ...menuItemProps} = item;
+ return (
+
+ selectItem(menuIndex)}
+ focused={focusedIndex === menuIndex}
+ shouldShowSelectedItemCheck={shouldShowSelectedItemCheck}
+ shouldCheckActionAllowedOnPress={false}
+ onFocus={() => {
+ if (!shouldUpdateFocusedIndex) {
+ return;
+ }
+ setFocusedIndex(menuIndex);
+ }}
+ wrapperStyle={StyleUtils.getItemBackgroundColorStyle(
+ !!item.isSelected,
+ focusedIndex === menuIndex,
+ item.disabled ?? false,
+ theme.activeComponentBG,
+ theme.hoverComponentBG,
+ )}
+ shouldRemoveHoverBackground={item.isSelected}
+ titleStyle={StyleSheet.flatten([styles.flex1, item.titleStyle])}
+ // Spread other props dynamically
+ {...menuItemProps}
+ />
+
+ );
+ });
+
const renderHeaderText = () => {
if (!headerText || enteredSubMenuIndexes.length !== 0) {
return;
@@ -296,39 +343,7 @@ function PopoverMenu({
{renderHeaderText()}
{enteredSubMenuIndexes.length > 0 && renderBackButtonItem()}
- {/** eslint-disable-next-line react/jsx-props-no-spreading */}
-
- {currentMenuItems.map((item, menuIndex) => {
- const {text, onSelected, subMenuItems, shouldCallAfterModalHide, ...menuItemProps} = item;
- return (
-
- selectItem(menuIndex)}
- focused={focusedIndex === menuIndex}
- shouldShowSelectedItemCheck={shouldShowSelectedItemCheck}
- shouldCheckActionAllowedOnPress={false}
- onFocus={() => {
- if (!shouldUpdateFocusedIndex) {
- return;
- }
- setFocusedIndex(menuIndex);
- }}
- style={{backgroundColor: item.isSelected ? theme.activeComponentBG : undefined}}
- titleStyle={StyleSheet.flatten([styles.flex1, item.titleStyle])}
- // eslint-disable-next-line react/jsx-props-no-spreading
- {...menuItemProps}
- />
-
- );
- })}
-
+ {renderWithConditionalWrapper(shouldUseScrollView, scrollContainerStyle, renderedMenuItems)}
diff --git a/src/components/Pressable/PressableWithDelayToggle.tsx b/src/components/Pressable/PressableWithDelayToggle.tsx
index 617811637525..68007c1c03ad 100644
--- a/src/components/Pressable/PressableWithDelayToggle.tsx
+++ b/src/components/Pressable/PressableWithDelayToggle.tsx
@@ -121,7 +121,7 @@ function PressableWithDelayToggle(
{({hovered, pressed}) => (
<>
{!inline && labelText}
- {icon && (
+ {!!icon && (
({
- value: key,
- text: value,
- keyForList: key,
- isSelected: key === selectedOption,
- }));
- const [searchbarInputText, setSearchbarInputText] = useState('');
- const [optionListItems, setOptionListItems] = useState(allOptions);
-
- useEffect(() => {
- setOptionListItems((prevOptionListItems) =>
- prevOptionListItems.map((option) => ({
- ...option,
- isSelected: option.value === selectedOption,
+ const [searchValue, debouncedSearchValue, setSearchValue] = useDebouncedState('');
+
+ const options = useMemo(
+ () =>
+ Object.entries(optionsList).map(([key, value]) => ({
+ value: key,
+ text: value,
+ keyForList: key,
+ isSelected: key === selectedOption,
+ searchValue: StringUtils.sanitizeString(value),
})),
- );
- }, [selectedOption]);
-
- const filterShownOptions = (searchText: string) => {
- setSearchbarInputText(searchText);
- const searchWords = searchText.toLowerCase().match(/[a-z0-9]+/g) ?? [];
- setOptionListItems(
- allOptions.filter((option) =>
- searchWords.every((word) =>
- option.text
- .toLowerCase()
- .replace(/[^a-z0-9]/g, ' ')
- .includes(word),
- ),
- ),
- );
- };
+ [optionsList, selectedOption],
+ );
const handleSelectRow = (option: ListItemType) => {
onOptionChange(option.value);
onClose();
};
+ const searchResults = searchOptions(debouncedSearchValue, options);
+ const headerMessage = debouncedSearchValue.trim() && !searchResults.length ? translate('common.noResultsFound') : '';
+
return (
option.value === selectedOption)?.keyForList}
+ sections={[{data: searchResults}]}
+ initiallyFocusedOptionKey={selectedOption}
showScrollIndicator
shouldShowTooltips={false}
ListItem={RadioListItem}
diff --git a/src/components/PushRowWithModal/index.tsx b/src/components/PushRowWithModal/index.tsx
index 11c7ff4386d4..83128899b50f 100644
--- a/src/components/PushRowWithModal/index.tsx
+++ b/src/components/PushRowWithModal/index.tsx
@@ -8,11 +8,11 @@ type PushRowWithModalProps = {
/** The list of options that we want to display where key is option code and value is option name */
optionsList: Record;
- /** The currently selected option */
- selectedOption: string;
+ /** Current value of the selected item */
+ value?: string;
- /** Function to call when the user selects an option */
- onOptionChange: (value: string) => void;
+ /** Function called whenever list item is selected */
+ onInputChange?: (value: string, key?: string) => void;
/** Additional styles to apply to container */
wrapperStyles?: StyleProp;
@@ -31,11 +31,13 @@ type PushRowWithModalProps = {
/** Text to display on error message */
errorText?: string;
+
+ /** The ID of the input that should be reset when the value changes */
+ stateInputIDToReset?: string;
};
function PushRowWithModal({
- selectedOption,
- onOptionChange,
+ value,
optionsList,
wrapperStyles,
description,
@@ -43,6 +45,8 @@ function PushRowWithModal({
searchInputTitle,
shouldAllowChange = true,
errorText,
+ onInputChange = () => {},
+ stateInputIDToReset,
}: PushRowWithModalProps) {
const [isModalVisible, setIsModalVisible] = useState(false);
@@ -54,15 +58,19 @@ function PushRowWithModal({
setIsModalVisible(true);
};
- const handleOptionChange = (value: string) => {
- onOptionChange(value);
+ const handleOptionChange = (optionValue: string) => {
+ onInputChange(optionValue);
+
+ if (stateInputIDToReset) {
+ onInputChange('', stateInputIDToReset);
+ }
};
return (
<>
diff --git a/src/components/ReportActionItem/MoneyRequestPreview/MoneyRequestPreviewContent.tsx b/src/components/ReportActionItem/MoneyRequestPreview/MoneyRequestPreviewContent.tsx
index a774b5c18c55..336b7dea9654 100644
--- a/src/components/ReportActionItem/MoneyRequestPreview/MoneyRequestPreviewContent.tsx
+++ b/src/components/ReportActionItem/MoneyRequestPreview/MoneyRequestPreviewContent.tsx
@@ -294,8 +294,13 @@ function MoneyRequestPreviewContent({
const navigateToReviewFields = () => {
const backTo = route.params.backTo;
- const comparisonResult = TransactionUtils.compareDuplicateTransactionFields(reviewingTransactionID);
- Transaction.setReviewDuplicatesKey({...comparisonResult.keep, duplicates, transactionID: transaction?.transactionID ?? ''});
+
+ // Clear the draft before selecting a different expense to prevent merging fields from the previous expense
+ // (e.g., category, tag, tax) that may be not enabled/available in the new expense's policy.
+ Transaction.abandonReviewDuplicateTransactions();
+ const comparisonResult = TransactionUtils.compareDuplicateTransactionFields(reviewingTransactionID, transaction?.reportID ?? '');
+ Transaction.setReviewDuplicatesKey({...comparisonResult.keep, duplicates, transactionID: transaction?.transactionID ?? '', reportID: transaction?.reportID});
+
if ('merchant' in comparisonResult.change) {
Navigation.navigate(ROUTES.TRANSACTION_DUPLICATE_REVIEW_MERCHANT_PAGE.getRoute(route.params?.threadReportID, backTo));
} else if ('category' in comparisonResult.change) {
diff --git a/src/components/ReportActionItem/MoneyRequestView.tsx b/src/components/ReportActionItem/MoneyRequestView.tsx
index efc7dc0e198e..ee87f8f12c7d 100644
--- a/src/components/ReportActionItem/MoneyRequestView.tsx
+++ b/src/components/ReportActionItem/MoneyRequestView.tsx
@@ -15,7 +15,6 @@ import ViolationMessages from '@components/ViolationMessages';
import useCurrentUserPersonalDetails from '@hooks/useCurrentUserPersonalDetails';
import useLocalize from '@hooks/useLocalize';
import useNetwork from '@hooks/useNetwork';
-import usePermissions from '@hooks/usePermissions';
import useTheme from '@hooks/useTheme';
import useThemeStyles from '@hooks/useThemeStyles';
import useViolations from '@hooks/useViolations';
@@ -102,7 +101,6 @@ function MoneyRequestView({report, shouldShowAnimatedBackground, readonly = fals
const parentReportAction = parentReportActions?.[report?.parentReportActionID ?? '-1'];
const isTrackExpense = ReportUtils.isTrackExpenseReport(report);
- const {canUseP2PDistanceRequests} = usePermissions(isTrackExpense ? CONST.IOU.TYPE.TRACK : undefined);
const moneyRequestReport = parentReport;
const linkedTransactionID = useMemo(() => {
const originalMessage = parentReportAction && ReportActionsUtils.isMoneyRequestAction(parentReportAction) ? ReportActionsUtils.getOriginalMessage(parentReportAction) : undefined;
@@ -307,9 +305,9 @@ function MoneyRequestView({report, shouldShowAnimatedBackground, readonly = fals
[transactionAmount, isSettled, isCancelled, isPolicyExpenseChat, isEmptyMerchant, transactionDate, readonly, hasErrors, hasViolations, translate, getViolationsForField],
);
- const distanceRequestFields = canUseP2PDistanceRequests ? (
+ const distanceRequestFields = (
<>
-
+
- ) : (
-
-
- Navigation.navigate(
- ROUTES.MONEY_REQUEST_STEP_DISTANCE.getRoute(
- CONST.IOU.ACTION.EDIT,
- iouType,
- transaction?.transactionID ?? '-1',
- report?.reportID ?? '-1',
- Navigation.getReportRHPActiveRoute(),
- ),
- )
- }
- />
-
);
const isReceiptAllowed = !isPaidReport && !isInvoice;
@@ -468,7 +445,7 @@ function MoneyRequestView({report, shouldShowAnimatedBackground, readonly = fals
/>
)}
- {(hasReceipt || errors) && (
+ {(hasReceipt || !!errors) && (
)}
{!shouldShowReceiptEmptyState && !hasReceipt && }
- {shouldShowAuditMessage && }
+ {!!shouldShowAuditMessage && }
- {shouldShowCategory && (
+ {!!shouldShowCategory && (
)}
{shouldShowTag && tagList}
- {shouldShowCard && (
+ {!!shouldShowCard && (
- {shouldShowSubtitle && supportText && (
+ {shouldShowSubtitle && !!supportText && (
{supportText}
@@ -558,7 +561,7 @@ function ReportPreview({
isLoading={!isOffline && !canAllowSettlement}
/>
)}
- {shouldShowExportIntegrationButton && !shouldShowSettlementButton && (
+ {!!shouldShowExportIntegrationButton && !shouldShowSettlementButton && (
- {isHoldMenuVisible && iouReport && requestType !== undefined && (
+ {isHoldMenuVisible && !!iouReport && requestType !== undefined && (
{formatAirportInfo(reservation.end)}
- {bottomDescription && {bottomDescription}}
+ {!!bottomDescription && {bottomDescription}}
);
}
@@ -105,7 +105,7 @@ function ReservationView({reservation}: ReservationViewProps) {
>
{reservation.type === CONST.RESERVATION_TYPE.CAR ? reservation.carInfo?.name : reservation.start.longName}
- {bottomDescription && {bottomDescription}}
+ {!!bottomDescription && {bottomDescription}}
);
};
diff --git a/src/components/ScreenWrapper.tsx b/src/components/ScreenWrapper.tsx
index 4a7aab4ad299..c74ccf0470d0 100644
--- a/src/components/ScreenWrapper.tsx
+++ b/src/components/ScreenWrapper.tsx
@@ -1,9 +1,9 @@
-import {useIsFocused, useNavigation} from '@react-navigation/native';
+import {UNSTABLE_usePreventRemove, useIsFocused, useNavigation, useRoute} from '@react-navigation/native';
import type {StackNavigationProp} from '@react-navigation/stack';
import type {ForwardedRef, ReactNode} from 'react';
import React, {createContext, forwardRef, useEffect, useMemo, useRef, useState} from 'react';
import type {StyleProp, ViewStyle} from 'react-native';
-import {Keyboard, PanResponder, View} from 'react-native';
+import {Keyboard, NativeModules, PanResponder, View} from 'react-native';
import {PickerAvoidingView} from 'react-native-picker-select';
import type {EdgeInsets} from 'react-native-safe-area-context';
import useEnvironment from '@hooks/useEnvironment';
@@ -26,7 +26,6 @@ import ImportedStateIndicator from './ImportedStateIndicator';
import KeyboardAvoidingView from './KeyboardAvoidingView';
import OfflineIndicator from './OfflineIndicator';
import SafeAreaConsumer from './SafeAreaConsumer';
-import TestToolsModal from './TestToolsModal';
import withNavigationFallback from './withNavigationFallback';
type ScreenWrapperChildrenProps = {
@@ -165,6 +164,15 @@ function ScreenWrapper(
// eslint-disable-next-line react-compiler/react-compiler
isKeyboardShownRef.current = keyboardState?.isKeyboardShown ?? false;
+ const route = useRoute();
+ const shouldReturnToOldDot = useMemo(() => {
+ return !!route?.params && 'singleNewDotEntry' in route.params && route.params.singleNewDotEntry === 'true';
+ }, [route?.params]);
+
+ UNSTABLE_usePreventRemove(shouldReturnToOldDot, () => {
+ NativeModules.HybridAppModule?.closeReactNativeApp(false, false);
+ });
+
const panResponder = useRef(
PanResponder.create({
onStartShouldSetPanResponderCapture: (_e, gestureState) => gestureState.numberActiveTouches === CONST.TEST_TOOL.NUMBER_OF_TAPS,
@@ -172,7 +180,7 @@ function ScreenWrapper(
}),
).current;
- const keyboardDissmissPanResponder = useRef(
+ const keyboardDismissPanResponder = useRef(
PanResponder.create({
onMoveShouldSetPanResponderCapture: (_e, gestureState) => {
const isHorizontalSwipe = Math.abs(gestureState.dx) > Math.abs(gestureState.dy);
@@ -265,7 +273,7 @@ function ScreenWrapper(
fsClass="fs-unmask"
style={[styles.flex1, paddingStyle, style]}
// eslint-disable-next-line react/jsx-props-no-spreading
- {...keyboardDissmissPanResponder.panHandlers}
+ {...keyboardDismissPanResponder.panHandlers}
>
-
{isDevelopment && }
{
diff --git a/src/components/Search/SearchPageHeader.tsx b/src/components/Search/SearchPageHeader.tsx
index 65d86005207c..a330be3d5ff6 100644
--- a/src/components/Search/SearchPageHeader.tsx
+++ b/src/components/Search/SearchPageHeader.tsx
@@ -58,7 +58,7 @@ function HeaderWrapper({icon, children, text, value, isCannedQuery, onSubmit, se
>
{isCannedQuery ? (
- {icon && (
+ {!!icon && (
{}}
+ updateSearch={setValue}
autoFocus={false}
isFullWidth
wrapperStyle={[styles.searchRouterInputResults, styles.br2]}
@@ -341,7 +340,10 @@ function SearchPageHeader({queryJSON, hash}: SearchPageHeaderProps) {
}
const inputQueryJSON = SearchQueryUtils.buildSearchQueryJSON(inputValue);
if (inputQueryJSON) {
- const standardizedQuery = SearchQueryUtils.standardizeQueryJSON(inputQueryJSON, cardList, taxRates);
+ // Todo traverse the tree to update all the display values into id values; this is only temporary until autocomplete code from SearchRouter is implement here
+ // After https://github.com/Expensify/App/pull/51633 is merged, autocomplete functionality will be included into this component, and `getFindIDFromDisplayValue` can be removed
+ const computeNodeValueFn = SearchQueryUtils.getFindIDFromDisplayValue(cardList, taxRates);
+ const standardizedQuery = SearchQueryUtils.traverseAndUpdatedQuery(inputQueryJSON, computeNodeValueFn);
const query = SearchQueryUtils.buildSearchQueryString(standardizedQuery);
SearchActions.clearAllFilters();
Navigation.navigate(ROUTES.SEARCH_CENTRAL_PANE.getRoute({query}));
diff --git a/src/components/Search/SearchRouter/SearchRouter.tsx b/src/components/Search/SearchRouter/SearchRouter.tsx
index cc9e9c6ca024..e65b12deb64b 100644
--- a/src/components/Search/SearchRouter/SearchRouter.tsx
+++ b/src/components/Search/SearchRouter/SearchRouter.tsx
@@ -1,22 +1,33 @@
import {useNavigationState} from '@react-navigation/native';
-import debounce from 'lodash/debounce';
+import {Str} from 'expensify-common';
import React, {useCallback, useEffect, useMemo, useRef, useState} from 'react';
import {View} from 'react-native';
import {useOnyx} from 'react-native-onyx';
+import type {ValueOf} from 'type-fest';
import HeaderWithBackButton from '@components/HeaderWithBackButton';
+import {usePersonalDetails} from '@components/OnyxProvider';
import {useOptionsList} from '@components/OptionListContextProvider';
-import type {SearchQueryJSON} from '@components/Search/types';
+import type {SearchAutocompleteQueryRange, SearchQueryString} from '@components/Search/types';
import type {SelectionListHandle} from '@components/SelectionList/types';
+import useActiveWorkspace from '@hooks/useActiveWorkspace';
import useDebouncedState from '@hooks/useDebouncedState';
import useKeyboardShortcut from '@hooks/useKeyboardShortcut';
import useLocalize from '@hooks/useLocalize';
+import usePolicy from '@hooks/usePolicy';
import useResponsiveLayout from '@hooks/useResponsiveLayout';
import useThemeStyles from '@hooks/useThemeStyles';
-import FastSearch from '@libs/FastSearch';
-import Log from '@libs/Log';
+import * as CardUtils from '@libs/CardUtils';
import * as OptionsListUtils from '@libs/OptionsListUtils';
import {getAllTaxRates} from '@libs/PolicyUtils';
import type {OptionData} from '@libs/ReportUtils';
+import {
+ getAutocompleteCategories,
+ getAutocompleteRecentCategories,
+ getAutocompleteRecentTags,
+ getAutocompleteTags,
+ getAutocompleteTaxList,
+ parseForAutocomplete,
+} from '@libs/SearchAutocompleteUtils';
import * as SearchQueryUtils from '@libs/SearchQueryUtils';
import Navigation from '@navigation/Navigation';
import variables from '@styles/variables';
@@ -25,10 +36,13 @@ import Timing from '@userActions/Timing';
import CONST from '@src/CONST';
import ONYXKEYS from '@src/ONYXKEYS';
import ROUTES from '@src/ROUTES';
+import type PersonalDetails from '@src/types/onyx/PersonalDetails';
+import {getQueryWithSubstitutions} from './getQueryWithSubstitutions';
+import type {SubstitutionMap} from './getQueryWithSubstitutions';
+import {getUpdatedSubstitutionsMap} from './getUpdatedSubstitutionsMap';
import SearchRouterInput from './SearchRouterInput';
import SearchRouterList from './SearchRouterList';
-
-const SEARCH_DEBOUNCE_DELAY = 150;
+import type {AutocompleteItemData} from './SearchRouterList';
type SearchRouterProps = {
onRouterClose: () => void;
@@ -40,18 +54,17 @@ function SearchRouter({onRouterClose}: SearchRouterProps) {
const [betas] = useOnyx(ONYXKEYS.BETAS);
const [recentSearches] = useOnyx(ONYXKEYS.RECENT_SEARCHES);
const [isSearchingForReports] = useOnyx(ONYXKEYS.IS_SEARCHING_FOR_REPORTS, {initWithStoredValues: false});
+ const [autocompleteSuggestions, setAutocompleteSuggestions] = useState([]);
+ const [autocompleteSubstitutions, setAutocompleteSubstitutions] = useState({});
const {shouldUseNarrowLayout} = useResponsiveLayout();
const listRef = useRef(null);
- const taxRates = getAllTaxRates();
- const [cardList = {}] = useOnyx(ONYXKEYS.CARD_LIST);
-
const [textInputValue, debouncedInputValue, setTextInputValue] = useDebouncedState('', 500);
- const [userSearchQuery, setUserSearchQuery] = useState(undefined);
const contextualReportID = useNavigationState, string | undefined>((state) => {
return state?.routes.at(-1)?.params?.reportID;
});
+
const sortedRecentSearches = useMemo(() => {
return Object.values(recentSearches ?? {}).sort((a, b) => b.timestamp.localeCompare(a.timestamp));
}, [recentSearches]);
@@ -64,49 +77,6 @@ function SearchRouter({onRouterClose}: SearchRouterProps) {
return OptionsListUtils.getSearchOptions(options, '', betas ?? []);
}, [areOptionsInitialized, betas, options]);
- /**
- * Builds a suffix tree and returns a function to search in it.
- */
- const findInSearchTree = useMemo(() => {
- const fastSearch = FastSearch.createFastSearch([
- {
- data: searchOptions.personalDetails,
- toSearchableString: (option) => {
- const displayName = option.participantsList?.[0]?.displayName ?? '';
- return [option.login ?? '', option.login !== displayName ? displayName : ''].join();
- },
- },
- {
- data: searchOptions.recentReports,
- toSearchableString: (option) => {
- const searchStringForTree = [option.text ?? '', option.login ?? ''];
-
- if (option.isThread) {
- if (option.alternateText) {
- searchStringForTree.push(option.alternateText);
- }
- } else if (!!option.isChatRoom || !!option.isPolicyExpenseChat) {
- if (option.subtitle) {
- searchStringForTree.push(option.subtitle);
- }
- }
-
- return searchStringForTree.join();
- },
- },
- ]);
- function search(searchInput: string) {
- const [personalDetails, recentReports] = fastSearch.search(searchInput);
-
- return {
- personalDetails,
- recentReports,
- };
- }
-
- return search;
- }, [searchOptions.personalDetails, searchOptions.recentReports]);
-
const filteredOptions = useMemo(() => {
if (debouncedInputValue.trim() === '') {
return {
@@ -117,25 +87,15 @@ function SearchRouter({onRouterClose}: SearchRouterProps) {
}
Timing.start(CONST.TIMING.SEARCH_FILTER_OPTIONS);
- const newOptions = findInSearchTree(debouncedInputValue);
+ const newOptions = OptionsListUtils.filterOptions(searchOptions, debouncedInputValue, {sortByReportTypeInSearch: true, preferChatroomsOverThreads: true});
Timing.end(CONST.TIMING.SEARCH_FILTER_OPTIONS);
- const recentReports = newOptions.recentReports.concat(newOptions.personalDetails);
-
- const userToInvite = OptionsListUtils.pickUserToInvite({
- canInviteUser: true,
+ return {
recentReports: newOptions.recentReports,
personalDetails: newOptions.personalDetails,
- searchValue: debouncedInputValue,
- optionsToExclude: [{login: CONST.EMAIL.NOTIFICATIONS}],
- });
-
- return {
- recentReports,
- personalDetails: [],
- userToInvite,
+ userToInvite: newOptions.userToInvite,
};
- }, [debouncedInputValue, findInSearchTree]);
+ }, [debouncedInputValue, searchOptions]);
const recentReports: OptionData[] = useMemo(() => {
if (debouncedInputValue === '') {
@@ -149,70 +109,271 @@ function SearchRouter({onRouterClose}: SearchRouterProps) {
return reports.slice(0, 10);
}, [debouncedInputValue, filteredOptions, searchOptions]);
- useEffect(() => {
- Report.searchInServer(debouncedInputValue.trim());
- }, [debouncedInputValue]);
-
const contextualReportData = contextualReportID ? searchOptions.recentReports?.find((option) => option.reportID === contextualReportID) : undefined;
- const clearUserQuery = () => {
- setTextInputValue('');
- setUserSearchQuery(undefined);
- };
+ const {activeWorkspaceID} = useActiveWorkspace();
+ const policy = usePolicy(activeWorkspaceID);
+
+ const typeAutocompleteList = Object.values(CONST.SEARCH.DATA_TYPES);
+ const statusAutocompleteList = Object.values({...CONST.SEARCH.STATUS.TRIP, ...CONST.SEARCH.STATUS.INVOICE, ...CONST.SEARCH.STATUS.CHAT, ...CONST.SEARCH.STATUS.TRIP});
+ const expenseTypes = Object.values(CONST.SEARCH.TRANSACTION_TYPE);
+ const [cardList = {}] = useOnyx(ONYXKEYS.CARD_LIST);
+ const cardAutocompleteList = Object.values(cardList);
+ const personalDetailsForParticipants = usePersonalDetails();
- const onSearchChange = useMemo(
- // eslint-disable-next-line react-compiler/react-compiler
+ const participantsAutocompleteList = useMemo(
() =>
- debounce((userQuery: string) => {
- if (!userQuery) {
- clearUserQuery();
- listRef.current?.updateAndScrollToFocusedIndex(-1);
+ Object.values(personalDetailsForParticipants)
+ .filter((details): details is NonNullable => !!(details && details?.login))
+ .map((details) => ({
+ name: details.displayName ?? Str.removeSMSDomain(details.login ?? ''),
+ accountID: details?.accountID.toString(),
+ })),
+ [personalDetailsForParticipants],
+ );
+ const allTaxRates = getAllTaxRates();
+ const taxAutocompleteList = useMemo(() => getAutocompleteTaxList(allTaxRates, policy), [policy, allTaxRates]);
+ const [allPolicyCategories] = useOnyx(ONYXKEYS.COLLECTION.POLICY_CATEGORIES);
+ const [allRecentCategories] = useOnyx(ONYXKEYS.COLLECTION.POLICY_RECENTLY_USED_CATEGORIES);
+ const categoryAutocompleteList = useMemo(() => {
+ return getAutocompleteCategories(allPolicyCategories, activeWorkspaceID);
+ }, [activeWorkspaceID, allPolicyCategories]);
+ const recentCategoriesAutocompleteList = useMemo(() => {
+ return getAutocompleteRecentCategories(allRecentCategories, activeWorkspaceID);
+ }, [activeWorkspaceID, allRecentCategories]);
+
+ const [currencyList] = useOnyx(ONYXKEYS.CURRENCY_LIST);
+ const currencyAutocompleteList = Object.keys(currencyList ?? {});
+ const [recentCurrencyAutocompleteList] = useOnyx(ONYXKEYS.RECENTLY_USED_CURRENCIES);
+
+ const [allPoliciesTags] = useOnyx(ONYXKEYS.COLLECTION.POLICY_TAGS);
+ const [allRecentTags] = useOnyx(ONYXKEYS.COLLECTION.POLICY_RECENTLY_USED_TAGS);
+ const tagAutocompleteList = useMemo(() => {
+ return getAutocompleteTags(allPoliciesTags, activeWorkspaceID);
+ }, [activeWorkspaceID, allPoliciesTags]);
+ const recentTagsAutocompleteList = getAutocompleteRecentTags(allRecentTags, activeWorkspaceID);
+
+ const updateAutocomplete = useCallback(
+ (autocompleteValue: string, ranges: SearchAutocompleteQueryRange[], autocompleteType?: ValueOf) => {
+ const alreadyAutocompletedKeys: string[] = [];
+ ranges.forEach((range) => {
+ if (!autocompleteType || range.key !== autocompleteType) {
return;
}
- listRef.current?.updateAndScrollToFocusedIndex(0);
- const queryJSON = SearchQueryUtils.buildSearchQueryJSON(userQuery);
-
- if (queryJSON) {
- setUserSearchQuery(queryJSON);
- } else {
- Log.alert(`${CONST.ERROR.ENSURE_BUGBOT} user query failed to parse`, userQuery, false);
+ alreadyAutocompletedKeys.push(range.value.toLowerCase());
+ });
+
+ let filteredAutocompleteSuggestions: AutocompleteItemData[] | undefined;
+ switch (autocompleteType) {
+ case CONST.SEARCH.SYNTAX_FILTER_KEYS.TAG: {
+ const autocompleteList = autocompleteValue ? tagAutocompleteList : recentTagsAutocompleteList ?? [];
+ const filteredTags = autocompleteList
+ .filter((tag) => tag.toLowerCase()?.includes(autocompleteValue.toLowerCase()) && !alreadyAutocompletedKeys.includes(tag))
+ .sort()
+ .slice(0, 10);
+
+ filteredAutocompleteSuggestions = filteredTags.map((tagName) => ({
+ filterKey: CONST.SEARCH.SYNTAX_FILTER_KEYS.TAG,
+ text: tagName,
+ }));
+ break;
+ }
+ case CONST.SEARCH.SYNTAX_FILTER_KEYS.CATEGORY: {
+ const autocompleteList = autocompleteValue ? categoryAutocompleteList : recentCategoriesAutocompleteList;
+ const filteredCategories = autocompleteList
+ .filter((category) => {
+ return category.toLowerCase()?.includes(autocompleteValue.toLowerCase()) && !alreadyAutocompletedKeys.includes(category.toLowerCase());
+ })
+ .sort()
+ .slice(0, 10);
+
+ filteredAutocompleteSuggestions = filteredCategories.map((categoryName) => ({
+ filterKey: CONST.SEARCH.SYNTAX_FILTER_KEYS.CATEGORY,
+ text: categoryName,
+ }));
+ break;
+ }
+ case CONST.SEARCH.SYNTAX_FILTER_KEYS.CURRENCY: {
+ const autocompleteList = autocompleteValue ? currencyAutocompleteList : recentCurrencyAutocompleteList ?? [];
+ const filteredCurrencies = autocompleteList
+ .filter((currency) => currency.toLowerCase()?.includes(autocompleteValue.toLowerCase()) && !alreadyAutocompletedKeys.includes(currency.toLowerCase()))
+ .sort()
+ .slice(0, 10);
+
+ filteredAutocompleteSuggestions = filteredCurrencies.map((currencyName) => ({
+ filterKey: CONST.SEARCH.SYNTAX_FILTER_KEYS.CURRENCY,
+ text: currencyName,
+ }));
+ break;
+ }
+ case CONST.SEARCH.SYNTAX_FILTER_KEYS.TAX_RATE: {
+ const filteredTaxRates = taxAutocompleteList
+ .filter((tax) => tax.taxRateName.toLowerCase().includes(autocompleteValue.toLowerCase()) && !alreadyAutocompletedKeys.includes(tax.taxRateName.toLowerCase()))
+ .sort()
+ .slice(0, 10);
+ filteredAutocompleteSuggestions = filteredTaxRates.map((tax) => ({
+ filterKey: CONST.SEARCH.SYNTAX_FILTER_KEYS.TAX_RATE,
+ text: tax.taxRateName,
+ autocompleteID: tax.taxRateIds.join(','),
+ }));
+
+ break;
+ }
+ case CONST.SEARCH.SYNTAX_FILTER_KEYS.FROM: {
+ const filteredParticipants = participantsAutocompleteList
+ .filter(
+ (participant) => participant.name.toLowerCase().includes(autocompleteValue.toLowerCase()) && !alreadyAutocompletedKeys.includes(participant.name.toLowerCase()),
+ )
+ .sort()
+ .slice(0, 10);
+ filteredAutocompleteSuggestions = filteredParticipants.map((participant) => ({
+ filterKey: CONST.SEARCH.SYNTAX_FILTER_KEYS.FROM,
+ text: participant.name,
+ autocompleteID: participant.accountID,
+ }));
+ break;
}
- }, SEARCH_DEBOUNCE_DELAY),
- // eslint-disable-next-line react-compiler/react-compiler
- // eslint-disable-next-line react-hooks/exhaustive-deps
- [],
+ case CONST.SEARCH.SYNTAX_FILTER_KEYS.TO: {
+ const filteredParticipants = participantsAutocompleteList
+ .filter(
+ (participant) => participant.name.toLowerCase().includes(autocompleteValue.toLowerCase()) && !alreadyAutocompletedKeys.includes(participant.name.toLowerCase()),
+ )
+ .sort()
+ .slice(0, 10);
+ filteredAutocompleteSuggestions = filteredParticipants.map((participant) => ({
+ filterKey: CONST.SEARCH.SYNTAX_FILTER_KEYS.TO,
+ text: participant.name,
+ autocompleteID: participant.accountID,
+ }));
+ break;
+ }
+ case CONST.SEARCH.SYNTAX_FILTER_KEYS.IN: {
+ const filteredChats = searchOptions.recentReports
+ .filter((chat) => chat.text?.toLowerCase()?.includes(autocompleteValue.toLowerCase()))
+ .sort((chatA, chatB) => (chatA > chatB ? 1 : -1))
+ .slice(0, 10);
+ filteredAutocompleteSuggestions = filteredChats.map((chat) => ({
+ filterKey: CONST.SEARCH.SYNTAX_FILTER_KEYS.IN,
+ text: chat.text ?? '',
+ autocompleteID: chat.reportID,
+ }));
+ break;
+ }
+ case CONST.SEARCH.SYNTAX_ROOT_KEYS.TYPE: {
+ const filteredTypes = typeAutocompleteList
+ .filter((type) => type.toLowerCase().includes(autocompleteValue.toLowerCase()) && !alreadyAutocompletedKeys.includes(type.toLowerCase()))
+ .sort();
+ filteredAutocompleteSuggestions = filteredTypes.map((type) => ({filterKey: CONST.SEARCH.SYNTAX_ROOT_KEYS.TYPE, text: type}));
+ break;
+ }
+ case CONST.SEARCH.SYNTAX_ROOT_KEYS.STATUS: {
+ const filteredStatuses = statusAutocompleteList
+ .filter((status) => status.includes(autocompleteValue.toLowerCase()) && !alreadyAutocompletedKeys.includes(status))
+ .sort()
+ .slice(0, 10);
+ filteredAutocompleteSuggestions = filteredStatuses.map((status) => ({filterKey: CONST.SEARCH.SYNTAX_ROOT_KEYS.STATUS, text: status}));
+ break;
+ }
+ case CONST.SEARCH.SYNTAX_FILTER_KEYS.EXPENSE_TYPE: {
+ const filteredExpenseTypes = expenseTypes
+ .filter((expenseType) => expenseType.includes(autocompleteValue.toLowerCase()) && !alreadyAutocompletedKeys.includes(expenseType))
+ .sort();
+
+ filteredAutocompleteSuggestions = filteredExpenseTypes.map((expenseType) => ({
+ filterKey: CONST.SEARCH.SYNTAX_FILTER_KEYS.EXPENSE_TYPE,
+ text: expenseType,
+ }));
+ break;
+ }
+ case CONST.SEARCH.SYNTAX_FILTER_KEYS.CARD_ID: {
+ const filteredCards = cardAutocompleteList
+ .filter((card) => card.bank.toLowerCase().includes(autocompleteValue.toLowerCase()) && !alreadyAutocompletedKeys.includes(card.bank.toLowerCase()))
+ .sort()
+ .slice(0, 10);
+
+ filteredAutocompleteSuggestions = filteredCards.map((card) => ({
+ filterKey: CONST.SEARCH.SYNTAX_FILTER_KEYS.CARD_ID,
+ text: CardUtils.getCardDescription(card.cardID),
+ autocompleteID: card.cardID.toString(),
+ }));
+ break;
+ }
+ default: {
+ filteredAutocompleteSuggestions = undefined;
+ }
+ }
+ setAutocompleteSuggestions(filteredAutocompleteSuggestions);
+ },
+ [
+ tagAutocompleteList,
+ recentTagsAutocompleteList,
+ categoryAutocompleteList,
+ recentCategoriesAutocompleteList,
+ currencyAutocompleteList,
+ recentCurrencyAutocompleteList,
+ taxAutocompleteList,
+ participantsAutocompleteList,
+ searchOptions.recentReports,
+ typeAutocompleteList,
+ statusAutocompleteList,
+ expenseTypes,
+ cardAutocompleteList,
+ ],
);
- const updateUserSearchQuery = (newSearchQuery: string) => {
- setTextInputValue(newSearchQuery);
- onSearchChange(newSearchQuery);
- };
+ useEffect(() => {
+ Report.searchInServer(debouncedInputValue.trim());
+ }, [debouncedInputValue]);
- const closeAndClearRouter = useCallback(() => {
- onRouterClose();
- clearUserQuery();
- // eslint-disable-next-line react-compiler/react-compiler
- // eslint-disable-next-line react-hooks/exhaustive-deps
- }, [onRouterClose]);
+ const onSearchChange = useCallback(
+ (userQuery: string) => {
+ let newUserQuery = userQuery;
+ if (autocompleteSuggestions && userQuery.endsWith(',')) {
+ newUserQuery = `${userQuery.slice(0, userQuery.length - 1).trim()},`;
+ }
+ setTextInputValue(newUserQuery);
+ const autocompleteParsedQuery = parseForAutocomplete(newUserQuery);
+ updateAutocomplete(autocompleteParsedQuery?.autocomplete?.value ?? '', autocompleteParsedQuery?.ranges ?? [], autocompleteParsedQuery?.autocomplete?.key);
+
+ const updatedSubstitutionsMap = getUpdatedSubstitutionsMap(userQuery, autocompleteSubstitutions);
+ setAutocompleteSubstitutions(updatedSubstitutionsMap);
+
+ if (newUserQuery) {
+ listRef.current?.updateAndScrollToFocusedIndex(0);
+ } else {
+ listRef.current?.updateAndScrollToFocusedIndex(-1);
+ }
+ },
+ [autocompleteSubstitutions, autocompleteSuggestions, setTextInputValue, updateAutocomplete],
+ );
const onSearchSubmit = useCallback(
- (query: SearchQueryJSON | undefined) => {
- if (!query) {
+ (queryString: SearchQueryString) => {
+ const cleanedQueryString = getQueryWithSubstitutions(queryString, autocompleteSubstitutions);
+ const queryJSON = SearchQueryUtils.buildSearchQueryJSON(cleanedQueryString);
+ if (!queryJSON) {
return;
}
+
onRouterClose();
- const standardizedQuery = SearchQueryUtils.standardizeQueryJSON(query, cardList, taxRates);
- const queryString = SearchQueryUtils.buildSearchQueryString(standardizedQuery);
- Navigation.navigate(ROUTES.SEARCH_CENTRAL_PANE.getRoute({query: queryString}));
- clearUserQuery();
+
+ const standardizedQuery = SearchQueryUtils.traverseAndUpdatedQuery(queryJSON, SearchQueryUtils.getUpdatedAmountValue);
+ const query = SearchQueryUtils.buildSearchQueryString(standardizedQuery);
+ Navigation.navigate(ROUTES.SEARCH_CENTRAL_PANE.getRoute({query}));
+
+ setTextInputValue('');
},
- // eslint-disable-next-line react-compiler/react-compiler
- // eslint-disable-next-line react-hooks/exhaustive-deps
- [onRouterClose],
+ [autocompleteSubstitutions, onRouterClose, setTextInputValue],
);
+ const onAutocompleteSuggestionClick = (autocompleteKey: string, autocompleteID: string) => {
+ const substitutions = {...autocompleteSubstitutions, [autocompleteKey]: autocompleteID};
+
+ setAutocompleteSubstitutions(substitutions);
+ };
+
useKeyboardShortcut(CONST.KEYBOARD_SHORTCUTS.ESCAPE, () => {
- closeAndClearRouter();
+ onRouterClose();
});
const modalWidth = shouldUseNarrowLayout ? styles.w100 : {width: variables.searchRouterPopoverWidth};
@@ -230,11 +391,10 @@ function SearchRouter({onRouterClose}: SearchRouterProps) {
)}
{
- onSearchSubmit(SearchQueryUtils.buildSearchQueryJSON(textInputValue));
+ onSearchSubmit(textInputValue);
}}
routerListRef={listRef}
shouldShowOfflineMessage
@@ -244,13 +404,16 @@ function SearchRouter({onRouterClose}: SearchRouterProps) {
isSearchingForReports={isSearchingForReports}
/>
diff --git a/src/components/Search/SearchRouter/SearchRouterInput.tsx b/src/components/Search/SearchRouter/SearchRouterInput.tsx
index 811c34b72a6e..c66437f63bdd 100644
--- a/src/components/Search/SearchRouter/SearchRouterInput.tsx
+++ b/src/components/Search/SearchRouter/SearchRouterInput.tsx
@@ -16,9 +16,6 @@ type SearchRouterInputProps = {
/** Value of TextInput */
value: string;
- /** Setter to TextInput value */
- setValue: (searchTerm: string) => void;
-
/** Callback to update search in SearchRouter */
updateSearch: (searchTerm: string) => void;
@@ -58,7 +55,6 @@ type SearchRouterInputProps = {
function SearchRouterInput({
value,
- setValue,
updateSearch,
onSubmit = () => {},
routerListRef,
@@ -78,11 +74,6 @@ function SearchRouterInput({
const {isOffline} = useNetwork();
const offlineMessage: string = isOffline && shouldShowOfflineMessage ? `${translate('common.youAppearToBeOffline')} ${translate('search.resultsAreLimited')}` : '';
- const onChangeText = (text: string) => {
- setValue(text);
- updateSearch(text);
- };
-
const inputWidth = isFullWidth ? styles.w100 : {width: variables.popoverWidth};
return (
@@ -92,7 +83,7 @@ function SearchRouterInput({
- {rightComponent && {rightComponent}}
+ {!!rightComponent && {rightComponent}}
void;
+
+ /** Callback to update text input value */
+ setTextInputValue: (text: string) => void;
/** Recent searches */
- recentSearches: Array | undefined;
+ recentSearches: Array | undefined;
/** Recent reports */
recentReports: OptionData[];
+ /** Autocomplete items */
+ autocompleteSuggestions: AutocompleteItemData[] | undefined;
+
/** Callback to submit query when selecting a list item */
- onSearchSubmit: (query: SearchQueryJSON | undefined) => void;
+ onSearchSubmit: (query: SearchQueryString) => void;
/** Context present when opening SearchRouter from a report, invoice or workspace page */
reportForContextualSearch?: OptionData;
- /** Callback to update search query when selecting contextual suggestion */
- updateUserSearchQuery: (newSearchQuery: string) => void;
+ /** Callback to run when user clicks a suggestion item that contains autocomplete data */
+ onAutocompleteSuggestionClick: (autocompleteKey: string, autocompleteID: string) => void;
/** Callback to close and clear SearchRouter */
- closeAndClearRouter: () => void;
+ closeRouter: () => void;
};
const setPerformanceTimersEnd = () => {
@@ -55,21 +73,25 @@ const setPerformanceTimersEnd = () => {
Performance.markEnd(CONST.TIMING.SEARCH_ROUTER_RENDER);
};
-function getContextualSearchQuery(reportID: string) {
- return `${CONST.SEARCH.SYNTAX_ROOT_KEYS.TYPE}:${CONST.SEARCH.DATA_TYPES.CHAT} in:${reportID}`;
+function getContextualSearchQuery(reportName: string) {
+ return `${CONST.SEARCH.SYNTAX_ROOT_KEYS.TYPE}:${CONST.SEARCH.DATA_TYPES.CHAT} ${CONST.SEARCH.SYNTAX_FILTER_KEYS.IN}:${SearchQueryUtils.sanitizeSearchValue(reportName)}`;
}
function isSearchQueryItem(item: OptionData | SearchQueryItem): item is SearchQueryItem {
- if ('singleIcon' in item && item.singleIcon && 'query' in item && item.query) {
- return true;
- }
- return false;
+ return 'searchItemType' in item;
}
function isSearchQueryListItem(listItem: UserListItemProps | SearchQueryListItemProps): listItem is SearchQueryListItemProps {
return isSearchQueryItem(listItem.item);
}
+function getItemHeight(item: OptionData | SearchQueryItem) {
+ if (isSearchQueryItem(item)) {
+ return 44;
+ }
+ return 64;
+}
+
function SearchRouterItem(props: UserListItemProps | SearchQueryListItemProps) {
const styles = useThemeStyles();
@@ -91,7 +113,18 @@ function SearchRouterItem(props: UserListItemProps | SearchQueryList
}
function SearchRouterList(
- {currentQuery, reportForContextualSearch, recentSearches, recentReports, onSearchSubmit, updateUserSearchQuery, closeAndClearRouter}: SearchRouterListProps,
+ {
+ textInputValue,
+ updateSearchValue,
+ setTextInputValue,
+ reportForContextualSearch,
+ recentSearches,
+ autocompleteSuggestions,
+ recentReports,
+ onSearchSubmit,
+ onAutocompleteSuggestionClick,
+ closeRouter,
+ }: SearchRouterListProps,
ref: ForwardedRef,
) {
const styles = useThemeStyles();
@@ -104,46 +137,65 @@ function SearchRouterList(
const [cardList = {}] = useOnyx(ONYXKEYS.CARD_LIST);
const sections: Array> = [];
- if (currentQuery?.inputQuery) {
+ if (textInputValue) {
sections.push({
data: [
{
- text: currentQuery?.inputQuery,
+ text: textInputValue,
singleIcon: Expensicons.MagnifyingGlass,
- query: currentQuery?.inputQuery,
+ searchQuery: textInputValue,
itemStyle: styles.activeComponentBG,
keyForList: 'findItem',
+ searchItemType: CONST.SEARCH.SEARCH_ROUTER_ITEM_TYPE.SEARCH,
},
],
});
}
- if (reportForContextualSearch && !currentQuery?.inputQuery) {
+ if (reportForContextualSearch && !textInputValue) {
+ const reportQueryValue = reportForContextualSearch.text ?? reportForContextualSearch.alternateText ?? reportForContextualSearch.reportID;
sections.push({
data: [
{
text: `${translate('search.searchIn')} ${reportForContextualSearch.text ?? reportForContextualSearch.alternateText}`,
singleIcon: Expensicons.MagnifyingGlass,
- query: getContextualSearchQuery(reportForContextualSearch.reportID),
+ searchQuery: reportQueryValue,
+ autocompleteID: reportForContextualSearch.reportID,
itemStyle: styles.activeComponentBG,
keyForList: 'contextualSearch',
- isContextualSearchItem: true,
+ searchItemType: CONST.SEARCH.SEARCH_ROUTER_ITEM_TYPE.CONTEXTUAL_SUGGESTION,
},
],
});
}
+ const autocompleteData = autocompleteSuggestions?.map(({filterKey, text, autocompleteID}) => {
+ return {
+ text: getSubstitutionMapKey(filterKey, text),
+ singleIcon: Expensicons.MagnifyingGlass,
+ searchQuery: text,
+ autocompleteID,
+ keyForList: autocompleteID ?? text, // in case we have a unique identifier then use it because text might not be unique
+ searchItemType: CONST.SEARCH.SEARCH_ROUTER_ITEM_TYPE.AUTOCOMPLETE_SUGGESTION,
+ };
+ });
+
+ if (autocompleteData && autocompleteData.length > 0) {
+ sections.push({title: translate('search.suggestions'), data: autocompleteData});
+ }
+
const recentSearchesData = recentSearches?.map(({query, timestamp}) => {
const searchQueryJSON = SearchQueryUtils.buildSearchQueryJSON(query);
return {
text: searchQueryJSON ? SearchQueryUtils.buildUserReadableQueryString(searchQueryJSON, personalDetails, cardList, reports, taxRates) : query,
singleIcon: Expensicons.History,
- query,
+ searchQuery: query,
keyForList: timestamp,
+ searchItemType: CONST.SEARCH.SEARCH_ROUTER_ITEM_TYPE.SEARCH,
};
});
- if (!currentQuery?.inputQuery && recentSearchesData && recentSearchesData.length > 0) {
+ if (!textInputValue && recentSearchesData && recentSearchesData.length > 0) {
sections.push({title: translate('search.recentSearches'), data: recentSearchesData});
}
@@ -153,28 +205,57 @@ function SearchRouterList(
const onSelectRow = useCallback(
(item: OptionData | SearchQueryItem) => {
if (isSearchQueryItem(item)) {
- if (item.isContextualSearchItem) {
- // Handle selection of "Contextual search suggestion"
- updateUserSearchQuery(`${item?.query} ${currentQuery?.inputQuery ?? ''}`);
+ if (!item.searchQuery) {
return;
}
+ if (item.searchItemType === CONST.SEARCH.SEARCH_ROUTER_ITEM_TYPE.CONTEXTUAL_SUGGESTION) {
+ const searchQuery = getContextualSearchQuery(item.searchQuery);
+ updateSearchValue(`${searchQuery} `);
- // Handle selection of "Recent search"
- if (!item?.query) {
+ if (item.autocompleteID) {
+ const autocompleteKey = `${CONST.SEARCH.SYNTAX_FILTER_KEYS.IN}:${item.searchQuery}`;
+ onAutocompleteSuggestionClick(autocompleteKey, item.autocompleteID);
+ }
return;
}
- onSearchSubmit(SearchQueryUtils.buildSearchQueryJSON(item?.query));
+ if (item.searchItemType === CONST.SEARCH.SEARCH_ROUTER_ITEM_TYPE.AUTOCOMPLETE_SUGGESTION && textInputValue) {
+ const trimmedUserSearchQuery = getQueryWithoutAutocompletedPart(textInputValue);
+ updateSearchValue(`${trimmedUserSearchQuery}${SearchQueryUtils.sanitizeSearchValue(item.searchQuery)} `);
+
+ if (item.autocompleteID && item.text) {
+ onAutocompleteSuggestionClick(item.text, item.autocompleteID);
+ }
+ return;
+ }
+
+ onSearchSubmit(item.searchQuery);
}
// Handle selection of "Recent chat"
- closeAndClearRouter();
+ closeRouter();
if ('reportID' in item && item?.reportID) {
Navigation.navigate(ROUTES.REPORT_WITH_ID.getRoute(item?.reportID));
} else if ('login' in item) {
Report.navigateToAndOpenReport(item.login ? [item.login] : [], false);
}
},
- [closeAndClearRouter, onSearchSubmit, currentQuery, updateUserSearchQuery],
+ [closeRouter, textInputValue, onSearchSubmit, updateSearchValue, onAutocompleteSuggestionClick],
+ );
+
+ const onArrowFocus = useCallback(
+ (focusedItem: OptionData | SearchQueryItem) => {
+ if (!isSearchQueryItem(focusedItem) || focusedItem?.searchItemType !== CONST.SEARCH.SEARCH_ROUTER_ITEM_TYPE.AUTOCOMPLETE_SUGGESTION || !focusedItem.searchQuery) {
+ return;
+ }
+
+ const trimmedUserSearchQuery = getQueryWithoutAutocompletedPart(textInputValue);
+ setTextInputValue(`${trimmedUserSearchQuery}${SearchQueryUtils.sanitizeSearchValue(focusedItem.searchQuery)} `);
+
+ if (focusedItem.autocompleteID && focusedItem.text) {
+ onAutocompleteSuggestionClick(focusedItem.text, focusedItem.autocompleteID);
+ }
+ },
+ [setTextInputValue, textInputValue, onAutocompleteSuggestionClick],
);
return (
@@ -185,15 +266,17 @@ function SearchRouterList(
containerStyle={[styles.mh100]}
sectionListStyle={[shouldUseNarrowLayout ? styles.ph5 : styles.ph2, styles.pb2]}
listItemWrapperStyle={[styles.pr3, styles.pl3]}
+ getItemHeight={getItemHeight}
onLayout={setPerformanceTimersEnd}
ref={ref}
showScrollIndicator={!shouldUseNarrowLayout}
sectionTitleStyles={styles.mhn2}
shouldSingleExecuteRowSelect
+ onArrowFocus={onArrowFocus}
/>
);
}
export default forwardRef(SearchRouterList);
export {SearchRouterItem};
-export type {ItemWithQuery};
+export type {AutocompleteItemData};
diff --git a/src/components/Search/SearchRouter/SearchRouterModal.tsx b/src/components/Search/SearchRouter/SearchRouterModal.tsx
index 2626b8565e2a..356dcb70f199 100644
--- a/src/components/Search/SearchRouter/SearchRouterModal.tsx
+++ b/src/components/Search/SearchRouter/SearchRouterModal.tsx
@@ -11,7 +11,7 @@ function SearchRouterModal() {
const {shouldUseNarrowLayout} = useResponsiveLayout();
const {isSearchRouterDisplayed, closeSearchRouter} = useSearchRouterContext();
- const modalType = shouldUseNarrowLayout ? CONST.MODAL.MODAL_TYPE.CENTERED_UNSWIPEABLE : CONST.MODAL.MODAL_TYPE.POPOVER;
+ const modalType = shouldUseNarrowLayout ? CONST.MODAL.MODAL_TYPE.CENTERED_SWIPABLE_TO_RIGHT : CONST.MODAL.MODAL_TYPE.POPOVER;
return (
diff --git a/src/components/Search/SearchRouter/getQueryWithSubstitutions.ts b/src/components/Search/SearchRouter/getQueryWithSubstitutions.ts
new file mode 100644
index 000000000000..117745fee480
--- /dev/null
+++ b/src/components/Search/SearchRouter/getQueryWithSubstitutions.ts
@@ -0,0 +1,50 @@
+import type {SearchAutocompleteQueryRange, SearchFilterKey} from '@components/Search/types';
+import * as parser from '@libs/SearchParser/autocompleteParser';
+
+type SubstitutionMap = Record;
+
+const getSubstitutionMapKey = (filterKey: SearchFilterKey, value: string) => `${filterKey}:${value}`;
+
+/**
+ * Given a plaintext query and a SubstitutionMap object, this function will return a transformed query where:
+ * - any autocomplete mention in the original query will be substituted with an id taken from `substitutions` object
+ * - anything that does not match will stay as is
+ *
+ * Ex:
+ * query: `A from:@johndoe A`
+ * substitutions: {
+ * from:@johndoe: 9876
+ * }
+ * return: `A from:9876 A`
+ */
+function getQueryWithSubstitutions(changedQuery: string, substitutions: SubstitutionMap) {
+ const parsed = parser.parse(changedQuery) as {ranges: SearchAutocompleteQueryRange[]};
+
+ const searchAutocompleteQueryRanges = parsed.ranges;
+
+ if (searchAutocompleteQueryRanges.length === 0) {
+ return changedQuery;
+ }
+
+ let resultQuery = changedQuery;
+ let lengthDiff = 0;
+
+ for (const range of searchAutocompleteQueryRanges) {
+ const itemKey = getSubstitutionMapKey(range.key, range.value);
+ const substitutionEntry = substitutions[itemKey];
+
+ if (substitutionEntry) {
+ const substitutionStart = range.start + lengthDiff;
+ const substitutionEnd = range.start + range.length;
+
+ // generate new query but substituting "user-typed" value with the entity id/email from substitutions
+ resultQuery = resultQuery.slice(0, substitutionStart) + substitutionEntry + changedQuery.slice(substitutionEnd);
+ lengthDiff = lengthDiff + substitutionEntry.length - range.length;
+ }
+ }
+
+ return resultQuery;
+}
+
+export {getQueryWithSubstitutions, getSubstitutionMapKey};
+export type {SubstitutionMap};
diff --git a/src/components/Search/SearchRouter/getUpdatedSubstitutionsMap.ts b/src/components/Search/SearchRouter/getUpdatedSubstitutionsMap.ts
new file mode 100644
index 000000000000..ee7bf3850259
--- /dev/null
+++ b/src/components/Search/SearchRouter/getUpdatedSubstitutionsMap.ts
@@ -0,0 +1,43 @@
+import type {SearchAutocompleteQueryRange, SearchFilterKey} from '@components/Search/types';
+import * as parser from '@libs/SearchParser/autocompleteParser';
+import type {SubstitutionMap} from './getQueryWithSubstitutions';
+
+const getSubstitutionsKey = (filterKey: SearchFilterKey, value: string) => `${filterKey}:${value}`;
+
+/**
+ * Given a plaintext query and a SubstitutionMap object,
+ * this function will remove any substitution keys that do not appear in the query and return an updated object
+ *
+ * Ex:
+ * query: `Test from:John1`
+ * substitutions: {
+ * from:SomeOtherJohn: 12345
+ * }
+ * return: {}
+ */
+function getUpdatedSubstitutionsMap(query: string, substitutions: SubstitutionMap): SubstitutionMap {
+ const parsedQuery = parser.parse(query) as {ranges: SearchAutocompleteQueryRange[]};
+
+ const searchAutocompleteQueryRanges = parsedQuery.ranges;
+
+ if (searchAutocompleteQueryRanges.length === 0) {
+ return {};
+ }
+
+ const autocompleteQueryKeys = searchAutocompleteQueryRanges.map((range) => getSubstitutionsKey(range.key, range.value));
+
+ // Build a new substitutions map consisting of only the keys from old map, that appear in query
+ const updatedSubstitutionMap = autocompleteQueryKeys.reduce((map, key) => {
+ if (substitutions[key]) {
+ // eslint-disable-next-line no-param-reassign
+ map[key] = substitutions[key];
+ }
+
+ return map;
+ }, {} as SubstitutionMap);
+
+ return updatedSubstitutionMap;
+}
+
+// eslint-disable-next-line import/prefer-default-export
+export {getUpdatedSubstitutionsMap};
diff --git a/src/components/Search/index.tsx b/src/components/Search/index.tsx
index 4a1a67505d91..a13b816fd8b8 100644
--- a/src/components/Search/index.tsx
+++ b/src/components/Search/index.tsx
@@ -1,6 +1,6 @@
import {useIsFocused, useNavigation} from '@react-navigation/native';
import type {StackNavigationProp} from '@react-navigation/stack';
-import React, {useCallback, useEffect, useRef, useState} from 'react';
+import React, {useCallback, useEffect, useMemo, useRef, useState} from 'react';
import {View} from 'react-native';
import type {NativeScrollEvent, NativeSyntheticEvent, StyleProp, ViewStyle} from 'react-native';
import type {OnyxEntry} from 'react-native-onyx';
@@ -196,7 +196,13 @@ function Search({queryJSON, onSearchListScroll, contentContainerStyle}: SearchPr
const shouldShowLoadingMoreItems = !shouldShowLoadingState && searchResults?.search?.isLoading && searchResults?.search?.offset > 0;
const isSearchResultsEmpty = !searchResults?.data || SearchUIUtils.isSearchResultsEmpty(searchResults);
const prevIsSearchResultEmpty = usePrevious(isSearchResultsEmpty);
- const data = searchResults === undefined ? [] : SearchUIUtils.getSections(type, status, searchResults.data, searchResults.search);
+
+ const data = useMemo(() => {
+ if (searchResults === undefined) {
+ return [];
+ }
+ return SearchUIUtils.getSections(type, status, searchResults.data, searchResults.search);
+ }, [searchResults, status, type]);
useEffect(() => {
/** We only want to display the skeleton for the status filters the first time we load them for a specific data type */
@@ -460,6 +466,7 @@ function Search({queryJSON, onSearchListScroll, contentContainerStyle}: SearchPr
}
contentContainerStyle={[contentContainerStyle, styles.pb3]}
scrollEventThrottle={1}
+ shouldKeepFocusedItemAtTopOfViewableArea={type === CONST.SEARCH.DATA_TYPES.CHAT}
/>
);
}
diff --git a/src/components/Search/types.ts b/src/components/Search/types.ts
index 4f96090be9d0..3e5c158660f1 100644
--- a/src/components/Search/types.ts
+++ b/src/components/Search/types.ts
@@ -1,4 +1,4 @@
-import type {ValueOf} from 'react-native-gesture-handler/lib/typescript/typeUtils';
+import type {ValueOf} from 'type-fest';
import type {ReportActionListItemType, ReportListItemType, TransactionListItemType} from '@components/SelectionList/types';
import type CONST from '@src/CONST';
import type {SearchDataTypes, SearchReport} from '@src/types/onyx/SearchResults';
@@ -56,11 +56,16 @@ type QueryFilter = {
value: string | number;
};
-type AdvancedFiltersKeys = ValueOf;
+type SearchFilterKey =
+ | ValueOf
+ | typeof CONST.SEARCH.SYNTAX_ROOT_KEYS.TYPE
+ | typeof CONST.SEARCH.SYNTAX_ROOT_KEYS.STATUS
+ | typeof CONST.SEARCH.SYNTAX_ROOT_KEYS.POLICY_ID;
-type QueryFilters = {
- [K in AdvancedFiltersKeys]?: QueryFilter[];
-};
+type QueryFilters = Array<{
+ key: SearchFilterKey;
+ filters: QueryFilter[];
+}>;
type SearchQueryString = string;
@@ -76,9 +81,23 @@ type SearchQueryAST = {
type SearchQueryJSON = {
inputQuery: SearchQueryString;
hash: number;
+ /** Hash used for putting queries in recent searches list. It ignores sortOrder and sortBy, because we want to treat queries differing only in sort params as the same query */
+ recentSearchHash: number;
flatFilters: QueryFilters;
} & SearchQueryAST;
+type SearchAutocompleteResult = {
+ autocomplete: SearchAutocompleteQueryRange | null;
+ ranges: SearchAutocompleteQueryRange[];
+};
+
+type SearchAutocompleteQueryRange = {
+ key: SearchFilterKey;
+ length: number;
+ start: number;
+ value: string;
+};
+
export type {
SelectedTransactionInfo,
SelectedTransactions,
@@ -92,9 +111,11 @@ export type {
ASTNode,
QueryFilter,
QueryFilters,
- AdvancedFiltersKeys,
+ SearchFilterKey,
ExpenseSearchStatus,
InvoiceSearchStatus,
TripSearchStatus,
ChatSearchStatus,
+ SearchAutocompleteResult,
+ SearchAutocompleteQueryRange,
};
diff --git a/src/components/SelectionList/BaseListItem.tsx b/src/components/SelectionList/BaseListItem.tsx
index f4140f602f40..6570ef020786 100644
--- a/src/components/SelectionList/BaseListItem.tsx
+++ b/src/components/SelectionList/BaseListItem.tsx
@@ -6,6 +6,7 @@ import OfflineWithFeedback from '@components/OfflineWithFeedback';
import PressableWithFeedback from '@components/Pressable/PressableWithFeedback';
import useHover from '@hooks/useHover';
import {useMouseContext} from '@hooks/useMouseContext';
+import useStyleUtils from '@hooks/useStyleUtils';
import useSyncFocus from '@hooks/useSyncFocus';
import useTheme from '@hooks/useTheme';
import useThemeStyles from '@hooks/useThemeStyles';
@@ -38,6 +39,7 @@ function BaseListItem({
}: BaseListItemProps) {
const theme = useTheme();
const styles = useThemeStyles();
+ const StyleUtils = useStyleUtils();
const {hovered, bind} = useHover();
const {isMouseDownOnInput, setMouseUp} = useMouseContext();
@@ -93,19 +95,27 @@ function BaseListItem({
role={CONST.ROLE.BUTTON}
hoverDimmingValue={1}
hoverStyle={[!item.isDisabled && styles.hoveredComponentBG, hoverStyle]}
- dataSet={{[CONST.SELECTION_SCRAPER_HIDDEN_ELEMENT]: true}}
+ dataSet={{[CONST.SELECTION_SCRAPER_HIDDEN_ELEMENT]: true, [CONST.INNER_BOX_SHADOW_ELEMENT]: true}}
onMouseDown={(e) => e.preventDefault()}
id={keyForList ?? ''}
- style={pressableStyle}
+ style={[
+ pressableStyle,
+ isFocused && StyleUtils.getItemBackgroundColorStyle(!!item.isSelected, !!isFocused, !!item.isDisabled, theme.activeComponentBG, theme.hoverComponentBG),
+ ]}
onFocus={onFocus}
onMouseLeave={handleMouseLeave}
tabIndex={item.tabIndex}
wrapperStyle={pressableWrapperStyle}
>
-
+
{typeof children === 'function' ? children(hovered) : children}
- {!canSelectMultiple && item.isSelected && !rightHandSideComponent && (
+ {!canSelectMultiple && !!item.isSelected && !rightHandSideComponent && (
({
)}
- {(!item.isSelected || item.canShowSeveralIndicators) && !!item.brickRoadIndicator && shouldDisplayRBR && (
+ {(!item.isSelected || !!item.canShowSeveralIndicators) && !!item.brickRoadIndicator && shouldDisplayRBR && (
variables.optionRowHeight;
@@ -89,6 +91,8 @@ function BaseSelectionList(
textInputIconLeft,
sectionTitleStyles,
textInputAutoFocus = true,
+ shouldShowTextInputAfterHeader = false,
+ includeSafeAreaPaddingBottom = true,
shouldTextInputInterceptSwipe = false,
listHeaderContent,
onEndReached = () => {},
@@ -97,6 +101,7 @@ function BaseSelectionList(
updateCellsBatchingPeriod = 50,
removeClippedSubviews = true,
shouldDelayFocus = true,
+ onArrowFocus = () => {},
shouldUpdateFocusedIndex = false,
onLongPressRow,
shouldShowTextInput = !!textInputLabel || !!textInputIconLeft,
@@ -106,6 +111,9 @@ function BaseSelectionList(
scrollEventThrottle,
contentContainerStyle,
shouldHighlightSelectedItem = false,
+ shouldKeepFocusedItemAtTopOfViewableArea = false,
+ shouldDebounceScrolling = false,
+ shouldPreventActiveCellVirtualization = false,
}: BaseSelectionListProps,
ref: ForwardedRef,
) {
@@ -125,6 +133,20 @@ function BaseSelectionList(
const [currentPage, setCurrentPage] = useState(1);
const isTextInputFocusedRef = useRef(false);
const {singleExecution} = useSingleExecution();
+ const [itemHeights, setItemHeights] = useState>({});
+
+ const onItemLayout = (event: LayoutChangeEvent, itemKey: string | null | undefined) => {
+ if (!itemKey) {
+ return;
+ }
+
+ const {height} = event.nativeEvent.layout;
+
+ setItemHeights((prevHeights) => ({
+ ...prevHeights,
+ [itemKey]: height,
+ }));
+ };
const incrementPage = () => setCurrentPage((prev) => prev + 1);
@@ -150,7 +172,7 @@ function BaseSelectionList(
const selectedOptions: TItem[] = [];
sections.forEach((section, sectionIndex) => {
- const sectionHeaderHeight = variables.optionsListSectionHeaderHeight;
+ const sectionHeaderHeight = !!section.title || !!section.CustomSectionHeader ? variables.optionsListSectionHeaderHeight : 0;
itemLayouts.push({length: sectionHeaderHeight, offset});
offset += sectionHeaderHeight;
@@ -174,7 +196,7 @@ function BaseSelectionList(
disabledIndex += 1;
// Account for the height of the item in getItemLayout
- const fullItemHeight = getItemHeight(item);
+ const fullItemHeight = item?.keyForList && itemHeights[item.keyForList] ? itemHeights[item.keyForList] : getItemHeight(item);
itemLayouts.push({length: fullItemHeight, offset});
offset += fullItemHeight;
@@ -206,7 +228,7 @@ function BaseSelectionList(
itemLayouts,
allSelected: selectedOptions.length > 0 && selectedOptions.length === allOptions.length - disabledOptionsIndexes.length,
};
- }, [canSelectMultiple, sections, customListHeader, customListHeaderHeight, getItemHeight]);
+ }, [canSelectMultiple, sections, customListHeader, customListHeaderHeight, itemHeights, getItemHeight]);
const [slicedSections, ShowMoreButtonInstance] = useMemo(() => {
let remainingOptionsLimit = CONST.MAX_SELECTION_LIST_PAGE_LENGTH * currentPage;
@@ -256,8 +278,20 @@ function BaseSelectionList(
const itemIndex = item.index ?? -1;
const sectionIndex = item.sectionIndex ?? -1;
+ let viewOffsetToKeepFocusedItemAtTopOfViewableArea = 0;
+
+ // Since there are always two items above the focused item in viewable area, and items can grow beyond the screen size
+ // in searchType chat, the focused item may move out of view. To prevent this, we will ensure that the focused item remains at
+ // the top of the viewable area at all times by adjusting the viewOffset.
+ if (shouldKeepFocusedItemAtTopOfViewableArea) {
+ const firstPreviousItem = index > 0 ? flattenedSections.allOptions.at(index - 1) : undefined;
+ const firstPreviousItemHeight = firstPreviousItem && firstPreviousItem.keyForList ? itemHeights[firstPreviousItem.keyForList] : 0;
+ const secondPreviousItem = index > 1 ? flattenedSections.allOptions.at(index - 2) : undefined;
+ const secondPreviousItemHeight = secondPreviousItem && secondPreviousItem?.keyForList ? itemHeights[secondPreviousItem.keyForList] : 0;
+ viewOffsetToKeepFocusedItemAtTopOfViewableArea = firstPreviousItemHeight + secondPreviousItemHeight;
+ }
- listRef.current.scrollToLocation({sectionIndex, itemIndex, animated, viewOffset: variables.contentHeaderHeight});
+ listRef.current.scrollToLocation({sectionIndex, itemIndex, animated, viewOffset: variables.contentHeaderHeight - viewOffsetToKeepFocusedItemAtTopOfViewableArea});
},
// eslint-disable-next-line react-compiler/react-compiler, react-hooks/exhaustive-deps
@@ -274,6 +308,8 @@ function BaseSelectionList(
// eslint-disable-next-line react-compiler/react-compiler, react-hooks/exhaustive-deps
}, [flattenedSections.disabledArrowKeyOptionsIndexes]);
+ const debouncedScrollToIndex = useMemo(() => lodashDebounce(scrollToIndex, CONST.TIMING.LIST_SCROLLING_DEBOUNCE_TIME, {leading: true, trailing: true}), [scrollToIndex]);
+
// If `initiallyFocusedOptionKey` is not passed, we fall back to `-1`, to avoid showing the highlight on the first member
const [focusedIndex, setFocusedIndex] = useArrowKeyFocusManager({
initialFocusedIndex: flattenedSections.allOptions.findIndex((option) => option.keyForList === initiallyFocusedOptionKey),
@@ -281,7 +317,11 @@ function BaseSelectionList(
disabledIndexes: disabledArrowKeyIndexes,
isActive: isFocused,
onFocusedIndexChange: (index: number) => {
- scrollToIndex(index, true);
+ const focusedItem = flattenedSections.allOptions.at(index);
+ if (focusedItem) {
+ onArrowFocus(focusedItem);
+ }
+ (shouldDebounceScrolling ? debouncedScrollToIndex : scrollToIndex)(index, true);
},
isFocused,
});
@@ -296,36 +336,50 @@ function BaseSelectionList(
* @param item - the list item
* @param indexToFocus - the list item index to focus
*/
- const selectRow = (item: TItem, indexToFocus?: number) => {
- // In single-selection lists we don't care about updating the focused index, because the list is closed after selecting an item
- if (canSelectMultiple) {
- if (sections.length > 1) {
- // If the list has only 1 section (e.g. Workspace Members list), we do nothing.
- // If the list has multiple sections (e.g. Workspace Invite list), and `shouldUnfocusRow` is false,
- // we focus the first one after all the selected (selected items are always at the top).
- const selectedOptionsCount = item.isSelected ? flattenedSections.selectedOptions.length - 1 : flattenedSections.selectedOptions.length + 1;
-
- if (!item.isSelected) {
- // If we're selecting an item, scroll to it's position at the top, so we can see it
- scrollToIndex(Math.max(selectedOptionsCount - 1, 0), true);
+ const selectRow = useCallback(
+ (item: TItem, indexToFocus?: number) => {
+ // In single-selection lists we don't care about updating the focused index, because the list is closed after selecting an item
+ if (canSelectMultiple) {
+ if (sections.length > 1) {
+ // If the list has only 1 section (e.g. Workspace Members list), we do nothing.
+ // If the list has multiple sections (e.g. Workspace Invite list), and `shouldUnfocusRow` is false,
+ // we focus the first one after all the selected (selected items are always at the top).
+ const selectedOptionsCount = item.isSelected ? flattenedSections.selectedOptions.length - 1 : flattenedSections.selectedOptions.length + 1;
+
+ if (!item.isSelected) {
+ // If we're selecting an item, scroll to it's position at the top, so we can see it
+ scrollToIndex(Math.max(selectedOptionsCount - 1, 0), true);
+ }
}
- }
- if (shouldShowTextInput) {
- clearInputAfterSelect();
+ if (shouldShowTextInput) {
+ clearInputAfterSelect();
+ }
}
- }
- if (shouldUpdateFocusedIndex && typeof indexToFocus === 'number') {
- setFocusedIndex(indexToFocus);
- }
+ if (shouldUpdateFocusedIndex && typeof indexToFocus === 'number') {
+ setFocusedIndex(indexToFocus);
+ }
- onSelectRow(item);
+ onSelectRow(item);
- if (shouldShowTextInput && shouldPreventDefaultFocusOnSelectRow && innerTextInputRef.current) {
- innerTextInputRef.current.focus();
- }
- };
+ if (shouldShowTextInput && shouldPreventDefaultFocusOnSelectRow && innerTextInputRef.current) {
+ innerTextInputRef.current.focus();
+ }
+ },
+ [
+ canSelectMultiple,
+ sections.length,
+ flattenedSections.selectedOptions.length,
+ scrollToIndex,
+ shouldShowTextInput,
+ clearInputAfterSelect,
+ shouldUpdateFocusedIndex,
+ setFocusedIndex,
+ onSelectRow,
+ shouldPreventDefaultFocusOnSelectRow,
+ ],
+ );
const selectAllRow = () => {
onSelectAll?.();
@@ -437,51 +491,35 @@ function BaseSelectionList(
// We only create tooltips for the first 10 users or so since some reports have hundreds of users, causing performance to degrade.
const showTooltip = shouldShowTooltips && normalizedIndex < 10;
- const handleOnCheckboxPress = () => {
- if (SearchUIUtils.isReportListItemType(item)) {
- return onCheckboxPress;
- }
- return onCheckboxPress ? () => onCheckboxPress(item) : undefined;
- };
-
return (
- <>
- onItemLayout(event, item?.keyForList)}>
+ {
- if (shouldSingleExecuteRowSelect) {
- singleExecution(() => selectRow(item, index))();
- } else {
- selectRow(item, index);
- }
- }}
- onCheckboxPress={handleOnCheckboxPress()}
- onDismissError={() => onDismissError?.(item)}
+ shouldSingleExecuteRowSelect={shouldSingleExecuteRowSelect}
+ selectRow={selectRow}
+ onCheckboxPress={onCheckboxPress}
+ onDismissError={onDismissError}
shouldPreventDefaultFocusOnSelectRow={shouldPreventDefaultFocusOnSelectRow}
- // We're already handling the Enter key press in the useKeyboardShortcut hook, so we don't want the list item to submit the form
- shouldPreventEnterKeySubmit
rightHandSideComponent={rightHandSideComponent}
- keyForList={item.keyForList ?? ''}
isMultilineSupported={isRowMultilineSupported}
isAlternateTextMultilineSupported={isAlternateTextMultilineSupported}
alternateTextNumberOfLines={alternateTextNumberOfLines}
- onFocus={() => {
- if (shouldIgnoreFocus || isDisabled) {
- return;
- }
- setFocusedIndex(normalizedIndex);
- }}
+ shouldIgnoreFocus={shouldIgnoreFocus}
+ setFocusedIndex={setFocusedIndex}
+ normalizedIndex={normalizedIndex}
shouldSyncFocus={!isTextInputFocusedRef.current}
- shouldHighlightSelectedItem={shouldHighlightSelectedItem}
wrapperStyle={listItemWrapperStyle}
+ shouldHighlightSelectedItem={shouldHighlightSelectedItem}
+ singleExecution={singleExecution}
/>
- {item.footerContent && item.footerContent}
-
+
);
};
@@ -495,6 +533,48 @@ function BaseSelectionList(
return null;
};
+ const renderInput = () => {
+ return (
+
+ {
+ innerTextInputRef.current = element as RNTextInput;
+
+ if (!textInputRef) {
+ return;
+ }
+
+ if (typeof textInputRef === 'function') {
+ textInputRef(element as RNTextInput);
+ } else {
+ // eslint-disable-next-line no-param-reassign
+ textInputRef.current = element as RNTextInput;
+ }
+ }}
+ onFocus={() => (isTextInputFocusedRef.current = true)}
+ onBlur={() => (isTextInputFocusedRef.current = false)}
+ label={textInputLabel}
+ accessibilityLabel={textInputLabel}
+ hint={textInputHint}
+ role={CONST.ROLE.PRESENTATION}
+ value={textInputValue}
+ placeholder={textInputPlaceholder}
+ maxLength={textInputMaxLength}
+ onChangeText={onChangeText}
+ inputMode={inputMode}
+ selectTextOnFocus
+ spellCheck={false}
+ iconLeft={textInputIconLeft}
+ onSubmitEditing={selectFocusedOption}
+ blurOnSubmit={!!flattenedSections.allOptions.length}
+ isLoading={isLoadingNewOptions}
+ testID="selection-list-text-input"
+ shouldInterceptSwipe={shouldTextInputInterceptSwipe}
+ />
+
+ );
+ };
+
const scrollToFocusedIndexOnFirstRender = useCallback(
(nativeEvent: LayoutChangeEvent) => {
if (shouldUseDynamicMaxToRenderPerBatch) {
@@ -671,46 +751,8 @@ function BaseSelectionList(
return (
{({safeAreaPaddingBottomStyle}) => (
-
- {shouldShowTextInput && (
-
- {
- innerTextInputRef.current = element as RNTextInput;
-
- if (!textInputRef) {
- return;
- }
-
- if (typeof textInputRef === 'function') {
- textInputRef(element as RNTextInput);
- } else {
- // eslint-disable-next-line no-param-reassign
- textInputRef.current = element as RNTextInput;
- }
- }}
- onFocus={() => (isTextInputFocusedRef.current = true)}
- onBlur={() => (isTextInputFocusedRef.current = false)}
- label={textInputLabel}
- accessibilityLabel={textInputLabel}
- hint={textInputHint}
- role={CONST.ROLE.PRESENTATION}
- value={textInputValue}
- placeholder={textInputPlaceholder}
- maxLength={textInputMaxLength}
- onChangeText={onChangeText}
- inputMode={inputMode}
- selectTextOnFocus
- spellCheck={false}
- iconLeft={textInputIconLeft}
- onSubmitEditing={selectFocusedOption}
- blurOnSubmit={!!flattenedSections.allOptions.length}
- isLoading={isLoadingNewOptions}
- testID="selection-list-text-input"
- shouldInterceptSwipe={shouldTextInputInterceptSwipe}
- />
-
- )}
+
+ {shouldShowTextInput && !shouldShowTextInputAfterHeader && renderInput()}
{/* If we are loading new options we will avoid showing any header message. This is mostly because one of the header messages says there are no options. */}
{/* This is misleading because we might be in the process of loading fresh options from the server. */}
{(!isLoadingNewOptions || headerMessage !== translate('common.noResultsFound') || (flattenedSections.allOptions.length === 0 && !showLoadingPlaceholder)) &&
@@ -754,12 +796,22 @@ function BaseSelectionList(
testID="selection-list"
onLayout={onSectionListLayout}
style={[(!maxToRenderPerBatch || (shouldHideListOnInitialRender && isInitialSectionListRender)) && styles.opacity0, sectionListStyle]}
- ListHeaderComponent={listHeaderContent}
+ ListHeaderComponent={
+ shouldShowTextInput && shouldShowTextInputAfterHeader ? (
+ <>
+ {listHeaderContent}
+ {renderInput()}
+
+ ) : (
+ listHeaderContent
+ )
+ }
ListFooterComponent={listFooterContent ?? ShowMoreButtonInstance}
onEndReached={onEndReached}
onEndReachedThreshold={onEndReachedThreshold}
scrollEventThrottle={scrollEventThrottle}
contentContainerStyle={contentContainerStyle}
+ CellRendererComponent={shouldPreventActiveCellVirtualization ? FocusAwareCellRendererComponent : undefined}
/>
{children}
diff --git a/src/components/SelectionList/BaseSelectionListItemRenderer.tsx b/src/components/SelectionList/BaseSelectionListItemRenderer.tsx
new file mode 100644
index 000000000000..b08d2ae2cfbc
--- /dev/null
+++ b/src/components/SelectionList/BaseSelectionListItemRenderer.tsx
@@ -0,0 +1,93 @@
+import React from 'react';
+import type useArrowKeyFocusManager from '@hooks/useArrowKeyFocusManager';
+import type useSingleExecution from '@hooks/useSingleExecution';
+import * as SearchUIUtils from '@libs/SearchUIUtils';
+import type {BaseListItemProps, BaseSelectionListProps, ListItem} from './types';
+
+type BaseSelectionListItemRendererProps = Omit, 'onSelectRow'> &
+ Pick, 'ListItem' | 'shouldHighlightSelectedItem' | 'shouldIgnoreFocus' | 'shouldSingleExecuteRowSelect'> & {
+ index: number;
+ selectRow: (item: TItem, indexToFocus?: number) => void;
+ setFocusedIndex: ReturnType[1];
+ normalizedIndex: number;
+ singleExecution: ReturnType['singleExecution'];
+ };
+
+function BaseSelectionListItemRenderer({
+ ListItem,
+ item,
+ index,
+ isFocused,
+ isDisabled,
+ showTooltip,
+ canSelectMultiple,
+ onLongPressRow,
+ shouldSingleExecuteRowSelect,
+ selectRow,
+ onCheckboxPress,
+ onDismissError,
+ shouldPreventDefaultFocusOnSelectRow,
+ rightHandSideComponent,
+ isMultilineSupported,
+ isAlternateTextMultilineSupported,
+ alternateTextNumberOfLines,
+ shouldIgnoreFocus,
+ setFocusedIndex,
+ normalizedIndex,
+ shouldSyncFocus,
+ shouldHighlightSelectedItem,
+ wrapperStyle,
+ singleExecution,
+}: BaseSelectionListItemRendererProps) {
+ const handleOnCheckboxPress = () => {
+ if (SearchUIUtils.isReportListItemType(item)) {
+ return onCheckboxPress;
+ }
+ return onCheckboxPress ? () => onCheckboxPress(item) : undefined;
+ };
+
+ return (
+ <>
+ {
+ if (shouldSingleExecuteRowSelect) {
+ singleExecution(() => selectRow(item, index))();
+ } else {
+ selectRow(item, index);
+ }
+ }}
+ onCheckboxPress={handleOnCheckboxPress()}
+ onDismissError={() => onDismissError?.(item)}
+ shouldPreventDefaultFocusOnSelectRow={shouldPreventDefaultFocusOnSelectRow}
+ // We're already handling the Enter key press in the useKeyboardShortcut hook, so we don't want the list item to submit the form
+ shouldPreventEnterKeySubmit
+ rightHandSideComponent={rightHandSideComponent}
+ keyForList={item.keyForList ?? ''}
+ isMultilineSupported={isMultilineSupported}
+ isAlternateTextMultilineSupported={isAlternateTextMultilineSupported}
+ alternateTextNumberOfLines={alternateTextNumberOfLines}
+ onFocus={() => {
+ // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
+ if (shouldIgnoreFocus || isDisabled) {
+ return;
+ }
+ setFocusedIndex(normalizedIndex);
+ }}
+ shouldSyncFocus={shouldSyncFocus}
+ shouldHighlightSelectedItem={shouldHighlightSelectedItem}
+ wrapperStyle={wrapperStyle}
+ />
+ {item.footerContent && item.footerContent}
+
+ );
+}
+
+BaseSelectionListItemRenderer.displayName = 'BaseSelectionListItemRenderer';
+
+export default BaseSelectionListItemRenderer;
diff --git a/src/components/SelectionList/CardListItem.tsx b/src/components/SelectionList/CardListItem.tsx
index b6267a04d133..0e887d1d30db 100644
--- a/src/components/SelectionList/CardListItem.tsx
+++ b/src/components/SelectionList/CardListItem.tsx
@@ -46,7 +46,7 @@ function CardListItem({
return (
({
shouldSyncFocus={shouldSyncFocus}
>
<>
- {item.bankIcon && (
+ {!!item.bankIcon && (
({
)}
- {canSelectMultiple && !item.isDisabled && (
+ {!!canSelectMultiple && !item.isDisabled && (
({
return (
({onFocusCapture, ...rest}: CellRendererProps) {
+ return (
+
+ );
+}
+
+FocusAwareCellRendererComponent.displayName = 'FocusAwareCellRendererComponent';
+
+export default FocusAwareCellRendererComponent;
diff --git a/src/components/SelectionList/InviteMemberListItem.tsx b/src/components/SelectionList/InviteMemberListItem.tsx
index daeb513e3fa9..7442fe24f7d2 100644
--- a/src/components/SelectionList/InviteMemberListItem.tsx
+++ b/src/components/SelectionList/InviteMemberListItem.tsx
@@ -61,7 +61,7 @@ function InviteMemberListItem({
({
)}
{!!item.rightElement && item.rightElement}
- {shouldShowCheckBox && (
+ {!!shouldShowCheckBox && (
({
return (
- {canSelectMultiple && (
+ {!!canSelectMultiple && (
- {isSelected && (
+ {!!isSelected && (
- {shouldDisplayArrowIcon && (
+ {!!shouldDisplayArrowIcon && (
({
// Removing background style because they are added to the parent OpacityView via animatedHighlightStyle
styles.bgTransparent,
item.isSelected && styles.activeComponentBG,
- isFocused && styles.sidebarLinkActive,
styles.mh0,
];
@@ -171,7 +170,7 @@ function ReportListItem({
- {canSelectMultiple && (
+ {!!canSelectMultiple && (
onCheckboxPress?.(item)}
isChecked={item.isSelected}
diff --git a/src/components/SelectionList/Search/SearchQueryListItem.tsx b/src/components/SelectionList/Search/SearchQueryListItem.tsx
index 369f527cdeba..77637eed39df 100644
--- a/src/components/SelectionList/Search/SearchQueryListItem.tsx
+++ b/src/components/SelectionList/Search/SearchQueryListItem.tsx
@@ -1,17 +1,20 @@
import React from 'react';
import {View} from 'react-native';
+import type {ValueOf} from 'type-fest';
import Icon from '@components/Icon';
import BaseListItem from '@components/SelectionList/BaseListItem';
import type {ListItem} from '@components/SelectionList/types';
import TextWithTooltip from '@components/TextWithTooltip';
import useTheme from '@hooks/useTheme';
import useThemeStyles from '@hooks/useThemeStyles';
+import type CONST from '@src/CONST';
import type IconAsset from '@src/types/utils/IconAsset';
type SearchQueryItem = ListItem & {
singleIcon?: IconAsset;
- query?: string;
- isContextualSearchItem?: boolean;
+ searchQuery?: string;
+ autocompleteID?: string;
+ searchItemType?: ValueOf;
};
type SearchQueryListItemProps = {
@@ -30,7 +33,7 @@ function SearchQueryListItem({item, isFocused, showTooltip, onSelectRow, onFocus
return (
<>
- {item.singleIcon && (
+ {!!item.singleIcon && (
- {item.alternateText && (
+ {!!item.alternateText && (
({
// Removing background style because they are added to the parent OpacityView via animatedHighlightStyle
styles.bgTransparent,
item.isSelected && styles.activeComponentBG,
- isFocused && styles.sidebarLinkActive,
styles.mh0,
];
diff --git a/src/components/SelectionList/Search/TransactionListItemRow.tsx b/src/components/SelectionList/Search/TransactionListItemRow.tsx
index 1fdbdbcbd70a..37b0429b7caa 100644
--- a/src/components/SelectionList/Search/TransactionListItemRow.tsx
+++ b/src/components/SelectionList/Search/TransactionListItemRow.tsx
@@ -284,7 +284,7 @@ function TransactionListItemRow({
)}
- {canSelectMultiple && shouldShowTransactionCheckbox && (
+ {canSelectMultiple && !!shouldShowTransactionCheckbox && (
- {item.isSelected && (
+ {!!item.isSelected && (
({
return (
({
/>
- {canSelectMultiple && !item.isDisabled && (
+ {!!canSelectMultiple && !item.isDisabled && (
({
return (
({
>
{(hovered) => (
<>
- {canSelectMultiple && (
+ {!!canSelectMultiple && (
({
style={[styles.cursorUnset, StyleUtils.getCheckboxPressableStyle(), item.isDisabledCheckbox && styles.cursorDisabled, styles.mr3, item.cursorStyle]}
>
- {item.isSelected && (
+ {!!item.isSelected && (
({
rightHandSideComponent={rightHandSideComponent}
errors={item.errors}
pendingAction={item.pendingAction}
- pressableStyle={[isFocused && styles.sidebarLinkActive, pressableStyle]}
+ pressableStyle={pressableStyle}
FooterComponent={
item.invitedSecondaryLogin ? (
@@ -86,7 +86,7 @@ function UserListItem({
>
{(hovered?: boolean) => (
<>
- {canSelectMultiple && (
+ {!!canSelectMultiple && (
({
style={[styles.cursorUnset, StyleUtils.getCheckboxPressableStyle(), item.isDisabledCheckbox && styles.cursorDisabled, styles.mr3]}
>
- {item.isSelected && (
+ {!!item.isSelected && (
({onScroll, ...props}: BaseSelecti
};
}, []);
+ const [shouldDebounceScrolling, setShouldDebounceScrolling] = useState(false);
+
+ const checkShouldDebounceScrolling = (event: KeyboardEvent) => {
+ if (!event) {
+ return;
+ }
+
+ // Moving through items using the keyboard triggers scrolling by the browser, so we debounce programmatic scrolling to prevent jittering.
+ if (
+ event.key === CONST.KEYBOARD_SHORTCUTS.ARROW_DOWN.shortcutKey ||
+ event.key === CONST.KEYBOARD_SHORTCUTS.ARROW_UP.shortcutKey ||
+ event.key === CONST.KEYBOARD_SHORTCUTS.TAB.shortcutKey
+ ) {
+ setShouldDebounceScrolling(event.type === 'keydown');
+ }
+ };
+
+ useEffect(() => {
+ document.addEventListener('keydown', checkShouldDebounceScrolling, {passive: true});
+ document.addEventListener('keyup', checkShouldDebounceScrolling, {passive: true});
+
+ return () => {
+ document.removeEventListener('keydown', checkShouldDebounceScrolling);
+ document.removeEventListener('keyup', checkShouldDebounceScrolling);
+ };
+ }, []);
+
// In SearchPageBottomTab we use useAnimatedScrollHandler from reanimated(for performance reasons) and it returns object instead of function. In that case we cannot change it to a function call, that's why we have to choose between onScroll and defaultOnScroll.
const defaultOnScroll = () => {
// Only dismiss the keyboard whenever the user scrolls the screen
@@ -46,6 +74,7 @@ function SelectionList({onScroll, ...props}: BaseSelecti
// Ignore the focus if it's caused by a touch event on mobile chrome.
// For example, a long press will trigger a focus event on mobile chrome.
shouldIgnoreFocus={Browser.isMobileChrome() && isScreenTouched}
+ shouldDebounceScrolling={shouldDebounceScrolling}
/>
);
}
diff --git a/src/components/SelectionList/types.ts b/src/components/SelectionList/types.ts
index b2e175418813..4c7fd330ec18 100644
--- a/src/components/SelectionList/types.ts
+++ b/src/components/SelectionList/types.ts
@@ -443,6 +443,12 @@ type BaseSelectionListProps = Partial & {
/** Item `keyForList` to focus initially */
initiallyFocusedOptionKey?: string | null;
+ /** Whether the text input should be shown after list header */
+ shouldShowTextInputAfterHeader?: boolean;
+
+ /** Whether to include padding bottom */
+ includeSafeAreaPaddingBottom?: boolean;
+
/** Callback to fire when the list is scrolled */
onScroll?: (event: NativeSyntheticEvent) => void;
@@ -515,6 +521,9 @@ type BaseSelectionListProps = Partial & {
/** Whether focus event should be delayed */
shouldDelayFocus?: boolean;
+ /** Callback to fire when the text input changes */
+ onArrowFocus?: (focusedItem: TItem) => void;
+
/** Whether to show the loading indicator for new options */
isLoadingNewOptions?: boolean;
@@ -594,6 +603,15 @@ type BaseSelectionListProps = Partial & {
/** Whether we highlight all the selected items */
shouldHighlightSelectedItem?: boolean;
+
+ /** Determines if the focused item should remain at the top of the viewable area when navigating with arrow keys */
+ shouldKeepFocusedItemAtTopOfViewableArea?: boolean;
+
+ /** Whether to debounce scrolling on focused index change */
+ shouldDebounceScrolling?: boolean;
+
+ /** Whether to prevent the active cell from being virtualized and losing focus in browsers */
+ shouldPreventActiveCellVirtualization?: boolean;
} & TRightHandSideComponent;
type SelectionListHandle = {
diff --git a/src/components/SelectionListWithModal/index.tsx b/src/components/SelectionListWithModal/index.tsx
index 25123d5454d4..2ea739f531c8 100644
--- a/src/components/SelectionListWithModal/index.tsx
+++ b/src/components/SelectionListWithModal/index.tsx
@@ -79,7 +79,7 @@ function SelectionListWithModal(
const handleLongPressRow = (item: TItem) => {
// eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
- if (!turnOnSelectionModeOnLongPress || !isSmallScreenWidth || item?.isDisabled || item?.isDisabledCheckbox) {
+ if (!turnOnSelectionModeOnLongPress || !isSmallScreenWidth || item?.isDisabled || item?.isDisabledCheckbox || !isFocused) {
return;
}
setLongPressedItem(item);
diff --git a/src/components/SelectionScreen.tsx b/src/components/SelectionScreen.tsx
index 8382029bc12f..3538b04ed57f 100644
--- a/src/components/SelectionScreen.tsx
+++ b/src/components/SelectionScreen.tsx
@@ -93,6 +93,18 @@ type SelectionScreenProps = {
/** Whether to update the focused index on a row select */
shouldUpdateFocusedIndex?: boolean;
+
+ /** Whether to show the text input */
+ shouldShowTextInput?: boolean;
+
+ /** Label for the text input */
+ textInputLabel?: string;
+
+ /** Value for the text input */
+ textInputValue?: string;
+
+ /** Callback to fire when the text input changes */
+ onChangeText?: (text: string) => void;
};
function SelectionScreen({
@@ -117,6 +129,10 @@ function SelectionScreen({
onClose,
shouldSingleExecuteRowSelect,
headerTitleAlreadyTranslated,
+ textInputLabel,
+ textInputValue,
+ onChangeText,
+ shouldShowTextInput,
shouldUpdateFocusedIndex = false,
}: SelectionScreenProps) {
const {translate} = useLocalize();
@@ -152,9 +168,13 @@ function SelectionScreen({
sections={sections}
ListItem={listItem}
showScrollIndicator
+ onChangeText={onChangeText}
shouldShowTooltips={false}
initiallyFocusedOptionKey={initiallyFocusedOptionKey}
listEmptyContent={listEmptyContent}
+ textInputLabel={textInputLabel}
+ textInputValue={textInputValue}
+ shouldShowTextInput={shouldShowTextInput}
listFooterContent={listFooterContent}
sectionListStyle={!!sections.length && [styles.flexGrow0]}
shouldSingleExecuteRowSelect={shouldSingleExecuteRowSelect}
diff --git a/src/components/SettlementButton/index.tsx b/src/components/SettlementButton/index.tsx
index 4c3c9adf8ef1..53b09bfcbf31 100644
--- a/src/components/SettlementButton/index.tsx
+++ b/src/components/SettlementButton/index.tsx
@@ -70,7 +70,7 @@ function SettlementButton({
const isLoadingLastPaymentMethod = isLoadingOnyxValue(lastPaymentMethodResult);
const [policy] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY}${policyID}`);
const isInvoiceReport = (!isEmptyObject(iouReport) && ReportUtils.isInvoiceReport(iouReport)) || false;
- const shouldShowPaywithExpensifyOption = !shouldHidePaymentOptions && policy?.reimbursementChoice !== CONST.POLICY.REIMBURSEMENT_CHOICES.REIMBURSEMENT_MANUAL;
+ const shouldShowPaywithExpensifyOption = !shouldHidePaymentOptions;
const shouldShowPayElsewhereOption = !shouldHidePaymentOptions && !isInvoiceReport;
const paymentButtonOptions = useMemo(() => {
const buttonOptions = [];
diff --git a/src/components/StatePicker/StateSelectorModal.tsx b/src/components/StatePicker/StateSelectorModal.tsx
index 95c6067c95a2..0ce488c176ee 100644
--- a/src/components/StatePicker/StateSelectorModal.tsx
+++ b/src/components/StatePicker/StateSelectorModal.tsx
@@ -8,8 +8,8 @@ import RadioListItem from '@components/SelectionList/RadioListItem';
import useDebouncedState from '@hooks/useDebouncedState';
import useLocalize from '@hooks/useLocalize';
import useThemeStyles from '@hooks/useThemeStyles';
-import searchCountryOptions from '@libs/searchCountryOptions';
-import type {CountryData} from '@libs/searchCountryOptions';
+import searchOptions from '@libs/searchOptions';
+import type {Option} from '@libs/searchOptions';
import StringUtils from '@libs/StringUtils';
import CONST from '@src/CONST';
@@ -29,7 +29,7 @@ type StateSelectorModalProps = {
currentState: string;
/** Function to call when the user selects a state */
- onStateSelected: (value: CountryData) => void;
+ onStateSelected: (value: Option) => void;
/** Function to call when the user presses on the modal backdrop */
onBackdropPress?: () => void;
@@ -56,7 +56,7 @@ function StateSelectorModal({isVisible, currentState, onStateSelected, onClose,
[translate, currentState],
);
- const searchResults = searchCountryOptions(debouncedSearchValue, countryStates);
+ const searchResults = searchOptions(debouncedSearchValue, countryStates);
const headerMessage = debouncedSearchValue.trim() && !searchResults.length ? translate('common.noResultsFound') : '';
const styles = useThemeStyles();
diff --git a/src/components/StatePicker/index.tsx b/src/components/StatePicker/index.tsx
index ebcb156fd293..558db66a52ec 100644
--- a/src/components/StatePicker/index.tsx
+++ b/src/components/StatePicker/index.tsx
@@ -3,7 +3,7 @@ import React, {useState} from 'react';
import MenuItemWithTopDescription from '@components/MenuItemWithTopDescription';
import useLocalize from '@hooks/useLocalize';
import Navigation from '@libs/Navigation/Navigation';
-import type {CountryData} from '@libs/searchCountryOptions';
+import type {Option} from '@libs/searchOptions';
import CONST from '@src/CONST';
import StateSelectorModal from './StateSelectorModal';
@@ -28,7 +28,7 @@ function StatePicker({value, errorText, onInputChange = () => {}}: StatePickerPr
setIsPickerVisible(false);
};
- const updateInput = (item: CountryData) => {
+ const updateInput = (item: Option) => {
onInputChange?.(item.value);
hidePickerModal();
};
diff --git a/src/components/SubStepForms/AddressStep.tsx b/src/components/SubStepForms/AddressStep.tsx
new file mode 100644
index 000000000000..86e6e328d226
--- /dev/null
+++ b/src/components/SubStepForms/AddressStep.tsx
@@ -0,0 +1,149 @@
+import React, {useCallback, useEffect, useRef} from 'react';
+import {View} from 'react-native';
+import FormProvider from '@components/Form/FormProvider';
+import type {FormInputErrors, FormOnyxKeys, FormOnyxValues, FormRef, FormValue} from '@components/Form/types';
+import Text from '@components/Text';
+import useLocalize from '@hooks/useLocalize';
+import type {SubStepProps} from '@hooks/useSubStep/types';
+import useThemeStyles from '@hooks/useThemeStyles';
+import * as ValidationUtils from '@libs/ValidationUtils';
+import AddressFormFields from '@pages/ReimbursementAccount/AddressFormFields';
+import HelpLinks from '@pages/ReimbursementAccount/PersonalInfo/HelpLinks';
+import type {OnyxFormValuesMapping} from '@src/ONYXKEYS';
+
+type AddressValues = {
+ street: string;
+ city: string;
+ state: string;
+ zipCode: string;
+};
+
+type AddressStepProps = SubStepProps & {
+ /** The ID of the form */
+ formID: TFormID;
+
+ /** The title of the form */
+ formTitle: string;
+
+ /** The disclaimer informing that PO box is not allowed */
+ formPOBoxDisclaimer?: string;
+
+ /** The validation function to call when the form is submitted */
+ customValidate?: (values: FormOnyxValues) => FormInputErrors;
+
+ /** A function to call when the form is submitted */
+ onSubmit: (values: FormOnyxValues) => void;
+
+ /** Fields list of the form */
+ stepFields: Array>;
+
+ /** The IDs of the input fields */
+ inputFieldsIDs: AddressValues;
+
+ /** The default values for the form */
+ defaultValues: AddressValues;
+
+ /** Should show help links */
+ shouldShowHelpLinks?: boolean;
+
+ /** Indicates if country selector should be displayed */
+ shouldDisplayCountrySelector?: boolean;
+
+ /** Indicates if state selector should be displayed */
+ shouldDisplayStateSelector?: boolean;
+
+ /** Label for the state selector */
+ stateSelectorLabel?: string;
+
+ /** The title of the state selector modal */
+ stateSelectorModalHeaderTitle?: string;
+
+ /** The title of the state selector search input */
+ stateSelectorSearchInputTitle?: string;
+
+ /** Callback to be called when the country is changed */
+ onCountryChange?: (country: unknown) => void;
+};
+
+function AddressStep({
+ formID,
+ formTitle,
+ formPOBoxDisclaimer,
+ customValidate,
+ onSubmit,
+ stepFields,
+ inputFieldsIDs,
+ defaultValues,
+ shouldShowHelpLinks,
+ isEditing,
+ shouldDisplayCountrySelector = false,
+ shouldDisplayStateSelector = true,
+ stateSelectorLabel,
+ stateSelectorModalHeaderTitle,
+ stateSelectorSearchInputTitle,
+ onCountryChange,
+}: AddressStepProps) {
+ const {translate} = useLocalize();
+ const styles = useThemeStyles();
+
+ const formRef = useRef(null);
+
+ useEffect(() => {
+ // When stepFields change (e.g. country changes) we need to reset state errors manually
+ formRef.current?.resetFormFieldError(inputFieldsIDs.state);
+ }, [inputFieldsIDs.state, stepFields]);
+
+ const validate = useCallback(
+ (values: FormOnyxValues): FormInputErrors => {
+ const errors = ValidationUtils.getFieldRequiredErrors(values, stepFields);
+
+ const street = values[inputFieldsIDs.street as keyof typeof values];
+ if (street && !ValidationUtils.isValidAddress(street as FormValue)) {
+ // @ts-expect-error type mismatch to be fixed
+ errors[inputFieldsIDs.street] = translate('bankAccount.error.addressStreet');
+ }
+
+ const zipCode = values[inputFieldsIDs.zipCode as keyof typeof values];
+ if (zipCode && (shouldDisplayCountrySelector ? !ValidationUtils.isValidZipCodeInternational(zipCode as string) : !ValidationUtils.isValidZipCode(zipCode as string))) {
+ // @ts-expect-error type mismatch to be fixed
+ errors[inputFieldsIDs.zipCode] = translate('bankAccount.error.zipCode');
+ }
+
+ return errors;
+ },
+ [inputFieldsIDs.street, inputFieldsIDs.zipCode, shouldDisplayCountrySelector, stepFields, translate],
+ );
+
+ return (
+
+
+ {formTitle}
+ {!!formPOBoxDisclaimer && {formPOBoxDisclaimer}}
+
+ {!!shouldShowHelpLinks && }
+
+
+ );
+}
+
+AddressStep.displayName = 'AddressStep';
+
+export default AddressStep;
diff --git a/src/components/SubStepForms/ConfirmationStep.tsx b/src/components/SubStepForms/ConfirmationStep.tsx
new file mode 100644
index 000000000000..c3832628a7ca
--- /dev/null
+++ b/src/components/SubStepForms/ConfirmationStep.tsx
@@ -0,0 +1,118 @@
+import React from 'react';
+import {View} from 'react-native';
+import Button from '@components/Button';
+import DotIndicatorMessage from '@components/DotIndicatorMessage';
+import MenuItemWithTopDescription from '@components/MenuItemWithTopDescription';
+import SafeAreaConsumer from '@components/SafeAreaConsumer';
+import ScrollView from '@components/ScrollView';
+import Text from '@components/Text';
+import TextLink from '@components/TextLink';
+import useLocalize from '@hooks/useLocalize';
+import useNetwork from '@hooks/useNetwork';
+import type {SubStepProps} from '@hooks/useSubStep/types';
+import useThemeStyles from '@hooks/useThemeStyles';
+import CONST from '@src/CONST';
+
+type SummaryItem = {
+ description: string;
+ title: string;
+ shouldShowRightIcon: boolean;
+ onPress: () => void;
+};
+
+type ConfirmationStepProps = SubStepProps & {
+ /** The title of the step */
+ pageTitle: string;
+
+ /** The summary items to display */
+ summaryItems: SummaryItem[];
+
+ /** Whether show additional section with Onfido terms etc. */
+ showOnfidoLinks: boolean;
+
+ /** The title of the Onfido section */
+ onfidoLinksTitle?: string;
+
+ /** Whether the data is loading */
+ isLoading?: boolean;
+
+ /** The error message to display */
+ error?: string;
+};
+
+function ConfirmationStep({pageTitle, summaryItems, showOnfidoLinks, onfidoLinksTitle, isLoading, error, onNext}: ConfirmationStepProps) {
+ const {translate} = useLocalize();
+ const styles = useThemeStyles();
+ const {isOffline} = useNetwork();
+
+ return (
+
+ {({safeAreaPaddingBottomStyle}) => (
+
+ {pageTitle}
+ {summaryItems.map(({description, title, shouldShowRightIcon, onPress}) => (
+
+ ))}
+
+ {showOnfidoLinks && (
+
+ {onfidoLinksTitle}
+
+ {translate('onfidoStep.facialScan')}
+
+ {', '}
+
+ {translate('common.privacy')}
+
+ {` ${translate('common.and')} `}
+
+ {translate('common.termsOfService')}
+
+
+ )}
+
+
+ {!!error && error.length > 0 && (
+
+ )}
+
+
+
+ )}
+
+ );
+}
+
+ConfirmationStep.displayName = 'ConfirmationStep';
+
+export default ConfirmationStep;
diff --git a/src/components/SubStepForms/DateOfBirthStep.tsx b/src/components/SubStepForms/DateOfBirthStep.tsx
new file mode 100644
index 000000000000..42077cef2ba1
--- /dev/null
+++ b/src/components/SubStepForms/DateOfBirthStep.tsx
@@ -0,0 +1,106 @@
+import {subYears} from 'date-fns';
+import React, {useCallback} from 'react';
+import DatePicker from '@components/DatePicker';
+import FormProvider from '@components/Form/FormProvider';
+import InputWrapper from '@components/Form/InputWrapper';
+import type {FormInputErrors, FormOnyxKeys, FormOnyxValues} from '@components/Form/types';
+import Text from '@components/Text';
+import useLocalize from '@hooks/useLocalize';
+import type {SubStepProps} from '@hooks/useSubStep/types';
+import useThemeStyles from '@hooks/useThemeStyles';
+import * as ValidationUtils from '@libs/ValidationUtils';
+import HelpLinks from '@pages/ReimbursementAccount/PersonalInfo/HelpLinks';
+import CONST from '@src/CONST';
+import type {OnyxFormValuesMapping} from '@src/ONYXKEYS';
+
+type DateOfBirthStepProps = SubStepProps & {
+ /** The ID of the form */
+ formID: TFormID;
+
+ /** The title of the form */
+ formTitle: string;
+
+ /** The validation function to call when the form is submitted */
+ customValidate?: (values: FormOnyxValues) => FormInputErrors;
+
+ /** A function to call when the form is submitted */
+ onSubmit: (values: FormOnyxValues) => void;
+
+ /** Fields list of the form */
+ stepFields: Array>;
+
+ /** The ID of the date of birth input */
+ dobInputID: string;
+
+ /** The default value for the date of birth input */
+ dobDefaultValue: string;
+
+ /** Whether the component should show help links */
+ shouldShowHelpLinks?: boolean;
+};
+
+function DateOfBirthStep({
+ formID,
+ formTitle,
+ customValidate,
+ onSubmit,
+ stepFields,
+ dobInputID,
+ dobDefaultValue,
+ isEditing,
+ shouldShowHelpLinks = true,
+}: DateOfBirthStepProps) {
+ const {translate} = useLocalize();
+ const styles = useThemeStyles();
+
+ const minDate = subYears(new Date(), CONST.DATE_BIRTH.MAX_AGE);
+ const maxDate = subYears(new Date(), CONST.DATE_BIRTH.MIN_AGE_FOR_PAYMENT);
+
+ const validate = useCallback(
+ (values: FormOnyxValues): FormInputErrors => {
+ const errors = ValidationUtils.getFieldRequiredErrors(values, stepFields);
+
+ const valuesToValidate = values[dobInputID as keyof FormOnyxValues] as string;
+ if (valuesToValidate) {
+ if (!ValidationUtils.isValidPastDate(valuesToValidate) || !ValidationUtils.meetsMaximumAgeRequirement(valuesToValidate)) {
+ // @ts-expect-error type mismatch to be fixed
+ errors[dobInputID] = translate('bankAccount.error.dob');
+ } else if (!ValidationUtils.meetsMinimumAgeRequirement(valuesToValidate)) {
+ // @ts-expect-error type mismatch to be fixed
+ errors[dobInputID] = translate('bankAccount.error.age');
+ }
+ }
+
+ return errors;
+ },
+ [dobInputID, stepFields, translate],
+ );
+
+ return (
+
+ {formTitle}
+
+ {shouldShowHelpLinks && }
+
+ );
+}
+
+DateOfBirthStep.displayName = 'DateOfBirthStep';
+
+export default DateOfBirthStep;
diff --git a/src/components/SubStepForms/FullNameStep.tsx b/src/components/SubStepForms/FullNameStep.tsx
new file mode 100644
index 000000000000..3e8951f00d33
--- /dev/null
+++ b/src/components/SubStepForms/FullNameStep.tsx
@@ -0,0 +1,147 @@
+import React, {useCallback} from 'react';
+import {View} from 'react-native';
+import FormProvider from '@components/Form/FormProvider';
+import InputWrapper from '@components/Form/InputWrapper';
+import type {FormInputErrors, FormOnyxKeys, FormOnyxValues} from '@components/Form/types';
+import Text from '@components/Text';
+import TextInput from '@components/TextInput';
+import useLocalize from '@hooks/useLocalize';
+import type {SubStepProps} from '@hooks/useSubStep/types';
+import useThemeStyles from '@hooks/useThemeStyles';
+import * as ValidationUtils from '@libs/ValidationUtils';
+import HelpLinks from '@pages/ReimbursementAccount/PersonalInfo/HelpLinks';
+import CONST from '@src/CONST';
+import type {OnyxFormValuesMapping} from '@src/ONYXKEYS';
+
+type FullNameStepProps = SubStepProps & {
+ /** The ID of the form */
+ formID: TFormID;
+
+ /** The title of the form */
+ formTitle: string;
+
+ /** The validation function to call when the form is submitted */
+ customValidate?: (values: FormOnyxValues) => FormInputErrors;
+
+ /** A function to call when the form is submitted */
+ onSubmit: (values: FormOnyxValues) => void;
+
+ /** Fields list of the form */
+ stepFields: Array>;
+
+ /** The ID of the first name input */
+ firstNameInputID: string;
+
+ /** The ID of the last name input */
+ lastNameInputID: string;
+
+ /** The default values for the form */
+ defaultValues: {
+ firstName: string;
+ lastName: string;
+ };
+
+ /** Should show the help link or not */
+ shouldShowHelpLinks?: boolean;
+
+ /** Custom label of the first name input */
+ customFirstNameLabel?: string;
+
+ /** Custom label of the last name input */
+ customLastNameLabel?: string;
+};
+
+function FullNameStep({
+ formID,
+ formTitle,
+ customValidate,
+ onSubmit,
+ stepFields,
+ firstNameInputID,
+ lastNameInputID,
+ defaultValues,
+ isEditing,
+ shouldShowHelpLinks = true,
+ customFirstNameLabel,
+ customLastNameLabel,
+}: FullNameStepProps) {
+ const {translate} = useLocalize();
+ const styles = useThemeStyles();
+
+ const validate = useCallback(
+ (values: FormOnyxValues): FormInputErrors => {
+ const errors = ValidationUtils.getFieldRequiredErrors(values, stepFields);
+
+ const firstName = values[firstNameInputID as keyof FormOnyxValues] as string;
+ if (!ValidationUtils.isRequiredFulfilled(firstName)) {
+ // @ts-expect-error type mismatch to be fixed
+ errors[firstNameInputID] = translate('common.error.fieldRequired');
+ } else if (!ValidationUtils.isValidLegalName(firstName)) {
+ // @ts-expect-error type mismatch to be fixed
+ errors[firstNameInputID] = translate('privatePersonalDetails.error.hasInvalidCharacter');
+ } else if (firstName.length > CONST.LEGAL_NAME.MAX_LENGTH) {
+ // @ts-expect-error type mismatch to be fixed
+ errors[firstNameInputID] = translate('common.error.characterLimitExceedCounter', {
+ length: firstName.length,
+ limit: CONST.LEGAL_NAME.MAX_LENGTH,
+ });
+ }
+
+ const lastName = values[lastNameInputID as keyof FormOnyxValues] as string;
+ if (!ValidationUtils.isRequiredFulfilled(lastName)) {
+ // @ts-expect-error type mismatch to be fixed
+ errors[lastNameInputID] = translate('common.error.fieldRequired');
+ } else if (!ValidationUtils.isValidLegalName(lastName)) {
+ // @ts-expect-error type mismatch to be fixed
+ errors[lastNameInputID] = translate('privatePersonalDetails.error.hasInvalidCharacter');
+ } else if (lastName.length > CONST.LEGAL_NAME.MAX_LENGTH) {
+ // @ts-expect-error type mismatch to be fixed
+ errors[lastNameInputID] = translate('common.error.characterLimitExceedCounter', {
+ length: lastName.length,
+ limit: CONST.LEGAL_NAME.MAX_LENGTH,
+ });
+ }
+ return errors;
+ },
+ [firstNameInputID, lastNameInputID, stepFields, translate],
+ );
+
+ return (
+
+
+ {formTitle}
+
+
+ {shouldShowHelpLinks && }
+
+
+ );
+}
+
+FullNameStep.displayName = 'FullNameStep';
+
+export default FullNameStep;
diff --git a/src/components/SubStepForms/SingleFieldStep.tsx b/src/components/SubStepForms/SingleFieldStep.tsx
new file mode 100644
index 000000000000..7ab709e3d5c1
--- /dev/null
+++ b/src/components/SubStepForms/SingleFieldStep.tsx
@@ -0,0 +1,102 @@
+import React from 'react';
+import type {InputModeOptions} from 'react-native';
+import {View} from 'react-native';
+import FormProvider from '@components/Form/FormProvider';
+import InputWrapper from '@components/Form/InputWrapper';
+import type {FormInputErrors, FormOnyxValues} from '@components/Form/types';
+import Text from '@components/Text';
+import TextInput from '@components/TextInput';
+import useLocalize from '@hooks/useLocalize';
+import type {SubStepProps} from '@hooks/useSubStep/types';
+import useThemeStyles from '@hooks/useThemeStyles';
+import HelpLinks from '@pages/ReimbursementAccount/PersonalInfo/HelpLinks';
+import CONST from '@src/CONST';
+import type {OnyxFormValuesMapping} from '@src/ONYXKEYS';
+
+type SingleFieldStepProps = SubStepProps & {
+ /** The ID of the form */
+ formID: TFormID;
+
+ /** The title of the form */
+ formTitle: string;
+
+ /** The disclaimer to show below the form title */
+ formDisclaimer?: string;
+
+ /** The validation function to call when the form is submitted */
+ validate: (values: FormOnyxValues) => FormInputErrors;
+
+ /** A function to call when the form is submitted */
+ onSubmit: (values: FormOnyxValues) => void;
+
+ /** The ID of the form input */
+ inputId: string;
+
+ /** The label of the input */
+ inputLabel: string;
+
+ /** The mode of the input */
+ inputMode?: InputModeOptions;
+
+ /** The default values for the form */
+ defaultValue: string;
+
+ /** Whether to show help links */
+ shouldShowHelpLinks?: boolean;
+
+ /** Max length of the field */
+ maxLength?: number;
+};
+
+function SingleFieldStep({
+ formID,
+ formTitle,
+ formDisclaimer,
+ validate,
+ onSubmit,
+ inputId,
+ inputLabel,
+ inputMode,
+ defaultValue,
+ isEditing,
+ shouldShowHelpLinks = true,
+ maxLength,
+}: SingleFieldStepProps) {
+ const {translate} = useLocalize();
+ const styles = useThemeStyles();
+
+ return (
+
+
+ {formTitle}
+ {!!formDisclaimer && {formDisclaimer}}
+
+
+
+ {shouldShowHelpLinks && }
+
+
+ );
+}
+
+SingleFieldStep.displayName = 'SingleFieldStep';
+
+export default SingleFieldStep;
diff --git a/src/components/SubscriptAvatar.tsx b/src/components/SubscriptAvatar.tsx
index 789b4b4957c3..4e23befcbb15 100644
--- a/src/components/SubscriptAvatar.tsx
+++ b/src/components/SubscriptAvatar.tsx
@@ -88,7 +88,7 @@ function SubscriptAvatar({
/>
- {secondaryAvatar && (
+ {!!secondaryAvatar && (
)}
- {subscriptIcon && (
+ {!!subscriptIcon && (
- {icon && (
+ {!!icon && (
<>
{
+const getOpacity: GetOpacity = ({routesLength, tabIndex, active, affectedTabs, position}) => {
const activeValue = active ? 1 : 0;
const inactiveValue = active ? 0 : 1;
@@ -9,7 +9,7 @@ const getOpacity: GetOpacity = ({routesLength, tabIndex, active, affectedTabs, p
return position?.interpolate({
inputRange,
- outputRange: inputRange.map((i) => (affectedTabs.includes(tabIndex) && i === tabIndex && isActive ? activeValue : inactiveValue)),
+ outputRange: inputRange.map((i) => (affectedTabs.includes(tabIndex) && i === tabIndex ? activeValue : inactiveValue)),
});
}
return activeValue;
diff --git a/src/components/TestToolsModal.tsx b/src/components/TestToolsModal.tsx
index 5c330bd700e0..7c2e161b2d11 100644
--- a/src/components/TestToolsModal.tsx
+++ b/src/components/TestToolsModal.tsx
@@ -1,8 +1,6 @@
import React from 'react';
import {View} from 'react-native';
-import type {OnyxEntry} from 'react-native-onyx';
-import {withOnyx} from 'react-native-onyx';
-import useEnvironment from '@hooks/useEnvironment';
+import {useOnyx} from 'react-native-onyx';
import useLocalize from '@hooks/useLocalize';
import useStyleUtils from '@hooks/useStyleUtils';
import useThemeStyles from '@hooks/useThemeStyles';
@@ -20,18 +18,9 @@ import TestToolMenu from './TestToolMenu';
import TestToolRow from './TestToolRow';
import Text from './Text';
-type TestToolsModalOnyxProps = {
- /** Whether the test tools modal is open */
- isTestToolsModalOpen: OnyxEntry;
-
- /** Whether or not logs should be stored */
- shouldStoreLogs: OnyxEntry;
-};
-
-type TestToolsModalProps = TestToolsModalOnyxProps;
-
-function TestToolsModal({isTestToolsModalOpen = false, shouldStoreLogs = false}: TestToolsModalProps) {
- const {isProduction} = useEnvironment();
+function TestToolsModal() {
+ const [isTestToolsModalOpen = false] = useOnyx(ONYXKEYS.IS_TEST_TOOLS_MODAL_OPEN);
+ const [shouldStoreLogs = false] = useOnyx(ONYXKEYS.SHOULD_STORE_LOGS);
const {windowWidth} = useWindowDimensions();
const StyleUtils = useStyleUtils();
const styles = useThemeStyles();
@@ -64,7 +53,7 @@ function TestToolsModal({isTestToolsModalOpen = false, shouldStoreLogs = false}:
/>
)}
- {!isProduction && }
+
);
@@ -72,11 +61,4 @@ function TestToolsModal({isTestToolsModalOpen = false, shouldStoreLogs = false}:
TestToolsModal.displayName = 'TestToolsModal';
-export default withOnyx({
- isTestToolsModalOpen: {
- key: ONYXKEYS.IS_TEST_TOOLS_MODAL_OPEN,
- },
- shouldStoreLogs: {
- key: ONYXKEYS.SHOULD_STORE_LOGS,
- },
-})(TestToolsModal);
+export default TestToolsModal;
diff --git a/src/components/TextInput/BaseTextInput/index.native.tsx b/src/components/TextInput/BaseTextInput/index.native.tsx
index eadcabb8bfc6..670126f8c6ec 100644
--- a/src/components/TextInput/BaseTextInput/index.native.tsx
+++ b/src/components/TextInput/BaseTextInput/index.native.tsx
@@ -306,7 +306,7 @@ function BaseTextInput(
) : null}
- {iconLeft && (
+ {!!iconLeft && (
- {isFocused && !isReadOnly && shouldShowClearButton && value && setValue('')} />}
- {inputProps.isLoading && (
+ {isFocused && !isReadOnly && shouldShowClearButton && !!value && setValue('')} />}
+ {!!inputProps.isLoading && (
)}
- {!inputProps.secureTextEntry && icon && (
+ {!inputProps.secureTextEntry && !!icon && (
)}
- {contentWidth && (
+ {!!contentWidth && (
{
diff --git a/src/components/TextInput/BaseTextInput/index.tsx b/src/components/TextInput/BaseTextInput/index.tsx
index 48b99486d6cc..e36ae60255fc 100644
--- a/src/components/TextInput/BaseTextInput/index.tsx
+++ b/src/components/TextInput/BaseTextInput/index.tsx
@@ -334,7 +334,7 @@ function BaseTextInput(
) : null}
- {iconLeft && (
+ {!!iconLeft && (
)}
{isFocused && !isReadOnly && shouldShowClearButton && !!value && setValue('')} />}
- {inputProps.isLoading && (
+ {!!inputProps.isLoading && (
)}
- {contentWidth && (
+ {!!contentWidth && (
{
diff --git a/src/components/TextInputWithCurrencySymbol/BaseTextInputWithCurrencySymbol.tsx b/src/components/TextInputWithCurrencySymbol/BaseTextInputWithCurrencySymbol.tsx
index 3e7c5f0bc414..4c30b048c1af 100644
--- a/src/components/TextInputWithCurrencySymbol/BaseTextInputWithCurrencySymbol.tsx
+++ b/src/components/TextInputWithCurrencySymbol/BaseTextInputWithCurrencySymbol.tsx
@@ -7,7 +7,7 @@ import useThemeStyles from '@hooks/useThemeStyles';
import * as CurrencyUtils from '@libs/CurrencyUtils';
import * as MoneyRequestUtils from '@libs/MoneyRequestUtils';
import type {BaseTextInputRef} from '@src/components/TextInput/BaseTextInput/types';
-import type TextInputWithCurrencySymbolProps from './types';
+import type BaseTextInputWithCurrencySymbolProps from './types';
function BaseTextInputWithCurrencySymbol(
{
@@ -24,7 +24,7 @@ function BaseTextInputWithCurrencySymbol(
extraSymbol,
style,
...rest
- }: TextInputWithCurrencySymbolProps,
+ }: BaseTextInputWithCurrencySymbolProps,
ref: React.ForwardedRef,
) {
const {fromLocaleDigit} = useLocalize();
diff --git a/src/components/TextInputWithCurrencySymbol/index.android.tsx b/src/components/TextInputWithCurrencySymbol/index.android.tsx
index cbd822d07cf8..f7794c5822ff 100644
--- a/src/components/TextInputWithCurrencySymbol/index.android.tsx
+++ b/src/components/TextInputWithCurrencySymbol/index.android.tsx
@@ -2,7 +2,7 @@ import React, {useEffect, useState} from 'react';
import type {NativeSyntheticEvent, TextInputSelectionChangeEventData} from 'react-native';
import type {BaseTextInputRef} from '@src/components/TextInput/BaseTextInput/types';
import BaseTextInputWithCurrencySymbol from './BaseTextInputWithCurrencySymbol';
-import type TextInputWithCurrencySymbolProps from './types';
+import type {TextInputWithCurrencySymbolProps} from './types';
function TextInputWithCurrencySymbol({onSelectionChange = () => {}, ...props}: TextInputWithCurrencySymbolProps, ref: React.ForwardedRef) {
const [skipNextSelectionChange, setSkipNextSelectionChange] = useState(false);
@@ -21,7 +21,7 @@ function TextInputWithCurrencySymbol({onSelectionChange = () => {}, ...props}: T
setSkipNextSelectionChange(false);
return;
}
- onSelectionChange(event);
+ onSelectionChange(event.nativeEvent.selection.start, event.nativeEvent.selection.end);
}}
/>
);
diff --git a/src/components/TextInputWithCurrencySymbol/index.tsx b/src/components/TextInputWithCurrencySymbol/index.tsx
index b6230061bb6c..9e8333d9db23 100644
--- a/src/components/TextInputWithCurrencySymbol/index.tsx
+++ b/src/components/TextInputWithCurrencySymbol/index.tsx
@@ -1,14 +1,18 @@
import React from 'react';
+import type {NativeSyntheticEvent, TextInputSelectionChangeEventData} from 'react-native';
import type {BaseTextInputRef} from '@src/components/TextInput/BaseTextInput/types';
import BaseTextInputWithCurrencySymbol from './BaseTextInputWithCurrencySymbol';
-import type TextInputWithCurrencySymbolProps from './types';
+import type {TextInputWithCurrencySymbolProps} from './types';
-function TextInputWithCurrencySymbol(props: TextInputWithCurrencySymbolProps, ref: React.ForwardedRef) {
+function TextInputWithCurrencySymbol({onSelectionChange = () => {}, ...props}: TextInputWithCurrencySymbolProps, ref: React.ForwardedRef) {
return (
) => {
+ onSelectionChange(event.nativeEvent.selection.start, event.nativeEvent.selection.end);
+ }}
/>
);
}
diff --git a/src/components/TextInputWithCurrencySymbol/index.web.tsx b/src/components/TextInputWithCurrencySymbol/index.web.tsx
new file mode 100644
index 000000000000..f86b764f79cc
--- /dev/null
+++ b/src/components/TextInputWithCurrencySymbol/index.web.tsx
@@ -0,0 +1,42 @@
+import React, {useRef} from 'react';
+import type {NativeSyntheticEvent, TextInputSelectionChangeEventData} from 'react-native';
+import BaseTextInputWithCurrencySymbol from './BaseTextInputWithCurrencySymbol';
+import type {TextInputWithCurrencySymbolProps} from './types';
+
+function TextInputWithCurrencySymbol({onSelectionChange = () => {}, ...props}: TextInputWithCurrencySymbolProps, ref: React.ForwardedRef) {
+ const textInputRef = useRef(null);
+
+ return (
+ {
+ textInputRef.current = element as HTMLFormElement;
+
+ if (!ref) {
+ return;
+ }
+
+ if (typeof ref === 'function') {
+ ref(element as HTMLFormElement);
+ return;
+ }
+
+ // eslint-disable-next-line no-param-reassign
+ ref.current = element as HTMLFormElement;
+ }}
+ onSelectionChange={(event: NativeSyntheticEvent) => {
+ onSelectionChange(event.nativeEvent.selection.start, event.nativeEvent.selection.end);
+ }}
+ onPress={() => {
+ const selectionStart = (textInputRef.current?.selectionStart as number) ?? 0;
+ const selectionEnd = (textInputRef.current?.selectionEnd as number) ?? 0;
+ onSelectionChange(selectionStart, selectionEnd);
+ }}
+ />
+ );
+}
+
+TextInputWithCurrencySymbol.displayName = 'TextInputWithCurrencySymbol';
+
+export default React.forwardRef(TextInputWithCurrencySymbol);
diff --git a/src/components/TextInputWithCurrencySymbol/types.ts b/src/components/TextInputWithCurrencySymbol/types.ts
index 619ed0fd84e6..401af75b16cd 100644
--- a/src/components/TextInputWithCurrencySymbol/types.ts
+++ b/src/components/TextInputWithCurrencySymbol/types.ts
@@ -2,7 +2,7 @@ import type {NativeSyntheticEvent, StyleProp, TextInputFocusEventData, TextInput
import type {TextSelection} from '@components/Composer/types';
import type {BaseTextInputProps} from '@components/TextInput/BaseTextInput/types';
-type TextInputWithCurrencySymbolProps = {
+type BaseTextInputWithCurrencySymbolProps = {
/** Formatted amount in local currency */
formattedAmount: string;
@@ -77,6 +77,12 @@ type TextInputWithCurrencySymbolProps = {
/** Hide the focus styles on TextInput */
hideFocusedState?: boolean;
-} & Pick;
+} & Pick;
-export default TextInputWithCurrencySymbolProps;
+type TextInputWithCurrencySymbolProps = Omit & {
+ onSelectionChange?: (start: number, end: number) => void;
+};
+
+export type {TextInputWithCurrencySymbolProps};
+
+export default BaseTextInputWithCurrencySymbolProps;
diff --git a/src/components/ThumbnailImage.tsx b/src/components/ThumbnailImage.tsx
index 85f100981f85..793a5fbe634d 100644
--- a/src/components/ThumbnailImage.tsx
+++ b/src/components/ThumbnailImage.tsx
@@ -146,7 +146,7 @@ function ThumbnailImage({
return (
- {isDeleted && }
+ {!!isDeleted && }
void;
+
+ /** Handler that fires when file is removed */
+ onRemove: (fileUri: string) => void;
+
+ /** Array containing accepted file types */
+ acceptedFileTypes: Array>;
+
+ /** Styles to be assigned to Container */
+ style?: StyleProp;
+
+ /** Text to display on error message */
+ errorText?: string;
+
+ /** Function called whenever option changes */
+ onInputChange?: (value: FileObject[]) => void;
+
+ /** Function to set error message */
+ setError: (error: string) => void;
+
+ /** Whether to allow multiple files to be selected. */
+ fileLimit?: number;
+
+ /** The total size limit of the files that can be selected. */
+ totalFilesSizeLimit?: number;
+};
+
+function UploadFile({
+ buttonText,
+ uploadedFiles,
+ onUpload,
+ onRemove,
+ acceptedFileTypes,
+ style,
+ errorText = '',
+ setError,
+ onInputChange = () => {},
+ totalFilesSizeLimit = 0,
+ fileLimit = 0,
+}: UploadFileProps) {
+ const {translate} = useLocalize();
+ const styles = useThemeStyles();
+ const theme = useTheme();
+
+ const handleFileUpload = (files: FileObject[]) => {
+ const totalSize = files.reduce((sum, file) => sum + (file.size ?? 0), 0);
+
+ if (totalFilesSizeLimit) {
+ if (totalSize > totalFilesSizeLimit) {
+ setError(translate('attachmentPicker.sizeExceededWithValue', {maxUploadSizeInMB: totalFilesSizeLimit / (1024 * 1024)}));
+ return;
+ }
+ }
+
+ if (fileLimit && files.length > 0 && files.length > fileLimit) {
+ setError(translate('attachmentPicker.tooManyFiles', {fileLimit}));
+ return;
+ }
+
+ if (acceptedFileTypes.length > 0) {
+ const filesExtensions = files.map((file) => FileUtils.splitExtensionFromFileName(file?.name ?? '').fileExtension.toLowerCase());
+
+ if (acceptedFileTypes.every((element) => !filesExtensions.includes(element as string))) {
+ setError(translate('attachmentPicker.notAllowedExtension'));
+ return;
+ }
+ }
+
+ const uploadedFilesNames = uploadedFiles.map((uploadedFile) => uploadedFile.name);
+
+ const newFilesToUpload = files.filter((file) => !uploadedFilesNames.includes(file.name));
+
+ onInputChange(newFilesToUpload);
+ onUpload(newFilesToUpload);
+ };
+
+ return (
+
+
+ {({openPicker}) => (
+
+ {uploadedFiles.map((file) => (
+
+
+
+ {file.name}
+
+ onRemove(file?.uri ?? '')}
+ role={CONST.ROLE.BUTTON}
+ accessibilityLabel={translate('common.remove')}
+ >
+
+
+
+ ))}
+ {errorText !== '' && (
+
+ )}
+
+ );
+}
+
+UploadFile.displayName = 'UploadFile';
+
+export default UploadFile;
diff --git a/src/components/ValidateCodeActionModal/ValidateCodeForm/BaseValidateCodeForm.tsx b/src/components/ValidateCodeActionModal/ValidateCodeForm/BaseValidateCodeForm.tsx
index 02121ce26906..425960078b0a 100644
--- a/src/components/ValidateCodeActionModal/ValidateCodeForm/BaseValidateCodeForm.tsx
+++ b/src/components/ValidateCodeActionModal/ValidateCodeForm/BaseValidateCodeForm.tsx
@@ -63,6 +63,7 @@ type ValidateCodeFormProps = {
/** Function to clear error of the form */
clearError: () => void;
+ /** Function is called when validate code modal is mounted and on magic code resend */
sendValidateCode: () => void;
};
@@ -90,6 +91,9 @@ function BaseValidateCodeForm({
// eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing -- nullish coalescing doesn't achieve the same result in this case
const shouldDisableResendValidateCode = !!isOffline || account?.isLoading;
const focusTimeoutRef = useRef(null);
+ const [timeRemaining, setTimeRemaining] = useState(CONST.REQUEST_CODE_DELAY as number);
+
+ const timerRef = useRef();
useImperativeHandle(innerRef, () => ({
focus() {
@@ -135,12 +139,24 @@ function BaseValidateCodeForm({
inputValidateCodeRef.current?.clear();
}, [hasMagicCodeBeenSent]);
+ useEffect(() => {
+ if (timeRemaining > 0) {
+ timerRef.current = setTimeout(() => {
+ setTimeRemaining(timeRemaining - 1);
+ }, 1000);
+ }
+ return () => {
+ clearTimeout(timerRef.current);
+ };
+ }, [timeRemaining]);
+
/**
* Request a validate code / magic code be sent to verify this contact method
*/
const resendValidateCode = () => {
sendValidateCode();
inputValidateCodeRef.current?.clear();
+ setTimeRemaining(CONST.REQUEST_CODE_DELAY);
};
/**
@@ -177,6 +193,7 @@ function BaseValidateCodeForm({
handleSubmitForm(validateCode);
}, [validateCode, handleSubmitForm]);
+ const shouldShowTimer = timeRemaining > 0 && !isOffline;
return (
<>
+ {shouldShowTimer && (
+
+ {translate('validateCodeForm.requestNewCode')}
+ 00:{String(timeRemaining).padStart(2, '0')}
+
+ )}
User.clearValidateCodeActionError('actionVerified')}
>
-
-
- {translate('validateCodeForm.magicCodeNotReceived')}
-
- {hasMagicCodeBeenSent && (
-
- )}
-
+ {!shouldShowTimer && (
+
+
+ {translate('validateCodeForm.magicCodeNotReceived')}
+
+
+ )}
+ {!!hasMagicCodeBeenSent && (
+
+ )}
(null);
@@ -38,13 +40,13 @@ function ValidateCodeActionModal({
}, [onClose, clearError]);
useEffect(() => {
- if (!firstRenderRef.current || !isVisible) {
+ if (!firstRenderRef.current || !isVisible || hasMagicCodeBeenSent) {
return;
}
firstRenderRef.current = false;
sendValidateCode();
- }, [isVisible, sendValidateCode]);
+ }, [isVisible, sendValidateCode, hasMagicCodeBeenSent]);
return (
-
+ {description}
diff --git a/src/components/VideoPlayer/VideoPlayerControls/ProgressBar/index.tsx b/src/components/VideoPlayer/VideoPlayerControls/ProgressBar/index.tsx
index 5d1ea0d85d0b..c0b8c32cedcb 100644
--- a/src/components/VideoPlayer/VideoPlayerControls/ProgressBar/index.tsx
+++ b/src/components/VideoPlayer/VideoPlayerControls/ProgressBar/index.tsx
@@ -45,21 +45,22 @@ function ProgressBar({duration, position, seekPosition}: ProgressBarProps) {
};
const pan = Gesture.Pan()
+ .runOnJS(true)
.onBegin((event) => {
- runOnJS(setIsSliderPressed)(true);
- runOnJS(checkVideoPlaying)(onCheckVideoPlaying);
- runOnJS(pauseVideo)();
- runOnJS(progressBarInteraction)(event);
+ setIsSliderPressed(true);
+ checkVideoPlaying(onCheckVideoPlaying);
+ pauseVideo();
+ progressBarInteraction(event);
})
.onChange((event) => {
- runOnJS(progressBarInteraction)(event);
+ progressBarInteraction(event);
})
.onFinalize(() => {
- runOnJS(setIsSliderPressed)(false);
+ setIsSliderPressed(false);
if (!wasVideoPlayingOnCheck.value) {
return;
}
- runOnJS(playVideo)();
+ playVideo();
});
useEffect(() => {
diff --git a/src/components/VideoPlayerPreview/VideoPlayerThumbnail.tsx b/src/components/VideoPlayerPreview/VideoPlayerThumbnail.tsx
index 8103b6751d58..832b5eef45f0 100644
--- a/src/components/VideoPlayerPreview/VideoPlayerThumbnail.tsx
+++ b/src/components/VideoPlayerPreview/VideoPlayerThumbnail.tsx
@@ -33,7 +33,7 @@ function VideoPlayerThumbnail({thumbnailUrl, onPress, accessibilityLabel, isDele
return (
- {thumbnailUrl && (
+ {!!thumbnailUrl && (
;
};
-export default function useAutoFocusInput(): UseAutoFocusInput {
+export default function useAutoFocusInput(isMultiline = false): UseAutoFocusInput {
const [isInputInitialized, setIsInputInitialized] = useState(false);
const [isScreenTransitionEnded, setIsScreenTransitionEnded] = useState(false);
@@ -25,6 +26,9 @@ export default function useAutoFocusInput(): UseAutoFocusInput {
return;
}
const focusTaskHandle = InteractionManager.runAfterInteractions(() => {
+ if (inputRef.current && isMultiline) {
+ moveSelectionToEnd(inputRef.current);
+ }
inputRef.current?.focus();
setIsScreenTransitionEnded(false);
});
@@ -32,7 +36,7 @@ export default function useAutoFocusInput(): UseAutoFocusInput {
return () => {
focusTaskHandle.cancel();
};
- }, [isScreenTransitionEnded, isInputInitialized, splashScreenState]);
+ }, [isMultiline, isScreenTransitionEnded, isInputInitialized, splashScreenState]);
useFocusEffect(
useCallback(() => {
@@ -54,6 +58,9 @@ export default function useAutoFocusInput(): UseAutoFocusInput {
if (isInputInitialized) {
return;
}
+ if (ref && isMultiline) {
+ scrollToBottom(ref);
+ }
setIsInputInitialized(true);
};
diff --git a/src/hooks/useEmptyViewHeaderHeight/index.ios.ts b/src/hooks/useEmptyViewHeaderHeight/index.ios.ts
index d59e105574bf..d74e713f4b07 100644
--- a/src/hooks/useEmptyViewHeaderHeight/index.ios.ts
+++ b/src/hooks/useEmptyViewHeaderHeight/index.ios.ts
@@ -1,10 +1,11 @@
import useSafeAreaInsets from '@hooks/useSafeAreaInsets';
import {BUTTON_HEIGHT, BUTTON_MARGIN, HEADER_HEIGHT} from './const';
-function useEmptyViewHeaderHeight(isSmallScreenWidth: boolean): number {
+function useEmptyViewHeaderHeight(isSmallScreenWidth: boolean, areHeaderButtonsDisplayed: boolean): number {
const safeAreaInsets = useSafeAreaInsets();
+ const BUTTONS_HEIGHT = areHeaderButtonsDisplayed ? BUTTON_HEIGHT + BUTTON_MARGIN : 0;
- return isSmallScreenWidth ? HEADER_HEIGHT + BUTTON_HEIGHT + BUTTON_MARGIN + safeAreaInsets.top : HEADER_HEIGHT;
+ return isSmallScreenWidth ? HEADER_HEIGHT + BUTTONS_HEIGHT + safeAreaInsets.top : HEADER_HEIGHT;
}
export default useEmptyViewHeaderHeight;
diff --git a/src/hooks/useEmptyViewHeaderHeight/index.ts b/src/hooks/useEmptyViewHeaderHeight/index.ts
index d241d95b236f..3f0c34d340fa 100644
--- a/src/hooks/useEmptyViewHeaderHeight/index.ts
+++ b/src/hooks/useEmptyViewHeaderHeight/index.ts
@@ -1,7 +1,9 @@
import {BUTTON_HEIGHT, BUTTON_MARGIN, HEADER_HEIGHT} from './const';
-function useEmptyViewHeaderHeight(isSmallScreenWidth: boolean): number {
- return isSmallScreenWidth ? HEADER_HEIGHT + BUTTON_HEIGHT + BUTTON_MARGIN : HEADER_HEIGHT;
+function useEmptyViewHeaderHeight(isSmallScreenWidth: boolean, areHeaderButtonsDisplayed: boolean): number {
+ const BUTTONS_HEIGHT = areHeaderButtonsDisplayed ? BUTTON_HEIGHT + BUTTON_MARGIN : 0;
+
+ return isSmallScreenWidth ? HEADER_HEIGHT + BUTTONS_HEIGHT : HEADER_HEIGHT;
}
export default useEmptyViewHeaderHeight;
diff --git a/src/hooks/useFetchRoute.ts b/src/hooks/useFetchRoute.ts
index 4222f9f0183c..3232b7e02e37 100644
--- a/src/hooks/useFetchRoute.ts
+++ b/src/hooks/useFetchRoute.ts
@@ -1,16 +1,22 @@
import isEqual from 'lodash/isEqual';
import {useEffect} from 'react';
import type {OnyxEntry} from 'react-native-onyx';
-import * as IOUUtils from '@libs/IOUUtils';
import * as TransactionUtils from '@libs/TransactionUtils';
import * as TransactionAction from '@userActions/Transaction';
import type {IOUAction} from '@src/CONST';
+import CONST from '@src/CONST';
import type {Transaction} from '@src/types/onyx';
import type {WaypointCollection} from '@src/types/onyx/Transaction';
+import type TransactionState from '@src/types/utils/TransactionStateType';
import useNetwork from './useNetwork';
import usePrevious from './usePrevious';
-export default function useFetchRoute(transaction: OnyxEntry, waypoints: WaypointCollection | undefined, action: IOUAction) {
+export default function useFetchRoute(
+ transaction: OnyxEntry,
+ waypoints: WaypointCollection | undefined,
+ action: IOUAction,
+ transactionState: TransactionState = CONST.TRANSACTION.STATE.CURRENT,
+) {
const {isOffline} = useNetwork();
const hasRouteError = !!transaction?.errorFields?.route;
const hasRoute = TransactionUtils.hasRoute(transaction);
@@ -27,8 +33,8 @@ export default function useFetchRoute(transaction: OnyxEntry, waypo
return;
}
- TransactionAction.getRoute(transaction.transactionID, validatedWaypoints, IOUUtils.shouldUseTransactionDraft(action));
- }, [shouldFetchRoute, transaction?.transactionID, validatedWaypoints, isOffline, action]);
+ TransactionAction.getRoute(transaction.transactionID, validatedWaypoints, transactionState);
+ }, [shouldFetchRoute, transaction?.transactionID, validatedWaypoints, isOffline, action, transactionState]);
return {shouldFetchRoute, validatedWaypoints};
}
diff --git a/src/hooks/useIndicatorStatus.ts b/src/hooks/useIndicatorStatus.ts
index b026bc52fd7b..7fcd81112a9b 100644
--- a/src/hooks/useIndicatorStatus.ts
+++ b/src/hooks/useIndicatorStatus.ts
@@ -28,6 +28,7 @@ function useIndicatorStatus(): IndicatorStatusResult {
const [userWallet] = useOnyx(ONYXKEYS.USER_WALLET);
const [walletTerms] = useOnyx(ONYXKEYS.WALLET_TERMS);
const [loginList] = useOnyx(ONYXKEYS.LOGIN_LIST);
+ const [privatePersonalDetails] = useOnyx(ONYXKEYS.PRIVATE_PERSONAL_DETAILS);
// If a policy was just deleted from Onyx, then Onyx will pass a null value to the props, and
// those should be cleaned out before doing any error checking
@@ -57,6 +58,7 @@ function useIndicatorStatus(): IndicatorStatusResult {
[CONST.INDICATOR_STATUS.HAS_LOGIN_LIST_ERROR]: !!loginList && UserUtils.hasLoginListError(loginList),
// Wallet term errors that are not caused by an IOU (we show the red brick indicator for those in the LHN instead)
[CONST.INDICATOR_STATUS.HAS_WALLET_TERMS_ERRORS]: Object.keys(walletTerms?.errors ?? {}).length > 0 && !walletTerms?.chatReportID,
+ [CONST.INDICATOR_STATUS.HAS_PHONE_NUMBER_ERROR]: !!privatePersonalDetails?.errorFields?.phoneNumber ?? undefined,
};
const infoChecking: Partial> = {
diff --git a/src/hooks/useNetSuiteImportAddCustomListForm.ts b/src/hooks/useNetSuiteImportAddCustomListForm.ts
new file mode 100644
index 000000000000..aeb37d54b3ba
--- /dev/null
+++ b/src/hooks/useNetSuiteImportAddCustomListForm.ts
@@ -0,0 +1,27 @@
+import type {FormOnyxKeys} from '@components/Form/types';
+import type {OnyxFormKey} from '@src/ONYXKEYS';
+import ONYXKEYS from '@src/ONYXKEYS';
+import useStepFormSubmit from './useStepFormSubmit';
+import type {SubStepProps} from './useSubStep/types';
+
+type UseNetSuiteImportAddCustomListFormSubmitParams = Pick & {
+ formId?: OnyxFormKey;
+ fieldIds: Array>;
+ shouldSaveDraft: boolean;
+};
+
+/**
+ * Hook for handling submit method in NetSuite Custom List substeps.
+ * When user is in editing mode, we should save values only when user confirms the change
+ * @param onNext - callback
+ * @param fieldIds - field IDs for particular step
+ * @param shouldSaveDraft - if we should save draft values
+ */
+export default function useNetSuiteImportAddCustomListFormSubmit({onNext, fieldIds, shouldSaveDraft}: UseNetSuiteImportAddCustomListFormSubmitParams) {
+ return useStepFormSubmit({
+ formId: ONYXKEYS.FORMS.NETSUITE_CUSTOM_LIST_ADD_FORM,
+ onNext,
+ fieldIds,
+ shouldSaveDraft,
+ });
+}
diff --git a/src/hooks/useNetSuiteImportAddCustomSegmentForm.ts b/src/hooks/useNetSuiteImportAddCustomSegmentForm.ts
new file mode 100644
index 000000000000..5e96c851430c
--- /dev/null
+++ b/src/hooks/useNetSuiteImportAddCustomSegmentForm.ts
@@ -0,0 +1,27 @@
+import type {FormOnyxKeys} from '@components/Form/types';
+import type {OnyxFormKey} from '@src/ONYXKEYS';
+import ONYXKEYS from '@src/ONYXKEYS';
+import useStepFormSubmit from './useStepFormSubmit';
+import type {SubStepProps} from './useSubStep/types';
+
+type UseNetSuiteImportAddCustomSegmentFormSubmitParams = Pick & {
+ formId?: OnyxFormKey;
+ fieldIds: Array>;
+ shouldSaveDraft: boolean;
+};
+
+/**
+ * Hook for handling submit method in NetSuite Custom Segment substeps.
+ * When user is in editing mode, we should save values only when user confirms the change
+ * @param onNext - callback
+ * @param fieldIds - field IDs for particular step
+ * @param shouldSaveDraft - if we should save draft values
+ */
+export default function useNetSuiteImportAddCustomSegmentFormSubmit({onNext, fieldIds, shouldSaveDraft}: UseNetSuiteImportAddCustomSegmentFormSubmitParams) {
+ return useStepFormSubmit({
+ formId: ONYXKEYS.FORMS.NETSUITE_CUSTOM_SEGMENT_ADD_FORM,
+ onNext,
+ fieldIds,
+ shouldSaveDraft,
+ });
+}
diff --git a/src/hooks/useNetworkWithOfflineStatus.ts b/src/hooks/useNetworkWithOfflineStatus.ts
new file mode 100644
index 000000000000..9167b0cae969
--- /dev/null
+++ b/src/hooks/useNetworkWithOfflineStatus.ts
@@ -0,0 +1,28 @@
+import type {MutableRefObject} from 'react';
+import {useEffect, useRef} from 'react';
+import DateUtils from '@libs/DateUtils';
+import useLocalize from './useLocalize';
+import useNetwork from './useNetwork';
+
+type UseNetworkWithOfflineStatus = {isOffline: boolean; lastOfflineAt: MutableRefObject; lastOnlineAt: MutableRefObject};
+
+export default function useNetworkWithOfflineStatus(): UseNetworkWithOfflineStatus {
+ const {isOffline} = useNetwork();
+ const {preferredLocale} = useLocalize();
+
+ // The last time/date the user went/was offline. If the user was never offline, it is set to undefined.
+ const lastOfflineAt = useRef(isOffline ? DateUtils.getLocalDateFromDatetime(preferredLocale) : undefined);
+
+ // The last time/date the user went/was online. If the user was never online, it is set to undefined.
+ const lastOnlineAt = useRef(isOffline ? undefined : DateUtils.getLocalDateFromDatetime(preferredLocale));
+
+ useEffect(() => {
+ if (isOffline) {
+ lastOfflineAt.current = DateUtils.getLocalDateFromDatetime(preferredLocale);
+ } else {
+ lastOnlineAt.current = DateUtils.getLocalDateFromDatetime(preferredLocale);
+ }
+ }, [isOffline, preferredLocale]);
+
+ return {isOffline, lastOfflineAt, lastOnlineAt};
+}
diff --git a/src/hooks/useOnboardingFlow.ts b/src/hooks/useOnboardingFlow.ts
index 5ccd3bab9378..66ef088d0e4f 100644
--- a/src/hooks/useOnboardingFlow.ts
+++ b/src/hooks/useOnboardingFlow.ts
@@ -21,12 +21,23 @@ function useOnboardingFlowRouter() {
selector: hasCompletedHybridAppOnboardingFlowSelector,
});
+ const [isSingleNewDotEntry, isSingleNewDotEntryMetadata] = useOnyx(ONYXKEYS.IS_SINGLE_NEW_DOT_ENTRY);
+
useEffect(() => {
- if (isLoadingOnyxValue(isOnboardingCompletedMetadata, isHybridAppOnboardingCompletedMetadata)) {
+ if (isLoadingOnyxValue(isOnboardingCompletedMetadata)) {
+ return;
+ }
+
+ if (NativeModules.HybridAppModule && isLoadingOnyxValue(isHybridAppOnboardingCompletedMetadata, isSingleNewDotEntryMetadata)) {
return;
}
if (NativeModules.HybridAppModule) {
+ // For single entries, such as using the Travel feature from OldDot, we don't want to show onboarding
+ if (isSingleNewDotEntry) {
+ return;
+ }
+
// When user is transitioning from OldDot to NewDot, we usually show the explanation modal
if (isHybridAppOnboardingCompleted === false) {
Navigation.navigate(ROUTES.EXPLANATION_MODAL_ROOT);
@@ -43,7 +54,7 @@ function useOnboardingFlowRouter() {
if (!NativeModules.HybridAppModule && isOnboardingCompleted === false) {
OnboardingFlow.startOnboardingFlow();
}
- }, [isOnboardingCompleted, isHybridAppOnboardingCompleted, isOnboardingCompletedMetadata, isHybridAppOnboardingCompletedMetadata]);
+ }, [isOnboardingCompleted, isHybridAppOnboardingCompleted, isOnboardingCompletedMetadata, isHybridAppOnboardingCompletedMetadata, isSingleNewDotEntryMetadata, isSingleNewDotEntry]);
return {isOnboardingCompleted, isHybridAppOnboardingCompleted};
}
diff --git a/src/hooks/usePermissions.ts b/src/hooks/usePermissions.ts
index 22200304fdd5..e60825b610e9 100644
--- a/src/hooks/usePermissions.ts
+++ b/src/hooks/usePermissions.ts
@@ -1,13 +1,12 @@
import {useContext, useMemo} from 'react';
import {BetasContext} from '@components/OnyxProvider';
import Permissions from '@libs/Permissions';
-import type {IOUType} from '@src/CONST';
type PermissionKey = keyof typeof Permissions;
type UsePermissions = Partial>;
let permissionKey: PermissionKey;
-export default function usePermissions(iouType: IOUType | undefined = undefined): UsePermissions {
+export default function usePermissions(): UsePermissions {
const betas = useContext(BetasContext);
return useMemo(() => {
const permissions: UsePermissions = {};
@@ -16,10 +15,10 @@ export default function usePermissions(iouType: IOUType | undefined = undefined)
if (betas) {
const checkerFunction = Permissions[permissionKey];
- permissions[permissionKey] = checkerFunction(betas, iouType);
+ permissions[permissionKey] = checkerFunction(betas);
}
}
return permissions;
- }, [betas, iouType]);
+ }, [betas]);
}
diff --git a/src/hooks/useReportIDs.tsx b/src/hooks/useReportIDs.tsx
index 7c35f2661336..284d80f737f2 100644
--- a/src/hooks/useReportIDs.tsx
+++ b/src/hooks/useReportIDs.tsx
@@ -2,12 +2,10 @@ import React, {createContext, useCallback, useContext, useMemo} from 'react';
import type {OnyxEntry} from 'react-native-onyx';
import {useOnyx} from 'react-native-onyx';
import {getPolicyEmployeeListByIdWithoutCurrentUser} from '@libs/PolicyUtils';
-import * as ReportActionsUtils from '@libs/ReportActionsUtils';
import SidebarUtils from '@libs/SidebarUtils';
import CONST from '@src/CONST';
import ONYXKEYS from '@src/ONYXKEYS';
import type * as OnyxTypes from '@src/types/onyx';
-import type {Message} from '@src/types/onyx/ReportAction';
import mapOnyxCollectionItems from '@src/utils/mapOnyxCollectionItems';
import useActiveWorkspace from './useActiveWorkspace';
import useCurrentReportID from './useCurrentReportID';
@@ -34,33 +32,6 @@ const ReportIDsContext = createContext({
policyMemberAccountIDs: [],
});
-/**
- * This function (and the few below it), narrow down the data from Onyx to just the properties that we want to trigger a re-render of the component. This helps minimize re-rendering
- * and makes the entire component more performant because it's not re-rendering when a bunch of properties change which aren't ever used in the UI.
- */
-const reportActionsSelector = (reportActions: OnyxEntry): ReportActionsSelector =>
- (reportActions &&
- Object.values(reportActions)
- .filter(Boolean)
- .map((reportAction) => {
- const {reportActionID, actionName, errors = []} = reportAction;
- const originalMessage = ReportActionsUtils.getOriginalMessage(reportAction);
- const message = ReportActionsUtils.getReportActionMessage(reportAction);
- const decision = message?.moderationDecision?.decision;
-
- return {
- reportActionID,
- actionName,
- errors,
- message: [
- {
- moderationDecision: {decision},
- },
- ] as Message[],
- originalMessage,
- };
- })) as ReportActionsSelector;
-
const policySelector = (policy: OnyxEntry): PolicySelector =>
(policy && {
type: policy.type,
@@ -84,7 +55,6 @@ function ReportIDsContextProvider({
const [priorityMode] = useOnyx(ONYXKEYS.NVP_PRIORITY_MODE, {initialValue: CONST.PRIORITY_MODE.DEFAULT});
const [chatReports] = useOnyx(ONYXKEYS.COLLECTION.REPORT);
const [policies] = useOnyx(ONYXKEYS.COLLECTION.POLICY, {selector: (c) => mapOnyxCollectionItems(c, policySelector)});
- const [allReportActions] = useOnyx(ONYXKEYS.COLLECTION.REPORT_ACTIONS, {selector: (c) => mapOnyxCollectionItems(c, reportActionsSelector)});
const [transactionViolations] = useOnyx(ONYXKEYS.COLLECTION.TRANSACTION_VIOLATIONS);
const [reportsDrafts] = useOnyx(ONYXKEYS.COLLECTION.REPORT_DRAFT_COMMENT);
const [betas] = useOnyx(ONYXKEYS.BETAS);
@@ -99,20 +69,10 @@ function ReportIDsContextProvider({
const getOrderedReportIDs = useCallback(
(currentReportID?: string) =>
- SidebarUtils.getOrderedReportIDs(
- currentReportID ?? null,
- chatReports,
- betas,
- policies,
- priorityMode,
- allReportActions,
- transactionViolations,
- activeWorkspaceID,
- policyMemberAccountIDs,
- ),
+ SidebarUtils.getOrderedReportIDs(currentReportID ?? null, chatReports, betas, policies, priorityMode, transactionViolations, activeWorkspaceID, policyMemberAccountIDs),
// we need reports draft in deps array for reloading of list when reportsDrafts will change
// eslint-disable-next-line react-compiler/react-compiler, react-hooks/exhaustive-deps
- [chatReports, betas, policies, priorityMode, allReportActions, transactionViolations, activeWorkspaceID, policyMemberAccountIDs, reportsDrafts],
+ [chatReports, betas, policies, priorityMode, transactionViolations, activeWorkspaceID, policyMemberAccountIDs, reportsDrafts],
);
const orderedReportIDs = useMemo(() => getOrderedReportIDs(), [getOrderedReportIDs]);
diff --git a/src/languages/en.ts b/src/languages/en.ts
index 5daecbc98e5f..221b718a7699 100755
--- a/src/languages/en.ts
+++ b/src/languages/en.ts
@@ -12,7 +12,7 @@ import type {
ApprovalWorkflowErrorParams,
ApprovedAmountParams,
AssignCardParams,
- AssignedYouCardParams,
+ AssignedCardParams,
AssigneeParams,
AuthenticationErrorParams,
AutoPayApprovedReportsLimitErrorParams,
@@ -44,6 +44,7 @@ import type {
ConfirmThatParams,
ConnectionNameParams,
ConnectionParams,
+ CurrencyCodeParams,
CustomersOrJobsLabelParams,
DateParams,
DateShouldBeAfterParams,
@@ -63,6 +64,7 @@ import type {
ExportedToIntegrationParams,
ExportIntegrationSelectedParams,
FeatureNameParams,
+ FileLimitParams,
FiltersAmountBetweenParams,
FormattedMaxLengthParams,
ForwardedAmountParams,
@@ -345,6 +347,7 @@ const translations = {
pleaseSelectOne: 'Please select an option above.',
invalidRateError: 'Please enter a valid rate.',
lowRateError: 'Rate must be greater than 0.',
+ email: 'Please enter a valid email address.',
},
comma: 'comma',
semicolon: 'semicolon',
@@ -500,6 +503,8 @@ const translations = {
protectedPDFNotSupported: 'Password-protected PDF is not supported',
attachmentImageResized: 'This image has been resized for previewing. Download for full resolution.',
attachmentImageTooLarge: 'This image is too large to preview before uploading.',
+ tooManyFiles: ({fileLimit}: FileLimitParams) => `You can only upload up to ${fileLimit} files at a time.`,
+ sizeExceededWithValue: ({maxUploadSizeInMB}: SizeExceededParams) => `Files exceeds ${maxUploadSizeInMB}MB. Please try again.`,
},
filePicker: {
fileError: 'File error',
@@ -596,8 +601,8 @@ const translations = {
},
login: {
hero: {
- header: 'Manage spend, split expenses, and chat with your team.',
- body: 'Welcome to the future of Expensify, your new go-to place for financial collaboration with friends and teammates alike.',
+ header: 'Travel and expense, at the speed of chat',
+ body: 'Welcome to the next generation of Expensify, where your travel and expenses move faster with the help of contextual, realtime chat.',
},
},
thirdPartySignIn: {
@@ -664,7 +669,7 @@ const translations = {
beginningOfChatHistoryDomainRoomPartTwo: ' Use it to chat with colleagues, share tips, and ask questions.',
beginningOfChatHistoryAdminRoomPartOne: ({workspaceName}: BeginningOfChatHistoryAdminRoomPartOneParams) => `This chat is with ${workspaceName} admins.`,
beginningOfChatHistoryAdminRoomPartTwo: ' Use it to chat about workspace setup and more.',
- beginningOfChatHistoryAnnounceRoomPartOne: ({workspaceName}: BeginningOfChatHistoryAnnounceRoomPartOneParams) => `This chat is with everyone in ${workspaceName} workspace.`,
+ beginningOfChatHistoryAnnounceRoomPartOne: ({workspaceName}: BeginningOfChatHistoryAnnounceRoomPartOneParams) => `This chat is with everyone in ${workspaceName}.`,
beginningOfChatHistoryAnnounceRoomPartTwo: ` Use it for the most important announcements.`,
beginningOfChatHistoryUserRoomPartOne: 'This chat room is for anything ',
beginningOfChatHistoryUserRoomPartTwo: ' related.',
@@ -673,7 +678,7 @@ const translations = {
beginningOfChatHistory: 'This chat is with ',
beginningOfChatHistoryPolicyExpenseChatPartOne: 'This is where ',
beginningOfChatHistoryPolicyExpenseChatPartTwo: ' will submit expenses to ',
- beginningOfChatHistoryPolicyExpenseChatPartThree: ' workspace. Just use the + button.',
+ beginningOfChatHistoryPolicyExpenseChatPartThree: '. Just use the + button.',
beginningOfChatHistorySelfDM: 'This is your personal space. Use it for notes, tasks, drafts, and reminders.',
beginningOfChatHistorySystemDM: "Welcome! Let's get you set up.",
chatWithAccountManager: 'Chat with your account manager here',
@@ -953,6 +958,7 @@ const translations = {
error: {
invalidCategoryLength: 'The category name exceeds 255 characters. Please shorten it or choose a different category.',
invalidAmount: 'Please enter a valid amount before continuing.',
+ invalidIntegerAmount: 'Please enter a whole dollar amount before continuing.',
invalidTaxAmount: ({amount}: RequestAmountParams) => `Maximum tax amount is ${amount}`,
invalidSplit: 'The sum of splits must equal the total amount.',
invalidSplitParticipants: 'Please enter an amount greater than zero for at least two participants.',
@@ -1397,7 +1403,7 @@ const translations = {
enableWalletToSendAndReceiveMoney: 'Enable your wallet to send and receive money with friends.',
walletEnabledToSendAndReceiveMoney: 'Your wallet has been enabled to send and receive money with friends.',
enableWallet: 'Enable wallet',
- addBankAccountToSendAndReceive: 'Adding a bank account allows you to get paid back for expenses you submit to a workspace.',
+ addBankAccountToSendAndReceive: 'Add a bank account to get paid back for expenses you submit to a workspace.',
addBankAccount: 'Add bank account',
assignedCards: 'Assigned cards',
assignedCardsDescription: 'These are cards assigned by a workspace admin to manage company spend.',
@@ -1783,6 +1789,7 @@ const translations = {
dateShouldBeAfter: ({dateString}: DateShouldBeAfterParams) => `Date should be after ${dateString}.`,
hasInvalidCharacter: 'Name can only include Latin characters.',
incorrectZipFormat: ({zipFormat}: IncorrectZipFormatParams = {}) => `Incorrect zip code format.${zipFormat ? ` Acceptable format: ${zipFormat}` : ''}`,
+ invalidPhoneNumber: `Please ensure the phone number is valid (e.g. ${CONST.EXAMPLE_PHONE_NUMBER}).`,
},
},
resendValidationForm: {
@@ -1913,7 +1920,7 @@ const translations = {
noBankAccountAvailable: "Sorry, there's no bank account available.",
noBankAccountSelected: 'Please choose an account.',
taxID: 'Please enter a valid tax ID number.',
- website: 'Please enter a valid website using lower-case letters.',
+ website: 'Please enter a valid website.',
zipCode: `Please enter a valid ZIP code using the format: ${CONST.COUNTRY_ZIP_REGEX_DATA.US.samples}.`,
phoneNumber: 'Please enter a valid phone number.',
companyName: 'Please enter a valid business name.',
@@ -2164,6 +2171,33 @@ const translations = {
listOfRestrictedBusinesses: 'list of restricted businesses',
confirmCompanyIsNot: 'I confirm that this company is not on the',
businessInfoTitle: 'Business info',
+ legalBusinessName: 'Legal business name',
+ whatsTheBusinessName: "What's the business name?",
+ whatsTheBusinessAddress: "What's the business address?",
+ whatsTheBusinessContactInformation: "What's the business contact information?",
+ whatsTheBusinessRegistrationNumber: "What's the business registration number?",
+ whatsThisNumber: "What's this number?",
+ whereWasTheBusinessIncorporated: 'Where was the business incorporated?',
+ whatTypeOfBusinessIsIt: 'What type of business is it?',
+ whatsTheBusinessAnnualPayment: "What's the business's annual payment volume?",
+ registrationNumber: 'Registration number',
+ businessAddress: 'Business address',
+ businessType: 'Business type',
+ incorporation: 'Incorporation',
+ incorporationCountry: 'Incorporation country',
+ incorporationTypeName: 'Incorporation type',
+ businessCategory: 'Business category',
+ annualPaymentVolume: 'Annual payment volume',
+ annualPaymentVolumeInCurrency: ({currencyCode}: CurrencyCodeParams) => `Annual payment volume in ${currencyCode}`,
+ selectIncorporationType: 'Select incorporation type',
+ selectBusinessCategory: 'Select business category',
+ selectAnnualPaymentVolume: 'Select annual payment volume',
+ selectIncorporationCountry: 'Select incorporation country',
+ selectIncorporationState: 'Select incorporation state',
+ findIncorporationType: 'Find incorporation type',
+ findBusinessCategory: 'Find business category',
+ findAnnualPaymentVolume: 'Find annual payment volume',
+ findIncorporationState: 'Find incorporation state',
},
beneficialOwnerInfoStep: {
doYouOwn25percent: 'Do you own 25% or more of',
@@ -2245,6 +2279,10 @@ const translations = {
countryStep: {
confirmBusinessBank: 'Confirm business bank account currency and country',
confirmCurrency: 'Confirm currency and country',
+ yourBusiness: 'Your business bank account currency must match your workspace currency.',
+ youCanChange: 'You can change your workspace currency in your',
+ findCountry: 'Find country',
+ selectCountry: 'Select country',
},
signerInfoStep: {
signerInfo: 'Signer info',
@@ -2328,6 +2366,7 @@ const translations = {
displayedAs: 'Displayed as',
plan: 'Plan',
profile: 'Profile',
+ perDiem: 'Per diem',
bankAccount: 'Bank account',
connectBankAccount: 'Connect bank account',
testTransactions: 'Test transactions',
@@ -2392,6 +2431,25 @@ const translations = {
}
},
},
+ perDiem: {
+ subtitle: 'Set per diem rates to control daily employee spend. ',
+ destination: 'Destination',
+ subrate: 'Subrate',
+ amount: 'Amount',
+ deleteRates: () => ({
+ one: 'Delete rate',
+ other: 'Delete rates',
+ }),
+ deletePerDiemRate: 'Delete per diem rate',
+ areYouSureDelete: () => ({
+ one: 'Are you sure you want to delete this rate?',
+ other: 'Are you sure you want to delete these rates?',
+ }),
+ emptyList: {
+ title: 'Per diem',
+ subtitle: 'Set per diem rates to control daily employee spend. Import rates from a spreadsheet to get started.',
+ },
+ },
qbd: {
exportOutOfPocketExpensesDescription: 'Set how out-of-pocket expenses export to QuickBooks Desktop.',
exportOutOfPocketExpensesCheckToogle: 'Mark checks as “print later”',
@@ -2468,6 +2526,10 @@ const translations = {
setupPage: {
title: 'Open this link to connect',
body: 'To complete setup, open the following link on the computer where QuickBooks Desktop is running.',
+ setupErrorTitle: 'Something went wrong',
+ setupErrorBody1: "The QuickBooks Desktop connection isn't working at the moment. Please try again later or",
+ setupErrorBody2: 'if the problem persists.',
+ setupErrorBodyContactConcierge: 'reach out to Concierge',
},
importDescription: 'Choose which coding configurations to import from QuickBooks Desktop to Expensify.',
classes: 'Classes',
@@ -3084,7 +3146,7 @@ const translations = {
enableFeed: {
title: ({provider}: GoBackMessageParams) => `Enable your ${provider} feed`,
heading: 'We have a direct integration with your card issuer and can import your transaction data into Expensify quickly and accurately.\n\nTo get started, simply:',
- vcf: `1. Visit [this help article](${CONST.COMPANY_CARDS_HELP}) for detailed instructionson how to set up your Visa Commercial Cards.\n\n2. [Contact your bank](${CONST.COMPANY_CARDS_HELP}) to verify they support a custom feed for your program, and ask them toenable it.\n\n3. *Once the feed is enabled and you have its details, continue to the next screen.*`,
+ vcf: `1. Visit [this help article](${CONST.COMPANY_CARDS_HELP}) for detailed instructions on how to set up your Visa Commercial Cards.\n\n2. [Contact your bank](${CONST.COMPANY_CARDS_HELP}) to verify they support a custom feed for your program, and ask them toenable it.\n\n3. *Once the feed is enabled and you have its details, continue to the next screen.*`,
gl1025: `1. Visit [this help article](${CONST.COMPANY_CARDS_HELP}) to find out if American Express can enable a custom feed for your program.\n\n2. Once the feed is enabled, Amex will send you a production letter.\n\n3. *Once you have the feed information, continue to the next screen.*`,
cdf: `1. Visit [this help article](${CONST.COMPANY_CARDS_HELP}) for detailed instructions on how to set up your Mastercard Commercial Cards.\n\n 2. [Contact your bank](${CONST.COMPANY_CARDS_HELP}) to verify they support a custom feed for your program, and ask them to enable it.\n\n3. *Once the feed is enabled and you have its details, continue to the next screen.*`,
stripe: `1. Visit Stripe’s Dashboard, and go to [Settings](${CONST.COMPANY_CARDS_STRIPE_HELP}).\n\n2. Under Product Integrations, click Enable next to Expensify.\n\n3. Once the feed is enabled, click Submit below and we’ll work on adding it.`,
@@ -3097,14 +3159,17 @@ const translations = {
processorLabel: 'Processor ID',
bankLabel: 'Financial institution (bank) ID',
companyLabel: 'Company ID',
+ helpLabel: 'Where do I find these IDs?',
},
gl1025: {
title: `What's the Amex delivery file name?`,
fileNameLabel: 'Delivery file name',
+ helpLabel: 'Where do I find the delivery file name?',
},
cdf: {
title: `What's the Mastercard distribution ID?`,
distributionLabel: 'Distribution ID',
+ helpLabel: 'Where do I find the distribution ID?',
},
},
amexCorporate: 'Select this if the front of your cards say “Corporate”',
@@ -3118,6 +3183,7 @@ const translations = {
assignCard: 'Assign card',
cardNumber: 'Card number',
customFeed: 'Custom feed',
+ feedName: ({feedName}: CompanyCardFeedNameParams) => `${feedName} cards`,
directFeed: 'Direct feed',
whoNeedsCardAssigned: 'Who needs a card assigned?',
chooseCard: 'Choose a card',
@@ -3133,18 +3199,19 @@ const translations = {
confirmationDescription: 'We’ll begin importing transactions immediately.',
cardholder: 'Cardholder',
card: 'Card',
- startTransactionDate: 'Start transaction date',
cardName: 'Card name',
brokenConnectionErrorFirstPart: `Card feed connection is broken. Please `,
brokenConnectionErrorLink: 'log into your bank ',
brokenConnectionErrorSecondPart: 'so we can establish the connection again.',
- assignedYouCard: ({link}: AssignedYouCardParams) => `assigned you a ${link}! Imported transactions will appear in this chat.`,
+ assignedCard: ({assignee, link}: AssignedCardParams) => `assigned ${assignee} a ${link}! Imported transactions will appear in this chat.`,
companyCard: 'company card',
chooseCardFeed: 'Choose card feed',
},
expensifyCard: {
issueAndManageCards: 'Issue and manage your Expensify Cards',
getStartedIssuing: 'Get started by issuing your first virtual or physical card.',
+ verificationInProgress: 'Verification in progress...',
+ verifyingTheDetails: "We're verifying a few details. Concierge will let you know when Expensify Cards are ready to issue.",
disclaimer:
'The Expensify Visa® Commercial Card is issued by The Bancorp Bank, N.A., Member FDIC, pursuant to a license from Visa U.S.A. Inc. and may not be used at all merchants that accept Visa cards. Apple® and the Apple logo® are trademarks of Apple Inc., registered in the U.S. and other countries. App Store is a service mark of Apple Inc. Google Play and the Google Play logo are trademarks of Google LLC.',
issueCard: 'Issue card',
@@ -3200,6 +3267,16 @@ const translations = {
issuedCardNoShippingDetails: ({assignee}: AssigneeParams) => `issued ${assignee} an Expensify Card! The card will be shipped once shipping details are added.`,
issuedCardVirtual: ({assignee, link}: IssueVirtualCardParams) => `issued ${assignee} a virtual ${link}! The card can be used right away.`,
addedShippingDetails: ({assignee}: AssigneeParams) => `${assignee} added shipping details. Expensify Card will arrive in 2-3 business days.`,
+ verifyingHeader: 'Verifying',
+ bankAccountVerifiedHeader: 'Bank account verified',
+ verifyingBankAccount: 'Verifying bank account...',
+ verifyingBankAccountDescription: 'Please wait while we confirm that this account can be used to issue Expensify Cards.',
+ bankAccountVerified: 'Bank account verified!',
+ bankAccountVerifiedDescription: 'You can now issue Expensify Cards to your workspace members.',
+ oneMoreStep: 'One more step...',
+ oneMoreStepDescription: 'Looks like we need to manually verify your bank account. Please head on over to Concierge where your instructions are waiting for you.',
+ gotIt: 'Got it',
+ goToConcierge: 'Go to Concierge',
},
categories: {
deleteCategories: 'Delete categories',
@@ -3262,6 +3339,10 @@ const translations = {
title: 'Distance rates',
subtitle: 'Add, update, and enforce rates.',
},
+ perDiem: {
+ title: 'Per diem',
+ subtitle: 'Set Per diem rates to control daily employee spend.',
+ },
expensifyCard: {
title: 'Expensify Card',
subtitle: 'Gain insights and control over spend.',
@@ -3298,7 +3379,7 @@ const translations = {
cardNumber: 'Card number',
cardholder: 'Cardholder',
cardName: 'Card name',
- integrationExport: ({integration, type}: IntegrationExportParams) => `${integration} ${type} export`,
+ integrationExport: ({integration, type}: IntegrationExportParams) => `${integration} ${type?.toLowerCase()} export`,
integrationExportTitleFirstPart: ({integration}: IntegrationExportParams) => `Choose the ${integration} account where transactions should be exported. Select a different`,
integrationExportTitleLinkPart: 'export option',
integrationExportTitleSecondPart: 'to change the available accounts.',
@@ -3494,12 +3575,12 @@ const translations = {
},
emptyWorkspace: {
title: 'Create a workspace',
- subtitle: 'Workspaces are where you’ll chat with your team, reimburse expenses, issue cards, send invoices, pay bills, and more - all in one place.',
+ subtitle: 'Create a workspace to track receipts, reimburse expenses, send invoices, and more -- all at the speed of chat.',
createAWorkspaceCTA: 'Get Started',
features: {
trackAndCollect: 'Track and collect receipts',
- companyCards: 'Company credit cards',
- reimbursements: 'Easy reimbursements',
+ reimbursements: 'Reimburse employees',
+ companyCards: 'Manage company cards',
},
notFound: 'No workspace found',
description: 'Rooms are a great place to discuss and work with multiple people. To begin collaborating, create or join a workspace',
@@ -3564,6 +3645,7 @@ const translations = {
fixedAmount: 'Fixed amount',
fixedAmountDescription: 'Spend up to a certain amount once',
setLimit: 'Set a limit',
+ cardLimitError: 'Please enter an amount less than $21,474,836',
giveItName: 'Give it a name',
giveItNameInstruction: 'Make it unique enough to tell apart from other cards. Specific use cases are even better!',
cardName: 'Card name',
@@ -3632,6 +3714,8 @@ const translations = {
return "Can't connect to Xero.";
case CONST.POLICY.CONNECTIONS.NAME.NETSUITE:
return "Can't connect to NetSuite.";
+ case CONST.POLICY.CONNECTIONS.NAME.QBD:
+ return "Can't connect to QuickBooks Desktop.";
default: {
return "Can't connect to integration.";
}
@@ -4027,7 +4111,7 @@ const translations = {
},
companyCards: {
title: 'Company cards',
- description: `Company cards lets you import spend for existing company cards from all major card issuers. You can assign cards to employees, and automatically import transactions.`,
+ description: `Connect your existing corporate cards to Expensify, assign them to employees, and automatically import transactions.`,
onlyAvailableOnPlan: 'Company cards are only available on the Control plan, starting at ',
},
rules: {
@@ -4035,6 +4119,12 @@ const translations = {
description: `Rules run in the background and keep your spend under control so you don't have to sweat the small stuff.\n\nRequire expense details like receipts and descriptions, set limits and defaults, and automate approvals and payments – all in one place.`,
onlyAvailableOnPlan: 'Rules are only available on the Control plan, starting at ',
},
+ perDiem: {
+ title: 'Per diem',
+ description:
+ 'Per diem is a great way to keep your daily costs compliant and predictable whenever your employees travel. Enjoy features like custom rates, default categories, and more granular details like destinations and subrates.',
+ onlyAvailableOnPlan: 'Per diem are only available on the Control plan, starting at ',
+ },
pricing: {
amount: '$9 ',
perActiveMember: 'per active member per month.',
@@ -4268,7 +4358,6 @@ const translations = {
},
statementPage: {
title: ({year, monthName}: StatementTitleParams) => `${monthName} ${year} statement`,
- generatingPDF: "We're generating your PDF right now. Please check back soon!",
},
keyboardShortcutsPage: {
title: 'Keyboard shortcuts',
@@ -4346,6 +4435,7 @@ const translations = {
recentChats: 'Recent chats',
searchIn: 'Search in',
searchPlaceholder: 'Search for something',
+ suggestions: 'Suggestions',
},
genericErrorPage: {
title: 'Uh-oh, something went wrong!',
@@ -4505,7 +4595,7 @@ const translations = {
pressKit: 'Press Kit',
support: 'Support',
expensifyHelp: 'ExpensifyHelp',
- community: 'Community',
+ terms: 'Terms of Service',
privacy: 'Privacy',
learnMore: 'Learn More',
aboutExpensify: 'About Expensify',
@@ -4730,12 +4820,12 @@ const translations = {
},
modifiedDate: 'Date differs from scanned receipt',
nonExpensiworksExpense: 'Non-Expensiworks expense',
- overAutoApprovalLimit: ({formattedLimit}: ViolationsOverLimitParams) => `Expense exceeds auto approval limit of ${formattedLimit}`,
+ overAutoApprovalLimit: ({formattedLimit}: ViolationsOverLimitParams) => `Expense exceeds auto-approval limit of ${formattedLimit}`,
overCategoryLimit: ({formattedLimit}: ViolationsOverCategoryLimitParams) => `Amount over ${formattedLimit}/person category limit`,
overLimit: ({formattedLimit}: ViolationsOverLimitParams) => `Amount over ${formattedLimit}/person limit`,
overLimitAttendee: ({formattedLimit}: ViolationsOverLimitParams) => `Amount over ${formattedLimit}/person limit`,
perDayLimit: ({formattedLimit}: ViolationsPerDayLimitParams) => `Amount over daily ${formattedLimit}/person category limit`,
- receiptNotSmartScanned: 'Receipt not verified. Please confirm accuracy.',
+ receiptNotSmartScanned: 'Receipt scan incomplete. Please verify details manually.',
receiptRequired: ({formattedLimit, category}: ViolationsReceiptRequiredParams) => {
let message = 'Receipt required';
if (formattedLimit ?? category) {
@@ -5121,6 +5211,7 @@ const translations = {
RBR: 'RBR',
true: 'true',
false: 'false',
+ viewReport: 'View Report',
reasonVisibleInLHN: {
hasDraftComment: 'Has draft comment',
hasGBR: 'Has GBR',
@@ -5165,6 +5256,10 @@ const translations = {
emptySearchView: {
takeATour: 'Take a tour',
},
+ tour: {
+ takeATwoMinuteTour: 'Take a 2-minute tour',
+ exploreExpensify: 'Explore everything Expensify has to offer',
+ },
};
export default translations satisfies TranslationDeepObject;
diff --git a/src/languages/es.ts b/src/languages/es.ts
index c38e9052bd60..1db2cd23011e 100644
--- a/src/languages/es.ts
+++ b/src/languages/es.ts
@@ -10,7 +10,7 @@ import type {
ApprovalWorkflowErrorParams,
ApprovedAmountParams,
AssignCardParams,
- AssignedYouCardParams,
+ AssignedCardParams,
AssigneeParams,
AuthenticationErrorParams,
AutoPayApprovedReportsLimitErrorParams,
@@ -42,6 +42,7 @@ import type {
ConfirmThatParams,
ConnectionNameParams,
ConnectionParams,
+ CurrencyCodeParams,
CustomersOrJobsLabelParams,
DateParams,
DateShouldBeAfterParams,
@@ -61,6 +62,7 @@ import type {
ExportedToIntegrationParams,
ExportIntegrationSelectedParams,
FeatureNameParams,
+ FileLimitParams,
FiltersAmountBetweenParams,
FormattedMaxLengthParams,
ForwardedAmountParams,
@@ -335,6 +337,7 @@ const translations = {
pleaseSelectOne: 'Seleccione una de las opciones.',
invalidRateError: 'Por favor, introduce una tarifa válida.',
lowRateError: 'La tarifa debe ser mayor que 0.',
+ email: 'Por favor, introduzca una dirección de correo electrónico válida.',
},
comma: 'la coma',
semicolon: 'el punto y coma',
@@ -494,6 +497,8 @@ const translations = {
protectedPDFNotSupported: 'Los PDFs con contraseña no son compatibles',
attachmentImageResized: 'Se ha cambiado el tamaño de esta imagen para obtener una vista previa. Descargar para resolución completa.',
attachmentImageTooLarge: 'Esta imagen es demasiado grande para obtener una vista previa antes de subirla.',
+ tooManyFiles: ({fileLimit}: FileLimitParams) => `Solamente puedes suber ${fileLimit} archivos a la vez.`,
+ sizeExceededWithValue: ({maxUploadSizeInMB}: SizeExceededParams) => `El archivo supera los ${maxUploadSizeInMB}MB. Por favor, vuelve a intentarlo.`,
},
filePicker: {
fileError: 'Error de archivo',
@@ -587,8 +592,8 @@ const translations = {
},
login: {
hero: {
- header: 'Gestiona, divide gastos y chatea con tu equipo.',
- body: 'Bienvenido al futuro de Expensify, tu nuevo lugar de referencia para la colaboración financiera con amigos y compañeros de equipo por igual.',
+ header: 'Viajes y gastos, a la velocidad del chat',
+ body: 'Bienvenido a la próxima generación de Expensify, donde tus viajes y gastos avanzan más rápido con la ayuda de un chat contextual en tiempo real.',
},
},
thirdPartySignIn: {
@@ -658,7 +663,7 @@ const translations = {
beginningOfChatHistoryAdminRoomPartOne: ({workspaceName}: BeginningOfChatHistoryAdminRoomPartOneParams) =>
`Este chat es con los administradores del espacio de trabajo ${workspaceName}.`,
beginningOfChatHistoryAdminRoomPartTwo: ' Use it to chat about workspace setup and more.',
- beginningOfChatHistoryAnnounceRoomPartOne: ({workspaceName}: BeginningOfChatHistoryAnnounceRoomPartOneParams) => `Este chat es con todos en el espacio de trabajo ${workspaceName}.`,
+ beginningOfChatHistoryAnnounceRoomPartOne: ({workspaceName}: BeginningOfChatHistoryAnnounceRoomPartOneParams) => `Este chat es con todos en ${workspaceName}.`,
beginningOfChatHistoryAnnounceRoomPartTwo: ` Úsalo para hablar sobre la configuración del espacio de trabajo y más.`,
beginningOfChatHistoryUserRoomPartOne: 'ste chat es para todo lo relacionado con ',
beginningOfChatHistoryUserRoomPartTwo: ' Fue creado por.',
@@ -950,6 +955,7 @@ const translations = {
error: {
invalidCategoryLength: 'La longitud de la categoría escogida excede el máximo permitido (255). Por favor, escoge otra categoría o acorta la categoría primero.',
invalidAmount: 'Por favor, ingresa un importe válido antes de continuar.',
+ invalidIntegerAmount: 'Por favor, introduce una cantidad entera en dólares antes de continuar.',
invalidTaxAmount: ({amount}: RequestAmountParams) => `El importe máximo del impuesto es ${amount}`,
invalidSplit: 'La suma de las partes debe ser igual al importe total.',
invalidSplitParticipants: 'Introduce un importe superior a cero para al menos dos participantes.',
@@ -1397,7 +1403,7 @@ const translations = {
enableWalletToSendAndReceiveMoney: 'Habilita tu Billetera Expensify para comenzar a enviar y recibir dinero con amigos.',
walletEnabledToSendAndReceiveMoney: 'Tu billetera ha sido habilitada para enviar y recibir dinero con amigos.',
enableWallet: 'Habilitar billetera',
- addBankAccountToSendAndReceive: 'Agregar una cuenta bancaria te permite recibir reembolsos por los gastos que envíes a un espacio de trabajo.',
+ addBankAccountToSendAndReceive: 'Añade una cuenta bancaria para recibir reembolsos por los gastos que envíes a un espacio de trabajo.',
addBankAccount: 'Añadir cuenta bancaria',
assignedCards: 'Tarjetas asignadas',
assignedCardsDescription: 'Son tarjetas asignadas por un administrador del espacio de trabajo para gestionar los gastos de la empresa.',
@@ -1784,6 +1790,7 @@ const translations = {
dateShouldBeAfter: ({dateString}: DateShouldBeAfterParams) => `La fecha debe ser posterior a ${dateString}.`,
incorrectZipFormat: ({zipFormat}: IncorrectZipFormatParams = {}) => `Formato de código postal incorrecto.${zipFormat ? ` Formato aceptable: ${zipFormat}` : ''}`,
hasInvalidCharacter: 'El nombre sólo puede incluir caracteres latinos.',
+ invalidPhoneNumber: `Asegúrese de que el número de teléfono sean válidos (p. ej. ${CONST.EXAMPLE_PHONE_NUMBER}).`,
},
},
resendValidationForm: {
@@ -1932,7 +1939,7 @@ const translations = {
noBankAccountAvailable: 'Lo sentimos, no hay ninguna cuenta bancaria disponible.',
noBankAccountSelected: 'Por favor, elige una cuenta bancaria.',
taxID: 'Por favor, introduce un número de identificación fiscal válido.',
- website: 'Por favor, introduce un sitio web válido. El sitio web debe estar en minúsculas.',
+ website: 'Por favor, introduce un sitio web válido.',
zipCode: `Formato de código postal incorrecto. Formato aceptable: ${CONST.COUNTRY_ZIP_REGEX_DATA.US.samples}.`,
phoneNumber: 'Por favor, introduce un teléfono válido.',
companyName: 'Por favor, introduce un nombre comercial legal válido.',
@@ -2187,6 +2194,33 @@ const translations = {
listOfRestrictedBusinesses: 'lista de negocios restringidos',
confirmCompanyIsNot: 'Confirmo que esta empresa no está en la',
businessInfoTitle: 'Información del negocio',
+ legalBusinessName: 'Nombre legal de la empresa',
+ whatsTheBusinessName: '¿Cuál es el nombre de la empresa?',
+ whatsTheBusinessAddress: '¿Cuál es la dirección de la empresa?',
+ whatsTheBusinessContactInformation: '¿Cuál es la información de contacto de la empresa?',
+ whatsTheBusinessRegistrationNumber: '¿Cuál es el número de registro de la empresa?',
+ whatsThisNumber: '¿Qué es este número?',
+ whereWasTheBusinessIncorporated: '¿Dónde se constituyó la empresa?',
+ whatTypeOfBusinessIsIt: '¿Qué tipo de empresa es?',
+ whatsTheBusinessAnnualPayment: '¿Cuál es el volumen anual de pagos de la empresa?',
+ registrationNumber: 'Número de registro',
+ businessAddress: 'Dirección de la empresa',
+ businessType: 'Tipo de empresa',
+ incorporation: 'Constitución',
+ incorporationCountry: 'País de constitución',
+ incorporationTypeName: 'Tipo de constitución',
+ businessCategory: 'Categoría de la empresa',
+ annualPaymentVolume: 'Volumen anual de pagos',
+ annualPaymentVolumeInCurrency: ({currencyCode}: CurrencyCodeParams) => `Volumen anual de pagos en ${currencyCode}`,
+ selectIncorporationType: 'Seleccione tipo de constitución',
+ selectBusinessCategory: 'Seleccione categoría de la empresa',
+ selectAnnualPaymentVolume: 'Seleccione volumen anual de pagos',
+ selectIncorporationCountry: 'Seleccione país de constitución',
+ selectIncorporationState: 'Seleccione estado de constitución',
+ findIncorporationType: 'Buscar tipo de constitución',
+ findBusinessCategory: 'Buscar categoría de la empresa',
+ findAnnualPaymentVolume: 'Buscar volumen anual de pagos',
+ findIncorporationState: 'Buscar estado de constitución',
},
beneficialOwnerInfoStep: {
doYouOwn25percent: '¿Posees el 25% o más de',
@@ -2268,6 +2302,10 @@ const translations = {
countryStep: {
confirmBusinessBank: 'Confirmar moneda y país de la cuenta bancaria comercial',
confirmCurrency: 'Confirmar moneda y país',
+ yourBusiness: 'La moneda de su cuenta bancaria comercial debe coincidir con la moneda de su espacio de trabajo.',
+ youCanChange: 'Puede cambiar la moneda de su espacio de trabajo en su',
+ findCountry: 'Encontrar país',
+ selectCountry: 'Seleccione su país',
},
signerInfoStep: {
signerInfo: 'Información del firmante',
@@ -2349,6 +2387,7 @@ const translations = {
rules: 'Reglas',
plan: 'Plan',
profile: 'Perfil',
+ perDiem: 'Per diem',
bankAccount: 'Cuenta bancaria',
displayedAs: 'Mostrado como',
connectBankAccount: 'Conectar cuenta bancaria',
@@ -2415,6 +2454,25 @@ const translations = {
}
},
},
+ perDiem: {
+ subtitle: 'Establece las tasas per diem para controlar los gastos diarios de los empleados. ',
+ destination: 'Destino',
+ subrate: 'Subtasa',
+ amount: 'Cantidad',
+ deleteRates: () => ({
+ one: 'Eliminar tasa',
+ other: 'Eliminar tasas',
+ }),
+ deletePerDiemRate: 'Eliminar tasa per diem',
+ areYouSureDelete: () => ({
+ one: '¿Estás seguro de que quieres eliminar esta tasa?',
+ other: '¿Estás seguro de que quieres eliminar estas tasas?',
+ }),
+ emptyList: {
+ title: 'Per diem',
+ subtitle: 'Establece dietas per diem para controlar el gasto diario de los empleados. Importa las tarifas desde una hoja de cálculo para comenzar.',
+ },
+ },
qbd: {
exportOutOfPocketExpensesDescription: 'Establezca cómo se exportan los gastos de bolsillo a QuickBooks Desktop.',
exportOutOfPocketExpensesCheckToogle: 'Marcar los cheques como “imprimir más tarde”',
@@ -2493,6 +2551,10 @@ const translations = {
setupPage: {
title: 'Abre este enlace para conectar',
body: 'Para completar la configuración, abre el siguiente enlace en la computadora donde se está ejecutando QuickBooks Desktop.',
+ setupErrorTitle: '¡Ups! Ha ocurrido un error',
+ setupErrorBody1: 'La conexión con QuickBooks Desktop no está funcionando en este momento. Por favor, inténtalo de nuevo más tarde o',
+ setupErrorBody2: 'si el problema persiste.',
+ setupErrorBodyContactConcierge: 'contacta con Concierge',
},
importDescription: 'Elige que configuraciónes de codificación son importadas desde QuickBooks Desktop a Expensify.',
classes: 'Clases',
@@ -3095,8 +3157,8 @@ const translations = {
},
type: {
free: 'Gratis',
- control: 'Control',
- collect: 'Recolectar',
+ control: 'Controlar',
+ collect: 'Recopilar',
},
companyCards: {
addCompanyCards: 'Agregar tarjetas de empresa',
@@ -3136,14 +3198,17 @@ const translations = {
processorLabel: 'ID del procesador',
bankLabel: 'Identificación de la institución financiera (banco)',
companyLabel: 'Empresa ID',
+ helpLabel: '¿Dónde encuentro estos IDs?',
},
gl1025: {
title: `¿Cuál es el nombre del archivo de entrega de Amex?`,
fileNameLabel: 'Nombre del archivo de entrega',
+ helpLabel: '¿Dónde encuentro el nombre del archivo de entrega?',
},
cdf: {
title: `¿Cuál es el identificador de distribución de Mastercard?`,
distributionLabel: 'ID de distribución',
+ helpLabel: '¿Dónde encuentro el ID de distribución?',
},
},
amexCorporate: 'Seleccione esto si el frente de sus tarjetas dice “Corporativa”',
@@ -3157,6 +3222,7 @@ const translations = {
assignCard: 'Asignar tarjeta',
cardNumber: 'Número de la tarjeta',
customFeed: 'Fuente personalizada',
+ feedName: ({feedName}: CompanyCardFeedNameParams) => `Tarjetas ${feedName}`,
directFeed: 'Fuente directa',
whoNeedsCardAssigned: '¿Quién necesita una tarjeta?',
chooseCard: 'Elige una tarjeta',
@@ -3172,18 +3238,19 @@ const translations = {
confirmationDescription: 'Comenzaremos a importar transacciones inmediatamente.',
cardholder: 'Titular de la tarjeta',
card: 'Tarjeta',
- startTransactionDate: 'Fecha de inicio de transacciones',
cardName: 'Nombre de la tarjeta',
brokenConnectionErrorFirstPart: `La conexión de la fuente de tarjetas está rota. Por favor, `,
brokenConnectionErrorLink: 'inicia sesión en tu banco ',
brokenConnectionErrorSecondPart: 'para que podamos restablecer la conexión.',
- assignedYouCard: ({link}: AssignedYouCardParams) => `te ha asignado una ${link}! Las transacciones importadas aparecerán en este chat.`,
+ assignedCard: ({assignee, link}: AssignedCardParams) => `ha asignado a ${assignee} una ${link}! Las transacciones importadas aparecerán en este chat.`,
companyCard: 'tarjeta de empresa',
chooseCardFeed: 'Elige feed de tarjetas',
},
expensifyCard: {
issueAndManageCards: 'Emitir y gestionar Tarjetas Expensify',
getStartedIssuing: 'Empieza emitiendo tu primera tarjeta virtual o física.',
+ verificationInProgress: 'Verificación en curso...',
+ verifyingTheDetails: "We're verifying a few details. Concierge will let you know when Expensify Cards are ready to issue.",
disclaimer:
'La tarjeta comercial Expensify Visa® es emitida por The Bancorp Bank, N.A., miembro de la FDIC, en virtud de una licencia de Visa U.S.A. Inc. y no puede utilizarse en todos los comercios que aceptan tarjetas Visa. Apple® y el logotipo de Apple® son marcas comerciales de Apple Inc. registradas en EE.UU. y otros países. App Store es una marca de servicio de Apple Inc. Google Play y el logotipo de Google Play son marcas comerciales de Google LLC.',
issueCard: 'Emitir tarjeta',
@@ -3237,10 +3304,20 @@ const translations = {
changeCardMonthlyLimitTypeWarning: ({limit}: CharacterLimitParams) =>
`Si cambias el tipo de límite de esta tarjeta a Mensual, las nuevas transacciones serán rechazadas porque ya se ha alcanzado el límite de ${limit} mensual.`,
addShippingDetails: 'Añadir detalles de envío',
- issuedCard: ({assignee}: AssigneeParams) => `¡emitió a ${assignee} una Tarjeta Expensify! La tarjeta llegará en 2-3 días laborables.`,
- issuedCardNoShippingDetails: ({assignee}: AssigneeParams) => `¡emitió a ${assignee} una Tarjeta Expensify! La tarjeta se enviará una vez que se agreguen los detalles de envío.`,
- issuedCardVirtual: ({assignee, link}: IssueVirtualCardParams) => `¡emitió a ${assignee} una ${link} virtual! La tarjeta puede utilizarse inmediatamente.`,
+ issuedCard: ({assignee}: AssigneeParams) => `emitió a ${assignee} una Tarjeta Expensify. La tarjeta llegará en 2-3 días laborables.`,
+ issuedCardNoShippingDetails: ({assignee}: AssigneeParams) => `emitió a ${assignee} una Tarjeta Expensify. La tarjeta se enviará una vez que se agreguen los detalles de envío.`,
+ issuedCardVirtual: ({assignee, link}: IssueVirtualCardParams) => `emitió a ${assignee} una ${link} virtual. La tarjeta puede utilizarse inmediatamente.`,
addedShippingDetails: ({assignee}: AssigneeParams) => `${assignee} agregó los detalles de envío. La Tarjeta Expensify llegará en 2-3 días hábiles.`,
+ verifyingHeader: 'Verificando',
+ bankAccountVerifiedHeader: 'Cuenta bancaria verificada',
+ verifyingBankAccount: 'Verificando cuenta bancaria...',
+ verifyingBankAccountDescription: 'Por favor, espere mientras confirmamos que esta cuenta se puede utilizar para emitir tarjetas Expensify.',
+ bankAccountVerified: '¡Cuenta bancaria verificada!',
+ bankAccountVerifiedDescription: 'Ahora puedes emitir tarjetas de Expensify para los miembros de tu espacio de trabajo.',
+ oneMoreStep: 'Un paso más',
+ oneMoreStepDescription: 'Parece que tenemos que verificar manualmente tu cuenta bancaria. Dirígete a Concierge, donde te esperan las instrucciones.',
+ gotIt: 'Entendido',
+ goToConcierge: 'Ir a Concierge',
},
categories: {
deleteCategories: 'Eliminar categorías',
@@ -3303,6 +3380,10 @@ const translations = {
title: 'Tasas de distancia',
subtitle: 'Añade, actualiza y haz cumplir las tasas.',
},
+ perDiem: {
+ title: 'Per diem',
+ subtitle: 'Establece las tasas per diem para controlar los gastos diarios de los empleados.',
+ },
expensifyCard: {
title: 'Tarjeta Expensify',
subtitle: 'Obtén información y control sobre tus gastos.',
@@ -3339,7 +3420,7 @@ const translations = {
cardNumber: 'Número de la tarjeta',
cardholder: 'Titular de la tarjeta',
cardName: 'Nombre de la tarjeta',
- integrationExport: ({integration, type}: IntegrationExportParams) => `Exportación a ${integration} ${type}`,
+ integrationExport: ({integration, type}: IntegrationExportParams) => `Exportación a ${integration} ${type?.toLowerCase()}`,
integrationExportTitleFirstPart: ({integration}: IntegrationExportParams) =>
`Seleccione la cuenta ${integration} donde se deben exportar las transacciones. Seleccione una cuenta diferente`,
integrationExportTitleLinkPart: 'opción de exportación',
@@ -3537,12 +3618,12 @@ const translations = {
},
emptyWorkspace: {
title: 'Crea un espacio de trabajo',
- subtitle: 'En los espacios de trabajo podrás chatear con tu equipo, reembolsar gastos, emitir tarjetas, enviar y pagar facturas, y mucho más - todo en un mismo lugar.',
+ subtitle: 'Crea un espacio de trabajo para organizar recibos, reembolsar gastos, enviar facturas y mucho más, todo a la velocidad del chat.',
createAWorkspaceCTA: 'Comenzar',
features: {
trackAndCollect: 'Organiza recibos',
- companyCards: 'Tarjetas de crédito corporativas',
- reimbursements: 'Reembolsos fáciles',
+ reimbursements: 'Reembolsa a los empleados',
+ companyCards: 'Gestiona tarjetas de la empresa',
},
notFound: 'No se encontró ningún espacio de trabajo',
description: 'Las salas son un gran lugar para discutir y trabajar con varias personas. Para comenzar a colaborar, cree o únase a un espacio de trabajo',
@@ -3638,6 +3719,8 @@ const translations = {
return 'No se puede conectar a Xero.';
case CONST.POLICY.CONNECTIONS.NAME.NETSUITE:
return 'No se puede conectar a NetSuite.';
+ case CONST.POLICY.CONNECTIONS.NAME.QBD:
+ return 'No se puede conectar a QuickBooks Desktop.';
default: {
return 'No se ha podido conectar a la integración.';
}
@@ -3844,6 +3927,7 @@ const translations = {
monthlyDescription: 'Gasta hasta una determinada cantidad al mes',
fixedAmount: 'Cantidad fija',
fixedAmountDescription: 'Gasta hasta una determinada cantidad una vez',
+ cardLimitError: 'Por favor, introduce un monto menor a $21,474,836',
setLimit: 'Establecer un límite',
giveItName: 'Dale un nombre',
giveItNameInstruction: 'Hazlo lo suficientemente único para distinguirla de otras tarjetas. ¡Los casos de uso específicos son aún mejores!',
@@ -4034,52 +4118,58 @@ const translations = {
reportFields: {
title: 'Los campos',
description: `Los campos de informe permiten especificar detalles a nivel de cabecera, distintos de las etiquetas que pertenecen a los gastos en partidas individuales. Estos detalles pueden incluir nombres de proyectos específicos, información sobre viajes de negocios, ubicaciones, etc.`,
- onlyAvailableOnPlan: 'Los campos de informe sólo están disponibles en el plan Control, a partir de ',
+ onlyAvailableOnPlan: 'Los campos de informe sólo están disponibles en el plan Controlar, a partir de ',
},
[CONST.POLICY.CONNECTIONS.NAME.NETSUITE]: {
title: 'NetSuite',
description: `Disfruta de la sincronización automática y reduce las entradas manuales con la integración Expensify + NetSuite. Obtén información financiera en profundidad y en tiempo real con la compatibilidad nativa y personalizada con segmentos, incluida la asignación de proyectos y clientes.`,
- onlyAvailableOnPlan: 'Nuestra integración NetSuite sólo está disponible en el plan Control, a partir de ',
+ onlyAvailableOnPlan: 'Nuestra integración NetSuite sólo está disponible en el plan Controlar, a partir de ',
},
[CONST.POLICY.CONNECTIONS.NAME.SAGE_INTACCT]: {
title: 'Sage Intacct',
description: `Disfruta de una sincronización automatizada y reduce las entradas manuales con la integración Expensify + Sage Intacct. Obtén información financiera en profundidad y en tiempo real con dimensiones definidas por el usuario, así como codificación de gastos por departamento, clase, ubicación, cliente y proyecto (trabajo).`,
- onlyAvailableOnPlan: 'Nuestra integración Sage Intacct sólo está disponible en el plan Control, a partir de ',
+ onlyAvailableOnPlan: 'Nuestra integración Sage Intacct sólo está disponible en el plan Controlar, a partir de ',
},
[CONST.POLICY.CONNECTIONS.NAME.QBD]: {
title: 'QuickBooks Desktop',
description: `Disfruta de la sincronización automática y reduce las entradas manuales con la integración de Expensify + QuickBooks Desktop. Obtén la máxima eficiencia con una conexión bidireccional en tiempo real y la codificación de gastos por clase, artículo, cliente y proyecto.`,
- onlyAvailableOnPlan: 'Nuestra integración con QuickBooks Desktop solo está disponible en el plan Control, que comienza en ',
+ onlyAvailableOnPlan: 'Nuestra integración con QuickBooks Desktop solo está disponible en el plan Controlar, que comienza en ',
},
[CONST.UPGRADE_FEATURE_INTRO_MAPPING.approvals.id]: {
title: 'Aprobaciones anticipadas',
description: `Si quieres añadir más niveles de aprobación, o simplemente asegurarte de que los gastos más importantes reciben otro vistazo, no hay problema. Las aprobaciones avanzadas ayudan a realizar las comprobaciones adecuadas a cada nivel para mantener los gastos de tu equipo bajo control.`,
- onlyAvailableOnPlan: 'Las aprobaciones avanzadas sólo están disponibles en el plan Control, con precios desde ',
+ onlyAvailableOnPlan: 'Las aprobaciones avanzadas sólo están disponibles en el plan Controlar, con precios desde ',
},
glCodes: {
title: 'Códigos de libro mayor',
description: `Añada códigos de libro mayor a sus categorías para exportar fácilmente los gastos a sus sistemas de contabilidad y nómina.`,
- onlyAvailableOnPlan: 'Los códigos de libro mayor solo están disponibles en el plan Control, a partir de ',
+ onlyAvailableOnPlan: 'Los códigos de libro mayor solo están disponibles en el plan Controlar, a partir de ',
},
glAndPayrollCodes: {
title: 'Códigos de libro mayor y nómina',
description: `Añada códigos de libro mayor y nómina a sus categorías para exportar fácilmente los gastos a sus sistemas de contabilidad y nómina.`,
- onlyAvailableOnPlan: 'Los códigos de libro mayor y nómina solo están disponibles en el plan Control, a partir de ',
+ onlyAvailableOnPlan: 'Los códigos de libro mayor y nómina solo están disponibles en el plan Controlar, a partir de ',
},
taxCodes: {
title: 'Código de impuesto',
description: `Añada código de impuesto mayor a sus categorías para exportar fácilmente los gastos a sus sistemas de contabilidad y nómina.`,
- onlyAvailableOnPlan: 'Los código de impuesto mayor solo están disponibles en el plan Control, a partir de ',
+ onlyAvailableOnPlan: 'Los código de impuesto mayor solo están disponibles en el plan Controlar, a partir de ',
},
companyCards: {
title: 'Tarjetas de empresa',
- description: `Las tarjetas de empresa le permiten importar los gastos de las tarjetas de empresa existentes de todos los principales emisores de tarjetas. Puede asignar tarjetas a empleados e importar transacciones automáticamente.`,
- onlyAvailableOnPlan: 'Las tarjetas de empresa solo están disponibles en el plan Control, a partir de ',
+ description: `Conecta tus tarjetas corporativas existentes a Expensify, asígnalas a empleados e importa transacciones automáticamente.`,
+ onlyAvailableOnPlan: 'Las tarjetas de empresa solo están disponibles en el plan Controlar, a partir de ',
},
rules: {
title: 'Reglas',
description: `Las reglas se ejecutan en segundo plano y mantienen tus gastos bajo control para que no tengas que preocuparte por los detalles pequeños.\n\nExige detalles de los gastos, como recibos y descripciones, establece límites y valores predeterminados, y automatiza las aprobaciones y los pagos, todo en un mismo lugar.`,
- onlyAvailableOnPlan: 'Las reglas están disponibles solo en el plan Control, que comienza en ',
+ onlyAvailableOnPlan: 'Las reglas están disponibles solo en el plan Controlar, que comienza en ',
+ },
+ perDiem: {
+ title: 'Per diem',
+ description:
+ 'Las dietas per diem (ej.: $100 por día para comidas) son una excelente forma de mantener los gastos diarios predecibles y ajustados a las políticas de la empresa, especialmente si tus empleados viajan por negocios. Disfruta de funciones como tasas personalizadas, categorías por defecto y detalles más específicos como destinos y subtasas.',
+ onlyAvailableOnPlan: 'Las dietas per diem solo están disponibles en el plan Control, a partir de ',
},
note: {
upgradeWorkspace: 'Mejore su espacio de trabajo para acceder a esta función, o',
@@ -4093,7 +4183,7 @@ const translations = {
upgradeToUnlock: 'Desbloquear esta función',
completed: {
headline: 'Has mejorado tu espacio de trabajo.',
- successMessage: ({policyName}: ReportPolicyNameParams) => `Has actualizado con éxito ${policyName} al plan Control.`,
+ successMessage: ({policyName}: ReportPolicyNameParams) => `Has actualizado con éxito ${policyName} al plan Controlar.`,
viewSubscription: 'Ver su suscripción',
moreDetails: 'para obtener más información.',
gotIt: 'Entendido, gracias.',
@@ -4315,7 +4405,6 @@ const translations = {
},
statementPage: {
title: ({year, monthName}: StatementTitleParams) => `Estado de cuenta de ${monthName} ${year}`,
- generatingPDF: 'Estamos generando tu PDF ahora mismo. ¡Por favor, vuelve más tarde!',
},
keyboardShortcutsPage: {
title: 'Atajos de teclado',
@@ -4393,6 +4482,7 @@ const translations = {
recentChats: 'Chats recientes',
searchIn: 'Buscar en',
searchPlaceholder: 'Busca algo',
+ suggestions: 'Sugerencias',
},
genericErrorPage: {
title: '¡Oh-oh, algo salió mal!',
@@ -4554,7 +4644,7 @@ const translations = {
pressKit: 'Kit de Prensa',
support: 'Soporte',
expensifyHelp: 'ExpensifyHelp',
- community: 'Comunidad',
+ terms: 'Términos de Servicio',
privacy: 'Privacidad',
learnMore: 'Más Información',
aboutExpensify: 'Acerca de Expensify',
@@ -5245,7 +5335,7 @@ const translations = {
overLimit: ({formattedLimit}: ViolationsOverLimitParams) => `Importe supera el límite${formattedLimit ? ` de ${formattedLimit}/persona` : ''}`,
overLimitAttendee: ({formattedLimit}: ViolationsOverLimitParams) => `Importe supera el límite${formattedLimit ? ` de ${formattedLimit}/persona` : ''}`,
perDayLimit: ({formattedLimit}: ViolationsPerDayLimitParams) => `Importe supera el límite diario de la categoría${formattedLimit ? ` de ${formattedLimit}/persona` : ''}`,
- receiptNotSmartScanned: 'Recibo no verificado. Por favor, confirma la exactitud',
+ receiptNotSmartScanned: 'Escaneo de recibo incompleto. Por favor, verifica los detalles manualmente.',
receiptRequired: ({formattedLimit, category}: ViolationsReceiptRequiredParams) => {
let message = 'Recibo obligatorio';
if (formattedLimit ?? category) {
@@ -5450,7 +5540,7 @@ const translations = {
yourPlan: {
title: 'Tu plan',
collect: {
- title: 'Recolectar',
+ title: 'Recopilar',
priceAnnual: ({lower, upper}: YourPlanPriceParams) => `Desde ${lower}/miembro activo con la Tarjeta Expensify, ${upper}/miembro activo sin la Tarjeta Expensify.`,
pricePayPerUse: ({lower, upper}: YourPlanPriceParams) => `Desde ${lower}/miembro activo con la Tarjeta Expensify, ${upper}/miembro activo sin la Tarjeta Expensify.`,
benefit1: 'SmartScans ilimitados y seguimiento de la distancia',
@@ -5462,10 +5552,10 @@ const translations = {
benefit7: 'Reportes e informes personalizados',
},
control: {
- title: 'Control',
+ title: 'Controlar',
priceAnnual: ({lower, upper}: YourPlanPriceParams) => `Desde ${lower}/miembro activo con la Tarjeta Expensify, ${upper}/miembro activo sin la Tarjeta Expensify.`,
pricePayPerUse: ({lower, upper}: YourPlanPriceParams) => `Desde ${lower}/miembro activo con la Tarjeta Expensify, ${upper}/miembro activo sin la Tarjeta Expensify.`,
- benefit1: 'Todo en Recolectar, más:',
+ benefit1: 'Todo en Recopilar, más:',
benefit2: 'Integraciones con NetSuite y Sage Intacct',
benefit3: 'Sincronización de Certinia y Workday',
benefit4: 'Varios aprobadores de gastos',
@@ -5636,6 +5726,7 @@ const translations = {
RBR: 'RBR',
true: 'verdadero',
false: 'falso',
+ viewReport: 'Ver Informe',
reasonVisibleInLHN: {
hasDraftComment: 'Tiene comentario en borrador',
hasGBR: 'Tiene GBR',
@@ -5680,6 +5771,10 @@ const translations = {
emptySearchView: {
takeATour: 'Haz un tour',
},
+ tour: {
+ takeATwoMinuteTour: 'Haz un tour de 2 minutos',
+ exploreExpensify: 'Explora todo lo que Expensify tiene para ofrecer',
+ },
};
export default translations satisfies TranslationDeepObject;
diff --git a/src/languages/params.ts b/src/languages/params.ts
index 9341b914d1d0..2d60c13c4dd0 100644
--- a/src/languages/params.ts
+++ b/src/languages/params.ts
@@ -476,7 +476,8 @@ type SpreadCategoriesParams = {
categories: number;
};
-type AssignedYouCardParams = {
+type AssignedCardParams = {
+ assignee: string;
link: string;
};
@@ -538,10 +539,18 @@ type ImportedTypesParams = {
importedTypes: string[];
};
+type FileLimitParams = {
+ fileLimit: number;
+};
+
type CompanyCardBankName = {
bankName: string;
};
+type CurrencyCodeParams = {
+ currencyCode: string;
+};
+
export type {
AuthenticationErrorParams,
ImportMembersSuccessfullDescriptionParams,
@@ -556,9 +565,10 @@ export type {
DefaultAmountParams,
AutoPayApprovedReportsLimitErrorParams,
FeatureNameParams,
+ FileLimitParams,
SpreadSheetColumnParams,
SpreadFieldNameParams,
- AssignedYouCardParams,
+ AssignedCardParams,
SpreadCategoriesParams,
DelegateRoleParams,
DelegatorParams,
@@ -740,4 +750,5 @@ export type {
OptionalParam,
AssignCardParams,
ImportedTypesParams,
+ CurrencyCodeParams,
};
diff --git a/src/libs/API/parameters/ApproveMoneyRequestOnSearchParams.ts b/src/libs/API/parameters/ApproveMoneyRequestOnSearchParams.ts
new file mode 100644
index 000000000000..c30ed4b946e6
--- /dev/null
+++ b/src/libs/API/parameters/ApproveMoneyRequestOnSearchParams.ts
@@ -0,0 +1,6 @@
+type ApproveMoneyRequestOnSearchParams = {
+ hash: number;
+ reportIDList: string[];
+};
+
+export default ApproveMoneyRequestOnSearchParams;
diff --git a/src/libs/API/parameters/ApproveMoneyRequestParams.ts b/src/libs/API/parameters/ApproveMoneyRequestParams.ts
index f6eb93270428..521226aeeff2 100644
--- a/src/libs/API/parameters/ApproveMoneyRequestParams.ts
+++ b/src/libs/API/parameters/ApproveMoneyRequestParams.ts
@@ -12,10 +12,6 @@ type ApproveMoneyRequestParams = {
* }>
*/
optimisticHoldReportExpenseActionIDs?: string;
- /**
- * Call the optimized version of ApproveMoneyRequest
- */
- v2?: boolean;
};
export default ApproveMoneyRequestParams;
diff --git a/src/libs/API/parameters/AssignCompanyCardParams.ts b/src/libs/API/parameters/AssignCompanyCardParams.ts
index c4dcd7c628a0..782345686c62 100644
--- a/src/libs/API/parameters/AssignCompanyCardParams.ts
+++ b/src/libs/API/parameters/AssignCompanyCardParams.ts
@@ -1,6 +1,7 @@
type AssignCompanyCardParams = {
policyID: string;
bankName: string;
+ cardName: string;
encryptedCardNumber: string;
email: string;
startDate: string;
diff --git a/src/libs/API/parameters/CompleteGuidedSetupParams.ts b/src/libs/API/parameters/CompleteGuidedSetupParams.ts
index 1242b9285de9..6ff45ecc424a 100644
--- a/src/libs/API/parameters/CompleteGuidedSetupParams.ts
+++ b/src/libs/API/parameters/CompleteGuidedSetupParams.ts
@@ -9,6 +9,7 @@ type CompleteGuidedSetupParams = {
paymentSelected?: string;
companySize?: OnboardingCompanySizeType;
userReportedIntegration?: OnboardingAccountingType;
+ policyID?: string;
};
export default CompleteGuidedSetupParams;
diff --git a/src/libs/API/parameters/OpenPolicyPerDiemRatesPageParams.ts b/src/libs/API/parameters/OpenPolicyPerDiemRatesPageParams.ts
new file mode 100644
index 000000000000..de2fa3467027
--- /dev/null
+++ b/src/libs/API/parameters/OpenPolicyPerDiemRatesPageParams.ts
@@ -0,0 +1,5 @@
+type OpenPolicyPerDiemRatesPageParams = {
+ policyID: string;
+};
+
+export default OpenPolicyPerDiemRatesPageParams;
diff --git a/src/libs/API/parameters/PayMoneyRequestOnSearchParams.ts b/src/libs/API/parameters/PayMoneyRequestOnSearchParams.ts
new file mode 100644
index 000000000000..10174f0baa37
--- /dev/null
+++ b/src/libs/API/parameters/PayMoneyRequestOnSearchParams.ts
@@ -0,0 +1,11 @@
+type PayMoneyRequestOnSearchParams = {
+ hash: number;
+ paymentType: string;
+ /**
+ * Stringified JSON object with type of following structure:
+ * Array<{reportID: string, amount: number}>
+ */
+ reportsAndAmounts: string;
+};
+
+export default PayMoneyRequestOnSearchParams;
diff --git a/src/libs/API/parameters/ReportVirtualExpensifyCardFraudParams.ts b/src/libs/API/parameters/ReportVirtualExpensifyCardFraudParams.ts
index 350795d46355..ebb5abcb5d00 100644
--- a/src/libs/API/parameters/ReportVirtualExpensifyCardFraudParams.ts
+++ b/src/libs/API/parameters/ReportVirtualExpensifyCardFraudParams.ts
@@ -1,4 +1,5 @@
type ReportVirtualExpensifyCardFraudParams = {
cardID: number;
+ validateCode: string;
};
export default ReportVirtualExpensifyCardFraudParams;
diff --git a/src/libs/API/parameters/RequestReplacementExpensifyCardParams.ts b/src/libs/API/parameters/RequestReplacementExpensifyCardParams.ts
index bc86923a83a4..f8e62bd3bc6f 100644
--- a/src/libs/API/parameters/RequestReplacementExpensifyCardParams.ts
+++ b/src/libs/API/parameters/RequestReplacementExpensifyCardParams.ts
@@ -1,6 +1,7 @@
type RequestReplacementExpensifyCardParams = {
cardID: number;
reason: string;
+ validateCode: string;
};
export default RequestReplacementExpensifyCardParams;
diff --git a/src/libs/API/parameters/TogglePlatformMuteParams.ts b/src/libs/API/parameters/TogglePlatformMuteParams.ts
new file mode 100644
index 000000000000..1517782e18d7
--- /dev/null
+++ b/src/libs/API/parameters/TogglePlatformMuteParams.ts
@@ -0,0 +1,7 @@
+import type Platform from '@libs/getPlatform/types';
+
+type TogglePlatformMuteParams = {
+ platformToMute: Platform;
+};
+
+export default TogglePlatformMuteParams;
diff --git a/src/libs/API/parameters/TogglePolicyPerDiemParams.ts b/src/libs/API/parameters/TogglePolicyPerDiemParams.ts
new file mode 100644
index 000000000000..363020ec5c66
--- /dev/null
+++ b/src/libs/API/parameters/TogglePolicyPerDiemParams.ts
@@ -0,0 +1,7 @@
+type TogglePolicyPerDiemParams = {
+ policyID: string;
+ enabled: boolean;
+ customUnitID: string;
+};
+
+export default TogglePolicyPerDiemParams;
diff --git a/src/libs/API/parameters/UnassignCompanyCard.ts b/src/libs/API/parameters/UnassignCompanyCard.ts
index 10e04aa13f82..d433d9e537c3 100644
--- a/src/libs/API/parameters/UnassignCompanyCard.ts
+++ b/src/libs/API/parameters/UnassignCompanyCard.ts
@@ -1,6 +1,6 @@
type UnassignCompanyCard = {
authToken?: string | null;
- cardID: string;
+ cardID: number;
};
export default UnassignCompanyCard;
diff --git a/src/libs/API/parameters/UpdateCompanyCard.ts b/src/libs/API/parameters/UpdateCompanyCard.ts
index 3d5eb3c580cb..113f0e1d7511 100644
--- a/src/libs/API/parameters/UpdateCompanyCard.ts
+++ b/src/libs/API/parameters/UpdateCompanyCard.ts
@@ -1,6 +1,6 @@
type UpdateCompanyCard = {
authToken?: string | null;
- cardID: string;
+ cardID: number;
};
export default UpdateCompanyCard;
diff --git a/src/libs/API/parameters/UpdateInvoiceCompanyNameParams.ts b/src/libs/API/parameters/UpdateInvoiceCompanyNameParams.ts
new file mode 100644
index 000000000000..15cc73c12cb1
--- /dev/null
+++ b/src/libs/API/parameters/UpdateInvoiceCompanyNameParams.ts
@@ -0,0 +1,7 @@
+type UpdateInvoiceCompanyNameParams = {
+ authToken: string;
+ policyID: string;
+ companyName: string;
+};
+
+export default UpdateInvoiceCompanyNameParams;
diff --git a/src/libs/API/parameters/UpdateInvoiceCompanyWebsiteParams.ts b/src/libs/API/parameters/UpdateInvoiceCompanyWebsiteParams.ts
new file mode 100644
index 000000000000..68087364d05c
--- /dev/null
+++ b/src/libs/API/parameters/UpdateInvoiceCompanyWebsiteParams.ts
@@ -0,0 +1,7 @@
+type UpdateInvoiceCompanyWebsiteParams = {
+ authToken: string;
+ policyID: string;
+ companyWebsite: string;
+};
+
+export default UpdateInvoiceCompanyWebsiteParams;
diff --git a/src/libs/API/parameters/UpdatePhoneNumberParams.ts b/src/libs/API/parameters/UpdatePhoneNumberParams.ts
new file mode 100644
index 000000000000..683ecb16be13
--- /dev/null
+++ b/src/libs/API/parameters/UpdatePhoneNumberParams.ts
@@ -0,0 +1,5 @@
+type UpdatePhoneNumberParams = {
+ phoneNumber?: string;
+};
+
+export default UpdatePhoneNumberParams;
diff --git a/src/libs/API/parameters/index.ts b/src/libs/API/parameters/index.ts
index 9f07049736ed..fb5558fb0350 100644
--- a/src/libs/API/parameters/index.ts
+++ b/src/libs/API/parameters/index.ts
@@ -73,6 +73,7 @@ export type {default as UpdateGroupChatMemberRolesParams} from './UpdateGroupCha
export type {default as UpdateHomeAddressParams} from './UpdateHomeAddressParams';
export type {default as UpdatePolicyAddressParams} from './UpdatePolicyAddressParams';
export type {default as UpdateLegalNameParams} from './UpdateLegalNameParams';
+export type {default as UpdatePhoneNumberParams} from './UpdatePhoneNumberParams';
export type {default as UpdateNewsletterSubscriptionParams} from './UpdateNewsletterSubscriptionParams';
export type {default as UpdatePersonalInformationForBankAccountParams} from './UpdatePersonalInformationForBankAccountParams';
export type {default as UpdatePreferredEmojiSkinToneParams} from './UpdatePreferredEmojiSkinToneParams';
@@ -254,6 +255,8 @@ export type {default as MarkAsExportedParams} from './MarkAsExportedParams';
export type {default as UpgradeToCorporateParams} from './UpgradeToCorporateParams';
export type {default as DeleteMoneyRequestOnSearchParams} from './DeleteMoneyRequestOnSearchParams';
export type {default as HoldMoneyRequestOnSearchParams} from './HoldMoneyRequestOnSearchParams';
+export type {default as ApproveMoneyRequestOnSearchParams} from './ApproveMoneyRequestOnSearchParams';
+export type {default as PayMoneyRequestOnSearchParams} from './PayMoneyRequestOnSearchParams';
export type {default as UnholdMoneyRequestOnSearchParams} from './UnholdMoneyRequestOnSearchParams';
export type {default as UpdateNetSuiteSubsidiaryParams} from './UpdateNetSuiteSubsidiaryParams';
export type {default as DeletePolicyReportField} from './DeletePolicyReportField';
@@ -339,5 +342,10 @@ export type {default as SetPersonalDetailsAndShipExpensifyCardsParams} from './S
export type {default as RequestFeedSetupParams} from './RequestFeedSetupParams';
export type {default as SetInvoicingTransferBankAccountParams} from './SetInvoicingTransferBankAccountParams';
export type {default as ConnectPolicyToQuickBooksDesktopParams} from './ConnectPolicyToQuickBooksDesktopParams';
+export type {default as UpdateInvoiceCompanyNameParams} from './UpdateInvoiceCompanyNameParams';
+export type {default as UpdateInvoiceCompanyWebsiteParams} from './UpdateInvoiceCompanyWebsiteParams';
export type {default as UpdateQuickbooksDesktopExpensesExportDestinationTypeParams} from './UpdateQuickbooksDesktopExpensesExportDestinationTypeParams';
export type {default as UpdateQuickbooksDesktopCompanyCardExpenseAccountTypeParams} from './UpdateQuickbooksDesktopCompanyCardExpenseAccountTypeParams';
+export type {default as TogglePolicyPerDiemParams} from './TogglePolicyPerDiemParams';
+export type {default as OpenPolicyPerDiemRatesPageParams} from './OpenPolicyPerDiemRatesPageParams';
+export type {default as TogglePlatformMuteParams} from './TogglePlatformMuteParams';
diff --git a/src/libs/API/types.ts b/src/libs/API/types.ts
index 063be53a2eda..b8b4bb749701 100644
--- a/src/libs/API/types.ts
+++ b/src/libs/API/types.ts
@@ -57,6 +57,7 @@ const WRITE_COMMANDS = {
UPDATE_DISPLAY_NAME: 'UpdateDisplayName',
UPDATE_LEGAL_NAME: 'UpdateLegalName',
UPDATE_DATE_OF_BIRTH: 'UpdateDateOfBirth',
+ UPDATE_PHONE_NUMBER: 'UpdatePhoneNumber',
UPDATE_HOME_ADDRESS: 'UpdateHomeAddress',
UPDATE_POLICY_ADDRESS: 'SetPolicyAddress',
UPDATE_AUTOMATIC_TIMEZONE: 'UpdateAutomaticTimezone',
@@ -75,6 +76,7 @@ const WRITE_COMMANDS = {
VALIDATE_SECONDARY_LOGIN: 'ValidateSecondaryLogin',
UPDATE_PREFERRED_EMOJI_SKIN_TONE: 'UpdatePreferredEmojiSkinTone',
UPDATE_CHAT_PRIORITY_MODE: 'UpdateChatPriorityMode',
+ TOGGLE_PLATFORM_MUTE: 'TogglePlatformMute',
SET_CONTACT_METHOD_AS_DEFAULT: 'SetContactMethodAsDefault',
UPDATE_THEME: 'UpdateTheme',
UPDATE_STATUS: 'UpdateStatus',
@@ -219,6 +221,7 @@ const WRITE_COMMANDS = {
ENABLE_POLICY_WORKFLOWS: 'EnablePolicyWorkflows',
ENABLE_POLICY_REPORT_FIELDS: 'EnablePolicyReportFields',
ENABLE_POLICY_EXPENSIFY_CARDS: 'EnablePolicyExpensifyCards',
+ TOGGLE_POLICY_PER_DIEM: 'TogglePolicyPerDiem',
ENABLE_POLICY_COMPANY_CARDS: 'EnablePolicyCompanyCards',
ENABLE_POLICY_INVOICING: 'EnablePolicyInvoicing',
SET_POLICY_RULES_ENABLED: 'SetPolicyRulesEnabled',
@@ -313,6 +316,8 @@ const WRITE_COMMANDS = {
UPGRADE_TO_CORPORATE: 'UpgradeToCorporate',
DELETE_MONEY_REQUEST_ON_SEARCH: 'DeleteMoneyRequestOnSearch',
HOLD_MONEY_REQUEST_ON_SEARCH: 'HoldMoneyRequestOnSearch',
+ APPROVE_MONEY_REQUEST_ON_SEARCH: 'ApproveMoneyRequestOnSearch',
+ PAY_MONEY_REQUEST_ON_SEARCH: 'PayMoneyRequestOnSearch',
UNHOLD_MONEY_REQUEST_ON_SEARCH: 'UnholdMoneyRequestOnSearch',
REQUEST_REFUND: 'User_RefundPurchase',
UPDATE_NETSUITE_SUBSIDIARY: 'UpdateNetSuiteSubsidiary',
@@ -430,6 +435,9 @@ const WRITE_COMMANDS = {
SET_CARD_EXPORT_ACCOUNT: 'SetCardExportAccount',
SET_PERSONAL_DETAILS_AND_SHIP_EXPENSIFY_CARDS: 'SetPersonalDetailsAndShipExpensifyCards',
SET_INVOICING_TRANSFER_BANK_ACCOUNT: 'SetInvoicingTransferBankAccount',
+ SELF_TOUR_VIEWED: 'SelfTourViewed',
+ UPDATE_INVOICE_COMPANY_NAME: 'UpdateInvoiceCompanyName',
+ UPDATE_INVOICE_COMPANY_WEBSITE: 'UpdateInvoiceCompanyWebsite',
} as const;
type WriteCommand = ValueOf;
@@ -466,6 +474,7 @@ type WriteCommandParameters = {
[WRITE_COMMANDS.UPDATE_DISPLAY_NAME]: Parameters.UpdateDisplayNameParams;
[WRITE_COMMANDS.UPDATE_LEGAL_NAME]: Parameters.UpdateLegalNameParams;
[WRITE_COMMANDS.UPDATE_DATE_OF_BIRTH]: Parameters.UpdateDateOfBirthParams;
+ [WRITE_COMMANDS.UPDATE_PHONE_NUMBER]: Parameters.UpdatePhoneNumberParams;
[WRITE_COMMANDS.UPDATE_POLICY_ADDRESS]: Parameters.UpdatePolicyAddressParams;
[WRITE_COMMANDS.UPDATE_HOME_ADDRESS]: Parameters.UpdateHomeAddressParams;
[WRITE_COMMANDS.UPDATE_AUTOMATIC_TIMEZONE]: Parameters.UpdateAutomaticTimezoneParams;
@@ -484,6 +493,7 @@ type WriteCommandParameters = {
[WRITE_COMMANDS.UPDATE_PREFERRED_EMOJI_SKIN_TONE]: Parameters.UpdatePreferredEmojiSkinToneParams;
[WRITE_COMMANDS.UPDATE_CHAT_PRIORITY_MODE]: Parameters.UpdateChatPriorityModeParams;
[WRITE_COMMANDS.SET_CONTACT_METHOD_AS_DEFAULT]: Parameters.SetContactMethodAsDefaultParams;
+ [WRITE_COMMANDS.TOGGLE_PLATFORM_MUTE]: Parameters.TogglePlatformMuteParams;
[WRITE_COMMANDS.UPDATE_THEME]: Parameters.UpdateThemeParams;
[WRITE_COMMANDS.UPDATE_STATUS]: Parameters.UpdateStatusParams;
[WRITE_COMMANDS.CLEAR_STATUS]: null;
@@ -652,6 +662,7 @@ type WriteCommandParameters = {
[WRITE_COMMANDS.ENABLE_POLICY_WORKFLOWS]: Parameters.EnablePolicyWorkflowsParams;
[WRITE_COMMANDS.ENABLE_POLICY_REPORT_FIELDS]: Parameters.EnablePolicyReportFieldsParams;
[WRITE_COMMANDS.ENABLE_POLICY_EXPENSIFY_CARDS]: Parameters.EnablePolicyExpensifyCardsParams;
+ [WRITE_COMMANDS.TOGGLE_POLICY_PER_DIEM]: Parameters.TogglePolicyPerDiemParams;
[WRITE_COMMANDS.ENABLE_POLICY_COMPANY_CARDS]: Parameters.EnablePolicyCompanyCardsParams;
[WRITE_COMMANDS.ENABLE_POLICY_INVOICING]: Parameters.EnablePolicyInvoicingParams;
[WRITE_COMMANDS.SET_POLICY_RULES_ENABLED]: Parameters.SetPolicyRulesEnabledParams;
@@ -754,6 +765,8 @@ type WriteCommandParameters = {
[WRITE_COMMANDS.DELETE_MONEY_REQUEST_ON_SEARCH]: Parameters.DeleteMoneyRequestOnSearchParams;
[WRITE_COMMANDS.HOLD_MONEY_REQUEST_ON_SEARCH]: Parameters.HoldMoneyRequestOnSearchParams;
+ [WRITE_COMMANDS.APPROVE_MONEY_REQUEST_ON_SEARCH]: Parameters.ApproveMoneyRequestOnSearchParams;
+ [WRITE_COMMANDS.PAY_MONEY_REQUEST_ON_SEARCH]: Parameters.PayMoneyRequestOnSearchParams;
[WRITE_COMMANDS.UNHOLD_MONEY_REQUEST_ON_SEARCH]: Parameters.UnholdMoneyRequestOnSearchParams;
[WRITE_COMMANDS.REQUEST_REFUND]: null;
@@ -851,6 +864,7 @@ type WriteCommandParameters = {
[WRITE_COMMANDS.UPDATE_CARD_SETTLEMENT_FREQUENCY]: Parameters.UpdateCardSettlementFrequencyParams;
[WRITE_COMMANDS.UPDATE_CARD_SETTLEMENT_ACCOUNT]: Parameters.UpdateCardSettlementAccountParams;
[WRITE_COMMANDS.SET_PERSONAL_DETAILS_AND_SHIP_EXPENSIFY_CARDS]: Parameters.SetPersonalDetailsAndShipExpensifyCardsParams;
+ [WRITE_COMMANDS.SELF_TOUR_VIEWED]: null;
// Xero API
[WRITE_COMMANDS.UPDATE_XERO_TENANT_ID]: Parameters.UpdateXeroGenericTypeParams;
@@ -869,7 +883,10 @@ type WriteCommandParameters = {
[WRITE_COMMANDS.UPDATE_XERO_SYNC_SYNC_REIMBURSED_REPORTS]: Parameters.UpdateXeroGenericTypeParams;
[WRITE_COMMANDS.UPDATE_XERO_SYNC_REIMBURSEMENT_ACCOUNT_ID]: Parameters.UpdateXeroGenericTypeParams;
+ // Invoice API
[WRITE_COMMANDS.SET_INVOICING_TRANSFER_BANK_ACCOUNT]: Parameters.SetInvoicingTransferBankAccountParams;
+ [WRITE_COMMANDS.UPDATE_INVOICE_COMPANY_NAME]: Parameters.UpdateInvoiceCompanyNameParams;
+ [WRITE_COMMANDS.UPDATE_INVOICE_COMPANY_WEBSITE]: Parameters.UpdateInvoiceCompanyWebsiteParams;
};
const READ_COMMANDS = {
@@ -898,6 +915,7 @@ const READ_COMMANDS = {
SEND_PERFORMANCE_TIMING: 'SendPerformanceTiming',
GET_ROUTE: 'GetRoute',
GET_ROUTE_FOR_DRAFT: 'GetRouteForDraft',
+ GET_ROUTE_FOR_BACKUP: 'GetRouteForBackup',
GET_STATEMENT_PDF: 'GetStatementPDF',
OPEN_ONFIDO_FLOW: 'OpenOnfidoFlow',
OPEN_INITIAL_SETTINGS_PAGE: 'OpenInitialSettingsPage',
@@ -920,6 +938,7 @@ const READ_COMMANDS = {
OPEN_DRAFT_WORKSPACE_REQUEST: 'OpenDraftWorkspaceRequest',
OPEN_POLICY_WORKFLOWS_PAGE: 'OpenPolicyWorkflowsPage',
OPEN_POLICY_DISTANCE_RATES_PAGE: 'OpenPolicyDistanceRatesPage',
+ OPEN_POLICY_PER_DIEM_RATES_PAGE: 'OpenPolicyPerDiemRatesPage',
OPEN_POLICY_MORE_FEATURES_PAGE: 'OpenPolicyMoreFeaturesPage',
OPEN_POLICY_ACCOUNTING_PAGE: 'OpenPolicyAccountingPage',
OPEN_POLICY_PROFILE_PAGE: 'OpenPolicyProfilePage',
@@ -958,6 +977,7 @@ type ReadCommandParameters = {
[READ_COMMANDS.SEND_PERFORMANCE_TIMING]: Parameters.SendPerformanceTimingParams;
[READ_COMMANDS.GET_ROUTE]: Parameters.GetRouteParams;
[READ_COMMANDS.GET_ROUTE_FOR_DRAFT]: Parameters.GetRouteParams;
+ [READ_COMMANDS.GET_ROUTE_FOR_BACKUP]: Parameters.GetRouteParams;
[READ_COMMANDS.GET_STATEMENT_PDF]: Parameters.GetStatementPDFParams;
[READ_COMMANDS.OPEN_ONFIDO_FLOW]: null;
[READ_COMMANDS.OPEN_INITIAL_SETTINGS_PAGE]: null;
@@ -976,6 +996,7 @@ type ReadCommandParameters = {
[READ_COMMANDS.OPEN_DRAFT_WORKSPACE_REQUEST]: Parameters.OpenDraftWorkspaceRequestParams;
[READ_COMMANDS.OPEN_POLICY_WORKFLOWS_PAGE]: Parameters.OpenPolicyWorkflowsPageParams;
[READ_COMMANDS.OPEN_POLICY_DISTANCE_RATES_PAGE]: Parameters.OpenPolicyDistanceRatesPageParams;
+ [READ_COMMANDS.OPEN_POLICY_PER_DIEM_RATES_PAGE]: Parameters.OpenPolicyPerDiemRatesPageParams;
[READ_COMMANDS.OPEN_POLICY_MORE_FEATURES_PAGE]: Parameters.OpenPolicyMoreFeaturesPageParams;
[READ_COMMANDS.OPEN_POLICY_ACCOUNTING_PAGE]: Parameters.OpenPolicyAccountingPageParams;
[READ_COMMANDS.OPEN_POLICY_EXPENSIFY_CARDS_PAGE]: Parameters.OpenPolicyExpensifyCardsPageParams;
diff --git a/src/libs/BankAccountUtils.ts b/src/libs/BankAccountUtils.ts
index c781ccab3f33..89bcf96c642f 100644
--- a/src/libs/BankAccountUtils.ts
+++ b/src/libs/BankAccountUtils.ts
@@ -3,7 +3,7 @@ import type {OnyxEntry} from 'react-native-onyx';
import type * as OnyxTypes from '@src/types/onyx';
function getDefaultCompanyWebsite(session: OnyxEntry, user: OnyxEntry): string {
- return user?.isFromPublicDomain ? 'https://' : `https://www.${Str.extractEmailDomain(session?.email ?? '')}`;
+ return user?.isFromPublicDomain ? '' : `https://www.${Str.extractEmailDomain(session?.email ?? '')}`;
}
function getLastFourDigits(bankAccountNumber: string): string {
diff --git a/src/libs/CardUtils.ts b/src/libs/CardUtils.ts
index 9fda616557a8..ad9bf7f4b90e 100644
--- a/src/libs/CardUtils.ts
+++ b/src/libs/CardUtils.ts
@@ -9,6 +9,7 @@ import type {TranslationPaths} from '@src/languages/types';
import type {OnyxValues} from '@src/ONYXKEYS';
import ONYXKEYS from '@src/ONYXKEYS';
import type {BankAccountList, Card, CardFeeds, CardList, CompanyCardFeed, PersonalDetailsList, WorkspaceCardsList} from '@src/types/onyx';
+import type {CardFeedData} from '@src/types/onyx/CardFeeds';
import {isEmptyObject} from '@src/types/utils/EmptyObject';
import type IconAsset from '@src/types/utils/IconAsset';
import localeCompare from './LocaleCompare';
@@ -189,7 +190,7 @@ function getCompanyCardNumber(cardList: Record, lastFourPAN?: st
return '';
}
- return Object.keys(cardList).find((card) => card.endsWith(lastFourPAN)) ?? '';
+ return Object.keys(cardList).find((card) => card.endsWith(lastFourPAN)) ?? maskCard(lastFourPAN);
}
function getCardFeedIcon(cardFeed: CompanyCardFeed | typeof CONST.EXPENSIFY_CARD.BANK): IconAsset {
@@ -226,6 +227,13 @@ function getCardFeedIcon(cardFeed: CompanyCardFeed | typeof CONST.EXPENSIFY_CARD
return Illustrations.AmexCompanyCards;
}
+function removeExpensifyCardFromCompanyCards(companyCards?: Record) {
+ if (!companyCards) {
+ return {};
+ }
+ return Object.fromEntries(Object.entries(companyCards).filter(([key]) => key !== CONST.EXPENSIFY_CARD.BANK));
+}
+
function getCardFeedName(feedType: CompanyCardFeed): string {
const feedNamesMapping = {
[CONST.COMPANY_CARD.FEED_BANK_NAME.VISA]: 'Visa',
@@ -293,7 +301,7 @@ const getCorrectStepForSelectedBank = (selectedBank: ValueOf, cardFeeds: OnyxEntry): CompanyCardFeed {
- const defaultFeed = Object.keys(cardFeeds?.settings?.companyCards ?? {}).at(0) as CompanyCardFeed;
+ const defaultFeed = Object.keys(removeExpensifyCardFromCompanyCards(cardFeeds?.settings?.companyCards)).at(0) as CompanyCardFeed;
return lastSelectedFeed ?? defaultFeed;
}
@@ -318,4 +326,5 @@ export {
getBankCardDetailsImage,
getSelectedFeed,
getCorrectStepForSelectedBank,
+ removeExpensifyCardFromCompanyCards,
};
diff --git a/src/libs/CategoryUtils.ts b/src/libs/CategoryUtils.ts
index 479ae557eab6..789026f91af6 100644
--- a/src/libs/CategoryUtils.ts
+++ b/src/libs/CategoryUtils.ts
@@ -24,9 +24,9 @@ function formatDefaultTaxRateText(translate: LocaleContextProps['translate'], ta
return `${taxRateText}${suffix ? ` ${CONST.DOT_SEPARATOR} ${suffix}` : ``}`;
}
-function formatRequireReceiptsOverText(translate: LocaleContextProps['translate'], policy: Policy, categoryMaxExpenseAmountNoReceipt?: number | null) {
- const isAlwaysSelected = categoryMaxExpenseAmountNoReceipt === 0;
- const isNeverSelected = categoryMaxExpenseAmountNoReceipt === CONST.DISABLED_MAX_EXPENSE_VALUE;
+function formatRequireReceiptsOverText(translate: LocaleContextProps['translate'], policy: Policy, categoryMaxAmountNoReceipt?: number | null) {
+ const isAlwaysSelected = categoryMaxAmountNoReceipt === 0;
+ const isNeverSelected = categoryMaxAmountNoReceipt === CONST.DISABLED_MAX_EXPENSE_VALUE;
if (isAlwaysSelected) {
return translate(`workspace.rules.categoryRules.requireReceiptsOverList.always`);
diff --git a/src/libs/CurrencyUtils.ts b/src/libs/CurrencyUtils.ts
index f9ac681cb468..b701a32a7c98 100644
--- a/src/libs/CurrencyUtils.ts
+++ b/src/libs/CurrencyUtils.ts
@@ -164,7 +164,8 @@ function convertAmountToDisplayString(amount = 0, currency: string = CONST.CURRE
return NumberFormatUtils.format(BaseLocaleListener.getPreferredLocale(), convertedAmount, {
style: 'currency',
currency,
- minimumFractionDigits: CONST.MAX_TAX_RATE_DECIMAL_PLACES,
+ minimumFractionDigits: CONST.MIN_TAX_RATE_DECIMAL_PLACES,
+ maximumFractionDigits: CONST.MAX_TAX_RATE_DECIMAL_PLACES,
});
}
diff --git a/src/libs/DebugUtils.ts b/src/libs/DebugUtils.ts
index d63758761c3c..6b3b2a70ede0 100644
--- a/src/libs/DebugUtils.ts
+++ b/src/libs/DebugUtils.ts
@@ -44,14 +44,12 @@ type PropertyTypes = Array<'string' | 'number' | 'object' | 'boolean' | 'undefin
const OPTIONAL_BOOLEAN_STRINGS = ['true', 'false', 'undefined'];
const REPORT_NUMBER_PROPERTIES: Array = [
- 'lastMessageTimestamp',
'lastReadSequenceNumber',
'managerID',
'lastActorAccountID',
'ownerAccountID',
'total',
'unheldTotal',
- 'iouReportAmount',
'nonReimbursableTotal',
] satisfies Array;
@@ -63,20 +61,16 @@ const REPORT_BOOLEAN_PROPERTIES: Array = [
'isPinned',
'hasParentAccess',
'isDeletedParentAction',
- 'openOnAdminRoom',
'isOptimisticReport',
'isWaitingOnBankAccount',
'isCancelledIOU',
- 'isLastMessageDeletedParentAction',
'isHidden',
'isChatRoom',
'isLoadingPrivateNotes',
'selected',
] satisfies Array;
-const REPORT_DATE_PROPERTIES: Array = ['lastVisibleActionCreated', 'lastReadCreated', 'lastReadTime', 'lastMentionedTime', 'lastVisibleActionLastModified'] satisfies Array<
- keyof Report
->;
+const REPORT_DATE_PROPERTIES: Array = ['lastVisibleActionCreated', 'lastReadTime', 'lastMentionedTime', 'lastVisibleActionLastModified'] satisfies Array;
const REPORT_REQUIRED_PROPERTIES: Array = ['reportID'] satisfies Array;
@@ -502,9 +496,6 @@ function validateReportDraftProperty(key: keyof Report, value: string) {
if (key === 'pendingFields') {
return validateObject(value, {});
}
- if (key === 'visibleChatMemberAccountIDs') {
- return validateArray(value, 'number');
- }
if (key === 'participantAccountIDs') {
return validateArray(value, 'number');
}
diff --git a/src/libs/DistanceRequestUtils.ts b/src/libs/DistanceRequestUtils.ts
index 286f952b3484..86e9c23af97b 100644
--- a/src/libs/DistanceRequestUtils.ts
+++ b/src/libs/DistanceRequestUtils.ts
@@ -50,6 +50,10 @@ function getMileageRates(policy: OnyxInputOrEntry, includeDisabledRates
return;
}
+ if (!distanceUnit.attributes) {
+ return;
+ }
+
mileageRates[rateID] = {
rate: rate.rate,
currency: rate.currency,
@@ -79,7 +83,7 @@ function getDefaultMileageRate(policy: OnyxInputOrEntry): MileageRate |
}
const distanceUnit = PolicyUtils.getDistanceRateCustomUnit(policy);
- if (!distanceUnit?.rates) {
+ if (!distanceUnit?.rates || !distanceUnit.attributes) {
return;
}
const mileageRates = Object.values(getMileageRates(policy));
@@ -277,7 +281,7 @@ function convertToDistanceInMeters(distance: number, unit: Unit): number {
/**
* Returns custom unit rate ID for the distance transaction
*/
-function getCustomUnitRateID(reportID: string, shouldUseDefault?: boolean) {
+function getCustomUnitRateID(reportID: string) {
const allReports = ReportConnection.getAllReports();
const report = allReports?.[`${ONYXKEYS.COLLECTION.REPORT}${reportID}`];
const parentReport = allReports?.[`${ONYXKEYS.COLLECTION.REPORT}${report?.parentReportID}`];
@@ -288,7 +292,7 @@ function getCustomUnitRateID(reportID: string, shouldUseDefault?: boolean) {
const distanceUnit = Object.values(policy?.customUnits ?? {}).find((unit) => unit.name === CONST.CUSTOM_UNITS.NAME_DISTANCE);
const lastSelectedDistanceRateID = lastSelectedDistanceRates?.[policy?.id ?? '-1'] ?? '-1';
const lastSelectedDistanceRate = distanceUnit?.rates[lastSelectedDistanceRateID] ?? {};
- if (lastSelectedDistanceRate.enabled && lastSelectedDistanceRateID && !shouldUseDefault) {
+ if (lastSelectedDistanceRate.enabled && lastSelectedDistanceRateID) {
customUnitRateID = lastSelectedDistanceRateID;
} else {
customUnitRateID = getDefaultMileageRate(policy)?.customUnitRateID ?? '-1';
diff --git a/src/libs/DomUtils/index.ts b/src/libs/DomUtils/index.ts
index e6286dce77fc..99ebda35ede8 100644
--- a/src/libs/DomUtils/index.ts
+++ b/src/libs/DomUtils/index.ts
@@ -34,25 +34,25 @@ const addCSS = (css: string, styleId: string) => {
* Chrome on iOS does not support the autofill pseudo class because it is a non-standard webkit feature.
* We should rely on the chrome-autofilled property being added to the input when users use auto-fill
*/
-const getAutofilledInputStyle = (inputTextColor: string) => `
- input[chrome-autofilled],
- input[chrome-autofilled]:hover,
- input[chrome-autofilled]:focus,
- textarea[chrome-autofilled],
- textarea[chrome-autofilled]:hover,
- textarea[chrome-autofilled]:focus,
- select[chrome-autofilled],
- select[chrome-autofilled]:hover,
- select[chrome-autofilled]:focus,
- input:-webkit-autofill,
- input:-webkit-autofill:hover,
- input:-webkit-autofill:focus,
- textarea:-webkit-autofill,
- textarea:-webkit-autofill:hover,
- textarea:-webkit-autofill:focus,
- select:-webkit-autofill,
- select:-webkit-autofill:hover,
- select:-webkit-autofill:focus {
+const getAutofilledInputStyle = (inputTextColor: string, cssSelector = '') => `
+ ${cssSelector} input[chrome-autofilled],
+ ${cssSelector} input[chrome-autofilled]:hover,
+ ${cssSelector} input[chrome-autofilled]:focus,
+ ${cssSelector} textarea[chrome-autofilled],
+ ${cssSelector} textarea[chrome-autofilled]:hover,
+ ${cssSelector} textarea[chrome-autofilled]:focus,
+ ${cssSelector} select[chrome-autofilled],
+ ${cssSelector} select[chrome-autofilled]:hover,
+ ${cssSelector} select[chrome-autofilled]:focus,
+ ${cssSelector} input:-webkit-autofill,
+ ${cssSelector} input:-webkit-autofill:hover,
+ ${cssSelector} input:-webkit-autofill:focus,
+ ${cssSelector} textarea:-webkit-autofill,
+ ${cssSelector} textarea:-webkit-autofill:hover,
+ ${cssSelector} textarea:-webkit-autofill:focus,
+ ${cssSelector} select:-webkit-autofill,
+ ${cssSelector} select:-webkit-autofill:hover,
+ ${cssSelector} select:-webkit-autofill:focus {
-webkit-background-clip: text;
-webkit-text-fill-color: ${inputTextColor};
caret-color: ${inputTextColor};
diff --git a/src/libs/ErrorUtils.ts b/src/libs/ErrorUtils.ts
index ba2a33a367d4..b880239b8abf 100644
--- a/src/libs/ErrorUtils.ts
+++ b/src/libs/ErrorUtils.ts
@@ -134,6 +134,15 @@ function getLatestErrorFieldForAnyField Object.assign(acc, error), {});
}
+function getLatestError(errors?: Errors): Errors {
+ if (!errors || Object.keys(errors).length === 0) {
+ return {};
+ }
+
+ const key = Object.keys(errors).sort().reverse().at(0) ?? '';
+ return {[key]: getErrorMessageWithTranslationData(errors[key])};
+}
+
/**
* Method used to attach already translated message
* @param errors - An object containing current errors in the form
@@ -198,6 +207,7 @@ export {
getLatestErrorFieldForAnyField,
getLatestErrorMessage,
getLatestErrorMessageField,
+ getLatestError,
getMicroSecondOnyxErrorWithTranslationKey,
getMicroSecondOnyxErrorWithMessage,
getMicroSecondOnyxErrorObject,
diff --git a/src/libs/FastSearch.ts b/src/libs/FastSearch.ts
deleted file mode 100644
index 59d28dedd449..000000000000
--- a/src/libs/FastSearch.ts
+++ /dev/null
@@ -1,140 +0,0 @@
-/* eslint-disable rulesdir/prefer-at */
-import CONST from '@src/CONST';
-import Timing from './actions/Timing';
-import SuffixUkkonenTree from './SuffixUkkonenTree';
-
-type SearchableData = {
- /**
- * The data that should be searchable
- */
- data: T[];
- /**
- * A function that generates a string from a data entry. The string's value is used for searching.
- * If you have multiple fields that should be searchable, simply concat them to the string and return it.
- */
- toSearchableString: (data: T) => string;
-};
-
-// There are certain characters appear very often in our search data (email addresses), which we don't need to search for.
-const charSetToSkip = new Set(['@', '.', '#', '$', '%', '&', '*', '+', '-', '/', ':', ';', '<', '=', '>', '?', '_', '~', '!', ' ']);
-
-/**
- * Creates a new "FastSearch" instance. "FastSearch" uses a suffix tree to search for substrings in a list of strings.
- * You can provide multiple datasets. The search results will be returned for each dataset.
- *
- * Note: Creating a FastSearch instance with a lot of data is computationally expensive. You should create an instance once and reuse it.
- * Searches will be very fast though, even with a lot of data.
- */
-function createFastSearch(dataSets: Array>) {
- Timing.start(CONST.TIMING.SEARCH_CONVERT_SEARCH_VALUES);
- const maxNumericListSize = 400_000;
- // The user might provide multiple data sets, but internally, the search values will be stored in this one list:
- let concatenatedNumericList = new Uint8Array(maxNumericListSize);
- // Here we store the index of the data item in the original data list, so we can map the found occurrences back to the original data:
- const occurrenceToIndex = new Uint32Array(maxNumericListSize * 4);
- // As we are working with ArrayBuffers, we need to keep track of the current offset:
- const offset = {value: 1};
- // We store the last offset for a dataSet, so we can map the found occurrences to the correct dataSet:
- const listOffsets: number[] = [];
-
- for (const {data, toSearchableString} of dataSets) {
- // Performance critical: the array parameters are passed by reference, so we don't have to create new arrays every time:
- dataToNumericRepresentation(concatenatedNumericList, occurrenceToIndex, offset, {data, toSearchableString});
- listOffsets.push(offset.value);
- }
- concatenatedNumericList[offset.value++] = SuffixUkkonenTree.END_CHAR_CODE;
- listOffsets[listOffsets.length - 1] = offset.value;
- Timing.end(CONST.TIMING.SEARCH_CONVERT_SEARCH_VALUES);
-
- // The list might be larger than necessary, so we clamp it to the actual size:
- concatenatedNumericList = concatenatedNumericList.slice(0, offset.value);
-
- // Create & build the suffix tree:
- Timing.start(CONST.TIMING.SEARCH_MAKE_TREE);
- const tree = SuffixUkkonenTree.makeTree(concatenatedNumericList);
- Timing.end(CONST.TIMING.SEARCH_MAKE_TREE);
-
- Timing.start(CONST.TIMING.SEARCH_BUILD_TREE);
- tree.build();
- Timing.end(CONST.TIMING.SEARCH_BUILD_TREE);
-
- /**
- * Searches for the given input and returns results for each dataset.
- */
- function search(searchInput: string): T[][] {
- const cleanedSearchString = cleanString(searchInput);
- const {numeric} = SuffixUkkonenTree.stringToNumeric(cleanedSearchString, {
- charSetToSkip,
- // stringToNumeric might return a list that is larger than necessary, so we clamp it to the actual size
- // (otherwise the search could fail as we include in our search empty array values):
- clamp: true,
- });
- const result = tree.findSubstring(Array.from(numeric));
-
- const resultsByDataSet = Array.from({length: dataSets.length}, () => new Set());
- // eslint-disable-next-line @typescript-eslint/prefer-for-of
- for (let i = 0; i < result.length; i++) {
- const occurrenceIndex = result[i];
- const itemIndexInDataSet = occurrenceToIndex[occurrenceIndex];
- const dataSetIndex = listOffsets.findIndex((listOffset) => occurrenceIndex < listOffset);
-
- if (dataSetIndex === -1) {
- throw new Error(`[FastSearch] The occurrence index ${occurrenceIndex} is not in any dataset`);
- }
- const item = dataSets[dataSetIndex].data[itemIndexInDataSet];
- if (!item) {
- throw new Error(`[FastSearch] The item with index ${itemIndexInDataSet} in dataset ${dataSetIndex} is not defined`);
- }
- resultsByDataSet[dataSetIndex].add(item);
- }
-
- return resultsByDataSet.map((set) => Array.from(set));
- }
-
- return {
- search,
- };
-}
-
-/**
- * The suffix tree can only store string like values, and internally stores those as numbers.
- * This function converts the user data (which are most likely objects) to a numeric representation.
- * Additionally a list of the original data and their index position in the numeric list is created, which is used to map the found occurrences back to the original data.
- */
-function dataToNumericRepresentation(concatenatedNumericList: Uint8Array, occurrenceToIndex: Uint32Array, offset: {value: number}, {data, toSearchableString}: SearchableData): void {
- data.forEach((option, index) => {
- const searchStringForTree = toSearchableString(option);
- const cleanedSearchStringForTree = cleanString(searchStringForTree);
-
- if (cleanedSearchStringForTree.length === 0) {
- return;
- }
-
- SuffixUkkonenTree.stringToNumeric(cleanedSearchStringForTree, {
- charSetToSkip,
- out: {
- outArray: concatenatedNumericList,
- offset,
- outOccurrenceToIndex: occurrenceToIndex,
- index,
- },
- });
- // eslint-disable-next-line no-param-reassign
- occurrenceToIndex[offset.value] = index;
- // eslint-disable-next-line no-param-reassign
- concatenatedNumericList[offset.value++] = SuffixUkkonenTree.DELIMITER_CHAR_CODE;
- });
-}
-
-/**
- * Everything in the tree is treated as lowercase.
- */
-function cleanString(input: string) {
- return input.toLowerCase();
-}
-
-const FastSearch = {
- createFastSearch,
-};
-
-export default FastSearch;
diff --git a/src/libs/Firebase/index.native.ts b/src/libs/Firebase/index.native.ts
index 39a23440c77d..ba899dee1732 100644
--- a/src/libs/Firebase/index.native.ts
+++ b/src/libs/Firebase/index.native.ts
@@ -2,7 +2,7 @@
import crashlytics from '@react-native-firebase/crashlytics';
import perf from '@react-native-firebase/perf';
import * as Environment from '@libs/Environment/Environment';
-import type {Log, StartTrace, StopTrace, TraceMap} from './types';
+import type {FirebaseAttributes, Log, StartTrace, StopTrace, TraceMap} from './types';
import utils from './utils';
const traceMap: TraceMap = {};
@@ -17,7 +17,7 @@ const startTrace: StartTrace = (customEventName) => {
return;
}
- const attributes = utils.getAttributes();
+ const attributes: FirebaseAttributes = utils.getAttributes(['accountId', 'personalDetailsLength', 'reportActionsLength', 'reportsLength', 'policiesLength']);
perf()
.startTrace(customEventName)
diff --git a/src/libs/Firebase/index.web.ts b/src/libs/Firebase/index.web.ts
index 2d42154d3c26..483e63617978 100644
--- a/src/libs/Firebase/index.web.ts
+++ b/src/libs/Firebase/index.web.ts
@@ -1,7 +1,7 @@
import {trace} from '@firebase/performance';
import * as Environment from '@libs/Environment/Environment';
import {firebasePerfWeb} from './firebaseWebConfig';
-import type {Log, StartTrace, StopTrace, TraceMap} from './types';
+import type {FirebaseAttributes, Log, StartTrace, StopTrace, TraceMap} from './types';
import utils from './utils';
const traceMap: TraceMap = {};
@@ -19,7 +19,7 @@ const startTrace: StartTrace = (customEventName) => {
const perfTrace = trace(firebasePerfWeb, customEventName);
- const attributes = utils.getAttributes();
+ const attributes: FirebaseAttributes = utils.getAttributes(['accountId', 'personalDetailsLength', 'reportActionsLength', 'reportsLength', 'policiesLength']);
Object.entries(attributes).forEach(([name, value]) => {
perfTrace.putAttribute(name, value);
diff --git a/src/libs/Firebase/types.ts b/src/libs/Firebase/types.ts
index 4c970375c226..2f6a8b42505e 100644
--- a/src/libs/Firebase/types.ts
+++ b/src/libs/Firebase/types.ts
@@ -9,7 +9,7 @@ type TraceMap = Record;
type StartTrace = (customEventName: string) => void;
type StopTrace = (customEventName: string) => void;
type Log = (action: string) => void;
-type FirebaseAttributes = {
+type PerfAttributes = {
accountId: string;
personalDetailsLength: string;
reportsLength: string;
@@ -21,4 +21,7 @@ type FirebaseAttributes = {
policyRole: string;
};
-export type {StartTrace, StopTrace, TraceMap, Log, FirebaseAttributes};
+// TODO confirm which attributes are required for Firebase
+type FirebaseAttributes = Pick;
+
+export type {StartTrace, StopTrace, TraceMap, Log, PerfAttributes, FirebaseAttributes};
diff --git a/src/libs/Firebase/utils.ts b/src/libs/Firebase/utils.ts
index 4f7718e691ed..01df2bfc8a7e 100644
--- a/src/libs/Firebase/utils.ts
+++ b/src/libs/Firebase/utils.ts
@@ -4,31 +4,33 @@ import {getActivePolicy, getAllPoliciesLength} from '@libs/PolicyUtils';
import {getReportActionsLength} from '@libs/ReportActionsUtils';
import * as ReportConnection from '@libs/ReportConnection';
import * as SessionUtils from '@libs/SessionUtils';
-import type {FirebaseAttributes} from './types';
+import type {PerfAttributes} from './types';
-function getAttributes(): FirebaseAttributes {
+function getAttributes(attributes?: T[]): Pick {
const session = SessionUtils.getSession();
-
- const accountId = session?.accountID?.toString() ?? 'N/A';
- const reportsLength = ReportConnection.getAllReportsLength().toString();
- const reportActionsLength = getReportActionsLength().toString();
- const personalDetailsLength = PersonalDetailsUtils.getPersonalDetailsLength().toString();
- const transactionViolationsLength = getAllTransactionViolationsLength().toString();
- const policiesLength = getAllPoliciesLength().toString();
- const transactionsLength = getAllTransactions().toString();
const policy = getActivePolicy();
- return {
- accountId,
- reportsLength,
- reportActionsLength,
- personalDetailsLength,
- transactionViolationsLength,
- policiesLength,
- transactionsLength,
+ const allAttributes: PerfAttributes = {
+ accountId: session?.accountID?.toString() ?? 'N/A',
+ reportsLength: ReportConnection.getAllReportsLength().toString(),
+ reportActionsLength: getReportActionsLength().toString(),
+ personalDetailsLength: PersonalDetailsUtils.getPersonalDetailsLength().toString(),
+ transactionViolationsLength: getAllTransactionViolationsLength().toString(),
+ policiesLength: getAllPoliciesLength().toString(),
+ transactionsLength: getAllTransactions().toString(),
policyType: policy?.type ?? 'N/A',
policyRole: policy?.role ?? 'N/A',
};
+
+ if (attributes && attributes.length > 0) {
+ const selectedAttributes = {} as Pick;
+ attributes.forEach((attribute) => {
+ selectedAttributes[attribute] = allAttributes[attribute];
+ });
+ return selectedAttributes;
+ }
+
+ return allAttributes;
}
export default {
diff --git a/src/libs/Fullstory/index.native.ts b/src/libs/Fullstory/index.native.ts
index 8d97b8d4307e..30a5a77ae9f3 100644
--- a/src/libs/Fullstory/index.native.ts
+++ b/src/libs/Fullstory/index.native.ts
@@ -40,7 +40,8 @@ const FS = {
// after the init function since this function is also called on updates for
// UserMetadata onyx key.
Environment.getEnvironment().then((envName: string) => {
- if (envName !== CONST.ENVIRONMENT.PRODUCTION) {
+ const isTestEmail = value.email !== undefined && value.email.startsWith('fullstory') && value.email.endsWith(CONST.EMAIL.QA_DOMAIN);
+ if (CONST.ENVIRONMENT.PRODUCTION !== envName && !isTestEmail) {
return;
}
FullStory.restart();
diff --git a/src/libs/Fullstory/index.ts b/src/libs/Fullstory/index.ts
index df65af358a55..0aa0b2094591 100644
--- a/src/libs/Fullstory/index.ts
+++ b/src/libs/Fullstory/index.ts
@@ -57,7 +57,8 @@ const FS = {
}
try {
Environment.getEnvironment().then((envName: string) => {
- if (CONST.ENVIRONMENT.PRODUCTION !== envName) {
+ const isTestEmail = value.email !== undefined && value.email.startsWith('fullstory') && value.email.endsWith(CONST.EMAIL.QA_DOMAIN);
+ if (CONST.ENVIRONMENT.PRODUCTION !== envName && !isTestEmail) {
return;
}
FS.onReady().then(() => {
diff --git a/src/libs/GoogleTagManager/index.native.ts b/src/libs/GoogleTagManager/index.native.ts
new file mode 100644
index 000000000000..267591d6ef40
--- /dev/null
+++ b/src/libs/GoogleTagManager/index.native.ts
@@ -0,0 +1,15 @@
+import analytics from '@react-native-firebase/analytics';
+import Log from '@libs/Log';
+import type {GoogleTagManagerEvent} from './types';
+import type GoogleTagManagerModule from './types';
+
+function publishEvent(event: GoogleTagManagerEvent, accountID: number) {
+ analytics().logEvent(event, {accountID});
+ Log.info('[GTM] event published', false, {event, accountID});
+}
+
+const GoogleTagManager: GoogleTagManagerModule = {
+ publishEvent,
+};
+
+export default GoogleTagManager;
diff --git a/src/libs/GoogleTagManager/index.ts b/src/libs/GoogleTagManager/index.ts
new file mode 100644
index 000000000000..e859da8c12e9
--- /dev/null
+++ b/src/libs/GoogleTagManager/index.ts
@@ -0,0 +1,35 @@
+import Log from '@libs/Log';
+import type {GoogleTagManagerEvent} from './types';
+import type GoogleTagManagerModule from './types';
+
+/**
+ * The dataLayer is added with a js snippet from Google in web/thirdPartyScripts.js. Set USE_THIRD_PARTY_SCRIPTS to true
+ * in your .env to enable this
+ */
+type WindowWithDataLayer = Window & {
+ dataLayer?: {
+ push: (params: DataLayerPushParams) => void;
+ };
+};
+
+type DataLayerPushParams = {
+ event: GoogleTagManagerEvent;
+ accountID: number;
+};
+
+declare const window: WindowWithDataLayer;
+
+function publishEvent(event: GoogleTagManagerEvent, accountID: number) {
+ if (!window.dataLayer) {
+ return;
+ }
+
+ window.dataLayer.push({event, accountID});
+ Log.info('[GTM] event published', false, {event, accountID});
+}
+
+const GoogleTagManager: GoogleTagManagerModule = {
+ publishEvent,
+};
+
+export default GoogleTagManager;
diff --git a/src/libs/GoogleTagManager/types.ts b/src/libs/GoogleTagManager/types.ts
new file mode 100644
index 000000000000..a4af6aa00330
--- /dev/null
+++ b/src/libs/GoogleTagManager/types.ts
@@ -0,0 +1,13 @@
+/**
+ * An event that can be published to Google Tag Manager. New events must be configured in GTM before they can be used
+ * in the app.
+ */
+type GoogleTagManagerEvent = 'sign_up' | 'workspace_created' | 'paid_adoption';
+
+type GoogleTagManagerModule = {
+ publishEvent: (event: GoogleTagManagerEvent, accountID: number) => void;
+};
+
+export default GoogleTagManagerModule;
+
+export type {GoogleTagManagerEvent};
diff --git a/src/libs/HttpUtils.ts b/src/libs/HttpUtils.ts
index de6aea96cb47..66ce71451c17 100644
--- a/src/libs/HttpUtils.ts
+++ b/src/libs/HttpUtils.ts
@@ -58,6 +58,11 @@ function processHTTPRequest(url: string, method: RequestType = 'get', body: Form
signal: abortSignal,
method,
body,
+ // On Web fetch already defaults to 'omit' for credentials, but it seems that this is not the case for the ReactNative implementation
+ // so to avoid sending cookies with the request we set it to 'omit' explicitly
+ // this avoids us sending specially the expensifyWeb cookie, which makes a CSRF token required
+ // more on that here: https://stackoverflowteams.com/c/expensify/questions/93
+ credentials: 'omit',
})
.then((response) => {
// We are calculating the skew to minimize the delay when posting the messages
diff --git a/src/libs/InputUtils/index.native.ts b/src/libs/InputUtils/index.native.ts
new file mode 100644
index 000000000000..3db4280b7d73
--- /dev/null
+++ b/src/libs/InputUtils/index.native.ts
@@ -0,0 +1,6 @@
+import type {MoveSelectiontoEnd, ScrollToBottom} from './types';
+
+const scrollToBottom: ScrollToBottom = () => {};
+const moveSelectionToEnd: MoveSelectiontoEnd = () => {};
+
+export {scrollToBottom, moveSelectionToEnd};
diff --git a/src/libs/InputUtils/index.ts b/src/libs/InputUtils/index.ts
new file mode 100644
index 000000000000..19943bf3132a
--- /dev/null
+++ b/src/libs/InputUtils/index.ts
@@ -0,0 +1,19 @@
+import type {MoveSelectiontoEnd, ScrollToBottom} from './types';
+
+const scrollToBottom: ScrollToBottom = (input) => {
+ if (!('scrollTop' in input)) {
+ return;
+ }
+ // eslint-disable-next-line no-param-reassign
+ input.scrollTop = input.scrollHeight;
+};
+
+const moveSelectionToEnd: MoveSelectiontoEnd = (input) => {
+ if (!('setSelectionRange' in input)) {
+ return;
+ }
+ const length = input.value.length;
+ input.setSelectionRange(length, length);
+};
+
+export {scrollToBottom, moveSelectionToEnd};
diff --git a/src/libs/InputUtils/types.ts b/src/libs/InputUtils/types.ts
new file mode 100644
index 000000000000..875ac6b602e4
--- /dev/null
+++ b/src/libs/InputUtils/types.ts
@@ -0,0 +1,6 @@
+import type {TextInput} from 'react-native';
+
+type ScrollToBottom = (input: HTMLInputElement | TextInput) => void;
+type MoveSelectiontoEnd = (input: HTMLInputElement | TextInput) => void;
+
+export type {ScrollToBottom, MoveSelectiontoEnd};
diff --git a/src/libs/IntlPolyfill/index.ios.ts b/src/libs/IntlPolyfill/index.ios.ts
index ecde57ddd21e..a1af6455ea2f 100644
--- a/src/libs/IntlPolyfill/index.ios.ts
+++ b/src/libs/IntlPolyfill/index.ios.ts
@@ -1,4 +1,3 @@
-import polyfillDateTimeFormat from './polyfillDateTimeFormat';
import polyfillListFormat from './polyfillListFormat';
import polyfillNumberFormat from './polyfillNumberFormat';
import type IntlPolyfill from './types';
@@ -21,10 +20,6 @@ const intlPolyfill: IntlPolyfill = () => {
// see: https://github.com/facebook/hermes/issues/1172#issuecomment-1776156538
polyfillNumberFormat();
- // Required to polyfill DateTimeFormat on iOS
- // see: https://github.com/facebook/hermes/issues/1172#issuecomment-1776156538
- polyfillDateTimeFormat();
-
polyfillListFormat();
};
diff --git a/src/libs/Localize/index.ts b/src/libs/Localize/index.ts
index bd8a34406846..3f079b49653a 100644
--- a/src/libs/Localize/index.ts
+++ b/src/libs/Localize/index.ts
@@ -1,7 +1,7 @@
import * as RNLocalize from 'react-native-localize';
import Onyx from 'react-native-onyx';
-import type {ValueOf} from 'type-fest';
import Log from '@libs/Log';
+import memoize from '@libs/memoize';
import type {MessageElementBase, MessageTextElement} from '@libs/MessageElement';
import Config from '@src/CONFIG';
import CONST from '@src/CONST';
@@ -9,6 +9,7 @@ import translations from '@src/languages/translations';
import type {PluralForm, TranslationParameters, TranslationPaths} from '@src/languages/types';
import ONYXKEYS from '@src/ONYXKEYS';
import type {Locale} from '@src/types/onyx';
+import {isEmptyObject} from '@src/types/utils/EmptyObject';
import LocaleListener from './LocaleListener';
import BaseLocaleListener from './LocaleListener/BaseLocaleListener';
@@ -45,28 +46,6 @@ function init() {
}, {});
}
-/**
- * Map to store translated values for each locale.
- * This is used to avoid translating the same phrase multiple times.
- *
- * The data is stored in the following format:
- *
- * {
- * "en": {
- * "name": "Name",
- * }
- *
- * Note: We are not storing any translated values for phrases with variables,
- * as they have higher chance of being unique, so we'll end up wasting space
- * in our cache.
- */
-const translationCache = new Map, Map>(
- Object.values(CONST.LOCALES).reduce((cache, locale) => {
- cache.push([locale, new Map()]);
- return cache;
- }, [] as Array<[ValueOf, Map]>),
-);
-
/**
* Helper function to get the translated string for given
* locale and phrase. This function is used to avoid
@@ -86,18 +65,6 @@ function getTranslatedPhrase(
fallbackLanguage: 'en' | 'es' | null,
...parameters: TranslationParameters
): string | null {
- // Get the cache for the above locale
- const cacheForLocale = translationCache.get(language);
-
- // Directly access and assign the translated value from the cache, instead of
- // going through map.has() and map.get() to avoid multiple lookups.
- const valueFromCache = cacheForLocale?.get(phraseKey);
-
- // If the phrase is already translated, return the translated value
- if (valueFromCache) {
- return valueFromCache;
- }
-
const translatedPhrase = translations?.[language]?.[phraseKey];
if (translatedPhrase) {
@@ -138,8 +105,6 @@ function getTranslatedPhrase(
return translateResult.other(phraseObject.count);
}
- // We set the translated value in the cache only for the phrases without parameters.
- cacheForLocale?.set(phraseKey, translatedPhrase);
return translatedPhrase;
}
@@ -162,6 +127,13 @@ function getTranslatedPhrase(
return getTranslatedPhrase(CONST.LOCALES.DEFAULT, phraseKey, null, ...parameters);
}
+const memoizedGetTranslatedPhrase = memoize(getTranslatedPhrase, {
+ maxArgs: 2,
+ equality: 'shallow',
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
+ skipCache: (params) => !isEmptyObject(params.at(3)),
+});
+
/**
* Return translated string for given locale and phrase
*
@@ -174,7 +146,7 @@ function translate(desiredLanguage: 'en' | 'es'
// Phrase is not found in full locale, search it in fallback language e.g. es
const languageAbbreviation = desiredLanguage.substring(0, 2) as 'en' | 'es';
- const translatedPhrase = getTranslatedPhrase(language, path, languageAbbreviation, ...parameters);
+ const translatedPhrase = memoizedGetTranslatedPhrase(language, path, languageAbbreviation, ...parameters);
if (translatedPhrase !== null && translatedPhrase !== undefined) {
return translatedPhrase;
}
diff --git a/src/libs/Navigation/AppNavigator/AuthScreens.tsx b/src/libs/Navigation/AppNavigator/AuthScreens.tsx
index 85c027f06d95..58586250f958 100644
--- a/src/libs/Navigation/AppNavigator/AuthScreens.tsx
+++ b/src/libs/Navigation/AppNavigator/AuthScreens.tsx
@@ -9,6 +9,7 @@ import OptionsListContextProvider from '@components/OptionListContextProvider';
import {SearchContextProvider} from '@components/Search/SearchContext';
import {useSearchRouterContext} from '@components/Search/SearchRouter/SearchRouterContext';
import SearchRouterModal from '@components/Search/SearchRouter/SearchRouterModal';
+import TestToolsModal from '@components/TestToolsModal';
import useActiveWorkspace from '@hooks/useActiveWorkspace';
import useOnboardingFlowRouter from '@hooks/useOnboardingFlow';
import usePermissions from '@hooks/usePermissions';
@@ -263,6 +264,12 @@ function AuthScreens({session, lastOpenedPublicRoomID, initialLastUpdateIDApplie
isInitialRender.current = false;
}
+ const isOnboardingCompletedRef = useRef(isOnboardingCompleted);
+
+ useEffect(() => {
+ isOnboardingCompletedRef.current = isOnboardingCompleted;
+ }, [isOnboardingCompleted]);
+
useEffect(() => {
const shortcutsOverviewShortcutConfig = CONST.KEYBOARD_SHORTCUTS.SHORTCUTS;
const searchShortcutConfig = CONST.KEYBOARD_SHORTCUTS.SEARCH;
@@ -361,6 +368,9 @@ function AuthScreens({session, lastOpenedPublicRoomID, initialLastUpdateIDApplie
searchShortcutConfig.shortcutKey,
() => {
Session.checkIfActionIsAllowed(() => {
+ if (!isOnboardingCompletedRef.current) {
+ return;
+ }
toggleSearchRouter();
})();
},
@@ -381,9 +391,7 @@ function AuthScreens({session, lastOpenedPublicRoomID, initialLastUpdateIDApplie
const unsubscribeDebugShortcut = KeyboardShortcut.subscribe(
debugShortcutConfig.shortcutKey,
- () => {
- toggleTestToolsModal();
- },
+ () => toggleTestToolsModal(),
debugShortcutConfig.descriptionKey,
debugShortcutConfig.modifiers,
true,
@@ -581,6 +589,7 @@ function AuthScreens({session, lastOpenedPublicRoomID, initialLastUpdateIDApplie
);
})}
+
{didPusherInit && }
diff --git a/src/libs/Navigation/AppNavigator/ModalStackNavigators/index.tsx b/src/libs/Navigation/AppNavigator/ModalStackNavigators/index.tsx
index 35f67e0253c6..8a64424c8f7d 100644
--- a/src/libs/Navigation/AppNavigator/ModalStackNavigators/index.tsx
+++ b/src/libs/Navigation/AppNavigator/ModalStackNavigators/index.tsx
@@ -217,6 +217,7 @@ const SettingsModalStackNavigator = createModalStackNavigator require('../../../../pages/settings/Profile/TimezoneSelectPage').default,
[SCREENS.SETTINGS.PROFILE.LEGAL_NAME]: () => require('../../../../pages/settings/Profile/PersonalDetails/LegalNamePage').default,
[SCREENS.SETTINGS.PROFILE.DATE_OF_BIRTH]: () => require('../../../../pages/settings/Profile/PersonalDetails/DateOfBirthPage').default,
+ [SCREENS.SETTINGS.PROFILE.PHONE_NUMBER]: () => require('../../../../pages/settings/Profile/PersonalDetails/PhoneNumberPage').default,
[SCREENS.SETTINGS.PROFILE.ADDRESS]: () => require('../../../../pages/settings/Profile/PersonalDetails/PersonalAddressPage').default,
[SCREENS.SETTINGS.PROFILE.ADDRESS_COUNTRY]: () => require('../../../../pages/settings/Profile/PersonalDetails/CountrySelectionPage').default,
[SCREENS.SETTINGS.PROFILE.ADDRESS_STATE]: () => require('../../../../pages/settings/Profile/PersonalDetails/StateSelectionPage').default,
diff --git a/src/libs/Navigation/AppNavigator/Navigators/FullScreenNavigator.tsx b/src/libs/Navigation/AppNavigator/Navigators/FullScreenNavigator.tsx
index 2f513fe804bb..4aac30587725 100644
--- a/src/libs/Navigation/AppNavigator/Navigators/FullScreenNavigator.tsx
+++ b/src/libs/Navigation/AppNavigator/Navigators/FullScreenNavigator.tsx
@@ -29,6 +29,7 @@ const CENTRAL_PANE_WORKSPACE_SCREENS = {
[SCREENS.WORKSPACE.REPORT_FIELDS]: () => require('../../../../pages/workspace/reportFields/WorkspaceReportFieldsPage').default,
[SCREENS.WORKSPACE.EXPENSIFY_CARD]: () => require('../../../../pages/workspace/expensifyCard/WorkspaceExpensifyCardPage').default,
[SCREENS.WORKSPACE.COMPANY_CARDS]: () => require('../../../../pages/workspace/companyCards/WorkspaceCompanyCardsPage').default,
+ [SCREENS.WORKSPACE.PER_DIEM]: () => require('../../../../pages/workspace/perDiem/WorkspacePerDiemPage').default,
[SCREENS.WORKSPACE.DISTANCE_RATES]: () => require('../../../../pages/workspace/distanceRates/PolicyDistanceRatesPage').default,
[SCREENS.WORKSPACE.RULES]: () => require('../../../../pages/workspace/rules/PolicyRulesPage').default,
} satisfies Screens;
diff --git a/src/libs/Navigation/AppNavigator/createCustomBottomTabNavigator/BottomTabBar.tsx b/src/libs/Navigation/AppNavigator/createCustomBottomTabNavigator/BottomTabBar.tsx
index 1c99845cb008..34bdf866dbb8 100644
--- a/src/libs/Navigation/AppNavigator/createCustomBottomTabNavigator/BottomTabBar.tsx
+++ b/src/libs/Navigation/AppNavigator/createCustomBottomTabNavigator/BottomTabBar.tsx
@@ -7,6 +7,7 @@ import {PressableWithFeedback} from '@components/Pressable';
import type {SearchQueryString} from '@components/Search/types';
import Text from '@components/Text';
import useActiveWorkspace from '@hooks/useActiveWorkspace';
+import useCurrentReportID from '@hooks/useCurrentReportID';
import useLocalize from '@hooks/useLocalize';
import useTheme from '@hooks/useTheme';
import useThemeStyles from '@hooks/useThemeStyles';
@@ -65,15 +66,23 @@ function BottomTabBar({selectedTab}: BottomTabBarProps) {
const styles = useThemeStyles();
const {translate} = useLocalize();
const {activeWorkspaceID} = useActiveWorkspace();
+ const {currentReportID} = useCurrentReportID() ?? {currentReportID: null};
const [user] = useOnyx(ONYXKEYS.USER);
+ const [betas] = useOnyx(ONYXKEYS.BETAS);
+ const [priorityMode] = useOnyx(ONYXKEYS.NVP_PRIORITY_MODE);
const [reports] = useOnyx(ONYXKEYS.COLLECTION.REPORT);
+ const [policies] = useOnyx(ONYXKEYS.COLLECTION.POLICY);
const [reportActions] = useOnyx(ONYXKEYS.COLLECTION.REPORT_ACTIONS);
const [transactionViolations] = useOnyx(ONYXKEYS.COLLECTION.TRANSACTION_VIOLATIONS);
- const [chatTabBrickRoad, setChatTabBrickRoad] = useState(getChatTabBrickRoad(activeWorkspaceID));
+ const [chatTabBrickRoad, setChatTabBrickRoad] = useState(
+ getChatTabBrickRoad(activeWorkspaceID, currentReportID, reports, betas, policies, priorityMode, transactionViolations),
+ );
useEffect(() => {
- setChatTabBrickRoad(getChatTabBrickRoad(activeWorkspaceID));
- }, [activeWorkspaceID, transactionViolations, reports, reportActions]);
+ setChatTabBrickRoad(getChatTabBrickRoad(activeWorkspaceID, currentReportID, reports, betas, policies, priorityMode, transactionViolations));
+ // We need to get a new brick road state when report actions are updated, otherwise we'll be showing an outdated brick road.
+ // That's why reportActions is added as a dependency here
+ }, [activeWorkspaceID, transactionViolations, reports, reportActions, betas, policies, priorityMode, currentReportID]);
const navigateToChats = useCallback(() => {
if (selectedTab === SCREENS.HOME) {
@@ -113,11 +122,17 @@ function BottomTabBar({selectedTab}: BottomTabBarProps) {
return (
<>
- {user?.isDebugModeEnabled && (
+ {!!user?.isDebugModeEnabled && (
)}
@@ -135,7 +150,7 @@ function BottomTabBar({selectedTab}: BottomTabBarProps) {
width={variables.iconBottomBar}
height={variables.iconBottomBar}
/>
- {chatTabBrickRoad && (
+ {!!chatTabBrickRoad && (
)}
diff --git a/src/libs/Navigation/AppNavigator/createCustomBottomTabNavigator/DebugTabView.tsx b/src/libs/Navigation/AppNavigator/createCustomBottomTabNavigator/DebugTabView.tsx
index 3e5803b797dc..354529941e0c 100644
--- a/src/libs/Navigation/AppNavigator/createCustomBottomTabNavigator/DebugTabView.tsx
+++ b/src/libs/Navigation/AppNavigator/createCustomBottomTabNavigator/DebugTabView.tsx
@@ -1,6 +1,6 @@
import React, {useCallback, useMemo} from 'react';
import {View} from 'react-native';
-import type {OnyxEntry} from 'react-native-onyx';
+import type {OnyxCollection, OnyxEntry} from 'react-native-onyx';
import {useOnyx} from 'react-native-onyx';
import Button from '@components/Button';
import Icon from '@components/Icon';
@@ -21,12 +21,18 @@ import ONYXKEYS from '@src/ONYXKEYS';
import type {Route} from '@src/ROUTES';
import ROUTES from '@src/ROUTES';
import SCREENS from '@src/SCREENS';
-import type {ReimbursementAccount} from '@src/types/onyx';
+import type {Beta, Policy, PriorityMode, ReimbursementAccount, Report, TransactionViolations} from '@src/types/onyx';
type DebugTabViewProps = {
selectedTab?: string;
chatTabBrickRoad: BrickRoad;
activeWorkspaceID?: string;
+ currentReportID: string | null;
+ reports: OnyxCollection;
+ betas: OnyxEntry;
+ policies: OnyxCollection;
+ transactionViolations: OnyxCollection;
+ priorityMode: OnyxEntry;
};
function getSettingsMessage(status: IndicatorStatus | undefined): TranslationPaths | undefined {
@@ -91,7 +97,7 @@ function getSettingsRoute(status: IndicatorStatus | undefined, reimbursementAcco
}
}
-function DebugTabView({selectedTab = '', chatTabBrickRoad, activeWorkspaceID}: DebugTabViewProps) {
+function DebugTabView({selectedTab = '', chatTabBrickRoad, activeWorkspaceID, currentReportID, reports, betas, policies, transactionViolations, priorityMode}: DebugTabViewProps) {
const StyleUtils = useStyleUtils();
const theme = useTheme();
const styles = useThemeStyles();
@@ -131,10 +137,10 @@ function DebugTabView({selectedTab = '', chatTabBrickRoad, activeWorkspaceID}: D
const navigateTo = useCallback(() => {
if (selectedTab === SCREENS.HOME && !!chatTabBrickRoad) {
- const report = getChatTabBrickRoadReport(activeWorkspaceID);
+ const report = getChatTabBrickRoadReport(activeWorkspaceID, currentReportID, reports, betas, policies, priorityMode, transactionViolations);
if (report) {
- Navigation.navigate(ROUTES.REPORT_WITH_ID.getRoute(report.reportID));
+ Navigation.navigate(ROUTES.DEBUG_REPORT.getRoute(report.reportID));
}
}
if (selectedTab === SCREENS.SETTINGS.ROOT) {
@@ -144,7 +150,7 @@ function DebugTabView({selectedTab = '', chatTabBrickRoad, activeWorkspaceID}: D
Navigation.navigate(route);
}
}
- }, [selectedTab, chatTabBrickRoad, activeWorkspaceID, status, reimbursementAccount, policyIDWithErrors]);
+ }, [selectedTab, chatTabBrickRoad, activeWorkspaceID, currentReportID, reports, betas, policies, priorityMode, transactionViolations, status, reimbursementAccount, policyIDWithErrors]);
if (!([SCREENS.HOME, SCREENS.SETTINGS.ROOT] as string[]).includes(selectedTab) || !indicator) {
return null;
@@ -157,7 +163,7 @@ function DebugTabView({selectedTab = '', chatTabBrickRoad, activeWorkspaceID}: D
src={Expensicons.DotIndicator}
fill={indicator}
/>
- {message && {translate(message)}}
+ {!!message && {translate(message)}}