Skip to content

Address first-use friction: login clarity, navigation discoverability, and new-user onboarding (#468) - #478

Open
ericwinger wants to merge 7 commits into
mainfrom
eric/issue468-login-feedback-docs
Open

Address first-use friction: login clarity, navigation discoverability, and new-user onboarding (#468)#478
ericwinger wants to merge 7 commits into
mainfrom
eric/issue468-login-feedback-docs

Conversation

@ericwinger

Copy link
Copy Markdown
Member

Summary

Addresses the actionable items from #468 — observations from the second new-developer first-use session (remote login, then a first attempt to browse code). The work groups into six areas; each is one focused commit (plus one merge of main), described below with what to expect and how to test it in a real editor window.

Where an item turned out not to need code, it's listed under "Items closed without code" with the reasoning.

What changed, and what to test

Log in to a stone first (any 3.7.x). Each area can be checked independently.

1. Login field help + connection feedback (items 1, 2, 3)

Expect: The login editor has a "Help me login" toggle (open by default for a new login) with per-field help; Host User / Host Password are marked optional. A left status-bar item shows a spinner while connecting, and on failure turns red and is click-to-explain. README / the walkthrough's connect page are rewritten to follow the UI order.
Test: Add a login and connect — watch the status bar go from connecting → (banner on success, see #2) or red on a bad password (click it to see why). Open the login editor and confirm the field help and the optional markers read clearly.

2. Green "connected" banner (item 3)

Expect: On a successful connect, a green ✅ Connected to <stone> banner flashes at the top of the GemStone Explorer's Dictionaries view for a few seconds.
Test: Connect and confirm the banner appears and then clears on its own. (VS Code status bars can't render green, so this is a TreeView.message banner — please eyeball placement.)

3. High Contrast selection visibility (item 6)

Expect: In the class browser, the selected row draws a full outline in the theme's focus-border color — visible in every theme and bold under High Contrast.
Test: Switch VS Code to a High Contrast theme, click a class/method, and confirm the selection is unmistakable. (Accessibility fix — please verify in a real HC window.)

4. Explorer selection stability + Methods-pane discoverability (items 7, 8)

Expect: The Explorer's Open Editors pane is gone (it reshuffled the sidebar and scrolled your selection out of view when you opened your first editor); a left status-bar Close N GemStone editor(s) button replaces its one-click close-all. The Methods pane opens each method in one reusable preview tab; a one-time hint explains this at the moment a click first replaces a previewed method, the pin command reads Keep Method Open (Pin), and the method-row tooltip spells out preview-vs-keep.
Test: Open a class, single-click several methods — confirm the selection no longer jumps away, and the one-time hint fires the first time a click replaces a method. Confirm the status-bar close-all button tallies and closes open GemStone editors.

5. Breadcrumb as a live class navigator + Back/Forward (items 8, plus #432)

Expect: The editor breadcrumb over an open method now drills into the stone at every level (dictionary → class → side → category → selector), so you can navigate sideways to sibling classes/methods without leaving the editor. Two title-bar GemStone Go Back / Forward buttons retrace the methods you've viewed (VS Code's own history can't, because methods share one preview tab). Also fixes #432: the senders/implementors hover no longer disappears when one of its two queries fails.
Test: Open a method, click through the breadcrumb dropdowns to reach a sibling method and the class definition. Use Go Back / Forward to retrace. Rest on a selector to confirm the senders/implementors hover still shows even on a stone without the RB plugin.

6. "Start Here" onboarding for a newly-connected user (item 10)

Expect: On connect, a purple GemStone - Start Here button appears in the status bar. Clicking it opens a quick pick — Browse a class, Search your code, Open a workspace, Take the tour. It stays put (it's unobtrusive) and is removed only via its own Hide the Start Here button entry; GemStone: Reset Getting Started brings it back. The same quick pick is always available from the Command Palette as GemStone: Start Here. The Get Started walkthrough also gained Browse classes and Search your code steps.
Test: Connect and confirm the button appears; click it and try each quick-pick action. Confirm dismissing the quick pick (clicking away) leaves the button in place, and that Hide the Start Here button removes it. Run GemStone: Reset Getting Started and reconnect to confirm it returns. Open Help → Welcome → Get Started with GemStone and confirm the two new steps.

Items closed without code

  • Items 4 & 5 (accidental rename / ivar reorder): not reproducible — rename requires an explicit icon/menu plus a confirmation dialog, and ivar moves require an explicit arrow plus a destination quick pick. Dropped; reopen with a real accidental-repro case.
  • Item 8, breadcrumb tooltip separators: the visible breadcrumb bar already uses . The remaining /-separated string is the editor tab's hover tooltip, which VS Code derives from the resource URI — no extension API can override it. Not fixable from the extension.
  • Item 9 (selecting a class should update the editor): effectively resolved by items 6 + 8 — clicking a class now visibly populates the (larger, discoverable) Methods pane and the selection is clearly highlighted. We deliberately did not auto-open a class-definition tab on every click (visually noisy for read-oriented browsing). Left for the original tester to confirm.

Testing done

Fast gate green: ESLint, Prettier, tsc, and the full unit + integration suites — client 5912 · server 322 · mcp-server 92 (integration tests log into a live 3.7.x stone).

Closes #468

ericwinger and others added 7 commits August 20, 2026 15:23
Addresses the first three actionable items from the new-developer
first-use review in #468:

- Login editor: add a "Help me login" toggle that reveals grounded,
  per-field guidance (defaults open for a new login), mark Host User /
  Host Password optional with an explanation of when they are needed,
  and link GemStone's "Logging in Gem Sessions" guide. Fixes the
  undocumented fields a first-time user couldn't interpret.
- Connect feedback: a dedicated left-aligned status-bar item now carries
  the whole connect lifecycle — connecting spinner, a green "Connected"
  flash for a few seconds, or a red click-to-explain state on failure —
  so success/failure is unambiguous without a modal or a missable toast.
- Docs: rewrite the connect walkthrough step and align the README to the
  order the login editor presents its fields.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Follow-up to the connect-feedback work: success is now shown by revealing
the GemStone Explorer and flashing a green "✅ Connected to <stone>"
banner at the top of the Dictionaries view for a few seconds (via
TreeView.message), rather than a status-bar color (VS Code status-bar
backgrounds can't be green) or a webview panel (far too large for a
transient flash). The ✅ emoji reads green in every theme including High
Contrast. Failure feedback (red, click-to-explain status-bar item) is
unchanged.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
The class browser is a custom webview, so its selected row does not get
VS Code's automatic High-Contrast selection outline; its shared
selection rule (used by all six columns) set only a theme background,
which reads faint or empty under High Contrast — so the selected class
and method were nearly invisible for a low-vision user. Draw a full
outline around the selected row in the focus color, which High-Contrast
themes render as a bold, high-contrast color (restoring the outline the
user navigated by) and which is visible in every theme.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
… pinning discoverable (#468)

Opening the first editor used to flip the Explorer's Open Editors pane from
hidden to shown, reflowing the sidebar and scrolling the Classes selection out
of view. Remove that pane entirely (open editors are already editor tabs) and
move its only unique feature — one-click close-all — to a left status-bar button
that shows a live count and reads as an action ("Close N GemStone editor(s)").
Deleted explorerOpenEditors.ts, explorerOpenEditorsLabel.ts, the dirty-decoration
provider (VS Code dots the tab natively), and the reveal/close-one commands,
menus, and view. Frees a pane's height for the Methods pane.

The Methods pane opens each method in one reusable preview tab, so single-
clicking another method replaces it and a first-time user thinks the method was
lost. Keep VS Code's preview/pin behavior but make it discoverable: a one-time
toast at the exact replace moment, the pin commands retitled "Keep Method Open
(Pin)", and the method-row tooltip now spells out preview-vs-keep.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
…history (#468)

The gemstone:// method editor already shows a Dictionary › Class › side ›
category › selector breadcrumb, but readDirectory returned nothing so its
dropdowns were empty and the crumbs led nowhere. Implement readDirectory + stat
on the FS provider so each level drills into the stone: dictionary → classes,
class → instance/class + definition, side → categories, category → selectors
(opening the method). A new parseDirUri classifies the intermediate path URIs as
read-only directories without a stone round-trip, carefully leaving the real
files (method/definition/comment/new-*) to parseUri.

VS Code's own Go Back can't retrace those methods: they open in one reusable
preview tab and its history only tracks distinct/pinned tabs, so a first-time
user drilling through the breadcrumb had no way back. Add GemStone Go Back /
Forward title-bar buttons backed by GemstoneNavigationHistory — a browser-style
stack of the gemstone:// editors visited, reopening each in the preview tab, with
forward-truncation on a new visit and pruning of entries that no longer open. It
ignores the activation echo of its own navigation so the stack can't corrupt.

Also fix a latent hover bug surfaced along the way: the senders/implementors
hover ran implementorsOf unguarded, so one thrown query (busy session, or no
browser/RB plugin) rejected the whole hover and silently showed nothing. Guard it
like the sendersOf call so the hover degrades instead of vanishing.

Tests: parseDirUri classification, directory stat, and readDirectory listing;
the navigation-history stack (back/forward, echo-suppression, truncation, stale
pruning); and the hover surviving a thrown implementorsOf.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
A newly-connected user was dropped into the raw kernel with no signpost to
browsing, searching, or opening a workspace. Add two unobtrusive, self-erasing
entry points to the basics:

- A "GemStone - Start Here" status-bar button, shown on connect, that opens a
  quick pick of Browse a class / Search your code / Open a workspace / Take the
  tour. It stays put (non-invasive for power users) and is removed only via its
  own "Hide the Start Here button" entry; Reset Getting Started brings it back.
  The same quick pick is always available from the palette as GemStone: Start
  Here. Implemented in a testable module (client/src/startHere.ts).

- Two new Get Started walkthrough steps, "Browse classes" and "Search your
  code", which the walkthrough previously skipped despite teaching evaluate and
  inspect.

Reset Getting Started now re-arms both the walkthrough and the button, and its
title reflects that. CHANGELOG updated.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

2 participants