[Due for payment 2026-04-14] [$250] Domain Verification Process - No verified badge after verifying the domain

[lanitochka17]

If you haven’t already, check out our contributing guidelines for onboarding and email contributors@expensify.com to request to join our Slack channel!

---

Version Number: v9.3.3-2
Reproducible in staging?: Yes
Reproducible in production?: Yes
If this was caught during regression testing, add the test name, ID and link from BrowserStack: https://test-management.browserstack.com/projects/2219752/test-runs/TR-2995/folder/31025987/72289419/1128451665?sort=%2Bidentifier
Email or phone of affected tester (no customers): admin@expplause.com
Issue reported by: Applause Internal Team
Bug source: Regression TC Execution
Device used: Win11Pro/Chrome
App Component: Workspace Settings

Action Performed:

Preconditions:
User is an admin of an unverified domain.

1. Navigate to the Workspaces page
2. Verify the domain has an Not verified badge
3. Click on the three-dot menu for the domain and select Verify Domain
4. Verify the "Verify domain" RHP opens and displays a TXT record code
5. Click Verify Domain
6. Verify you are routed to a confirmation page
7. Click "Got it."
8. Verify the domain badge now shows as Verified

Expected Result:

The domain badge now shows as Verified

Actual Result:

No Verified badge after the verification of the domain

Workaround:

Unknown

Platforms:

• Android: App
• Android: mWeb Chrome
• iOS: App
• iOS: mWeb Safari
• iOS: mWeb Chrome
• Windows: Chrome
• MacOS: Chrome / Safari

Screenshots/Videos

Bug7051087_1768574756818.bandicam_2026-01-16_16-33-33-539.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~022013479456623181779
• Upwork Job ID: 2013479456623181779
• Last Price Increase: 2026-02-17
• Automatic offers:
• samranahm | Contributor | 110581850

Issue Owner

Current Issue Owner: @samranahm

[melvin-bot]

Triggered auto assignment to @kadiealexander (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.

[annaweber830]

Proposal

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

The domain badge now shows as Verified

What is the root cause of that problem?

• The Workspaces domains list UI only ever renders a “Not verified” badge for admins when the domain is unverified, and renders no badge at all when the domain is validated—so there is no way for “Verified” to appear.
• Additionally, the verification action flow was not guaranteeing the Workspaces list’s domain Onyx record immediately reflects validated: true upon success, and the confirmation screen navigation path wasn’t optimized to return the user to the Workspaces list to see the updated state.

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

• Update the Workspaces domain list row badge logic to show:
  • “Not verified” when validated is false (admin view)
  • “Verified” when validated is true (admin view)
• Update the domain validation success handling so the client state sets validated: true immediately on success, ensuring the Workspaces list updates without requiring a refetch.
• Change the “Got it” action on the verification confirmation page (Workspaces flow) to dismiss the modal / return the user to the Workspaces list, so the updated badge is visible right away.

App/src/components/Domain/DomainMenuItem.tsx

Lines 87 to 92 in e94f05d

	<DomainsListRow
	title={item.title}
	badgeText={isAdmin && !isValidated ? translate('domain.notVerified') : undefined}
	isHovered={hovered}
	menuItems={threeDotsMenuItems}
	/>

<DomainsListRow
                        title={item.title}
                        badgeText={isAdmin ? (isValidated ? translate('common.verified') : translate('domain.notVerified')) : undefined}
                        isHovered={hovered}
                        menuItems={threeDotsMenuItems}
                    />

App/src/libs/actions/Domain.ts

Lines 59 to 65 in e94f05d

	const successData: Array<OnyxUpdate<typeof ONYXKEYS.COLLECTION.DOMAIN>> = [
	{
	onyxMethod: Onyx.METHOD.MERGE,
	key: `${ONYXKEYS.COLLECTION.DOMAIN}${accountID}`,
	value: {isValidationPending: null, hasValidationSucceeded: true},
	},
	];

const successData: Array<OnyxUpdate<typeof ONYXKEYS.COLLECTION.DOMAIN>> = [
        {
            onyxMethod: Onyx.METHOD.MERGE,
            key: `${ONYXKEYS.COLLECTION.DOMAIN}${accountID}`,
            value: {isValidationPending: null, hasValidationSucceeded: true, validated: true},
        },
    ];

App/src/pages/domain/BaseDomainVerifiedPage.tsx

Lines 24 to 28 in e94f05d

	/** Route to redirect to when trying to access the page for an unverified domain */
	redirectTo: Route;
	};
	function BaseDomainVerifiedPage({domainAccountID, redirectTo}: BaseDomainVerifiedPageProps) {

 redirectTo: Route;
    onConfirm?: () => void;
};

