Moving the schedule to the new grouped button + popover will help us to free up some space in the main content making some space to better accommodate the resources info.

Design:

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

How it works:

• The schedule button opens a popover with the full schedule information.
• If the workspace is "started" we should display on the left the shutdown info.
• If the workspace is "stopped" we should display on the left the starts info.
• The "+" and "-" controls should have the same behavior as the one from the current schedule component.
• The component 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 "workspace actions" grouped button will be made in another ticket.