8000 review notes, documentation and make fmt · coder/coder@79896b2 · GitHub
[go: up one dir, main page]
Skip to content

Commit 79896b2

Browse files
SasSwartSasSwart
committed
review notes, documentation and make fmt
1 parent 32aec0b commit 79896b2

File tree

5 files changed

+30
-19
lines changed

5 files changed

+30
-19
lines changed

‎site/src/modules/provisioners/ProvisionerAlert.stories.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ export const Info: Story = {};
2424

2525
export const InfoStyledForLogs: Story = {
2626
args: {
27-
variant: AlertVariant.InLogs,
27+
variant: AlertVariant.Inline,
2828
},
2929
};
3030

@@ -37,7 +37,7 @@ export const Warning: Story = {
3737
export const WarningStyledForLogs: Story = {
3838
args: {
3939
severity: "warning",
40-
variant: AlertVariant.InLogs,
40+
variant: AlertVariant.Inline,
4141
},
4242
};
4343

‎site/src/modules/provisioners/ProvisionerAlert.tsx

Lines changed: 23 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -6,8 +6,13 @@ import { ProvisionerTag } from "modules/provisioners/ProvisionerTag";
66
import type { FC } from "react";
77

88
export enum AlertVariant {
9+
// Alerts are usually styled with a full rounded border and meant to use as a visually distinct element of the page.
10+
// The Standalone variant conforms to this styling.
911
Standalone = "Standalone",
10-
InLogs = "InLogs",
12+
// We show these same alerts in environments such as log drawers where we stream the logs from builds.
13+
// In this case the full border is incongruent with the surroundings of the component.
14+
// The Inline variant replaces the full rounded border with a left border and a divider so that it complements the surroundings.
15+
Inline = "Inline",
1116
}
1217

1318
interface ProvisionerAlertProps {
@@ -18,6 +23,22 @@ interface ProvisionerAlertProps {
1823
variant?: AlertVariant;
1924
}
2025

26+
const getAlertStyles = (variant: AlertVariant, severity: AlertColor) => {
27+
switch (variant) {
28+
case AlertVariant.Inline:
29+
return {
30+
css: (theme) => ({
31+
borderRadius: 0,
32+
border: 0,
33+
borderBottom: `1px solid ${theme.palette.divider}`,
34+
borderLeft: `2px solid ${theme.palette[severity].main}`,
35+
}),
36+
};
37+
default:
38+
return {};
39+
}
40+
};
41+
2142
export const ProvisionerAlert: FC<ProvisionerAlertProps> = ({
2243
title,
2344
detail,
@@ -26,17 +47,7 @@ export const ProvisionerAlert: FC<ProvisionerAlertProps> = ({
2647
variant = AlertVariant.Standalone,
2748
}) => {
2849
return (
29-
<Alert
30-
severity={severity}
31-
{...(variant === AlertVariant.InLogs && {
32-
css: (theme) => ({
33-
borderRadius: 0,
34-
border: 0,
35-
borderBottom: `1px solid ${theme.palette.divider}`,
36-
borderLeft: `2px solid ${theme.palette[severity].main}`,
37-
}),
38-
})}
39-
>
50+
<Alert severity={severity} {...getAlertStyles(variant, severity)}>
4051
<AlertTitle>{title}</AlertTitle>
4152
<AlertDetail>
4253
<div>{detail}</div>

‎site/src/modules/provisioners/ProvisionerStatusAlert.stories.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -51,7 +51,7 @@ export const NoMatchingProvisioners: Story = {
5151
export const NoMatchingProvisionersInLogs: Story = {
5252
args: {
5353
matchingProvisioners: 0,
54-
variant: AlertVariant.InLogs,
54+
variant: AlertVariant.Inline,
5555
},
5656
};
5757

@@ -66,6 +66,6 @@ export const NoAvailableProvisionersInLogs: Story = {
6666
args: {
6767
matchingProvisioners: 1,
6868
availableProvisioners: 0,
69-
variant: AlertVariant.InLogs,
69+
variant: AlertVariant.Inline,
7070
},
7171
};

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

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -95,7 +95,7 @@ export const BuildLogsDrawer: FC<BuildLogsDrawerProps> = ({
9595
matchingProvisioners={matchingProvisioners}
9696
availableProvisioners={availableProvisioners}
9797
tags={templateVersion?.job.tags ?? {}}
98-
variant={AlertVariant.InLogs}
98+
variant={AlertVariant.Inline}
9999
/>
100100
<Loader />
101101
</>

‎site/src/pages/TemplateVersionEditorPage/TemplateVersionEditor.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -594,7 +594,7 @@ export const TemplateVersionEditor: FC<TemplateVersionEditorProps> = ({
594594
detail={templateVersion.job.error}
595595
severity="error"
596596
tags={templateVersion.job.tags}
597-
variant={AlertVariant.InLogs}
597+
variant={AlertVariant.Inline}
598598
/>
599599
</div>
600600
) : (
@@ -604,7 +604,7 @@ export const TemplateVersionEditor: FC<TemplateVersionEditorProps> = ({
604604
matchingProvisioners={matchingProvisioners}
605605
availableProvisioners={availableProvisioners}
606606
tags={templateVersion.job.tags}
607-
variant={AlertVariant.InLogs}
607+
variant={AlertVariant.Inline}
608608
/>
609609
<Loader css={{ height: "100%" }} />
610610
</>

0 commit comments

Comments
 (0)
0