Skip to content

feat(UI): add workspace restart button #7137

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.

Sign up for GitHub

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

Merged
merged 11 commits into from
Apr 14, 2023
Merged

feat(UI): add workspace restart button #7137

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
11 commits
Select commit Hold shift + click to select a range
ebf0011
Refactor primary buttons
BrunoQuaresma Apr 13, 2023
d923e1b
Merge branch 'main' into bq/refactor-workspace-header
BrunoQuaresma Apr 13, 2023
4e73089
refactor(site): Always show the main actions
BrunoQuaresma Apr 13, 2023
5df1260
Merge branch 'main' into bq/refactor-workspace-header
BrunoQuaresma Apr 14, 2023
f7e681e
Merge branch 'main' into bq/refactor-workspace-header
BrunoQuaresma Apr 14, 2023
4f0bc77
Remove tests that are testes on Storybook
BrunoQuaresma Apr 14, 2023
a9bb484
Fix tests
BrunoQuaresma Apr 14, 2023
27d2d24
Fix keys
BrunoQuaresma Apr 14, 2023
3d05424
added restart btn
Kira-Pilot Apr 14, 2023
2df38fb
Merge remote-tracking branch 'origin/bq/refactor-workspace-header' in…
Kira-Pilot Apr 14, 2023
4aab6b6
Merge remote-tracking branch 'origin/main' into w-restart-btn/kira-pilot
Kira-Pilot Apr 14, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 3 additions & 0 deletions site/src/components/Workspace/Workspace.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -41,6 +41,7 @@ export interface WorkspaceProps {
}
handleStart: () => void
handleStop: () => void
handleRestart: () => void
handleDelete: () => void
handleUpdate: () => void
handleCancel: () => void
Expand Down Expand Up @@ -72,6 +73,7 @@ export const Workspace: FC<React.PropsWithChildren<WorkspaceProps>> = ({
scheduleProps,
handleStart,
handleStop,
handleRestart,
handleDelete,
handleUpdate,
handleCancel,
Expand Down Expand Up @@ -132,6 +134,7 @@ export const Workspace: FC<React.PropsWithChildren<WorkspaceProps>> = ({
isOutdated={workspace.outdated}
handleStart={handleStart}
handleStop={handleStop}
handleRestart={handleRestart}
handleDelete={handleDelete}
handleUpdate={handleUpdate}
handleCancel={handleCancel}
Expand Down
33 changes: 26 additions & 7 deletions site/src/components/WorkspaceActions/Buttons.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,16 +3,17 @@ import BlockIcon from "@material-ui/icons/Block"
import CloudQueueIcon from "@material-ui/icons/CloudQueue"
import CropSquareIcon from "@material-ui/icons/CropSquare"
import PlayCircleOutlineIcon from "@material-ui/icons/PlayCircleOutline"
import ReplayIcon from "@material-ui/icons/Replay"
import { LoadingButton } from "components/LoadingButton/LoadingButton"
import { FC } from "react"
import { FC, PropsWithChildren } from "react"
import { useTranslation } from "react-i18next"
import { makeStyles } from "@material-ui/core/styles"

interface WorkspaceAction {
handleAction: () => void
}

export const UpdateButton: FC<React.PropsWithChildren<WorkspaceAction>> = ({
export const UpdateButton: FC<PropsWithChildren<WorkspaceAction>> = ({
handleAction,
}) => {
const { t } = useTranslation("workspacePage")
Expand All @@ -30,7 +31,7 @@ export const UpdateButton: FC<React.PropsWithChildren<WorkspaceAction>> = ({
)
}

export const StartButton: FC<React.PropsWithChildren<WorkspaceAction>> = ({
export const StartButton: FC<PropsWithChildren<WorkspaceAction>> = ({
handleAction,
}) => {
const { t } = useTranslation("workspacePage")
Expand All @@ -48,7 +49,7 @@ export const StartButton: FC<React.PropsWithChildren<WorkspaceAction>> = ({
)
}

export const StopButton: FC<React.PropsWithChildren<WorkspaceAction>> = ({
export const StopButton: FC<PropsWithChildren<WorkspaceAction>> = ({
handleAction,
}) => {
const { t } = useTranslation("workspacePage")
Expand All @@ -66,7 +67,25 @@ export const StopButton: FC<React.PropsWithChildren<WorkspaceAction>> = ({
)
}

export const CancelButton: FC<React.PropsWithChildren<WorkspaceAction>> = ({
export const RestartButton: FC<PropsWithChildren<WorkspaceAction>> = ({
handleAction,
}) => {
const { t } = useTranslation("workspacePage")
const styles = useStyles()

return (
<Button
variant="outlined"
startIcon={<ReplayIcon />}
onClick={handleAction}
className={styles.fixedWidth}
>
{t("actionButton.restart")}
</Button>
)
}

export const CancelButton: FC<PropsWithChildren<WorkspaceAction>> = ({
handleAction,
}) => {
return (
Expand All @@ -80,7 +99,7 @@ interface DisabledProps {
label: string
}

export const DisabledButton: FC<React.PropsWithChildren<DisabledProps>> = ({
export const DisabledButton: FC<PropsWithChildren<DisabledProps>> = ({
label,
}) => {
return (
Expand All @@ -94,7 +113,7 @@ interface LoadingProps {
label: string
}

export const ActionLoadingButton: FC<React.PropsWithChildren<LoadingProps>> = ({
export const ActionLoadingButton: FC<PropsWithChildren<LoadingProps>> = ({
label,
}) => {
const styles = useStyles()
Expand Down
1 change: 1 addition & 0 deletions site/src/components/WorkspaceActions/WorkspaceActions.stories.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@ const Template: Story<WorkspaceActionsProps> = (args) => (
const defaultArgs = {
handleStart: action("start"),
handleStop: action("stop"),
handleRestart: action("restart"),
handleDelete: action("delete"),
handleUpdate: action("update"),
handleCancel: action("cancel"),
Expand Down
4 changes: 4 additions & 0 deletions site/src/components/WorkspaceActions/WorkspaceActions.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ import {
DisabledButton,
StartButton,
StopButton,
RestartButton,
UpdateButton,
} from "./Buttons"
import {
Expand All @@ -28,6 +29,7 @@ export interface WorkspaceActionsProps {
isOutdated: boolean
handleStart: () => void
handleStop: () => void
handleRestart: () => void
handleDelete: () => void
handleUpdate: () => void
handleCancel: () => void
Expand All @@ -43,6 +45,7 @@ export const WorkspaceActions: FC<WorkspaceActionsProps> = ({
isOutdated,
handleStart,
handleStop,
handleRestart,
handleDelete,
handleUpdate,
handleCancel,
Expand Down Expand Up @@ -91,6 +94,7 @@ export const WorkspaceActions: FC<WorkspaceActionsProps> = ({
key={ButtonTypesEnum.stopping}
/>
),
[ButtonTypesEnum.restart]: <RestartButton handleAction={handleRestart} />,
[ButtonTypesEnum.deleting]: (
<ActionLoadingButton
label={t("actionButton.deleting")}
Expand Down
3 changes: 2 additions & 1 deletion site/src/components/WorkspaceActions/constants.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@ export enum ButtonTypesEnum {
starting = "starting",
stop = "stop",
stopping = "stopping",
restart = "restart",
deleting = "deleting",
update = "update",
updating = "updating",
Expand Down Expand Up @@ -39,7 +40,7 @@ const statusToActions: Record<WorkspaceStatus, WorkspaceAbilities> = {
canAcceptJobs: false,
},
running: {
actions: [ButtonTypesEnum.stop],
actions: [ButtonTypesEnum.stop, ButtonTypesEnum.restart],
canCancel: false,
canAcceptJobs: true,
},
Expand Down
1 change: 1 addition & 0 deletions site/src/i18n/en/workspacePage.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,7 @@
"actionButton": {
"start": "Start",
"stop": "Stop",
"restart": "Restart",
"delete": "Delete",
"cancel": "Cancel",
"update": "Update",
Expand Down
1 change: 1 addition & 0 deletions site/src/pages/WorkspacePage/WorkspaceReadyPage.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -124,6 +124,7 @@ export const WorkspaceReadyPage = ({
workspace={workspace}
handleStart={() => workspaceSend({ type: "START" })}
handleStop={() => workspaceSend({ type: "STOP" })}
handleRestart={() => workspaceSend({ type: "START" })}
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

A restart is essentially just a start, so I simplified here instead of building out a new state in our workspace machine.
There might be edge cases that require a stop before a start, but we do the exact same thing (start without stopping first) for update and we haven't had any complaints about that feature, so I figure we start simple.

handleDelete={() => workspaceSend({ type: "ASK_DELETE" })}
handleUpdate={() => workspaceSend({ type: "UPDATE" })}
handleCancel={() => workspaceSend({ type: "CANCEL" })}
Expand Down