[$250] Blank page shows for Domain member page

[jponikarchuk]

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.55-0
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-17112/folder/31025987/84856839/1317000185
Email or phone of affected tester (no customers): applausetester+en@applause.expensifail.com
Issue reported by: Applause Internal Team
Bug source: Regression TC Execution
Device used: Macbook Pro 2023 / Sequoia 15.2
App Component: Workspace Settings

Action Performed:

1. Access staging.new.expensify.com
2. Add a domain (K.com for example)
3. Go to member page

Expected Result:

User expects some information on the page

Actual Result:

The page is shown blank when accessing for the first time

Workaround:

Unknown

Platforms:

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

Screenshots/Videos

Video.mp4

View all open jobs on GitHub

Issue Owner

Current Issue Owner: @nyomanjyotisa

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~022042191256114684752
• Upwork Job ID: 2042191256114684752
• Last Price Increase: 2026-04-09

[MelvinBot]

Proposal

What is the root cause of that problem?

The DomainMembersPage is the defaultCentralScreen in the DomainSplitNavigator (DomainSplitNavigator.tsx:31), so it renders immediately when navigating to a domain. However, domain member data (security groups containing member accountIDs) is fetched asynchronously by openDomainInitialPage in DomainInitialPage (DomainInitialPage.tsx:91-100).

Until that API response arrives and populates Onyx, the memberAccountIDsSelector (Domain.ts:76-103) returns an empty array. BaseDomainMembersPage then renders with zero members and has shouldShowListEmptyContent={false} (BaseDomainMembersPage.tsx:291), so nothing is displayed — resulting in the blank page.

The DomainNotFoundPageWrapper only shows a loading indicator during initial Onyx hydration (isLoadingOnyxValue), not while the API fetch is in-flight, so it doesn't help here.

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

Add a loading/skeleton state to DomainMembersPage that displays while member data is still being fetched. Specifically:

1. In DomainMembersPage, use the isLoadingOnyxValue metadata from the useOnyx call for the domain collection key to determine if the member data is still loading.
2. While loading, show a FullScreenLoadingIndicator (or the list skeleton pattern used elsewhere) instead of passing an empty accountIDs array to BaseDomainMembersPage.
3. Consider also setting shouldShowListEmptyContent={true} in BaseDomainMembersPage so that if a domain genuinely has no members after loading completes, the user sees an appropriate empty state rather than a blank page.

What alternative solutions did you explore?

• Moving the openDomainInitialPage fetch into DomainMembersPage itself — rejected because the fetch belongs at the initial page level and is already correctly placed there; the issue is the missing loading state, not the fetch location.
• Using DomainNotFoundPageWrapper to gate on member data — rejected because that wrapper's purpose is domain existence validation, not member data loading.

Investigation details

Data flow on first access:

1. User creates domain → server returns domain object to Onyx (no security groups yet)
2. User navigates to domain → DomainSplitNavigator mounts both DomainInitialPage (sidebar) and DomainMembersPage (central) simultaneously
3. DomainNotFoundPageWrapper finds domain in Onyx → passes through (no loading shown)
4. DomainInitialPage calls openDomainInitialPage(domainName) → async API.read
5. DomainMembersPage reads memberIDs via selector → empty array (no security groups in Onyx yet)
6. BaseDomainMembersPage renders with empty accountIDs, shouldShowListEmptyContent=false → blank page
7. API response arrives, populates security groups and personalDetails → page re-renders with data

There's also a secondary filter in BaseDomainMembersPage (line 131-134) that filters members by personalDetails availability — even if accountIDs arrive, if personalDetails for those accounts haven't been populated yet, the list remains empty.

---

Next Steps for Contributor+ team: Reply with @MelvinBot implement this to create a draft PR, @MelvinBot <your feedback> to refine this analysis, or explain why you are rejecting Melvin's proposal.

[melvin-bot]

Triggered auto assignment to Contributor-plus team member for initial proposal review - @nyomanjyotisa (External)

[melvin-bot]

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

[KJ21-ENG]

Proposal

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

When opening Domain members for a newly created domain, the Members page can render as a blank content area (no rows and no empty-state guidance), which makes it look broken on first load.

What is the root cause of that problem?

The members list is derived from memberAccountIDsSelector, which only keeps numeric keys from each security group's shared map. Any non-numeric member key is dropped, and if nothing numeric remains the selector returns an empty array.

App/src/selectors/Domain.ts

