App Expensify Card - Policy ID is displayed under the card's name for member

If you haven’t already, check out our contributing guidelines for onboarding and email [email protected] to request to join our Slack channel!

Version Number: 9.0.30-9 Reproducible in staging?: Y Reproducible in production?: Y Issue reported by: Applause Internal Team

Action Performed:

Precondition:

Admin and member are in the same workspace.

Go to staging.new.expensify.com
[Admin] Go to workspace settings > Expensify Card.
[Admin] Click Issue card.
[Admin] Issue a card to the member.
[Member] Go to Account settings > Wallet.

Expected Result:

Policy ID will not be displayed under the card's name for member.

Actual Result:

Policy ID is displayed under the card's name for member.

Workaround:

Unknown

Platforms:

[x] Android: Native
[x] Android: mWeb Chrome
[x] iOS: Native
[x] iOS: mWeb Safari
[x] MacOS: Chrome / Safari
[x] MacOS: Desktop

Screenshots/Videos

https://github.com/user-attachments/assets/9367e3b2-56a1-4426-b733-8f8d7fe01369

View all open jobs on GitHub

Sep 06 '24 20:09 IuliiaHerets

Triggered auto assignment to @RachCHopkins (Bug), see https://stackoverflow.com/c/expensify/questions/14418 for more details. Please add this bug to a GH project, as outlined in the SO.

Sep 06 '24 20:09 melvin-bot[bot]

@RachCHopkins FYI I haven't added the External label as I wasn't 100% sure about this issue. Please take a look and add the label if you agree it's a bug and can be handled by external contributors

Sep 06 '24 20:09 IuliiaHerets

Proposal

Please re-state the problem that we are trying to solve in this issue.

Policy ID is displayed under the card's name for member.

What is the root cause of that problem?

When displaying assigned card, we always display its domain name regardless the domain name contain the policyID or not:

https://github.com/Expensify/App/blob/a9dc59624ac6ad9896ef7c4fce46a18d696213bd/src/pages/settings/Wallet/PaymentMethodList.tsx#L248

What changes do you think we should make in order to solve the problem?

We can use:

                        description: /policy([a-zA-Z0-9]+)\.exfy/.test(card.domainName) ? '' : card.domainName,

or

                        description: /policy([a-zA-Z0-9]+)\.exfy/.test(card.domainName) ? getDescriptionForPolicyDomain(card.domainName) : card.domainName,

In above, I introduce a new function getDescriptionForPolicyDomain which will return the policy name based on card domain:

    const getDescriptionForPolicyDomain = (domainName: string) => {
        const match = domainName.match(/policy([a-zA-Z0-9]+)\.exfy/);
        const policyID = match ? match[1] : null;
        const policy = getPolicy(policyID)
        return policy?.name // Can be improved later
    };

What alternative solutions did you explore? (Optional)

Sep 07 '24 01:09 dominictb

Proposal

Please re-state the problem that we are trying to solve in this issue.

Policy ID is displayed under the card's name for member

What is the root cause of that problem?

The PolicyID is included in the domainName for Expensify Cards. As a result, when displaying the domain name, the PolicyID will also be shown.

What changes do you think we should make in order to solve the problem?

Checking if this is the Expensify Card, we will customize the domain name to prevent the policyID from being displayed.

To identify an Expensify Card, we can use the isExpensifyCard function or create a new function to identify it using the domainName field

https://github.com/Expensify/App/blob/7ebfaa0daaa43a20083250e0f263964ed5b647b2/src/libs/CardUtils.ts#L40

We need to discuss with other stuffs which domain name to display in the subtitle of the Expensify Card, rather than showing the domain name from the backend. We will then update it to display the new subtitle.

What alternative solutions did you explore? (Optional)

Sep 07 '24 18:09 cretadn22

What is the expectation here? If the card is issued from the workspace, I'd expect the workspace name, not just the domain name. I will check on this.