Skip to content

Move workspace actions into a grouped button #2748

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
BrunoQuaresma opened this issue Jun 30, 2022 · 1 comment · Fixed by #2996
Closed

Move workspace actions into a grouped button #2748

BrunoQuaresma opened this issue Jun 30, 2022 · 1 comment · Fixed by #2996
Assignees
Labels
site Area: frontend dashboard

Comments

@BrunoQuaresma
Copy link
Collaborator

BrunoQuaresma commented Jun 30, 2022

Moving the workspace actions into a grouped button will help us to free up some space in the header making some space to accommodate the schedule info.

Design:
Action dropdown

Figma link:
https://www.figma.com/file/YIGBkXUcnRGz2ZKNmLaJQf/Coder-v2-Design?node-id=444%3A603

How it works:

  • The main action should be on the left, and the other secondary actions, inside of the dropdown.
  • If there are no secondary actions, we can just disable the dropdown instead of "hide" it to avoid flickering the screen.
  • The button should have a fixed width to avoid size changes between states to avoid flickering the screen.
  • By flickering, I mean things that can change size quickly and modify the layout too fast causing a weird feeling of "laggy".

Considerations:

  • We should try to always use existent components from the codebase or Material UI package.
  • We should use existing colors.
  • The grouped button should be accessible via keyboard.
  • Please, let me know if you have any questions about this.
  • The "schedule" component will be made in another ticket.
  • if we are in an intermediate state and have the following actions: start | stop | delete -> display start, hides stop and delete
@BrunoQuaresma BrunoQuaresma added the site Area: frontend dashboard label Jun 30, 2022
@Kira-Pilot Kira-Pilot self-assigned this Jul 11, 2022
@Kira-Pilot
Copy link
Member

chatted with Bruno about #1928. Below is the outcome for intermediate states.
Will update the AC.

Case:
start | stop | delete -> display start, hides stop and delete
cancel | delete -> display cancel, hides delete
cancel -> display cancel

Kira-Pilot added a commit that referenced this issue Jul 14, 2022
Kira-Pilot added a commit that referenced this issue Jul 14, 2022
* added workspace cta dropdown

resolves #2748

* added tests

* fixed failing tests

* clean up snapshots
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
site Area: frontend dashboard
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants