Add change versions

coder · BrunoQuaresma · Nov 24, 2022 · Nov 22, 2022 · Nov 23, 2022 · Nov 23, 2022
commit 27645b75575818ed80aacdd08b9184e8f1b544f8
diff --git a/site/src/components/DropdownButton/ActionCtas.tsx b/site/src/components/DropdownButton/ActionCtas.tsx
@@ -3,6 +3,7 @@ import Button from "@material-ui/core/Button"
 import { makeStyles } from "@material-ui/core/styles"
 import BlockIcon from "@material-ui/icons/Block"
 import CloudQueueIcon from "@material-ui/icons/CloudQueue"
+import UpdateOutlined from "@material-ui/icons/UpdateOutlined"
 import CropSquareIcon from "@material-ui/icons/CropSquare"
 import DeleteOutlineIcon from "@material-ui/icons/DeleteOutline"
 import PlayCircleOutlineIcon from "@material-ui/icons/PlayCircleOutline"
@@ -33,6 +34,23 @@ export const UpdateButton: FC<React.PropsWithChildren<WorkspaceAction>> = ({
   )
 }
 
+export const ChangeVersionButton: FC<
+  React.PropsWithChildren<WorkspaceAction>
+> = ({ handleAction }) => {
+  const styles = useStyles()
+  const { t } = useTranslation("workspacePage")
+
+  return (
+    <Button
+      className={styles.actionButton}
+      startIcon={<UpdateOutlined />}
+      onClick={handleAction}
+    >
+      {t("actionButton.changeVersion")}
+    </Button>
+  )
+}
+
 export const StartButton: FC<React.PropsWithChildren<WorkspaceAction>> = ({
   handleAction,
 }) => {

diff --git a/site/src/components/Workspace/Workspace.tsx b/site/src/components/Workspace/Workspace.tsx
@@ -45,6 +45,7 @@ export interface WorkspaceProps {
   handleDelete: () => void
   handleUpdate: () => void
   handleCancel: () => void
+  handleChangeVersion: () => void
   isUpdating: boolean
   workspace: TypesGen.Workspace
   resources?: TypesGen.WorkspaceResource[]
@@ -68,6 +69,7 @@ export const Workspace: FC<React.PropsWithChildren<WorkspaceProps>> = ({
   handleDelete,
   handleUpdate,
   handleCancel,
+  handleChangeVersion,
   workspace,
   isUpdating,
   resources,
@@ -143,6 +145,7 @@ export const Workspace: FC<React.PropsWithChildren<WorkspaceProps>> = ({
               handleDelete={handleDelete}
               handleUpdate={handleUpdate}
               handleCancel={handleCancel}
+              handleChangeVersion={handleChangeVersion}
               isUpdating={isUpdating}
             />
           </Stack>

diff --git a/site/src/components/WorkspaceActions/WorkspaceActions.test.tsx b/site/src/components/WorkspaceActions/WorkspaceActions.test.tsx
@@ -18,6 +18,7 @@ const renderComponent = async (props: Partial<WorkspaceActionsProps> = {}) => {
       handleDelete={jest.fn()}
       handleUpdate={jest.fn()}
       handleCancel={jest.fn()}
+      handleChangeVersion={jest.fn()}
       isUpdating={false}
     />,
   )
@@ -35,6 +36,7 @@ const renderAndClick = async (props: Partial<WorkspaceActionsProps> = {}) => {
       handleDelete={jest.fn()}
       handleUpdate={jest.fn()}
       handleCancel={jest.fn()}
+      handleChangeVersion={jest.fn()}
       isUpdating={false}
     />,
   )

diff --git a/site/src/components/WorkspaceActions/WorkspaceActions.tsx b/site/src/components/WorkspaceActions/WorkspaceActions.tsx
@@ -4,6 +4,7 @@ import { useTranslation } from "react-i18next"
 import { WorkspaceStatus } from "../../api/typesGenerated"
 import {
   ActionLoadingButton,
+  ChangeVersionButton,
   DeleteButton,
   DisabledButton,
   StartButton,
@@ -20,6 +21,7 @@ export interface WorkspaceActionsProps {
   handleDelete: () => void
   handleUpdate: () => void
   handleCancel: () => void
+  handleChangeVersion: () => void
   isUpdating: boolean
   children?: ReactNode
 }
@@ -32,6 +34,7 @@ export const WorkspaceActions: FC<WorkspaceActionsProps> = ({
   handleDelete,
   handleUpdate,
   handleCancel,
+  handleChangeVersion,
   isUpdating,
 }) => {
   const { t } = useTranslation("workspacePage")
@@ -45,6 +48,9 @@ export const WorkspaceActions: FC<WorkspaceActionsProps> = ({
     [ButtonTypesEnum.updating]: (
       <ActionLoadingButton label={t("actionButton.updating")} />
     ),
+    [ButtonTypesEnum.changeVersion]: (
+      <ChangeVersionButton handleAction={handleChangeVersion} />
+    ),
     [ButtonTypesEnum.start]: <StartButton handleAction={handleStart} />,
     [ButtonTypesEnum.starting]: (
       <ActionLoadingButton label={t("actionButton.starting")} />

diff --git a/site/src/components/WorkspaceActions/constants.ts b/site/src/components/WorkspaceActions/constants.ts
@@ -11,6 +11,7 @@ export enum ButtonTypesEnum {
   deleting = "deleting",
   update = "update",
   updating = "updating",
+  changeVersion = "changeVersion",
   // disabled buttons
   canceling = "canceling",
   deleted = "deleted",
@@ -34,7 +35,11 @@ export const statusToAbilities: Record<WorkspaceStatus, WorkspaceAbilities> = {
     canAcceptJobs: false,
   },
   running: {
-    actions: [ButtonTypesEnum.stop, ButtonTypesEnum.delete],
+    actions: [
+      ButtonTypesEnum.stop,
+      ButtonTypesEnum.changeVersion,
+      ButtonTypesEnum.delete,
+    ],
     canCancel: false,
     canAcceptJobs: true,
   },
@@ -44,22 +49,31 @@ export const statusToAbilities: Record<WorkspaceStatus, WorkspaceAbilities> = {
     canAcceptJobs: false,
   },
   stopped: {
-    actions: [ButtonTypesEnum.start, ButtonTypesEnum.delete],
+    actions: [
+      ButtonTypesEnum.start,
+      ButtonTypesEnum.changeVersion,
+      ButtonTypesEnum.delete,
+    ],
     canCancel: false,
     canAcceptJobs: true,
   },
   canceled: {
     actions: [
       ButtonTypesEnum.start,
       ButtonTypesEnum.stop,
+      ButtonTypesEnum.changeVersion,
       ButtonTypesEnum.delete,
     ],
     canCancel: false,
     canAcceptJobs: true,
   },
   // in the case of an error
   failed: {
-    actions: [ButtonTypesEnum.start, ButtonTypesEnum.delete],
+    actions: [
+      ButtonTypesEnum.start,
+      ButtonTypesEnum.changeVersion,
+      ButtonTypesEnum.delete,
+    ],
     canCancel: false,
     canAcceptJobs: true,
   },

diff --git a/site/src/i18n/en/workspacePage.json b/site/src/i18n/en/workspacePage.json
@@ -27,7 +27,8 @@
     "updating": "Updating",
     "starting": "Starting...",
     "stopping": "Stopping...",
-    "deleting": "Deleting..."
+    "deleting": "Deleting...",
+    "changeVersion": "Change version"
   },
   "disabledButton": {
     "canceling": "Canceling",

diff --git a/site/src/pages/WorkspacePage/WorkspaceReadyPage.tsx b/site/src/pages/WorkspacePage/WorkspaceReadyPage.tsx
@@ -4,6 +4,7 @@ import dayjs from "dayjs"
 import { useContext } from "react"
 import { Helmet } from "react-helmet-async"
 import { useTranslation } from "react-i18next"
+import { useNavigate } from "react-router-dom"
 import {
   getMaxDeadline,
   getMaxDeadlineChange,
@@ -63,6 +64,7 @@ export const WorkspaceReadyPage = ({
   const canUpdateWorkspace = Boolean(permissions?.updateWorkspace)
   const { t } = useTranslation("workspacePage")
   const favicon = getFaviconByStatus(workspace.latest_build)
+  const navigate = useNavigate()
 
   return (
     <>
@@ -114,6 +116,7 @@ export const WorkspaceReadyPage = ({
         handleDelete={() => workspaceSend({ type: "ASK_DELETE" })}
         handleUpdate={() => workspaceSend({ type: "UPDATE" })}
         handleCancel={() => workspaceSend({ type: "CANCEL" })}
+        handleChangeVersion={() => navigate("/change-version")}
         resources={workspace.latest_build.resources}
         builds={builds}
         canUpdateWorkspace={canUpdateWorkspace}