function BaseDomainVerifiedPage({domainAccountID, redirectTo, onConfirm}: BaseDomainVerifiedPageProps) {

App/src/pages/domain/BaseDomainVerifiedPage.tsx

Lines 57 to 69 in e94f05d

	<ConfirmationPage
	illustration={LottieAnimations.Fireworks}
	heading={translate('domain.domainVerified.header')}
	descriptionComponent={
	<View style={[styles.renderHTML, styles.flexRow]}>
	<RenderHTML html={translate('domain.domainVerified.description', {domainName: Str.extractEmailDomain(domain.email)})} />
	</View>
	}
	innerContainerStyle={styles.p10}
	buttonText={translate('common.buttonConfirm')}
	shouldShowButton
	onButtonPress={() => Navigation.navigate(ROUTES.DOMAIN_INITIAL.getRoute(domainAccountID))}
	/>

<ConfirmationPage
                illustration={LottieAnimations.Fireworks}
                heading={translate('domain.domainVerified.header')}
                descriptionComponent={
                    <View style={[styles.renderHTML, styles.flexRow]}>
                        <RenderHTML html={translate('domain.domainVerified.description', {domainName: Str.extractEmailDomain(domain.email)})} />
                    </View>
                }
                innerContainerStyle={styles.p10}
                buttonText={translate('common.buttonConfirm')}
                shouldShowButton
                onButtonPress={() => (onConfirm ? onConfirm() : Navigation.navigate(ROUTES.DOMAIN_INITIAL.getRoute(domainAccountID)))}
            />

App/src/pages/domain/WorkspacesDomainVerifiedPage.tsx

Lines 14 to 17 in e94f05d

	<BaseDomainVerifiedPage
	domainAccountID={domainAccountID}
	redirectTo={ROUTES.WORKSPACES_VERIFY_DOMAIN.getRoute(domainAccountID)}
	/>

<BaseDomainVerifiedPage
            domainAccountID={domainAccountID}
            redirectTo={ROUTES.WORKSPACES_VERIFY_DOMAIN.getRoute(domainAccountID)}
            onConfirm={() => Navigation.dismissModal()}
        />

What alternative solutions did you explore? (Optional)

[samranahm]

🚨 Edited by proposal-police: This proposal was edited at 2026-01-30 17:12:22 UTC.

Proposal

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

After successfully verifying a domain through the domain verification flow (navigating to Workspaces page > clicking Verify Domain > completing the verification process), the domain badge should change from "Not verified" to "Verified". However, currently the badge disappears completely after verification instead of showing as "Verified".

What is the root cause of that problem?

Currently, the badgeText property is set as:

App/src/components/Domain/DomainMenuItem.tsx

Line 89 in 10d08d2

badgeText={isAdmin && !isValidated ? translate('domain.notVerified') : undefined}

This logic only displays a badge when the domain is NOT validated. When isValidated becomes true after successful verification, the badgeText becomes undefined, causing the badge to disappear entirely.

Additionally, the translation key domain.verified does not exist in any of the language files, so even if the logic were corrected, there would be no text to display for the verified state.

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

Calculate the badge text using IIFE:

const badgeText = (() => {
    if (!isAdmin) {
        return undefined;
    }
    return isValidated ? translate('domain.verified') : translate('domain.notVerified');
})();

and use that badgeText here

App/src/components/Domain/DomainMenuItem.tsx

Line 89 in 10d08d2

badgeText={isAdmin && !isValidated ? translate('domain.notVerified') : undefined}

    badgeText={badgeText}
    isDomainVerified={isValidated}

and apply badgeSuccess in DomainsListRow

    badgeStyles={[styles.alignSelfCenter, styles.badgeBordered, isDomainVerified && styles.badgeSuccess]}

here

App/src/components/Domain/DomainsListRow.tsx

Line 56 in 80dc863

badgeStyles={[styles.alignSelfCenter, styles.badgeBordered]}

And include copy on all locals

This ensures that:

• If the user is not an admin, show no badge (undefined)
• If the user is an admin and the domain is validated, show "Verified"
• If the user is an admin and the domain is not validated, show "Not verified"

What alternative solutions did you explore?

N/A

[nkdengineer]

Proposal

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

No Verified badge after the verification of the domain

What is the root cause of that problem?

We set the badgeText as undefined when the domain is verified

App/src/components/Domain/DomainMenuItem.tsx

Lines 87 to 90 in f38d88b

	<DomainsListRow
	title={item.title}
	badgeText={isAdmin && !isValidated ? translate('domain.notVerified') : undefined}
	isHovered={hovered}

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

1. We should show the verified badge when the domain is verified. If we only want to show the domain status for admin we can update to not show the badge for non-admin user

const bagdeText = useMemo(() => {
        if (!isAdmin) {
            return undefined;
        }
        return isValidated ? translate('common.verified') : translate('domain.notVerified');
    }, [isAdmin, isValidated, translate]);
badgeText={bagdeText}
// or display the verified status for all users
// badgeText={isAdmin && !isValidated ? translate('domain.notVerified') : translate('common.verified')}

App/src/components/Domain/DomainMenuItem.tsx

Lines 87 to 90 in f38d88b

	<DomainsListRow
	title={item.title}
	badgeText={isAdmin && !isValidated ? translate('domain.notVerified') : undefined}
	isHovered={hovered}

2. We should also display the success badge when it's verified; it's a better UI. To do that, add badgeSuccess prop to DomainsListRow

success={badgeSuccess}

App/src/components/Domain/DomainsListRow.tsx

Lines 51 to 55 in f38d88b

	{!!badgeText && (
	<View style={[styles.flexRow, styles.gap2, styles.alignItemsCenter, styles.justifyContentEnd]}>
	<Badge
	text={badgeText}
	textStyles={styles.textStrong}

and then pass badgeSuccess={isValidated} here

App/src/components/Domain/DomainMenuItem.tsx

Lines 87 to 90 in f38d88b

	<DomainsListRow
	title={item.title}
	badgeText={isAdmin && !isValidated ? translate('domain.notVerified') : undefined}
	isHovered={hovered}

What alternative solutions did you explore? (Optional)

Reminder: Please use plain English, be brief and avoid jargon. Feel free to use images, charts or pseudo-code if necessary. Do not post large multi-line diffs or write walls of text. Do not create PRs unless you have been hired for this job.

[melvin-bot]

@kadiealexander Whoops! This issue is 2 days overdue. Let's get this updated quick!

[melvin-bot]

Job added to Upwork: https://www.upwork.com/jobs/~022013479456623181779