chore: associate failed workspace states with retry button

coder · Parkreiner · Nov 8, 2023 · Nov 8, 2023 · Nov 8, 2023 · Nov 8, 2023
commit ecc3cf50f5dd14fefae059cd4bd98478ed0a97c5
diff --git a/site/src/pages/WorkspacePage/Workspace.tsx b/site/src/pages/WorkspacePage/Workspace.tsx
@@ -201,6 +201,7 @@ export const Workspace: FC<React.PropsWithChildren<WorkspaceProps>> = ({
               handleUpdate={handleUpdate}
               handleCancel={handleCancel}
               handleSettings={handleSettings}
+              handleRetry={handleBuildRetry}
               handleChangeVersion={handleChangeVersion}
               handleDormantActivate={handleDormantActivate}
               canChangeVersions={canChangeVersions}
@@ -308,7 +309,6 @@ export const Workspace: FC<React.PropsWithChildren<WorkspaceProps>> = ({
               actions={
                 canRetryDebugMode && (
                   <Button
-                    key={0}
                     onClick={handleBuildRetry}
                     variant="text"
                     size="small"

diff --git a/site/src/pages/WorkspacePage/WorkspaceActions/Buttons.tsx b/site/src/pages/WorkspacePage/WorkspaceActions/Buttons.tsx
@@ -1,23 +1,25 @@
+import { type FC } from "react";
+import type { Workspace, WorkspaceBuildParameter } from "api/typesGenerated";
+import { BuildParametersPopover } from "./BuildParametersPopover";
+
 import Button from "@mui/material/Button";
-import BlockIcon from "@mui/icons-material/Block";
+import LoadingButton from "@mui/lab/LoadingButton";
+import ButtonGroup from "@mui/material/ButtonGroup";
 import CloudQueueIcon from "@mui/icons-material/CloudQueue";
 import CropSquareIcon from "@mui/icons-material/CropSquare";
 import PlayCircleOutlineIcon from "@mui/icons-material/PlayCircleOutline";
 import ReplayIcon from "@mui/icons-material/Replay";
-import { FC } from "react";
-import BlockOutlined from "@mui/icons-material/BlockOutlined";
-import ButtonGroup from "@mui/material/ButtonGroup";
-import { Workspace, WorkspaceBuildParameter } from "api/typesGenerated";
-import { BuildParametersPopover } from "./BuildParametersPopover";
+import BlockIcon from "@mui/icons-material/Block";
+import OutlinedBlockIcon from "@mui/icons-material/BlockOutlined";
 import PowerSettingsNewIcon from "@mui/icons-material/PowerSettingsNew";
-import LoadingButton from "@mui/lab/LoadingButton";
+import RetryIcon from "@mui/icons-material/BuildOutlined";
 
-interface WorkspaceAction {
+interface WorkspaceActionProps {
   loading?: boolean;
   handleAction: () => void;
 }
 
-export const UpdateButton: FC<WorkspaceAction> = ({
+export const UpdateButton: FC<WorkspaceActionProps> = ({
   handleAction,
   loading,
 }) => {
@@ -34,7 +36,7 @@ export const UpdateButton: FC<WorkspaceAction> = ({
   );
 };
 
-export const ActivateButton: FC<WorkspaceAction> = ({
+export const ActivateButton: FC<WorkspaceActionProps> = ({
   handleAction,
   loading,
 }) => {
@@ -51,7 +53,7 @@ export const ActivateButton: FC<WorkspaceAction> = ({
 };
 
 export const StartButton: FC<
-  Omit<WorkspaceAction, "handleAction"> & {
+  Omit<WorkspaceActionProps, "handleAction"> & {
     workspace: Workspace;
     handleAction: (buildParameters?: WorkspaceBuildParameter[]) => void;
   }
@@ -83,7 +85,10 @@ export const StartButton: FC<
   );
 };
 
-export const StopButton: FC<WorkspaceAction> = ({ handleAction, loading }) => {
+export const StopButton: FC<WorkspaceActionProps> = ({
+  handleAction,
+  loading,
+}) => {
   return (
     <LoadingButton
       loading={loading}
@@ -98,7 +103,7 @@ export const StopButton: FC<WorkspaceAction> = ({ handleAction, loading }) => {
 };
 
 export const RestartButton: FC<
-  Omit<WorkspaceAction, "handleAction"> & {
+  Omit<WorkspaceActionProps, "handleAction"> & {
     workspace: Workspace;
     handleAction: (buildParameters?: WorkspaceBuildParameter[]) => void;
   }
@@ -131,7 +136,7 @@ export const RestartButton: FC<
   );
 };
 
-export const CancelButton: FC<WorkspaceAction> = ({ handleAction }) => {
+export const CancelButton: FC<WorkspaceActionProps> = ({ handleAction }) => {
   return (
     <Button startIcon={<BlockIcon />} onClick={handleAction}>
       Cancel
@@ -145,7 +150,7 @@ interface DisabledProps {
 
 export const DisabledButton: FC<DisabledProps> = ({ label }) => {
   return (
-    <Button startIcon={<BlockOutlined />} disabled>
+    <Button startIcon={<OutlinedBlockIcon />} disabled>
       {label}
     </Button>
   );
@@ -162,3 +167,13 @@ export const ActionLoadingButton: FC<LoadingProps> = ({ label }) => {
     </LoadingButton>
   );
 };
+
+export function RetryButton({
+  handleAction,
+}: Omit<WorkspaceActionProps, "loading">) {
+  return (
+    <Button startIcon={<RetryIcon />} onClick={handleAction}>
+      Retry
+    </Button>
+  );
+}
diff --git a/site/src/pages/WorkspacePage/WorkspaceActions/WorkspaceActions.tsx b/site/src/pages/WorkspacePage/WorkspaceActions/WorkspaceActions.tsx
@@ -10,6 +10,7 @@ import {
   RestartButton,
   UpdateButton,
   ActivateButton,
+  RetryButton,
 } from "./Buttons";
 import { type ButtonType, actionsByWorkspaceStatus } from "./constants";
 
@@ -37,6 +38,7 @@ export interface WorkspaceActionsProps {
   handleCancel: () => void;
   handleSettings: () => void;
   handleChangeVersion: () => void;
+  handleRetry: () => void;
   handleDormantActivate: () => void;
   isUpdating: boolean;
   isRestarting: boolean;
@@ -53,6 +55,7 @@ export const WorkspaceActions: FC<WorkspaceActionsProps> = ({
   handleUpdate,
   handleCancel,
   handleSettings,
+  handleRetry,
   handleChangeVersion,
   handleDormantActivate: handleDormantActivate,
   isUpdating,
@@ -88,6 +91,7 @@ export const WorkspaceActions: FC<WorkspaceActionsProps> = ({
     pending: <ActionLoadingButton label="Pending..." />,
     activate: <ActivateButton handleAction={handleDormantActivate} />,
     activating: <ActivateButton loading handleAction={handleDormantActivate} />,
+    retry: <RetryButton handleAction={handleRetry} />,
   };
 
   const { actions, canCancel, canAcceptJobs } = actionsByWorkspaceStatus(

diff --git a/site/src/pages/WorkspacePage/WorkspaceActions/constants.ts b/site/src/pages/WorkspacePage/WorkspaceActions/constants.ts
@@ -17,6 +17,11 @@ const buttonTypes = [
   "activate",
   "activating",
 
+  // There's no need for a retrying state because retrying starts a transition
+  // into one of the starting, stopping, or deleting states (based on the
+  // WorkspaceTransition type)
+  "retry",
+
   // These are buttons that should be used with disabled UI elements
   "canceling",
   "deleted",
@@ -97,7 +102,7 @@ const statusToActions: Record<WorkspaceStatus, WorkspaceAbilities> = {
 
   // in the case of an error
   failed: {
-    actions: ["start", "stop"],
+    actions: ["retry"],
     canCancel: false,
     canAcceptJobs: true,
   },