Skip to content

[v17] Redesign profile switcher#51654

Merged
gzdunek merged 2 commits intobranch/v17from
gzdunek/backport-51419/v17
Jan 30, 2025
Merged

[v17] Redesign profile switcher#51654
gzdunek merged 2 commits intobranch/v17from
gzdunek/backport-51419/v17

Conversation

@gzdunek
Copy link
Copy Markdown
Contributor

@gzdunek gzdunek commented Jan 30, 2025

Backport #51417 to branch/v17
Backport #51419 to branch/v17

Changelog: Redesigned the profile switcher in Teleport Connect for a more intuitive experience. Clusters now have distinct colors for easier identification, and readability is improved by preventing truncation of long user and cluster names

* Adjust workspace tests to accept persisted workspace type

* Store profile color in workspace

* Replace manual workspace creation in stories/tests with `addRootClusterWithDoc`

* Fix checking if all colors are taken

* Add DELETE IN comment

* `ProfileColor` -> `WorkspaceColor`

* Lint

* Prettier

* Add TODO about creating workspaces in `setActiveWorkspace`

(cherry picked from commit 3b1c689)
* Add mapping of profile color to theme color

* Prepare UserIcon to display colors, make it slightly larger

* Rewrite single identity item to show icon and user/cluster in separate lines

* Render single cluster items in a list

* Add color picker

* Render active cluster separately, above inactive clusters

* Put the new identity components together

* Refactor `Identity` story, render the container component instead of "presentational" one

* Refresh startup page

* Minor style fixes

* Add comment about `dataVisualisationColors`

* Bring back the original styling of `StaticListItem`

* Make the pencil icon hoverable and clickable

* Increase min-width from 200 px to 300 px, simplify active cluster layout

* Show logout button when any part of `ListItem` is hovered

* Remove text from logout button, improve titles

* Pass correct index number to `AddClusterItem`

* Update comment for `focusGrabber`

* Use `useStoreSelector` correctly

* Improve accessibility of color picker

* Replace Pam icon with plus symbol

* Remove unnecessary optional chaining

* Align profile status error with user icon

* Add story for cluster connect panel

* Make user icon letter follow active theme

This was suggested by Kenny, and I think it looks good.

* Change gap from 11 px to 10 px

* Rename profile color -> workspace color

(cherry picked from commit 937e4a9)
@public-teleport-github-review-bot public-teleport-github-review-bot Bot removed the request for review from avatus January 30, 2025 18:17
@gzdunek gzdunek added this pull request to the merge queue Jan 30, 2025
Merged via the queue into branch/v17 with commit f740f86 Jan 30, 2025
@gzdunek gzdunek deleted the gzdunek/backport-51419/v17 branch January 30, 2025 18:37
@camscale camscale mentioned this pull request Feb 13, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants