feat(FR-3226): add tabbed Downloads modal with CLI download & pip get-started

[agatha197]

Resolves #8076 (FR-3226)

Summary

Adds an in-WebUI entry point for getting started with the Backend.AI CLI, without adding another dropdown item. The existing "Download Desktop App" surface is generalized into a single tabbed Downloads modal.

• The user dropdown now has one Downloads row (was Download Desktop App), gated when either the desktop-app panel or the CLI panel is allowed.
• DesktopAppDownloadModal → DownloadModal with two tabs:
  • Desktop App — existing content moved as-is (OS select + ARM64/X64 buttons).
  • CLI — two routes to start using the CLI in one screen.

CLI tab

• SCIE binary download: OS select (Linux / macOS — no Windows SCIE) + per-arch download buttons. Asset names verified against the real lablup/backend.ai releases: backendai-client-<os>-<arch> (Linux: x86_64 + aarch64; macOS: aarch64 only). The base URL defaults to …/releases/latest/download (GitHub redirects to the newest release asset, so no version segment is needed) and is overridable via config.
• pip get-started: a copyable code block — pip install backend.ai-client, env-var configuration (endpoint pre-filled from the session; keypair shown as <your-access-key> / <your-secret-key> placeholders — secrets never rendered), and a few example commands (backend.ai run …, backend.ai ps, backend.ai --help).

Configuration

Two new config keys (defaults provided, overridable via the webserver config.toml; added to config.toml.sample):

Key	Default	Meaning
cliDownloadUrl	https://github.com/lablup/backend.ai/releases/latest/download	Base URL for the CLI SCIE binaries. Blank → falls back to the default.
allowCLIDownloadPanel	true	Show the CLI tab in the Downloads modal.

Because both default on, the CLI tab is testable in dev with no extra setup.

Changes