Lines 75 to 99 in 1d43910

	function memberAccountIDsSelector(domain: OnyxEntry<Domain>): number[] {
	if (!domain) {
	return getEmptyArray<number>();
	}
	const memberIDs = Object.entries(domain).reduce<number[]>((acc, [key, value]) => {
	if (key.startsWith(CONST.DOMAIN.DOMAIN_SECURITY_GROUP_PREFIX)) {
	const securityGroup = value as DomainSecurityGroup;
	const sharedMembers = securityGroup?.shared ?? {};
	for (const id of Object.keys(sharedMembers)) {
	const accountID = Number(id);
	if (!Number.isNaN(accountID)) {
	acc.push(accountID);
	}
	}
	}
	return acc;
	}, []);
	const uniqueIDs = [...new Set(memberIDs)];
	return uniqueIDs.length > 0 ? uniqueIDs : getEmptyArray<number>();
	}

DomainMembersPage passes that derived array directly to the members list screen. If the selector resolves to empty, BaseDomainMembersPage builds data from accountIDs.map(...), so the list is empty.

App/src/pages/domain/Members/DomainMembersPage.tsx

Lines 59 to 61 in 1d43910

	const [memberIDs] = useOnyx(`${ONYXKEYS.COLLECTION.DOMAIN}${domainAccountID}`, {
	selector: memberAccountIDsSelector,
	});

App/src/pages/domain/BaseDomainMembersPage.tsx

Lines 109 to 137 in 1d43910

	const data: MemberOption[] = accountIDs.map((accountID) => {
	const details = personalDetails?.[accountID];
	const login = details?.login ?? '';
	const customProps = getCustomRowProps?.(accountID, login);
	const isPendingActionDelete = customProps?.pendingAction === CONST.RED_BRICK_ROAD_PENDING_ACTION.DELETE;
	return {
	keyForList: String(accountID),
	accountID,
	login,
	text: formatPhoneNumber(getDisplayNameOrDefault(details)),
	alternateText: formatPhoneNumber(login),
	icons: [
	{
	source: details?.avatar ?? icons.FallbackAvatar,
	name: formatPhoneNumber(login),
	type: CONST.ICON_TYPE_AVATAR,
	id: accountID,
	},
	],
	rightElement: getCustomRightElement?.(accountID),
	errors: getLatestError(customProps?.errors),
	pendingAction: customProps?.pendingAction,
	isInteractive: !isPendingActionDelete && !details?.isOptimisticPersonalDetail,
	isDisabled: isPendingActionDelete,
	isDisabledCheckbox: isPendingActionDelete || !!details?.isOptimisticPersonalDetail,
	brickRoadIndicator: customProps?.brickRoadIndicator,
	};
	});

The list component is configured with showListEmptyContent={false}, so users see a blank pane instead of explicit empty/loading feedback.

App/src/pages/domain/BaseDomainMembersPage.tsx

Lines 228 to 232 in 1d43910

	ListItem={TableListItem}
	onSelectRow={onSelectRow}
	onDismissError={onDismissError}
	showListEmptyContent={false}
	showScrollIndicator={false}

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

1. Make member ID derivation resilient in memberAccountIDsSelector by resolving non-numeric shared keys through PERSONAL_DETAILS_LIST (login -> accountID) before filtering.
2. Keep deduping at the end, but return every resolvable member accountID so the members list is populated on first load.
3. Add explicit non-blank fallback behavior in BaseDomainMembersPage when accountIDs is empty (for example an empty-state row/message) so first-load states are understandable instead of appearing broken.
4. Add selector-level tests for mixed key formats in shared (numeric and login-based keys), and UI coverage for the empty-list fallback.

What alternative solutions did you explore? (Optional)

An alternative is to only add an empty-state message and keep current selector parsing. I do not recommend that alone because it hides the actual data-loss path and still leaves members missing when shared contains non-numeric keys.

[wildan-m]

Proposal

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

When a user adds a new domain and navigates to the Domain members page for the first time, the content area renders completely blank — no list rows, no loading indicator, and no empty state. It only populates once the backend response arrives a moment later.

What is the root cause of that problem?

DomainMembersPage is the default central screen inside DomainSplitNavigator, so it mounts immediately when the user opens a domain. The domain key itself was hydrated in Onyx by createDomain, but the security groups (which carry the member accountIDs) are only fetched later, asynchronously, by openDomainInitialPage called from the sibling DomainInitialPage:

App/src/pages/domain/DomainInitialPage.tsx

Lines 91 to 100 in a42bb23

	const fetchDomainData = useCallback(() => {
	if (!domainName) {
	return;
	}
	openDomainInitialPage(domainName);
	}, [domainName]);
	useEffect(() => {
	fetchDomainData();
	}, [fetchDomainData]);

openDomainInitialPage is a plain API.read with no optimistic/success/failure data, so there is no flag anywhere in Onyx saying "initial domain payload is in flight":

App/src/libs/actions/Domain.ts

