Files
OpenResearch/ui/src/panelLayout.ts
T
Myles AndersonandClaude Fable 5.1 b38c8136e6 OR-280 Nudge new installs to run the demo experiment (#338)
* Nudge new installs to run the demo experiment

Analytics for Sep 9-12 installs showed the largest funnel leak between
"onboarding complete" and "first message sent" (43.8%). The demo welcome
steered users to read the recorded sessions rather than send anything.

- Rename the welcome's primary button to "Run the demo experiment" and hand
  focus to the composer, which already holds the run-experiment prompt.
- Keep that prefill on offer until the user has sent anything in the demo,
  detected by a recorded session's active leaf moving off its seeded message
  or a new session appearing, instead of only until the welcome closes.
- Show a dismissible hint above the composer explaining the 200-step probe,
  with a ring on the send button while the prefilled prompt is untouched.
- Open only the experiments tab on the first demo visit.
- Default the right pane to a quarter of the window (max 480px) on installs
  with no saved layout, and share that default with the projects home so it
  is not overwritten before the demo opens.

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>

* Refine the demo nudge and add a running-experiment hint

- Relabel the welcome button "Try the demo experiment": the click only
  focuses the prefilled prompt, so "Run" over-promised.
- Style the composer hint as a neutral surface bubble instead of a tint.
- When a demo run starts, show a second dismissible hint above the composer
  with a Logs button that opens that run's logs; it clears when the run
  leaves the running state.

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>

* Address review on the running-experiment hint

- Seed the running-run hint from the runs baseline so it survives a reload
  or a return to the demo project mid-run.
- Announce the hint to assistive tech via a polite live region and return
  focus to the composer on dismiss, matching the prompt hint.
- Share the hint bubble classes, drop the redundant Logs tooltip key, and
  use the idiomatic Arabic phrasing for the tap instruction.

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>

---------

Co-authored-by: Claude Fable 5.1 <noreply@anthropic.com>
2026-09-15 12:19:34 -07:00

18 lines
720 B
TypeScript
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
// Floating panel sizing: keep both the panel and the chat column usable.
export const PANEL_MIN_WIDTH = 360;
const RAIL_WIDTH = 272;
const CHAT_MIN_SPACE = 380;
// Four 14px gutters: app-body padding ×2, rail inner margin, end-pane inner margin.
const LAYOUT_CHROME = RAIL_WIDTH + 14 * 4;
/** The widest the floating panel can be while leaving the rail + chat usable. */
export function panelMaxWidth(): number {
return Math.max(PANEL_MIN_WIDTH, window.innerWidth - LAYOUT_CHROME - CHAT_MIN_SPACE);
}
/** Default when no layout is saved. */
export function initialPanelWidth(): number {
const max = panelMaxWidth();
return Math.max(PANEL_MIN_WIDTH, Math.min(480, max, Math.round(window.innerWidth * 0.25)));
}