Skip to content

Commit 0cab768

Browse files
committed
use matched_provisioners instead of a second api call
1 parent 2baa81e commit 0cab768

File tree

9 files changed

+176
-174
lines changed

9 files changed

+176
-174
lines changed

site/src/api/api.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -691,7 +691,7 @@ class ApiMethods {
691691
const params = new URLSearchParams();
692692

693693
if (tags) {
694-
params.append('tags', encodeURIComponent(JSON.stringify(tags)));
694+
params.append('tags', JSON.stringify(tags));
695695
}
696696

697697
const response = await this.axios.get<TypesGen.ProvisionerDaemon[]>(
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
import type { Meta, StoryObj } from "@storybook/react";
2+
import { chromatic } from "testHelpers/chromatic";
3+
import { MockTemplateVersion } from "testHelpers/entities";
4+
import { ProvisionerAlert } from "./ProvisionerAlert";
5+
6+
const meta: Meta<typeof ProvisionerAlert> = {
7+
title: "modules/provisioners/ProvisionerAlert",
8+
parameters: {
9+
chromatic,
10+
layout: "centered",
11+
},
12+
component: ProvisionerAlert,
13+
args: {
14+
matchingProvisioners: 0,
15+
availableProvisioners: 0,
16+
tags: MockTemplateVersion.job.tags,
17+
},
18+
};
19+
20+
export default meta;
21+
type Story = StoryObj<typeof ProvisionerAlert>;
22+
23+
export const HealthyProvisioners: Story = {
24+
args: {
25+
matchingProvisioners: 1,
26+
availableProvisioners: 1,
27+
}
28+
};
29+
30+
export const NoMatchingProvisioners: Story = {
31+
args: {
32+
matchingProvisioners: 0,
33+
}
34+
};
35+
36+
export const NoAvailableProvisioners: Story = {
37+
args: {
38+
matchingProvisioners: 1,
39+
availableProvisioners: 0,
40+
}
41+
};
Original file line numberDiff line numberDiff line change
@@ -1,33 +1,100 @@
1-
import { Theme } from "@mui/material";
2-
import Alert from "@mui/material/Alert";
1+
import Alert, { AlertColor } from "@mui/material/Alert";
32
import AlertTitle from "@mui/material/AlertTitle";
4-
import type { AlertColor } from "@mui/material/Alert";
3+
import { Stack } from "components/Stack/Stack";
54
import { AlertDetail } from "components/Alert/Alert";
6-
import type { FC } from "react";
5+
import { type FC } from "react";
6+
import { ProvisionerTag } from "modules/provisioners/ProvisionerTag";
77

8-
type ProvisionerAlertProps = {
9-
title: string,
10-
detail: string,
11-
severity: AlertColor,
8+
interface ProvisionerAlertProps {
9+
matchingProvisioners: number | undefined,
10+
availableProvisioners: number | undefined,
11+
tags: Record<string, string>
1212
}
1313

1414
export const ProvisionerAlert : FC<ProvisionerAlertProps> = ({
15+
matchingProvisioners,
16+
availableProvisioners,
17+
tags
18+
}) => {
19+
let title, detail: string;
20+
switch (true) {
21+
case (matchingProvisioners === 0):
22+
title="Provisioning Cannot Proceed"
23+
detail="There are no provisioners that accept the required tags. Please contact your administrator. Once a compatible provisioner becomes available, provisioning will continue."
24+
break;
25+
case (availableProvisioners === 0):
26+
title="Provisioning Delayed"
27+
detail="Provisioners that accept the required tags are currently anavailable. This may delay your build. Please contact your administrator if your build does not complete."
28+
break;
29+
default:
30+
return null;
31+
}
32+
33+
return (
34+
<Alert
35+
severity="warning"
36+
css={(theme) => ({
37+
borderRadius: 0,
38+
border: 0,
39+
borderBottom: `1px solid ${theme.palette.divider}`,
40+
borderLeft: `2px solid ${theme.palette.error.main}`,
41+
})}
42+
>
43+
<AlertTitle>{title}</AlertTitle>
44+
<AlertDetail>
45+
<div>{detail}</div>
46+
<Stack direction="row" spacing={1} wrap="wrap">
47+
{Object.entries(tags)
48+
.filter(([key]) => key !== "owner")
49+
.map(([key, value]) => (
50+
<ProvisionerTag
51+
tagName={key}
52+
tagValue={value}
53+
/>
54+
))}
55+
</Stack>
56+
</AlertDetail>
57+
</Alert>
58+
);
59+
};
60+
61+
interface ProvisionerJobErrorProps {
62+
title: string
63+
detail: string
64+
severity: AlertColor
65+
tags: Record<string, string>
66+
}
67+
68+
export const ProvisionerJobAlert : FC<ProvisionerJobErrorProps> = ({
1569
title,
1670
detail,
1771
severity,
72+
tags,
1873
}) => {
1974
return (
2075
<Alert
2176
severity={severity}
22-
css={(theme: Theme) => ({
77+
css={(theme) => ({
2378
borderRadius: 0,
2479
border: 0,
2580
borderBottom: `1px solid ${theme.palette.divider}`,
2681
borderLeft: `2px solid ${theme.palette.error.main}`,
2782
})}
2883
>
2984
<AlertTitle>{title}</AlertTitle>
30-
<AlertDetail>{detail}</AlertDetail>
85+
<AlertDetail>
86+
<div>{detail}</div>
87+
<Stack direction="row" spacing={1} wrap="wrap">
88+
{Object.entries(tags)
89+
.filter(([key]) => key !== "owner")
90+
.map(([key, value]) => (
91+
<ProvisionerTag
92+
tagName={key}
93+
tagValue={value}
94+
/>
95+
))}
96+
</Stack>
97+
</AlertDetail>
3198
</Alert>
3299
);
33100
};

site/src/modules/provisioners/useCompatibleProvisioners.ts

-24
This file was deleted.

site/src/pages/CreateTemplatePage/BuildLogsDrawer.stories.tsx

+23-30
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import {
55
MockTemplateVersion,
66
MockWorkspaceBuildLogs,
77
} from "testHelpers/entities";
8-
import { withProvisioners, withWebSocket } from "testHelpers/storybook";
8+
import { withWebSocket } from "testHelpers/storybook";
99
import { BuildLogsDrawer } from "./BuildLogsDrawer";
1010

1111
const meta: Meta<typeof BuildLogsDrawer> = {
@@ -36,46 +36,39 @@ export const MissingVariables: Story = {
3636

3737
export const NoProvisioners: Story = {
3838
args: {
39-
templateVersion: {...MockTemplateVersion, organization_id: "org-id"},
39+
templateVersion: {
40+
...MockTemplateVersion,
41+
matched_provisioners: {
42+
count: 0,
43+
available: 0,
44+
}
45+
},
4046
},
41-
decorators: [withProvisioners],
42-
parameters: {
43-
organization_id: "org-id",
44-
tags: MockTemplateVersion.job.tags,
45-
provisioners: [],
46-
}
4747
};
4848

4949
export const ProvisionersUnhealthy: Story = {
5050
args: {
51-
templateVersion: {...MockTemplateVersion, organization_id: "org-id"},
51+
templateVersion: {
52+
...MockTemplateVersion,
53+
matched_provisioners: {
54+
count: 1,
55+
available: 0,
56+
}
57+
},
5258
},
53-
decorators: [withProvisioners],
54-
parameters: {
55-
organization_id: "org-id",
56-
tags: MockTemplateVersion.job.tags,
57-
provisioners: [
58-
{
59-
last_seen_at: new Date(new Date().getTime() - 5 * 60 * 1000).toISOString()
60-
},
61-
],
62-
}
6359
};
6460

6561
export const ProvisionersHealthy: Story = {
6662
args: {
67-
templateVersion: {...MockTemplateVersion, organization_id: "org-id"},
63+
templateVersion: {
64+
...MockTemplateVersion,
65+
organization_id: "org-id",
66+
matched_provisioners: {
67+
count: 1,
68+
available: 1,
69+
}
70+
},
6871
},
69-
decorators: [withProvisioners],
70-
parameters: {
71-
organization_id: "org-id",
72-
tags: MockTemplateVersion.job.tags,
73-
provisioners: [
74-
{
75-
last_seen_at: new Date()
76-
},
77-
],
78-
}
7972
};
8073

8174

site/src/pages/CreateTemplatePage/BuildLogsDrawer.tsx

+8-32
Original file line numberDiff line numberDiff line change
@@ -12,9 +12,6 @@ import { useWatchVersionLogs } from "modules/templates/useWatchVersionLogs";
1212
import { WorkspaceBuildLogs } from "modules/workspaces/WorkspaceBuildLogs/WorkspaceBuildLogs";
1313
import { type FC, useLayoutEffect, useRef } from "react";
1414
import { navHeight } from "theme/constants";
15-
import { provisionersUnhealthy } from "modules/provisioners/useCompatibleProvisioners";
16-
import { useQuery } from "react-query";
17-
import { provisionerDaemons } from "api/queries/organizations";
1815
import { ProvisionerAlert } from "modules/provisioners/ProvisionerAlert";
1916

2017
type BuildLogsDrawerProps = {
@@ -31,15 +28,8 @@ export const BuildLogsDrawer: FC<BuildLogsDrawerProps> = ({
3128
variablesSectionRef,
3229
...drawerProps
3330
}) => {
34-
const org = templateVersion?.organization_id
35-
const {
36-
data: compatibleProvisioners,
37-
isLoading: provisionerDaemonsLoading,
38-
isError: couldntGetProvisioners,
39-
} = useQuery(
40-
org ? provisionerDaemons(org, templateVersion?.job.tags) : { enabled: false}
41-
);
42-
const compatibleProvisionersUnhealthy = !compatibleProvisioners || provisionersUnhealthy(compatibleProvisioners);
31+
const matchingProvisioners = templateVersion?.matched_provisioners?.count
32+
const availableProvisioners = templateVersion?.matched_provisioners?.available
4333

4434
const logs = useWatchVersionLogs(templateVersion);
4535
const logsContainer = useRef<HTMLDivElement>(null);
@@ -79,26 +69,12 @@ export const BuildLogsDrawer: FC<BuildLogsDrawerProps> = ({
7969
</IconButton>
8070
</header>
8171

82-
{ !logs && !provisionerDaemonsLoading && (
83-
couldntGetProvisioners ? (
84-
<ProvisionerAlert
85-
severity="warning"
86-
title="Something went wrong"
87-
detail="Could not determine provisioner status. Your template build may fail. If your template does not build, please contact your administrator"
88-
/>
89-
) : (!compatibleProvisioners || compatibleProvisioners.length === 0) ? (
90-
<ProvisionerAlert
91-
severity="warning"
92-
title="Template Creation Stuck"
93-
detail="This organization does not have any provisioners to process this template. Configure a provisioner."
94-
/>
95-
) : compatibleProvisionersUnhealthy && (
96-
<ProvisionerAlert
97-
severity="warning"
98-
title="Template Creation Delayed"
99-
detail="Provisioners are currently unresponsive. This may delay your template creation. Please contact your administrator for support."
100-
/>
101-
)
72+
{ !logs && (
73+
<ProvisionerAlert
74+
matchingProvisioners={matchingProvisioners}
75+
availableProvisioners={availableProvisioners}
76+
tags={templateVersion?.job.tags ?? {}}
77+
/>
10278
)}
10379

10480
{isMissingVariables ? (

0 commit comments

Comments
 (0)