• react/src/components/DownloadModal.tsx (new) — tabbed modal (Desktop App / CLI); modal body paddingTop: 0 so tabs sit flush under the header.
• react/src/components/DesktopAppDownloadModal.tsx (removed) — content moved into the Desktop App tab.
• react/src/hooks/index.tsx — add useCliDownloadMap; add cliDownloadUrl / allowCLIDownloadPanel to the config type.
• react/src/helper/loginConfig.ts — parse/default/assign the two new config keys (mirrors appDownloadUrl / allowAppDownloadPanel).
• react/src/components/UserDropdownMenu.tsx — single Downloads entry → DownloadModal.
• config.toml.sample — document the two new keys.
• resources/i18n/*.json — new summary.* keys (Downloads, DesktopApp, CLI, CLIGetStartedDescription) across all 21 languages.

Notes / follow-ups

• cliDownloadUrl points at the backend.ai core releases (the CLI version follows core, not the WebUI package version); latest/download keeps it version-agnostic. A fully self-contained -fat- SCIE variant is also published if the team prefers it (one-line filename change).
• No credentials are rendered: the snippet pre-fills only the endpoint and uses placeholders for the keypair.

Screenshots

The single Downloads modal (one dropdown entry). The CLI tab is split into two labeled sections — SCIE binary download (with per-OS run guidance) and pip install.

Desktop App tab	CLI tab (Linux)	CLI tab (macOS)

macOS shows the Gatekeeper unblock note since the SCIE build isn't notarized yet (tracked in FR-3235).

How to test

The CLI tab is on by default — allowCLIDownloadPanel defaults to true and cliDownloadUrl defaults to the backend.ai latest/download base — so no config change is needed to see it.

Config (optional overrides)

Both keys are documented in config.toml.sample. For local dev, set them in the config.toml the dev server serves:

[general]
# blank "" → falls back to the default below
cliDownloadUrl = "https://github.com/lablup/backend.ai/releases/latest/download"
allowCLIDownloadPanel = true   # set false to hide the CLI tab

Not yet wired into the webserver — currently resolves from these defaults / the local config.toml only (see the TODO in loginConfig.ts; may move to appConfig later).

What to verify

• Top-right user menu shows a single Downloads entry (not separate App / CLI items).
• The modal has two tabs: Desktop App (unchanged) and CLI, with the tabs flush under the header.
• CLI tab SCIE buttons: Linux = x86_64 + aarch64; macOS = aarch64 only (no x64).
• A download button opens …/backendai-client-<os>-<arch> — e.g. …/releases/latest/download/backendai-client-linux-x86_64 → 302 to the latest release asset (confirmed 200, real binary).
• pip block: endpoint pre-filled from the current session; access/secret shown as <your-access-key> / <your-secret-key> placeholders (no real secret is ever rendered); the copy icon at the top-right copies the whole snippet.
• allowCLIDownloadPanel = false → CLI tab disappears. If allowAppDownloadPanel is also false, the Downloads menu entry is hidden entirely.
• cliDownloadUrl = "" → falls back to the default base URL.

Verification

bash scripts/verify.sh — Relay PASS · Lint PASS · Format PASS. The only tsc finding is a pre-existing, environment-only patched-dependency mislink in FluentEmojiIcon.tsx (origin/main file, untouched here). No tsc errors originate from this PR's files. CI installs with patches applied (frozen lockfile), where origin/main already passes. SCIE download URLs were confirmed live (302 → 26.4.6 assets) against lablup/backend.ai releases.

🤖 Generated with Claude Code

[agatha197]

• feat(FR-3226): add tabbed Downloads modal with CLI download & pip get-started #8081 👈 (View in Graphite)
• main

---

How to use the Graphite Merge Queue

Add either label to this PR to merge it via the merge queue:

• flow:merge-queue - adds this PR to the back of the merge queue
• flow:hotfix - for urgent changes, fast-track this PR to the front of the merge queue

You must have a Graphite account in order to use the merge queue. Sign up using this link.

An organization admin has required the Graphite Merge Queue in this repository.

Please do not merge from GitHub as this will restart CI on PRs being processed by the merge queue.

This stack of pull requests is managed by Graphite. Learn more about stacking.

[github-actions]

Coverage Report for react-coverage (./react)

Status	Category	Percentage	Covered / Total
🔵	Lines	6.7%	1946 / 29018
🔵	Statements	5.47%	2193 / 40061
🔵	Functions	5.66%	322 / 5684
🔵	Branches	3.66%	1385 / 37780

File Coverage

File	Stmts	Branches	Functions	Lines	Uncovered Lines
Changed Files
react/src/components/DownloadModal.tsx	0%	0%	0%	0%	32-203
react/src/components/UserDropdownMenu.tsx	0%	0%	0%	0%	46-265
react/src/helper/loginConfig.ts	0.69%	0%	12.5%	0.7%	25-46, 189-673
react/src/hooks/index.tsx	47.79%	31.25%	36.58%	50%	28-40, 44-45, 53-65, 72-82, 242-243, 248, 254-261, 353-356, 371-374, 382-403, 411, 421-436, 453, 479-493, 501-530, 533-562

Generated in workflow #2456 for commit 34ecd99 by the Vitest Coverage Report Action

[Copilot]

Pull request overview

This PR generalizes the existing “Download Desktop App” entry point into a single Downloads modal with tabs (Desktop App + CLI), so users can download/install and get started with the Backend.AI CLI without adding extra dropdown items.

Changes:

• Replaces the user dropdown “Download Desktop App” item with a single gated Downloads item that opens a new tabbed modal.
• Adds a new CLI tab that includes SCIE binary download links + a copyable pip-based get-started snippet (endpoint prefilled, secrets as placeholders).
• Introduces new config keys (cliDownloadUrl, allowCLIDownloadPanel) and adds i18n strings across languages for the new UI labels.

Reviewed changes

Copilot reviewed 27 out of 27 changed files in this pull request and generated 6 comments.

Show a summary per file

File	Description
react/src/components/DownloadModal.tsx	New tabbed modal implementing Desktop App and CLI download/get-started UI.
react/src/components/DesktopAppDownloadModal.tsx	Removed in favor of the new tabbed DownloadModal.
react/src/components/UserDropdownMenu.tsx	Switches dropdown menu item to “Downloads” and wires it to DownloadModal with combined gating.
react/src/hooks/index.tsx	Adds useCliDownloadMap and extends BackendAI client config typing for CLI download config.
react/src/helper/loginConfig.ts	Adds defaults + TOML parsing + client config application for cliDownloadUrl / allowCLIDownloadPanel.
config.toml.sample	Documents the two new CLI download-related config keys.
resources/i18n/en.json	Adds summary.Downloads, summary.DesktopApp, summary.CLI, summary.CLIGetStartedDescription.
resources/i18n/ko.json	Same i18n additions for Korean.
resources/i18n/ja.json	Same i18n additions for Japanese.
resources/i18n/zh-CN.json	Same i18n additions for Simplified Chinese.
resources/i18n/zh-TW.json	Same i18n additions for Traditional Chinese.
resources/i18n/de.json	Same i18n additions for German.
resources/i18n/es.json	Same i18n additions for Spanish.
resources/i18n/fr.json	Same i18n additions for French.
resources/i18n/fi.json	Same i18n additions for Finnish.
resources/i18n/el.json	Same i18n additions for Greek.
resources/i18n/it.json	Same i18n additions for Italian.
resources/i18n/id.json	Same i18n additions for Indonesian.
resources/i18n/ms.json	Same i18n additions for Malay.
resources/i18n/mn.json	Same i18n additions for Mongolian.
resources/i18n/pl.json	Same i18n additions for Polish.
resources/i18n/pt.json	Same i18n additions for Portuguese.
resources/i18n/pt-BR.json	Same i18n additions for Brazilian Portuguese.
resources/i18n/ru.json	Same i18n additions for Russian.
resources/i18n/th.json	Same i18n additions for Thai.
resources/i18n/tr.json	Same i18n additions for Turkish.
resources/i18n/vi.json	Same i18n additions for Vietnamese.

[ironAiken2]

Reviewed by exercising the CLI tab end-to-end on macOS (Apple Silicon). The feature is wired correctly and both routes are reachable, but in practice both download routes currently dead-end for a macOS user without steps the modal never mentions. Requesting changes to close these gaps before merge.

1. Separate the two install routes in the UI

The CLI tab stacks two unrelated routes with no visual boundary:

• top: SCIE binary download (OS select + arch buttons) — hands the user an executable file.
• bottom: a pip install backend.ai-client snippet — a completely different install method.

Because they sit flush together, a user who clicks the download button then reads "Install via pip and configure…" and is left wondering what the file they just downloaded is for. Please split them into two clearly-labeled sub-sections (e.g. "Download standalone binary (SCIE)" vs "Install via pip"), each self-contained with its own instructions, so neither reads as a continuation of the other.

2. SCIE binary has no run guidance, and the macOS build is Gatekeeper-blocked

• No usage instructions after download. The download buttons yield a raw executable (backendai-client-<os>-<arch>) with zero next-step guidance (make it executable, run it, put it on PATH). Every guidance string in the tab describes the pip route only.

• macOS binary isn't notarized → it won't run. Downloading backendai-client-macos-aarch64 and launching it triggers Gatekeeper:

  "Apple could not verify 'backendai-client-macos-aarch64' is free of malware that may harm your Mac or compromise your privacy."

  The lablup/backend.ai release binaries aren't codesigned/notarized, so on macOS the "click to download" button produces a file that can't be run without clearing the quarantine attribute (xattr -d com.apple.quarantine <file>) or System Settings → Privacy & Security → "Open Anyway". Since the tab ships a macOS-only aarch64 button, this affects every macOS user of the feature.

Two-part ask:

• This PR (webui): add a short "how to run" note under the binary buttons — chmod +x + run / PATH for Linux, and the Gatekeeper bypass for macOS (ideally shown only when macos is selected).
• Follow-up (backend.ai core, not this PR): notarize / codesign the macOS release binaries so the download-and-run flow works without manual steps. That's a release-pipeline change outside webui and should be tracked separately.

3. pip snippet needs its environment requirements

The snippet is a bare pip install backend.ai-client with no Python-version requirement and no version pin. Exercised on a fresh venv it fails hard:

• On Python 3.14, pip can't find a compatible client and silently backtracks to a 4-year-old backend.ai-client==22.3.2, whose pinned PyYAML==5.4.1 then fails to build:

  AttributeError: 'build_ext' object has no attribute 'cython_sources'
  

• Even on the happy path there are two more snags the snippet doesn't cover: pip may not be on PATH (needs pip3 / python3 -m pip), and installing outside a venv hits PEP 668 externally-managed-environment.

Asks:

• State the supported Python version(s) and use a version floor (e.g. pip install "backend.ai-client>=<current-series>") so users don't silently land on the 22.3.2 fallback.
• Recommend a venv (and python3 -m pip) so the snippet is actually copy-paste-runnable.

Additional (optional) — signpost the recommended route

Beyond separating them (#1), the tab currently gives both routes equal weight with no "use this one" hint. The SCIE binary is the batteries-included path (bundled Python, no pip / venv / PEP-668), while pip requires environment setup — worth labeling which is recommended. (This ties into #2: we can only recommend the binary once macOS notarization is resolved.)

---

Net: mechanically it works, but on macOS both the binary route (Gatekeeper) and the pip route (Python 3.14 → 22.3.2 → PyYAML build failure) currently dead-end. I'd want the in-modal guidance for #2 and #3, plus the UI separation in #1, before merge.

[agatha197]

Thanks for the thorough macOS run-through — all three are addressed in the latest push, plus a follow-up for the notarization part.

1. Separate the two install routes. The CLI tab is now split into two self-contained, labeled sub-sections with a divider between them: "Download standalone executable" (SCIE binary — OS select + arch buttons) and "Install via pip" (the pip snippet). Neither reads as a continuation of the other anymore.

2. Binary run guidance + macOS Gatekeeper.

• Added a "how to run" block under the binary buttons: chmod +x → run → optional install onto PATH. It's shown for the non-macOS case.
• For macOS (shown only when macOS is selected) there's now a warning Alert with the Gatekeeper bypass — chmod +x, xattr -d com.apple.quarantine <file>, then run — since the macos-aarch64 build isn't notarized.
• Follow-up filed for the core side: FR-3235 — notarize/codesign the macOS SCIE release binaries so the download-and-run flow works without manual steps (release-pipeline change in lablup/backend.ai, outside this PR; linked as related to FR-3226).

3. pip environment.

• The snippet now states the supported Python (3.13; 3.14+ not yet supported) and drives everything through a venv (python3.13 -m venv .venv → activate), which also sidesteps the pip-not-on-PATH and PEP 668 externally-managed-environment issues.
• It runs pip install -U pip first and pins the client to the connected manager version (pip install "backend.ai-client==<managerVersion>"), so it no longer silently backtracks to the 4-year-old 22.3.2 (and its PyYAML build failure).

Optional (recommended-route signpost). Held off intentionally — as you noted, we can only recommend the binary once macOS notarization (FR-3235) lands. Happy to add a "recommended" tag on the SCIE section as a fast follow once that's resolved.

[Copilot]

Pull request overview

Copilot reviewed 27 out of 27 changed files in this pull request and generated no new comments.