added new restart button and wrote tests

Kira-Pilot · Kira-Pilot · commit 7a314a52cbe7 · 2023-03-30T13:47:22.000Z
diff --git a/site/src/components/DropdownButton/ActionCtas.tsx b/site/src/components/DropdownButton/ActionCtas.tsx
@@ -6,9 +6,10 @@ import CloudQueueIcon from "@material-ui/icons/CloudQueue"
 import SettingsOutlined from "@material-ui/icons/SettingsOutlined"
 import CropSquareIcon from "@material-ui/icons/CropSquare"
 import DeleteOutlineIcon from "@material-ui/icons/DeleteOutline"
+import ReplayIcon from "@material-ui/icons/Replay"
 import PlayCircleOutlineIcon from "@material-ui/icons/PlayCircleOutline"
 import { LoadingButton } from "components/LoadingButton/LoadingButton"
-import { FC } from "react"
+import { FC, PropsWithChildren } from "react"
 import { useTranslation } from "react-i18next"
 import { combineClasses } from "util/combineClasses"
 import { WorkspaceActionButton } from "../WorkspaceActionButton/WorkspaceActionButton"
@@ -17,7 +18,7 @@ interface WorkspaceAction {
   handleAction: () => void
 }
 
-export const UpdateButton: FC<React.PropsWithChildren<WorkspaceAction>> = ({
+export const UpdateButton: FC<PropsWithChildren<WorkspaceAction>> = ({
   handleAction,
 }) => {
   const styles = useStyles()
@@ -35,7 +36,7 @@ export const UpdateButton: FC<React.PropsWithChildren<WorkspaceAction>> = ({
   )
 }
 
-export const SettingsButton: FC<React.PropsWithChildren<WorkspaceAction>> = ({
+export const SettingsButton: FC<PropsWithChildren<WorkspaceAction>> = ({
   handleAction,
 }) => {
   const styles = useStyles()
@@ -53,7 +54,7 @@ export const SettingsButton: FC<React.PropsWithChildren<WorkspaceAction>> = ({
   )
 }
 
-export const StartButton: FC<React.PropsWithChildren<WorkspaceAction>> = ({
+export const StartButton: FC<PropsWithChildren<WorkspaceAction>> = ({
   handleAction,
 }) => {
   const styles = useStyles()
@@ -69,7 +70,7 @@ export const StartButton: FC<React.PropsWithChildren<WorkspaceAction>> = ({
   )
 }
 
-export const StopButton: FC<React.PropsWithChildren<WorkspaceAction>> = ({
+export const StopButton: FC<PropsWithChildren<WorkspaceAction>> = ({
   handleAction,
 }) => {
   const styles = useStyles()
@@ -85,7 +86,23 @@ export const StopButton: FC<React.PropsWithChildren<WorkspaceAction>> = ({
   )
 }
 
-export const DeleteButton: FC<React.PropsWithChildren<WorkspaceAction>> = ({
+export const RestartButton: FC<PropsWithChildren<WorkspaceAction>> = ({
+  handleAction,
+}) => {
+  const styles = useStyles()
+  const { t } = useTranslation("workspacePage")
+
+  return (
+    <WorkspaceActionButton
+      className={styles.actionButton}
+      icon={<ReplayIcon />}
+      onClick={handleAction}
+      label={t("actionButton.restart")}
+    />
+  )
+}
+
+export const DeleteButton: FC<PropsWithChildren<WorkspaceAction>> = ({
   handleAction,
 }) => {
   const styles = useStyles()
@@ -101,7 +118,7 @@ export const DeleteButton: FC<React.PropsWithChildren<WorkspaceAction>> = ({
   )
 }
 
-export const CancelButton: FC<React.PropsWithChildren<WorkspaceAction>> = ({
+export const CancelButton: FC<PropsWithChildren<WorkspaceAction>> = ({
   handleAction,
 }) => {
   const styles = useStyles()
@@ -128,7 +145,7 @@ interface DisabledProps {
   label: string
 }
 
-export const DisabledButton: FC<React.PropsWithChildren<DisabledProps>> = ({
+export const DisabledButton: FC<PropsWithChildren<DisabledProps>> = ({
   label,
 }) => {
   const styles = useStyles()
@@ -144,7 +161,7 @@ interface LoadingProps {
   label: string
 }
 
-export const ActionLoadingButton: FC<React.PropsWithChildren<LoadingProps>> = ({
+export const ActionLoadingButton: FC<PropsWithChildren<LoadingProps>> = ({
   label,
 }) => {
   const styles = useStyles()
diff --git a/site/src/components/Workspace/Workspace.tsx b/site/src/components/Workspace/Workspace.tsx
@@ -125,6 +125,7 @@ export const Workspace: FC<React.PropsWithChildren<WorkspaceProps>> = ({
               isOutdated={workspace.outdated}
               handleStart={handleStart}
               handleStop={handleStop}
+              handleRestart={() => console.log("restarting!")}
               handleDelete={handleDelete}
               handleUpdate={handleUpdate}
               handleCancel={handleCancel}
diff --git a/site/src/components/WorkspaceActions/WorkspaceActions.stories.tsx b/site/src/components/WorkspaceActions/WorkspaceActions.stories.tsx
@@ -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"),
diff --git a/site/src/components/WorkspaceActions/WorkspaceActions.test.tsx b/site/src/components/WorkspaceActions/WorkspaceActions.test.tsx
@@ -15,6 +15,7 @@ const renderComponent = async (props: Partial<WorkspaceActionsProps> = {}) => {
       isOutdated={props.isOutdated ?? false}
       handleStart={jest.fn()}
       handleStop={jest.fn()}
+      handleRestart={jest.fn()}
       handleDelete={jest.fn()}
       handleUpdate={jest.fn()}
       handleCancel={jest.fn()}
@@ -33,6 +34,7 @@ const renderAndClick = async (props: Partial<WorkspaceActionsProps> = {}) => {
       isOutdated={props.isOutdated ?? false}
       handleStart={jest.fn()}
       handleStop={jest.fn()}
+      handleRestart={jest.fn()}
       handleDelete={jest.fn()}
       handleUpdate={jest.fn()}
       handleCancel={jest.fn()}
@@ -62,7 +64,7 @@ describe("WorkspaceActions", () => {
     })
   })
   describe("when the workspace is started", () => {
-    it("primary is stop; secondary is delete", async () => {
+    it("primary is stop; secondary are delete, restart", async () => {
       await renderAndClick({
         workspaceStatus: Mocks.MockWorkspace.latest_build.status,
       })
@@ -72,6 +74,9 @@ describe("WorkspaceActions", () => {
       expect(screen.getByTestId("secondary-ctas")).toHaveTextContent(
         t("actionButton.delete", { ns: "workspacePage" }),
       )
+      expect(screen.getByTestId("secondary-ctas")).toHaveTextContent(
+        t("actionButton.restart", { ns: "workspacePage" }),
+      )
     })
   })
   describe("when the workspace is started", () => {
diff --git a/site/src/components/WorkspaceActions/WorkspaceActions.tsx b/site/src/components/WorkspaceActions/WorkspaceActions.tsx
@@ -9,6 +9,7 @@ import {
   SettingsButton,
   StartButton,
   StopButton,
+  RestartButton,
   UpdateButton,
 } from "../DropdownButton/ActionCtas"
 import { ButtonMapping, ButtonTypesEnum, buttonAbilities } from "./constants"
@@ -18,6 +19,7 @@ export interface WorkspaceActionsProps {
   isOutdated: boolean
   handleStart: () => void
   handleStop: () => void
+  handleRestart: () => void
   handleDelete: () => void
   handleUpdate: () => void
   handleCancel: () => void
@@ -31,6 +33,7 @@ export const WorkspaceActions: FC<WorkspaceActionsProps> = ({
   isOutdated,
   handleStart,
   handleStop,
+  handleRestart,
   handleDelete,
   handleUpdate,
   handleCancel,
@@ -58,6 +61,10 @@ export const WorkspaceActions: FC<WorkspaceActionsProps> = ({
     [ButtonTypesEnum.stopping]: (
       <ActionLoadingButton label={t("actionButton.stopping")} />
     ),
+    [ButtonTypesEnum.restart]: <RestartButton handleAction={handleRestart} />,
+    [ButtonTypesEnum.starting]: (
+      <ActionLoadingButton label={t("actionButton.starting")} />
+    ),
     [ButtonTypesEnum.delete]: <DeleteButton handleAction={handleDelete} />,
     [ButtonTypesEnum.deleting]: (
       <ActionLoadingButton label={t("actionButton.deleting")} />
diff --git a/site/src/components/WorkspaceActions/constants.ts b/site/src/components/WorkspaceActions/constants.ts
@@ -7,6 +7,7 @@ export enum ButtonTypesEnum {
   starting = "starting",
   stop = "stop",
   stopping = "stopping",
+  restart = "restart",
   delete = "delete",
   deleting = "deleting",
   update = "update",
@@ -45,6 +46,7 @@ const statusToAbilities: Record<WorkspaceStatus, WorkspaceAbilities> = {
       ButtonTypesEnum.stop,
       ButtonTypesEnum.settings,
       ButtonTypesEnum.delete,
+      ButtonTypesEnum.restart,
     ],
     canCancel: false,
     canAcceptJobs: true,
diff --git a/site/src/i18n/en/workspacePage.json b/site/src/i18n/en/workspacePage.json
@@ -21,6 +21,7 @@
   "actionButton": {
     "start": "Start",
     "stop": "Stop",
+    "restart": "Restart",
     "delete": "Delete",
     "cancel": "Cancel",
     "update": "Update",
