feat(site): add Install Coder Desktop item to UserDropdown - #28244
Conversation
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 8b0888d846
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
| * install affordance everywhere else (e.g. Linux). | ||
| */ | ||
| export function supportsCoderDesktop(): boolean { | ||
| return isMac() || isWindows(); |
There was a problem hiding this comment.
Exclude iPadOS from macOS desktop support
On iPadOS 13+ Safari in desktop mode, navigator.platform reports MacIntel, so isMac() returns true and this new predicate displays an install option for a platform where Coder Desktop is unavailable. The repository already handles iPadOS masquerading as macOS by checking navigator.maxTouchPoints in site/src/pages/AgentsPage/utils/chatAttachments.ts:69-72; apply an equivalent exclusion here.
Useful? React with 👍 / 👎.
Address Codex review: move UserDropdown platform-gating coverage into Storybook play functions and exclude iPadOS (reports MacIntel with a touchscreen) from supportsCoderDesktop.
Coder Desktop now ships an (experimental) Linux client (coder/coder-desktop-linux), so the install affordance should be shown on Linux too. Add isLinux() and include it in the predicate, keeping the iPadOS exclusion. Addresses review feedback.
This comment was marked as outdated.
This comment was marked as outdated.
The Linux Coder Desktop client (coder/coder-desktop-linux) is experimental and its maintainer isn't comfortable advertising it yet, so revert the earlier change that surfaced the install affordance on Linux. Back to macOS/Windows only.
chrifro
left a comment
There was a problem hiding this comment.
non-blocking
I'd suggest to adjust the icons. Having a download icon for only one of the install actions can be confusing.
Install Coder Desktop https://lucide.dev/icons/monitor?search=termin
Install CLI https://lucide.dev/icons/terminal
I know it's out of scope, but would be great if we only show these options if they have not been installed yet. If we can't fit it into this PR, can we make sure to document it a linear issue to pick up another time?
Address review feedback: a lone download icon on Install CLI next to the Coder Desktop item was confusing. Use the monitor glyph for Install Coder Desktop and the terminal glyph for Install CLI.
Replace the manual Object.defineProperty navigator juggling with vi.stubGlobal in the unit test and spyOn in the story, per review feedback.
| import { supportsCoderDesktop } from "#/utils/platform"; | ||
| import { SupportIcon } from "../SupportIcon"; | ||
|
|
||
| const CODER_DESKTOP_DOCS_URL = "https://coder.com/docs/user-guides/desktop"; |
There was a problem hiding this comment.
should this use our docs() helper?
There was a problem hiding this comment.
Hmm. I like this on main as its more likely to be up to date with the instructions from the individual clients (this isn't synced with Coder <-> Coder Desktop).
I can see why some feedback might be specific to a version and we could back date for said docs. Agent in progress...
Spying the whole window.navigator getter and spreading it dropped prototype getters (e.g. userAgent) that Storybook's client reads, crashing the story in a real browser. Spy the platform and maxTouchPoints getters individually so the rest of navigator stays intact.
Resolves DEVEX-722.
Adds an Install Coder Desktop item to
UserDropdown, sitting directly above the existing Install CLI option. BecauseUserDropdownContentis shared, it appears in both the navbar dropdown and the agents-page sidebar footer.Screenshots
macOS/Windows shots are captured with
navigator.platformoverridden accordingly; the Linux shot is the real workspace platform, where the Coder Desktop item is hidden. Install Coder Desktop uses a monitor glyph, and Install CLI now uses a terminal glyph (it was a monitor onmain).main(before)Behaviour
https://coder.com/docs/user-guides/desktop) rather than a single install method. The docs page is the canonical hub covering Homebrew, WinGet, manual release downloads, and source, and it stays current without frontend changes. Thecoder-desktop-*repo READMEs don't enumerate install methods; they defer to these same docs.Changes
site/src/utils/platform.ts: addisWindows()andsupportsCoderDesktop().UserDropdownContent.tsx: render the platform-gated item (MonitorIcon) and switch Install CLI toTerminalIcon.Implementation plan & decision log
Ticket open questions and decisions
Implementation
site/src/utils/platform.tswithisWindows()andsupportsCoderDesktop()(reusing the existingisMac()).UserDropdownContent.tsx, conditionally render anInstall Coder DesktopDropdownMenuItem(external link,MonitorIcon, opens in a new tab) aboveInstall CLIwhensupportsCoderDesktop()is true.platform.test.ts(OS detection viavi.stubGlobal) andUserDropdown.stories.tsx(visibility + href per platform, mocking platform detection withspyOn).Left as a draft pending review, let me know when you'd like it opened.