From 447ad2ae371900c531e0fef88ba7706ef6b4a090 Mon Sep 17 00:00:00 2001 From: BrunoQuaresma Date: Tue, 11 Jul 2023 13:08:12 +0000 Subject: [PATCH 1/3] feat(site): make noticeable when a workspace is unhealthy --- .../Workspace/Workspace.stories.tsx | 14 ++++++ site/src/components/Workspace/Workspace.tsx | 10 +++++ .../WorkspacesTable/WorkspacesRow.tsx | 45 ++++++++++++++++++- .../WorkspacesPageView.stories.tsx | 14 ++++++ 4 files changed, 82 insertions(+), 1 deletion(-) diff --git a/site/src/components/Workspace/Workspace.stories.tsx b/site/src/components/Workspace/Workspace.stories.tsx index ef18cd1aef19f..189eb8f87924f 100644 --- a/site/src/components/Workspace/Workspace.stories.tsx +++ b/site/src/components/Workspace/Workspace.stories.tsx @@ -234,6 +234,20 @@ export const CancellationError: Story = { }, } +export const Unhealthy: Story = { + args: { + ...Running.args, + workspace: { + ...Mocks.MockWorkspace, + latest_build: { ...Mocks.MockWorkspace.latest_build, status: "running" }, + health: { + healthy: false, + failing_agents: [], + }, + }, + }, +} + function makeFailedBuildLogs(): ProvisionerJobLog[] { return [ { diff --git a/site/src/components/Workspace/Workspace.tsx b/site/src/components/Workspace/Workspace.tsx index 7fa5e68e66d03..3c17dd9a8cc46 100644 --- a/site/src/components/Workspace/Workspace.tsx +++ b/site/src/components/Workspace/Workspace.tsx @@ -225,6 +225,16 @@ export const Workspace: FC> = ({ > {buildError} {cancellationError} + {workspace.latest_build.status === "running" && + !workspace.health.healthy && ( + + Workspace is unhealty + + Your workspace is running but some agents had failed during + initialization. + + + )} diff --git a/site/src/components/WorkspacesTable/WorkspacesRow.tsx b/site/src/components/WorkspacesTable/WorkspacesRow.tsx index 7dd637b1afda7..d3ae795e7af94 100644 --- a/site/src/components/WorkspacesTable/WorkspacesRow.tsx +++ b/site/src/components/WorkspacesTable/WorkspacesRow.tsx @@ -13,6 +13,14 @@ import { OutdatedHelpTooltip } from "components/Tooltips/OutdatedHelpTooltip" import { Avatar } from "components/Avatar/Avatar" import { Stack } from "components/Stack/Stack" import { useClickableTableRow } from "hooks/useClickableTableRow" +import { + HelpTooltip, + HelpTooltipText, + HelpTooltipTitle, +} from "components/Tooltips/HelpTooltip" +import InfoIcon from "@mui/icons-material/InfoOutlined" +import { colors } from "theme/colors" +import Box from "@mui/material/Box" export const WorkspacesRow: FC<{ workspace: Workspace @@ -62,7 +70,11 @@ export const WorkspacesRow: FC<{ - + + + {workspace.latest_build.status === "running" && + !workspace.health.healthy && } + @@ -74,6 +86,25 @@ export const WorkspacesRow: FC<{ ) } +export const UnhealthyTooltip = () => { + const styles = useStyles() + + return ( + + Workspace is unhealty + + Your workspace is running but some agents had failed during + initialization. + + + ) +} + const useStyles = makeStyles((theme) => ({ arrowRight: { color: theme.palette.text.secondary, @@ -85,4 +116,16 @@ const useStyles = makeStyles((theme) => ({ display: "flex", paddingLeft: theme.spacing(2), }, + + unhealthyIcon: { + color: colors.yellow[5], + }, + + unhealthyButton: { + opacity: 1, + + "&:hover": { + opacity: 1, + }, + }, })) diff --git a/site/src/pages/WorkspacesPage/WorkspacesPageView.stories.tsx b/site/src/pages/WorkspacesPage/WorkspacesPageView.stories.tsx index ed032cb99f6f5..d9d8c0786a6f9 100644 --- a/site/src/pages/WorkspacesPage/WorkspacesPageView.stories.tsx +++ b/site/src/pages/WorkspacesPage/WorkspacesPageView.stories.tsx @@ -145,6 +145,20 @@ export const NoSearchResults: Story = { }, } +export const UnhealthyWorkspace: Story = { + args: { + workspaces: [ + { + ...createWorkspace("running"), + health: { + healthy: false, + failing_agents: [], + }, + }, + ], + }, +} + export const Error: Story = { args: { error: mockApiError({ message: "Something went wrong" }), From 2acc0ba4f0037987b10ecedf25e62c6e5e3d8308 Mon Sep 17 00:00:00 2001 From: BrunoQuaresma Date: Tue, 11 Jul 2023 13:45:35 +0000 Subject: [PATCH 2/3] Fix grammar --- site/src/components/Workspace/Workspace.tsx | 2 +- site/src/components/WorkspacesTable/WorkspacesRow.tsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/site/src/components/Workspace/Workspace.tsx b/site/src/components/Workspace/Workspace.tsx index 3c17dd9a8cc46..f61c252103fa4 100644 --- a/site/src/components/Workspace/Workspace.tsx +++ b/site/src/components/Workspace/Workspace.tsx @@ -228,7 +228,7 @@ export const Workspace: FC> = ({ {workspace.latest_build.status === "running" && !workspace.health.healthy && ( - Workspace is unhealty + Workspace is unhealthy Your workspace is running but some agents had failed during initialization. diff --git a/site/src/components/WorkspacesTable/WorkspacesRow.tsx b/site/src/components/WorkspacesTable/WorkspacesRow.tsx index d3ae795e7af94..fb76f4c298c33 100644 --- a/site/src/components/WorkspacesTable/WorkspacesRow.tsx +++ b/site/src/components/WorkspacesTable/WorkspacesRow.tsx @@ -96,7 +96,7 @@ export const UnhealthyTooltip = () => { iconClassName={styles.unhealthyIcon} buttonClassName={styles.unhealthyButton} > - Workspace is unhealty + Workspace is unhealthy Your workspace is running but some agents had failed during initialization. From 7fe9114e30dbf8816593608e86feaa1856ffdf60 Mon Sep 17 00:00:00 2001 From: BrunoQuaresma Date: Wed, 12 Jul 2023 13:15:45 +0000 Subject: [PATCH 3/3] Improve message --- site/src/components/Workspace/Workspace.tsx | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) diff --git a/site/src/components/Workspace/Workspace.tsx b/site/src/components/Workspace/Workspace.tsx index f61c252103fa4..dae6ab8545132 100644 --- a/site/src/components/Workspace/Workspace.tsx +++ b/site/src/components/Workspace/Workspace.tsx @@ -230,8 +230,11 @@ export const Workspace: FC> = ({ Workspace is unhealthy - Your workspace is running but some agents had failed during - initialization. + Your workspace is running but{" "} + {workspace.health.failing_agents.length > 1 + ? `${workspace.health.failing_agents.length} agents are unhealthy` + : `1 agent is unhealthy`} + . )}