Make Agentic UI available behind a beta feature flag

[katinthehatsite]

Related issues

Fixes STU-2006

How AI was used in this PR

It was used to brainstorm ideas and then implement the feature once I decided on what makes most sense.

Proposed Changes

Testing Instructions

• Pull the changes from this branch
• Start the app with npm start
• Confirm that you can see the banner in the app:
• Confirm that you can click on Try it button and that it switches the UI to the agentic UI
• Confirm that from the top menu, you can enable and disable the new UI from the beta features
• Confirm that once you dismiss the banner and restart the app, the banner does not appear again

Pre-merge Checklist

• Have you checked for TypeScript, React or other console errors?

[wpmobilebot]

📊 Performance Test Results

Comparing 7e69db5 vs trunk

app-size

Metric	trunk	7e69db5	Diff	Change
App Size (Mac)	1352.86 MB	1352.92 MB	+0.06 MB	⚪ 0.0%

site-editor

Metric	trunk	7e69db5	Diff	Change
load	1079 ms	1079 ms	0 ms	⚪ 0.0%

site-startup

Metric	trunk	7e69db5	Diff	Change
siteCreation	6995 ms	6980 ms	15 ms	⚪ 0.0%
siteStartup	2352 ms	2366 ms	+14 ms	⚪ 0.0%

---

Results are median values from multiple test runs.

Legend: 🟢 Improvement (faster) | 🔴 Regression (slower) | ⚪ No change (<50ms diff)

[bcotrim]

The UI looks great 👍
We didn't add a similar toggle in the Agentic UI preferences, but I think it's ok to discuss/address it when we redo the Agentic UI preferences.

Something I suggest changing:

• The beta flag should be the only source of truth for displaying the Agentic UI, replacing the existing feature flag behavior
• The feature flag controls the visibility of the beta opt-in (the banner and the Beta Features menu entry)

This allows us to keep working on the Agentic UI without exposing it to all users yet. When we're ready to make it available, we just remove the feature flag and the beta flag becomes visible and available for everyone.

What do you think?

[shaunandrews]

[shaunandrews]

Pushed a bunch of design updates to bring in the pixel-w, progressive blur, and dotgrid elements to both banners. I updated the design for the main banner to use a card-like design, with a single primary action; dismiss becomes an X icon at the top-right. I also added enter/exit animations for the card banner.

[katinthehatsite]

The beta flag should be the only source of truth for displaying the Agentic UI, replacing the existing feature flag behavior
The feature flag controls the visibility of the beta opt-in (the banner and the Beta Features menu entry)

Yeah that makes sense, I will adjust the PR 👍 I have not really worked on that bit yet as I was mostly looking to find agreement on the design, placement and approach. It seems that it is done now, so I will proceed with adding these changes.

[katinthehatsite]

Pushed a bunch of design updates to bring in the pixel-w, progressive blur, and dotgrid elements to both banners. I updated the design for the main banner to use a card-like design, with a single primary action; dismiss becomes an X icon at the top-right. I also added enter/exit animations for the card banner.

This looks good to me 👍 Thanks @shaunandrews - I will clean up the rest of the code.

[katinthehatsite]

@bcotrim I made some adjustments and now we have got:

Feature flag (ENABLE_AGENTIC_UI) — now controls visibility only:

• Toggling it in the developer menu no longer reloads the renderer
• It gates whether the banner and the enableAgenticUi beta features menu entry are visible
• When set to true: users see the banner and can opt in. When false (default): the opt-in is hidden.

Beta feature (betaFeatures.enableAgenticUi) — now the sole source of truth for which UI loads:

• Toggling it (via banner, preferences, or beta menu) persists + reloads the renderer
• The beta menu entry for it only appears when the feature flag is enabled

Banner/Preferences callout — show when:

• Feature flag is true (opt-in visible) AND
• Beta feature is false (not yet opted in) AND
• Not dismissed

I see that @shaunandrews also moved the banner into the preferences tab:

I don't know if it is visible enough in there or if we should move it to a place where it was before e.g. in the header so I will let you make a call there.

One thing to note is that to go back to the old UI, the users would need to use the Beta features menu. I don't know if that's a concern, but leaving it here in case we want to improve the visibility of the switch back.

[bcotrim]

The rework looks great 👍

One suggestion: getPreferredStudioUiMode() still reads the feature flag (with the beta value copied into it at boot/toggle). I'd make the beta flag the only thing deciding which UI loads, and keep the feature flag controlling just the UI elements (menu entry + banners).

That way releasing is trivial — remove the feature flag and the opt-in is visible to everyone. A user who enabled the beta would keep the Agentic UI even with the flag off, but I think that's fine: the flag's job is just to hide the opt-in until we're ready.

What do you think?

[bcotrim]

One thing to note is that to go back to the old UI, the users would need to use the Beta features menu. I don't know if that's a concern, but leaving it here in case we want to improve the visibility of the switch back.

I think it's a valid concern, we could have a similar option in the user preferences to revert back. If it's an easy addition let's do it, otherwise we can address it in a follow-up PR when we work on Agentic UI preferences.

[katinthehatsite]

One suggestion: getPreferredStudioUiMode() still reads the feature flag (with the beta value copied into it at boot/toggle). I'd make the beta flag the only thing deciding which UI loads, and keep the feature flag controlling just the UI elements (menu entry + banners).
That way releasing is trivial — remove the feature flag and the opt-in is visible to everyone. A user who enabled the beta would keep the Agentic UI even with the flag off, but I think that's fine: the flag's job is just to hide the opt-in until we're ready.
What do you think?

Sounds good to me, I made the related changes 👍 So now, if you enable agentic UI feature flag, the UI won't automatically switch to the legacy UI but instead, the banner will appear in Settings as well as the option for the beta features will start listing the new Studio experience.

[katinthehatsite]

I think it's a valid concern, we could have a similar option in the user preferences to revert back. If it's an easy addition let's do it, otherwise we can address it in a follow-up PR when we work on Agentic UI preferences.

I added something like this for now:

We can remove it if not needed.

[bcotrim]

LGTM 👍
Thanks for making the adjustments

[bcotrim]

Resolved the trunk conflicts and pushed two commits:

Merge — kept this branch's version of the dev flags menu; the #4200 fix there was obsolete since the feature flag no longer reloads the renderer.
Two small follow-ups: #4200's bug moved to the beta toggle (it was sending beta-features-updated to the renderer being replaced), so I ported the same guard there. Also gated "Toggle Site Preview" on the actual UI mode instead of the feature flag, so it survives removing the flag at release.

[katinthehatsite]

Thanks for merging @bcotrim 🙇