Skip to content

Commit cb846ba

Browse files
BrunoQuaresmaBrunoQuaresma
authored
fix(site): Show job error on updating template variables (#6674)
1 parent de83723 commit cb846ba

File tree

5 files changed

+81
-43
lines changed

5 files changed

+81
-43
lines changed

‎site/src/components/FullPageForm/FullPageHorizontalForm.tsx

Lines changed: 1 addition & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,6 @@ import {
66
PageHeaderSubtitle,
77
} from "components/PageHeader/PageHeader"
88
import Button from "@material-ui/core/Button"
9-
import { makeStyles } from "@material-ui/core/styles"
109

1110
export interface FullPageHorizontalFormProps {
1211
title: string
@@ -17,8 +16,6 @@ export interface FullPageHorizontalFormProps {
1716
export const FullPageHorizontalForm: FC<
1817
React.PropsWithChildren<FullPageHorizontalFormProps>
1918
> = ({ title, detail, onCancel, children }) => {
20-
const styles = useStyles()
21-
2219
return (
2320
<Margins size="medium">
2421
<PageHeader
@@ -34,13 +31,7 @@ export const FullPageHorizontalForm: FC<
3431
{detail && <PageHeaderSubtitle>{detail}</PageHeaderSubtitle>}
3532
</PageHeader>
3633

37-
<main className={styles.form}>{children}</main>
34+
<main>{children}</main>
3835
</Margins>
3936
)
4037
}
41-
42-
const useStyles = makeStyles((theme) => ({
43-
form: {
44-
marginTop: theme.spacing(1),
45-
},
46-
}))

‎site/src/pages/TemplateVariablesPage/TemplateVariablesPage.tsx

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -36,6 +36,7 @@ export const TemplateVariablesPage: FC = () => {
3636
templateVariables,
3737
getTemplateDataError,
3838
updateTemplateError,
39+
jobError,
3940
} = state.context
4041

4142
const { t } = useTranslation("templateVariablesPage")
@@ -52,6 +53,7 @@ export const TemplateVariablesPage: FC = () => {
5253
errors={{
5354
getTemplateDataError,
5455
updateTemplateError,
56+
jobError,
5557
}}
5658
onCancel={() => {
5759
navigate(`/templates/${templateName}`)

‎site/src/pages/TemplateVariablesPage/TemplateVariablesPageView.stories.tsx

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -76,3 +76,20 @@ WithUpdateTemplateError.args = {
7676
onSubmit: action("onSubmit"),
7777
onCancel: action("cancel"),
7878
}
79+
80+
export const WithJobError = TemplateVariables.bind({})
81+
WithJobError.args = {
82+
templateVersion: MockTemplateVersion,
83+
templateVariables: [
84+
MockTemplateVersionVariable1,
85+
MockTemplateVersionVariable2,
86+
MockTemplateVersionVariable3,
87+
MockTemplateVersionVariable4,
88+
],
89+
errors: {
90+
jobError:
91+
"template import provision for start: recv import provision: plan terraform: terraform plan: exit status 1",
92+
},
93+
onSubmit: action("onSubmit"),
94+
onCancel: action("cancel"),
95+
}

‎site/src/pages/TemplateVariablesPage/TemplateVariablesPageView.tsx

Lines changed: 42 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,7 @@ export interface TemplateVariablesPageViewProps {
2222
errors?: {
2323
getTemplateDataError?: unknown
2424
updateTemplateError?: unknown
25+
jobError?: TemplateVersion["job"]["error"]
2526
}
2627
initialTouched?: ComponentProps<
2728
typeof TemplateVariablesForm
@@ -46,44 +47,53 @@ export const TemplateVariablesPageView: FC<TemplateVariablesPageViewProps> = ({
4647
const { t } = useTranslation("templateVariablesPage")
4748

4849
return (
49-
<FullPageHorizontalForm title={t("title")} onCancel={onCancel}>
50-
{Boolean(errors.getTemplateDataError) && (
51-
<Stack className={classes.errorContainer}>
52-
<AlertBanner severity="error" error={errors.getTemplateDataError} />
53-
</Stack>
54-
)}
55-
{Boolean(errors.updateTemplateError) && (
56-
<Stack className={classes.errorContainer}>
57-
<AlertBanner severity="error" error={errors.updateTemplateError} />
58-
</Stack>
59-
)}
60-
{isLoading && <Loader />}
61-
{templateVersion && templateVariables && templateVariables.length > 0 && (
62-
<TemplateVariablesForm
63-
initialTouched={initialTouched}
64-
isSubmitting={isSubmitting}
65-
templateVersion={templateVersion}
66-
templateVariables={templateVariables}
67-
onSubmit={onSubmit}
68-
onCancel={onCancel}
69-
error={errors.updateTemplateError}
70-
/>
71-
)}
72-
{templateVariables && templateVariables.length === 0 && (
73-
<div>
74-
<AlertBanner severity="info" text={t("unusedVariablesNotice")} />
75-
<div className={classes.goBackSection}>
76-
<GoBackButton onClick={onCancel} />
50+
<>
51+
<FullPageHorizontalForm title={t("title")} onCancel={onCancel}>
52+
{Boolean(errors.getTemplateDataError) && (
53+
<Stack className={classes.errorContainer}>
54+
<AlertBanner severity="error" error={errors.getTemplateDataError} />
55+
</Stack>
56+
)}
57+
{Boolean(errors.updateTemplateError) && (
58+
<Stack className={classes.errorContainer}>
59+
<AlertBanner severity="error" error={errors.updateTemplateError} />
60+
</Stack>
61+
)}
62+
{Boolean(errors.jobError) && (
63+
<Stack className={classes.errorContainer}>
64+
<AlertBanner severity="error" text={errors.jobError} />
65+
</Stack>
66+
)}
67+
{isLoading && <Loader />}
68+
{templateVersion &&
69+
templateVariables &&
70+
templateVariables.length > 0 && (
71+
<TemplateVariablesForm
72+
initialTouched={initialTouched}
73+
isSubmitting={isSubmitting}
74+
templateVersion={templateVersion}
75+
templateVariables={templateVariables}
76+
onSubmit={onSubmit}
77+
onCancel={onCancel}
78+
error={errors.updateTemplateError}
79+
/>
80+
)}
81+
{templateVariables && templateVariables.length === 0 && (
82+
<div>
83+
<AlertBanner severity="info" text={t("unusedVariablesNotice")} />
84+
<div className={classes.goBackSection}>
85+
<GoBackButton onClick={onCancel} />
86+
</div>
7787
</div>
78-
</div>
79-
)}
80-
</FullPageHorizontalForm>
88+
)}
89+
</FullPageHorizontalForm>
90+
</>
8191
)
8292
}
8393

8494
const useStyles = makeStyles((theme) => ({
8595
errorContainer: {
86-
marginBottom: theme.spacing(2),
96+
marginBottom: theme.spacing(8),
8797
},
8898
goBackSection: {
8999
display: "flex",

‎site/src/xServices/template/templateVariablesXService.ts

Lines changed: 19 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,8 @@ type TemplateVariablesContext = {
2828

2929
getTemplateDataError?: Error | unknown
3030
updateTemplateError?: Error | unknown
31+
32+
jobError?: TemplateVersion["job"]["error"]
3133
}
3234

3335
type UpdateTemplateEvent = {
@@ -117,7 +119,7 @@ export const templateVariablesMachine = createMachine(
117119
fillingParams: {
118120
on: {
119121
UPDATE_TEMPLATE_EVENT: {
120-
actions: ["assignCreateTemplateVersionRequest"],
122+
actions: ["assignCreateTemplateVersionRequest", "clearJobError"],
121123
target: "creatingTemplateVersion",
122124
},
123125
},
@@ -141,6 +143,11 @@ export const templateVariablesMachine = createMachine(
141143
invoke: {
142144
src: "waitForJobToBeCompleted",
143145
onDone: [
146+
{
147+
target: "fillingParams",
148+
cond: "hasJobError",
149+
actions: ["assignJobError"],
150+
},
144151
{
145152
actions: ["assignNewTemplateVersion"],
146153
target: "updatingTemplate",
@@ -258,6 +265,17 @@ export const templateVariablesMachine = createMachine(
258265
clearUpdateTemplateError: assign({
259266
updateTemplateError: (_) => undefined,
260267
}),
268+
assignJobError: assign({
269+
jobError: (_, event) => event.data.job.error,
270+
}),
271+
clearJobError: assign({
272+
jobError: (_) => undefined,
273+
}),
274+
},
275+
guards: {
276+
hasJobError: (_, { data }) => {
277+
return Boolean(data.job.error)
278+
},
261279
},
262280
},
263281
)

0 commit comments

Comments
 (0)