Thanks to visit codestin.com
Credit goes to github.com

Skip to content

fix(webui): restore flex layout on top navbar right container#1060

Merged
itomek-amd merged 1 commit into
mainfrom
1059-bug-top-navbar-broken
May 15, 2026
Merged

fix(webui): restore flex layout on top navbar right container#1060
itomek-amd merged 1 commit into
mainfrom
1059-bug-top-navbar-broken

Conversation

@itomek

@itomek itomek commented May 15, 2026

Copy link
Copy Markdown
Collaborator

The action icons in the top navbar were stacking vertically instead of laying out in a horizontal row at all viewport widths. The right-side container (<div className="chat-header-right">) referenced a CSS class that didn't exist — .task-header-right is the correctly defined rule providing display: flex. Renaming the one JSX className restores the horizontal layout without touching any other file.

Test plan

  • Build passes: cd src/gaia/apps/webui && npm run build exits 0
  • New class in bundle: grep -c "task-header-right" dist/assets/index-*.js → 1
  • Old typo absent: grep -c "chat-header-right" dist/assets/index-*.js → 0
  • At 1841×611 (the screenshot from the issue): model badge + 7 icons render in a single horizontal row
  • At ≤768px: model badge hidden by existing responsive rule; icons remain on one row

Fixes #1059

The right-side nav container (model badge + 7 action icons) was rendered
with className="chat-header-right" — an undefined CSS class — so the element
received no flex layout and its children stacked vertically at any viewport
width. Renaming to "task-header-right" connects it to the existing CSS rule
(.task-header-right { display: flex; align-items: center; gap: 6px; }) and
restores horizontal layout.

Fixes #1059
@itomek itomek requested a review from kovtcharov-amd as a code owner May 15, 2026 17:08
@itomek itomek linked an issue May 15, 2026 that may be closed by this pull request
3 tasks
@itomek-amd itomek-amd added this pull request to the merge queue May 15, 2026
Merged via the queue into main with commit 896dc20 May 15, 2026
25 checks passed
@itomek-amd itomek-amd deleted the 1059-bug-top-navbar-broken branch May 15, 2026 17:21
@itomek itomek mentioned this pull request May 15, 2026
6 tasks
antmikinka pushed a commit to antmikinka/gaia that referenced this pull request May 15, 2026
# GAIA v0.18.1 Release Notes

GAIA v0.18.1 is a patch release covering two regressions reported after
v0.18.0. The first is a sweep of broken `amd-gaia.ai/...` documentation
links across connector cards, the Agent UI splash, the agent registry,
the installer, and BuilderAgent templates — every link was missing the
`/docs/` prefix the Mintlify site serves all content under, so 12
in-product "Learn More" / troubleshooting URLs were silently 404'ing.
The second is a CSS class typo in the Agent UI `ChatView` top navbar
that broke the right-side flex container, stacking the action icons
vertically instead of laying them out horizontally.

**Why upgrade:**
- **Documentation links resolve again** — every `amd-gaia.ai/...` URL
surfaced by GAIA (connector catalog, Agent UI server splash, agent
registry error guidance, BuilderAgent templates, installer messages,
WebUI metadata) now routes through the `/docs/` prefix Mintlify expects.
Two regression tests prevent the prefix from silently dropping again.
- **Agent UI navbar action icons render horizontally** — the right-side
container of the `ChatView` top navbar referenced a CSS class that
didn't exist (`chat-header-right` vs the defined `task-header-right`),
so the action icons stacked vertically at all viewport widths. The
one-line rename restores `display: flex`.


## Key Changes

Both changes in v0.18.1 are bug fixes targeting regressions reported
after v0.18.0 shipped.

- **Broken `amd-gaia.ai` documentation links across multiple surfaces**
(PR [amd#1061](amd#1061), closes
[amd#1058](amd#1058)) — Every "Learn More",
troubleshooting, and SDK doc link in `src/gaia/` was pointing at a bare
`https://amd-gaia.ai/<path>` URL that 404'd, because the Mintlify
Documentation tab serves all content under `/docs/`. The fix inserts the
missing `/docs/` prefix across all 12 affected locations — the connector
catalog, the Agent UI server splash, agent registry error guidance,
BuilderAgent template doc-comments, installer messages, and WebUI
metadata — and adds `tests/unit/test_amd_gaia_urls.py` plus
`tests/unit/connectors/test_catalog_docs_url.py` so the prefix can't
silently drop again.
- **Agent UI top-navbar action icons stacked vertically** (PR
[amd#1060](amd#1060), fixes
[amd#1059](amd#1059)) — The right-side
container of `ChatView`'s top navbar (`<div
className="chat-header-right">`) referenced a CSS class that didn't
exist; the correctly defined rule providing `display: flex` is
`.task-header-right`. Renaming the one JSX `className` restores the
horizontal layout at all viewport widths without touching any other
file.


## Full Changelog

**2 commits** since v0.18.0:

- `ae94190a` — fix(connectors): route all amd-gaia.ai URLs through
/docs/ prefix (amd#1061)
- `896dc203` — fix(webui): restore flex layout on top navbar right
container (amd#1060)

Full Changelog:
[v0.18.0...v0.18.1](amd/gaia@v0.18.0...v0.18.1)

## Release checklist

- [x] `util/validate_release_notes.py docs/releases/v0.18.1.mdx` passes
- [x] `src/gaia/version.py` → `0.18.1`
- [x] `src/gaia/apps/webui/package.json` → `0.18.1`
- [x] Navbar label in `docs/docs.json` → `v0.18.1 · Lemonade 10.2.0`
- [x] All 2 commits in range (v0.18.0..HEAD) are represented in the
notes
- [ ] Review from @kovtcharov-amd addressed
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.

[Bug]: Top navbar broken

2 participants