8000 support optional external auth providers in the frontend · coder/coder@c04cd37 · GitHub
[go: up one dir, main page]
Skip to content

Commit c04cd37

Browse files
aslilacaslilac
committed
support optional external auth providers in the frontend
1 parent 4ee3bad commit c04cd37

File tree

5 files changed

+106
-15
lines changed

5 files changed

+106
-15
lines changed

‎site/src/pages/CreateWorkspacePage/CreateWorkspacePage.test.tsx

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -241,9 +241,7 @@ describe("CreateWorkspacePage", () => {
241241
renderCreateWorkspacePage();
242242
await waitForLoaderToBeRemoved();
243243

244-
await screen.findByText(
245-
"To create a workspace using the selected template, please ensure you are authenticated with all the external providers listed below.",
246-
);
244+
await screen.findByText(/connect to all required/i);
247245
});
248246

249247
it("auto create a workspace if uses mode=auto", async () => {
@@ -312,7 +310,7 @@ describe("CreateWorkspacePage", () => {
312310
route: `/templates/${MockWorkspace.name}/workspace?${params.toString()}`,
313311
});
314312

315-
const warningMessage = await screen.findByRole("alert");
313+
const warningMessage = await screen.findByTestId("duplication-warning");
316314
const nameInput = await screen.findByRole("textbox", {
317315
name: "Workspace Name",
318316
});

‎site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.stories.tsx

Lines changed: 74 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -126,6 +126,80 @@ export const ExternalAuth: Story = {
126126
authenticate_url: "",
127127
display_icon: "/icon/gitlab.svg",
128128
display_name: "GitLab",
129+
optional: true,
130+
},
131+
],
132+
},
133+
};
134+
135+
export const ExternalAuthError: Story = {
136+
args: {
137+
error: true,
138+
externalAuth: [
139+
{
140+
id: "github",
141+
type: "github",
142+
authenticated: false,
143+
authenticate_url: "",
144+
display_icon: "/icon/github.svg",
145+
display_name: "GitHub",
146+
},
147+
{
148+
id: "gitlab",
149+
type: "gitlab",
150+
authenticated: false,
151+
authenticate_url: "",
152+
display_icon: "/icon/gitlab.svg",
153+
display_name: "GitLab",
154+
optional: true,
155+
},
156+
],
157+
},
158+
};
159+
160+
export const ExternalAuthAllRequiredConnected: Story = {
161+
args: {
162+
externalAuth: [
163+
{
164+
id: "github",
165+
type: "github",
166+
authenticated: true,
167+
authenticate_url: "",
168+
display_icon: "/icon/github.svg",
169+
display_name: "GitHub",
170+
},
171+
{
172+
id: "gitlab",
173+
type: "gitlab",
174+
authenticated: false,
175+
67ED authenticate_url: "",
176+
display_icon: "/icon/gitlab.svg",
177+
display_name: "GitLab",
178+
optional: true,
179+
},
180+
],
181+
},
182+
};
183+
184+
export const ExternalAuthAllConnected: Story = {
185+
args: {
186+
externalAuth: [
187+
{
188+
id: "github",
189+
type: "github",
190+
authenticated: true,
191+
authenticate_url: "",
192+
display_icon: "/icon/github.svg",
193+
display_name: "GitHub",
194+
},
195+
{
196+
id: "gitlab",
197+
type: "gitlab",
198+
authenticated: true,
199+
authenticate_url: "",
200+
display_icon: "/icon/gitlab.svg",
201+
display_name: "GitLab",
202+
optional: true,
129203
},
130204
],
131205
},

‎site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.tsx

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -183,7 +183,7 @@ export const CreateWorkspacePageView: FC<CreateWorkspacePageViewProps> = ({
183183
{Boolean(error) && <ErrorAlert error={error} />}
184184

185185
{mode === "duplicate" && (
186-
<Alert severity="info" dismissible>
186+
<Alert severity="info" dismissible data-testid="duplication-warning">
187187
{Language.duplicationWarning}
188188
</Alert>
189189
)}
@@ -252,7 +252,7 @@ export const CreateWorkspacePageView: FC<CreateWorkspacePageViewProps> = ({
252252
{externalAuth && externalAuth.length > 0 && (
253253
<FormSection
254254
title="External Authentication"
255-
description="This template requires authentication to external services."
255+
description="This template uses external services for authentication."
256256
>
257257
<FormFields>
258258
{hasAllRequiredExternalAuth ? (
@@ -261,14 +261,15 @@ export const CreateWorkspacePageView: FC<CreateWorkspacePageViewProps> = ({
261261
providers listed below.
262262
</Alert>
263263
) : (
264-
<Alert severity="error">
264+
<Alert severity={error ? "error" : "info"}>
265265
To create a workspace using this template, please connect to
266266
all required external authentication providers listed below.
267267
</Alert>
268268
)}
269269
{externalAuth.map((auth) => (
270270
<ExternalAuthButton
271271
key={auth.id}
272+
error={error}
272273
auth={auth}
273274
isLoading={externalAuthPollingState === "polling"}
274275
onStartPolling={startPollingExternalAuth}

‎site/src/pages/CreateWorkspacePage/ExternalAuthButton.stories.tsx

Lines changed: 13 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ const MockExternalAuth: TemplateVersionExternalAuth = {
1212
};
1313

1414
const meta: Meta<typeof ExternalAuthButton> = {
15-
title: "pages/CreateWorkspacePage/ExternalAuth",
15+
title: "pages/CreateWorkspacePage/ExternalAuthButton",
1616
component: ExternalAuthButton,
1717
};
1818

@@ -25,6 +25,15 @@ export const Github: Story = {
2525
},
2626
};
2727

28+
export const GithubOptional: Story = {
29+
args: {
30+
auth: {
31+
...MockExternalAuth,
32+
optional: true,
33+
},
34+
},
35+
};
36+
2837
export const GithubWithRetry: Story = {
2938
args: {
3039
auth: MockExternalAuth,
@@ -48,6 +57,7 @@ export const Gitlab: Story = {
4857
display_icon: "/icon/gitlab.svg",
4958
display_name: "GitLab",
5059
authenticated: false,
60+
optional: true,
5161
},
5262
},
5363
};
@@ -70,6 +80,7 @@ export const AzureDevOps: Story = {
7080
display_icon: "/icon/azure-devops.svg",
7181
display_name: "Azure DevOps",
7282
authenticated: false,
83+
optional: true,
7384
},
7485
},
7586
};
@@ -92,6 +103,7 @@ export const Bitbucket: Story = {
92103
display_icon: "/icon/bitbucket.svg",
93104
display_name: "Bitbucket",
94105
authenticated: false,
106+
optional: true,
95107
},
96108
},
97109
};

‎site/src/pages/CreateWorkspacePage/ExternalAuthButton.tsx

Lines changed: 13 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -13,13 +13,15 @@ export interface ExternalAuthButtonProps {
1313
displayRetry: boolean;
1414
isLoading: boolean;
1515
onStartPolling: () => void;
16+
error?: unknown;
1617
}
1718

1819
export const ExternalAuthButton: FC<ExternalAuthButtonProps> = ({
1920
auth,
2021
displayRetry,
2122
isLoading,
2223
onStartPolling,
24+
error,
2325
}) => {
2426
return (
2527
<>
@@ -49,13 +51,17 @@ export const ExternalAuthButton: FC<ExternalAuthButtonProps> = ({
4951
onStartPolling();
5052
}}
5153
>
52-
{auth.authenticated
53-
? `Authenticated with ${auth.display_name}`
54-
: `Login with ${auth.display_name}`}
55-
{!auth.optional && !auth.authenticated && (
56-
<Pill type="error" css={{ marginLeft: 8 }}>
57-
Required
58-
</Pill>
54+
{auth.authenticated ? (
55+
`Authenticated with ${auth.display_name}`
56+
) : (
57+
<>
58+
Login with {auth.display_name}
59+
{!auth.optional && (
60+
<Pill type={error ? "error" : "info"} css={{ marginLeft: 8 }}>
61+
Required
62+
</Pill>
63+
)}
64+
</>
5965
)}
6066
</LoadingButton>
6167

0 commit comments

Comments
 (0)
0