Skip to content

Move workspace actions into a grouped button #2748

Closed
@BrunoQuaresma

Description

@BrunoQuaresma

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

Metadata

Metadata

Assignees

Labels

siteArea: frontend dashboard

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions