Skip to content

Commit ae3f3f0

Browse files
BrunoQuaresmaBrunoQuaresma
committed
Extract retry button
1 parent 1bbe8d0 commit ae3f3f0

File tree

7 files changed

+109
-49
lines changed

7 files changed

+109
-49
lines changed

‎site/src/pages/WorkspacePage/Workspace.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -42,7 +42,7 @@ export interface WorkspaceProps {
4242
buildInfo?: TypesGen.BuildInfoResponse;
4343
sshPrefix?: string;
4444
template: TypesGen.Template;
45-
canRetryDebugMode: boolean;
45+
canDebugMode: boolean;
4646
handleRetry: (buildParameters?: TypesGen.WorkspaceBuildParameter[]) => void;
4747
handleDebug: (buildParameters?: TypesGen.WorkspaceBuildParameter[]) => void;
4848
buildLogs?: React.ReactNode;
@@ -74,7 +74,7 @@ export const Workspace: FC<WorkspaceProps> = ({
7474
buildInfo,
7575
sshPrefix,
7676
template,
77-
canRetryDebugMode,
77+
canDebugMode,
7878
handleRetry,
7979
handleDebug,
8080
buildLogs,
@@ -133,7 +133,7 @@ export const Workspace: FC<WorkspaceProps> = ({
133133
handleChangeVersion={handleChangeVersion}
134134
handleDormantActivate={handleDormantActivate}
135135
handleToggleFavorite={handleToggleFavorite}
136-
canRetryDebugMode={canRetryDebugMode}
136+
canDebugMode={canDebugMode}
137137
canChangeVersions={canChangeVersions}
138138
isUpdating={isUpdating}
139139
isRestarting={isRestarting}

‎site/src/pages/WorkspacePage/WorkspaceActions/Buttons.tsx

Lines changed: 1 addition & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,6 @@ import ReplayIcon from "@mui/icons-material/Replay";
77
import BlockIcon from "@mui/icons-material/Block";
88
import OutlinedBlockIcon from "@mui/icons-material/BlockOutlined";
99
import PowerSettingsNewIcon from "@mui/icons-material/PowerSettingsNew";
10-
import RetryIcon from "@mui/icons-material/CachedOutlined";
1110
import DebugIcon from "@mui/icons-material/BugReportOutlined";
1211
import Star from "@mui/icons-material/Star";
1312
import StarBorder from "@mui/icons-material/StarBorder";
@@ -16,7 +15,7 @@ import type { Workspace, WorkspaceBuildParameter } from "api/typesGenerated";
1615
import { BuildParametersPopover } from "./BuildParametersPopover";
1716
import { TopbarButton } from "components/FullPageLayout/Topbar";
1817

19-
interface ActionButtonProps {
18+
export interface ActionButtonProps {
2019
loading?: boolean;
2120
handleAction: (buildParameters?: WorkspaceBuildParameter[]) => void;
2221
disabled?: boolean;
@@ -175,42 +174,6 @@ export const DisabledButton: FC<DisabledButtonProps> = ({ label }) => {
175174
);
176175
};
177176

178-
type RetryButtonProps = Omit<ActionButtonProps, "loading"> & {
179-
enableBuildParameters: boolean;
180-
workspace: Workspace;
181-
};
182-
183-
export const RetryButton: FC<RetryButtonProps> = ({
184-
handleAction,
185-
workspace,
186-
enableBuildParameters,
187-
}) => {
188-
const mainAction = (
189-
<TopbarButton startIcon={<RetryIcon />} onClick={() => handleAction()}>
190-
Retry
191-
</TopbarButton>
192-
);
193-
194-
if (!enableBuildParameters) {
195-
return mainAction;
196-
}
197-
198-
return (
199-
<ButtonGroup
200-
variant="outlined"
201-
css={{
202-
// Workaround to make the border transitions smoothly on button groups
203-
"& > button:hover + button": {
204-
borderLeft: "1px solid #FFF",
205-
},
206-
}}
207-
>
208-
{mainAction}
209-
<BuildParametersPopover workspace={workspace} onSubmit={handleAction} />
210-
</ButtonGroup>
211-
);
212-
};
213-
214177
type DebugButtonProps = Omit<ActionButtonProps, "loading"> & {
215178
workspace: Workspace;
216179
enableBuildParameters: boolean;

‎site/src/pages/WorkspacePage/WorkspaceActions/RetryButton.stories.tsx

Lines changed: 54 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,54 @@
1+
import { Meta, StoryObj } from "@storybook/react";
2+
import { RetryButton } from "./RetryButton";
3+
import { MockWorkspace } from "testHelpers/entities";
4+
import { userEvent, waitFor, within } from "@storybook/test";
5+
6+
const meta: Meta<typeof RetryButton> = {
7+
title: "pages/WorkspacePage/RetryButton",
8+
component: RetryButton,
9+
};
10+
11+
export default meta;
12+
type Story = StoryObj<typeof RetryButton>;
13+
14+
export const Default: Story = {};
15+
16+
export const WithBuildParameters: Story = {
17+
args: {
18+
enableBuildParameters: true,
19+
workspace: MockWorkspace,
20+
},
21+
parameters: {
22+
queries: [
23+
{
24+
key: ["workspace", MockWorkspace.id, "parameters"],
25+
data: { templateVersionRichParameters: [], buildParameters: [] },
26+
},
27+
],
28+
},
29+
};
30+
31+
export const WithOpenBuildParameters: Story = {
32+
args: {
33+
enableBuildParameters: true,
34+
workspace: MockWorkspace,
35+
},
36+
parameters: {
37+
queries: [
38+
{
39+
key: ["workspace", MockWorkspace.id, "parameters"],
40+
data: { templateVersionRichParameters: [], buildParameters: [] },
41+
},
42+
],
43+
},
44+
play: async ({ canvasElement, step }) => {
45+
const screen = within(canvasElement);
46+
47+
await step("open popover", async () => {
48+
await userEvent.click(screen.getByTestId("build-parameters-button"));
49+
await waitFor(() =>
50+
expect(screen.getByText("Build Options")).toBeInTheDocument(),
51+
);
52+
});
53+
},
54+
};

‎site/src/pages/WorkspacePage/WorkspaceActions/RetryButton.tsx

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
import ButtonGroup from "@mui/material/ButtonGroup";
2+
import RetryIcon from "@mui/icons-material/CachedOutlined";
3+
import { type FC } from "react";
4+
import type { Workspace } from "api/typesGenerated";
5+
import { BuildParametersPopover } from "./BuildParametersPopover";
6+
import { TopbarButton } from "components/FullPageLayout/Topbar";
7+
import { ActionButtonProps } from "./Buttons";
8+
9+
type RetryButtonProps = Omit<ActionButtonProps, "loading"> & {
10+
enableBuildParameters: boolean;
11+
workspace: Workspace;
12+
};
13+
14+
export const RetryButton: FC<RetryButtonProps> = ({
15+
handleAction,
16+
workspace,
17+
enableBuildParameters,
18+
}) => {
19+
const mainAction = (
20+
<TopbarButton startIcon={<RetryIcon />} onClick={() => handleAction()}>
21+
Retry
22+
</TopbarButton>
23+
);
24+
25+
if (!enableBuildParameters) {
26+
return mainAction;
27+
}
28+
29+
return (
30+
<ButtonGroup
31+
variant="outlined"
32+
css={{
33+
// Workaround to make the border transitions smoothly on button groups
34+
"& > button:hover + button": {
35+
borderLeft: "1px solid #FFF",
36+
},
37+
}}
38+
>
39+
{mainAction}
40+
<BuildParametersPopover workspace={workspace} onSubmit={handleAction} />
41+
</ButtonGroup>
42+
);
43+
};

‎site/src/pages/WorkspacePage/WorkspaceActions/WorkspaceActions.tsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,6 @@ import {
1111
RestartButton,
1212
UpdateButton,
1313
ActivateButton,
14-
RetryButton,
1514
FavoriteButton,
1615
DebugButton,
1716
} from "./Buttons";
@@ -29,6 +28,7 @@ import {
2928
} from "components/MoreMenu/MoreMenu";
3029
import { TopbarIconButton } from "components/FullPageLayout/Topbar";
3130
import MoreVertOutlined from "@mui/icons-material/MoreVertOutlined";
31+
import { RetryButton } from "./RetryButton";
3232

3333
export interface WorkspaceActionsProps {
3434
workspace: Workspace;
@@ -48,7 +48,7 @@ export interface WorkspaceActionsProps {
4848
isRestarting: boolean;
4949
children?: ReactNode;
5050
canChangeVersions: boolean;
51-
canRetryDebug: boolean;
51+
canDebug: boolean;
5252
isOwner: boolean;
5353
}
5454

@@ -69,15 +69,15 @@ export const WorkspaceActions: FC<WorkspaceActionsProps> = ({
6969
isUpdating,
7070
isRestarting,
7171
canChangeVersions,
72-
canRetryDebug,
72+
canDebug,
7373
isOwner,
7474
}) => {
7575
const { duplicateWorkspace, isDuplicationReady } =
7676
useWorkspaceDuplication(workspace);
7777

7878
const { actions, canCancel, canAcceptJobs } = abilitiesByWorkspaceStatus(
7979
workspace,
80-
canRetryDebug,
80+
canDebug,
8181
);
8282
const showCancel =
8383
canCancel &&

‎site/src/pages/WorkspacePage/WorkspaceReadyPage.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -227,7 +227,7 @@ export const WorkspaceReadyPage: FC<WorkspaceReadyPageProps> = ({
227227
handleSettings={() => navigate("settings")}
228228
handleRetry={handleRetry}
229229
handleDebug={handleDebug}
230-
canRetryDebugMode={
230+
canDebugMode={
231231
deploymentValues?.config.enable_terraform_debug_mode ?? false
232232
}
233233
handleChangeVersion={() => {

‎site/src/pages/WorkspacePage/WorkspaceTopbar.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -52,7 +52,7 @@ export interface WorkspaceProps {
5252
workspace: TypesGen.Workspace;
5353
canUpdateWorkspace: boolean;
5454
canChangeVersions: boolean;
55-
canRetryDebugMode: boolean;
55+
canDebugMode: boolean;
5656
handleRetry: (buildParameters?: TypesGen.WorkspaceBuildParameter[]) => void;
5757
handleDebug: (buildParameters?: TypesGen.WorkspaceBuildParameter[]) => void;
5858
isOwner: boolean;
@@ -78,7 +78,7 @@ export const WorkspaceTopbar: FC<WorkspaceProps> = ({
7878
isRestarting,
7979
canUpdateWorkspace,
8080
canChangeVersions,
81-
canRetryDebugMode,
81+
canDebugMode,
8282
handleRetry,
8383
handleDebug,
8484
isOwner,
@@ -271,7 +271,7 @@ export const WorkspaceTopbar: FC<WorkspaceProps> = ({
271271
handleChangeVersion={handleChangeVersion}
272272
handleDormantActivate={handleDormantActivate}
273273
handleToggleFavorite={handleToggleFavorite}
274-
canRetryDebug={canRetryDebugMode}
274+
canDebug={canDebugMode}
275275
canChangeVersions={canChangeVersions}
276276
isUpdating={isUpdating}
277277
isRestarting={isRestarting}

0 commit comments

Comments
 (0)