Skip to content

Sync tenant selector dropdown after tenant save#970

Open
rchlfryn wants to merge 6 commits intomainfrom
fix-tenant-selector-refresh
Open

Sync tenant selector dropdown after tenant save#970
rchlfryn wants to merge 6 commits intomainfrom
fix-tenant-selector-refresh

Conversation

@rchlfryn
Copy link
Collaborator

@rchlfryn rchlfryn commented Mar 4, 2026

Description

Automatically refresh the tenant selector dropdown when a tenant is created or updated, eliminating the need to manually refresh the page.

Payload's official multi-tenant plugin has the same limitation.

Why this approach

The syncTenants() function already exists in TenantSelectionProviderClient and handles re-fetching the tenant list from the API. The challenge was triggering it at the right time after a save.

Considered alternatives:

  • Replacing the SaveButton — too heavy, requires re-implementing save logic just to add a side effect
  • Custom field component — the TenantFieldComponent already exists but runs during form interaction, not after save
  • Server-side hookafterChange hooks run on the server and can't reach the client-side React context

beforeDocumentControls is Payload's built-in slot for injecting invisible components into the document edit view. The component uses useDocumentInfo().lastUpdateTime which Payload updates after every successful save, making it a reliable signal without coupling to save button internals.

Related Issues

Fixes part of automating onboarding.md

Key Changes

  • Add SyncTenantsOnSave client component that watches lastUpdateTime from Payload's useDocumentInfo and calls syncTenants() when it changes
  • Register the component as beforeDocumentControls on the Tenants collection
  • Regenerate Payload import map

How to test

  1. Log in as a super admin
  2. Create a new Avalanche Center
  3. Verify the tenant selector dropdown updates immediately without a page refresh
  4. Update an existing tenant's name and verify the dropdown reflects the change

Screenshots / Demo video

Migration Explanation

No migration needed — this is a UI-only change.

@github-actions
Copy link

github-actions bot commented Mar 4, 2026

Preview deployment: https://fix-tenant-selector-refresh.preview.avy-fx.org

@rchlfryn rchlfryn requested review from busbyk and stevekuznetsov and removed request for busbyk March 5, 2026 00:48
@rchlfryn rchlfryn marked this pull request as ready for review March 5, 2026 00:48
Copy link
Collaborator

@busbyk busbyk left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

My immediate reaction was that this should be done in an afterChange hook but we really don't want to do a full page reload just to get the tenant selector to update so I like this solution. I couldn't think of any situations where this client component wouldn't fire when we'd want it to so 👍

Everything looks good except the failing test 🤘

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think the renaming of dvac isn't being correctly cleaned up somehow.

I'm getting the following test failure when running e2e tests locally. This only happens when running right after a pnpm seed. If I run this test, get the failure, then run again, it succeeds. So run a fresh seed first.

pnpm seed
pnpm dev
pnpm test:e2e __tests__/e2e/admin/tenant-selector

Image

admin/tenant-selector/tenant-cookie-edge-cases.e2e.spec.ts:86

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants