Skip to content

Show the signed-in username and ORCID iD in the gallery top bar - #52

Merged
dauglyon merged 5 commits into
mainfrom
feat/gallery-identity
Sep 24, 2026
Merged

dauglyon merged 5 commits into
mainfrom
feat/gallery-identity

Conversation

@dauglyon

@dauglyon dauglyon commented Sep 24, 2026 •

Copy link
Copy Markdown
Collaborator

When /api/V2/me returns a user, the right end of the gallery top bar shows the KBase username over the ORCID iD, with the user's avatar at the right. Signed out, nothing renders. The data comes from the existing /me query: user, and the ORCID entry in idents.

ORCID display guidelines

The iD uses the compact form from the ORCID iD display guidelines: the iD icon, then the 16 digits, linked to https://orcid.org/<iD>. The icon is 16px, the guidelines' minimum for limited space. The icon sits with the digits only. The inline form (name, then icon) would present the KBase username as the ORCID record holder's name.

No ORCID identity

A kbase_session cookie is shared across .kbase.us, so a session from another KBase site signed in with Google or Globus reaches the gallery with no ORCID identity. The second line then reads "Link your ORCID iD" with the design system's external-link icon (ArrowSquareOut), linking to <ui origin>/account/providers, the legacy account UI's linked-providers page. The UI origin is derived from AUTH_ORIGIN the way kbase-ui does it: https://kbase.us maps to https://narrative.kbase.us, any other origin to itself (legacyUiOrigin in src/config.ts). No iD icon is shown, since there is no iD.

Layout

  • The block is 40px tall in the logo's 26px slot and extends into the bar's padding by a negative margin. The bar is 51px signed in and signed out.
  • With a second line, the username is capped to that line's width; alone, to 190px. Either way it ends in an ellipsis, with the full name in title. auth2 usernames are up to 100 characters (UserName.MAX_NAME_LENGTH).
  • The username's line box is 12px. Its clip box extends 3px under the baseline, so descenders and underscores are not cut.

Checks

  • npm run lint, npm run format:check, npm run typecheck, npx vitest run --dir src: exit 0, 208 tests. New tests in portals.test.tsx: no identity block signed out; username and ORCID link signed in; the linking link when no ORCID identity exists. config.test.ts covers the origin mapping.
  • Rendered in Chromium with /me stubbed, at 1280px and 375px, for dlyon, jgreypy, gyjqp_pygmy, j_q_p_y_g, microbial_genomics_lab_2024, a 40-character name and a 100-character name: bar 51px, block 193px wide at the same position, no horizontal scroll, descenders intact.

Rendered only when /api/V2/me returns a user: the KBase username over the
ORCID iD in compact form (iD icon, then the digits, linked to the record),
with the user's avatar at the right. The block is taller than the logo and
extends into the bar's padding, so the bar is 51px signed in and out. A
username longer than the iD line ends in an ellipsis, with the full name
as a tooltip.
A kbase_session cookie from another kbase.us site (a Google or Globus
sign-in) can carry an account with no ORCID identity. The second line
then reads "Link your ORCID iD" with the design system's external-link
icon, opening the legacy account UI's linked-providers page.

Also fixes the username rendering at zero width in that case: the rule
that caps it to the iD line's width now applies only when a second line
exists; a lone username gets a 190px maximum.
The link pointed at production's account UI on every deployment, so a CI
user would link an ORCID in the wrong environment. legacyUiOrigin maps the
auth origin the way kbase-ui does: kbase.us to narrative.kbase.us, any
other origin to itself, and the dev proxy target when the origin is empty.
@dauglyon
dauglyon merged commit af53f37 into main Sep 24, 2026
6 checks passed
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.

1 participant