Skip to content

feat: Add OIDC authentication #3314

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 12 commits into from
Aug 1, 2022
Merged

feat: Add OIDC authentication #3314

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
12 commits
Select commit Hold shift + click to select a range
50ee7ad
feat: Add OIDC authentication
kylecarbs Jul 29, 2022
7eb897a
Extract username into a separate package and add OIDC tests
kylecarbs Jul 31, 2022
424579e
Add test case for invalid tokens
kylecarbs Jul 31, 2022
a49b491
Add test case for username as email
kylecarbs Jul 31, 2022
6eae627
Add OIDC to the frontend
kylecarbs Jul 31, 2022
292d9f6
Merge branch 'main' into oidc
kylecarbs Jul 31, 2022
e6619ff
Improve comments from self-review
kylecarbs Jul 31, 2022
3a20472
Add authentication docs
kylecarbs Jul 31, 2022
5f7176c
Add telemetry
kylecarbs Jul 31, 2022
c2a4481
Update docs/install/auth.md
kylecarbs Jul 31, 2022
4b71655
Update docs/install/auth.md
kylecarbs Jul 31, 2022
7b487be
Remove username package
kylecarbs Aug 1, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
Add OIDC to the frontend
  • Loading branch information
@kylecarbs
kylecarbs committed Jul 31, 2022
commit 6eae62770bc0ba4e563b610ab2bf6f20d5b6b80a
21 changes: 21 additions & 0 deletions site/src/components/SignInForm/SignInForm.stories.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -99,5 +99,26 @@ WithGithub.args = {
authMethods: {
password: true,
github: true,
oidc: false,
},
}

export const WithOIDC = Template.bind({})
WithOIDC.args = {
...SignedOut.args,
authMethods: {
password: true,
github: false,
oidc: true,
},
}

export const WithGithubAndOIDC = Template.bind({})
WithGithubAndOIDC.args = {
...SignedOut.args,
authMethods: {
password: true,
github: true,
oidc: true,
},
}
58 changes: 40 additions & 18 deletions site/src/components/SignInForm/SignInForm.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,8 +1,10 @@
import Box from "@material-ui/core/Box"
import Button from "@material-ui/core/Button"
import Link from "@material-ui/core/Link"
import { makeStyles } from "@material-ui/core/styles"
import TextField from "@material-ui/core/TextField"
import GitHubIcon from "@material-ui/icons/GitHub"
import KeyIcon from "@material-ui/icons/VpnKey"
import { ErrorSummary } from "components/ErrorSummary/ErrorSummary"
import { Stack } from "components/Stack/Stack"
import { FormikContextType, FormikTouched, useFormik } from "formik"
Expand Down Expand Up @@ -43,6 +45,7 @@ export const Language = {
},
passwordSignIn: "Sign In",
githubSignIn: "GitHub",
oidcSignIn: "OpenID Connect",
}

const validationSchema = Yup.object({
Expand Down Expand Up @@ -155,32 +158,51 @@ export const SignInForm: FC<SignInFormProps> = ({
</div>
</Stack>
</form>
{authMethods?.github && (
{(authMethods?.github || authMethods?.oidc) && (
<>
<div className={styles.divider}>
<div className={styles.dividerLine} />
<div className={styles.dividerLabel}>Or</div>
<div className={styles.dividerLine} />
</div>

<div>
<Link
underline="none"
href={`/api/v2/users/oauth2/github/callback?redirect=${encodeURIComponent(
redirectTo,
)}`}
>
<Button
startIcon={<GitHubIcon className={styles.buttonIcon} />}
disabled={isLoading}
fullWidth
type="submit"
variant="contained"
<Box display="grid" gridGap="16px">
{authMethods.github && (
<Link
underline="none"
href={`/api/v2/users/oauth2/github/callback?redirect=${encodeURIComponent(
redirectTo,
)}`}
>
{Language.githubSignIn}
</Button>
</Link>
</div>
<Button
startIcon={<GitHubIcon className={styles.buttonIcon} />}
disabled={isLoading}
fullWidth
type="submit"
variant="contained"
>
{Language.githubSignIn}
</Button>
</Link>
)}

{authMethods.oidc && (
<Link
underline="none"
href={`/api/v2/users/oidc/callback?redirect=${encodeURIComponent(redirectTo)}`}
>
<Button
startIcon={<KeyIcon className={styles.buttonIcon} />}
disabled={isLoading}
fullWidth
type="submit"
variant="contained"
>
{Language.oidcSignIn}
</Button>
</Link>
)}
</Box>
</>
)}
</>
Expand Down
1 change: 1 addition & 0 deletions site/src/testHelpers/entities.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -304,6 +304,7 @@ export const MockUserAgent: Types.UserAgent = {
export const MockAuthMethods: TypesGen.AuthMethods = {
password: true,
github: false,
oidc: false,
}

export const MockGitSSHKey: TypesGen.GitSSHKey = {
Expand Down