Lines 108 to 114 in a42bb23

	/**
	* Fetches the latest domain data from the server,
	* when accessing the domain initial page
	*/
	function openDomainInitialPage(domainName: string) {
	API.read(READ_COMMANDS.OPEN_DOMAIN_INITIAL_PAGE, {domainName});
	}

While that call is in flight, memberAccountIDsSelector correctly returns an empty array (there are no domain_securityGroup_* keys under the domain yet):

App/src/selectors/Domain.ts

Lines 76 to 103 in a42bb23

	function memberAccountIDsSelector(domain: OnyxEntry<Domain>): number[] {
	if (!domain) {
	return getEmptyArray<number>();
	}
	const memberIDs = Object.entries(domain).reduce<number[]>((acc, [key, value]) => {
	if (key.startsWith(CONST.DOMAIN.DOMAIN_SECURITY_GROUP_PREFIX)) {
	const securityGroup = value as DomainSecurityGroup;
	const sharedMembers = securityGroup?.shared ?? {};
	for (const [id, memberValue] of Object.entries(sharedMembers)) {
	if (memberValue === null || memberValue === undefined) {
	continue;
	}
	const accountID = Number(id);
	if (!Number.isNaN(accountID)) {
	acc.push(accountID);
	}
	}
	}
	return acc;
	}, []);
	const uniqueIDs = [...new Set(memberIDs)];
	return uniqueIDs.length > 0 ? uniqueIDs : getEmptyArray<number>();
	}

BaseDomainMembersPage then runs into a gap in its display logic. It builds data from the empty accountIDs array, and then:

• shouldShowListEmptyContent={false} disables the built-in SelectionList empty state, so an empty data renders nothing:

  App/src/pages/domain/BaseDomainMembersPage.tsx

  Line 291 in a42bb23

  shouldShowListEmptyContent={false}

• shouldShowEmptyPreFilterState additionally requires data.length !== 0, so the custom empty-state illustration does not fire either when data is empty:

  App/src/pages/domain/BaseDomainMembersPage.tsx

  Line 214 in a42bb23

  const shouldShowEmptyPreFilterState = filteredData.length === 0 && data.length !== 0 && !!emptyStateTitle && inputValue.length === 0;

So during the fetch window the page renders no rows, no loading indicator, and no empty state — a completely blank pane.

Note that DomainNotFoundPageWrapper cannot cover this window. It only shows FullscreenLoadingIndicator while isLoadingOnyxValue(domainMetadata) is true, but the domain Onyx key was already hydrated by the earlier createDomain call, so the metadata is already loaded by the time the user reaches the Members page.

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

Track the in-flight state of openDomainInitialPage explicitly on the domain object and gate the members list on it. This mirrors the existing isSamlEnabledLoading / isSamlRequiredLoading pattern already used in Domain.ts.

1. Add an optional isLoadingDomainInitialPage?: boolean field to the Domain type in src/types/onyx/Domain.ts.
2. In src/libs/actions/Domain.ts, change openDomainInitialPage to also accept domainAccountID and attach optimisticData / successData / failureData that set isLoadingDomainInitialPage: true on the domain key at call time and clear it back to null on success or failure. Update the single caller in DomainInitialPage to pass the domainAccountID it already has on hand.
3. Expose a small isLoadingDomainInitialPageSelector in src/selectors/Domain.ts that returns this new field.
4. In src/pages/domain/Members/DomainMembersPage.tsx, read that selector alongside memberIDs. While the flag is true and memberIDs is still empty, render a FullscreenLoadingIndicator inside DomainNotFoundPageWrapper (so the header/back button/tab bar still render correctly) instead of passing an empty list to BaseDomainMembersPage. Once the flag clears, fall through to the normal render path.

This keeps all the loading logic on the data-owning page, uses an Onyx flag that is guaranteed to be accurate (written by the action itself), and leaves the selector and BaseDomainMembersPage untouched for all the other existing callers.

What alternative solutions did you explore? (Optional)

• Proxy the loading state by "no security groups yet": treat memberIDs.length === 0 as still-loading and render the spinner until at least one security group appears. Rejected because it is semantically wrong — a domain can legitimately end up with zero resolvable members at steady state, and this would pin the spinner forever in that case.
• Gate on isLoadingOnyxValue(domainMetadata) at the Members page level: rejected because, as explained above, the domain key is already hydrated by createDomain, so that metadata reports loaded well before the members payload arrives. It does not cover the API-fetch window this bug lives in.

Compare: https://github.com/Expensify/App/compare/main...wildan-m:App:wildan/87478-domain-members-blank-page?expand=1

[wildan-m]

Proposal updated — added compare branch with implementation.

[nyomanjyotisa]

I couldn't reproduce this issue on my end

MacOS-Chrome.mp4

@jponikarchuk are there any preconditions required to reproduce this?