diff --git a/app/src/features/settings/components/BillingTeam/components/BillingDetails/MyBillingTeamDetails/components/AddMembersDrawer/AddMembersDrawer.tsx b/app/src/features/settings/components/BillingTeam/components/BillingDetails/MyBillingTeamDetails/components/AddMembersDrawer/AddMembersDrawer.tsx index 784cb3ed8a..d383e710b9 100644 --- a/app/src/features/settings/components/BillingTeam/components/BillingDetails/MyBillingTeamDetails/components/AddMembersDrawer/AddMembersDrawer.tsx +++ b/app/src/features/settings/components/BillingTeam/components/BillingDetails/MyBillingTeamDetails/components/AddMembersDrawer/AddMembersDrawer.tsx @@ -41,17 +41,16 @@ export const AppMembersDrawer: React.FC = ({ isOpen, onCl 3. Pending members */ - const externalDomainMembers = - Object.values(billingTeamMembers) - .filter((member) => { - return !billingTeamDetails?.ownerDomains?.includes(getDomainFromEmail(member.email)); - }) - .map((member) => { - return { - email: member.email, - domain: member.domain, - }; - }) || []; + const externalDomainMembers = Object.values(billingTeamMembers ?? {}) + .filter((member) => { + return !billingTeamDetails?.ownerDomains?.includes(getDomainFromEmail(member.email)); + }) + .map((member) => { + return { + email: member.email, + domain: member.domain, + }; + }); const orgMembers = organizationMembers || []; diff --git a/app/src/store/features/billing/selectors.ts b/app/src/store/features/billing/selectors.ts index 4c5a0ddf54..ca8704aba4 100644 --- a/app/src/store/features/billing/selectors.ts +++ b/app/src/store/features/billing/selectors.ts @@ -15,7 +15,20 @@ export const getBillingTeamById = (id: string | undefined) => (state: RootState) return allAvailableBillingTeams.find((billingTeam) => billingTeam.id === id); }; -export const getBillingTeamMembers = (billingId: string | undefined) => (state: RootState): Record => { +/** + * Returns `undefined` when the members for `billingId` have not been fetched (or the fetch failed) — + * callers must handle it. Note the `!billingId` branch below predates this and returns `{}` instead; + * that inconsistency is left alone rather than widened here. + * + * Deliberately NOT defaulted to `{}`, because BillingTeamMembers and OtherBillingTeamDetails both + * drive an antd ``, and a truthy empty object silently swaps + * those spinners for an empty-state. A fresh `{}` per call would additionally re-render both on every + * dispatched action while members are absent; that part is avoidable with a shared constant, the + * loading-state regression is not. + */ +export const getBillingTeamMembers = (billingId: string | undefined) => ( + state: RootState +): Record | undefined => { if (!billingId) { return {}; }