3pp-mirror/pomerium
1
0
Fork 0
mirror of https://github.com/pomerium/pomerium.git synced 2025-05-12 08:37:38 +02:00
Code Issues Projects Releases Packages Wiki Activity

userinfo: add webauthn buttons to user info page (#3075)

Browse source 
* userinfo: add webauthn buttons to user info page

* use new buttons on original page

* fix test
This commit is contained in:
Caleb Doxsey 2022-02-23 10:08:24 -07:00 • committed by GitHub
parent 38c7089642
commit 35f697e491
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
14 changed files with 423 additions and 288 deletions
Download patch file Download diff file Expand all files Collapse all files

116
ui/src/components/SessionDeviceCredentials.tsx
View file

@ -1,30 +1,35 @@
import DeviceCredentialsTable from "../components/DeviceCredentialsTable";
import SectionFooter from "../components/SectionFooter";
import { Session, User } from "../types";
import Box from "@mui/material/Box";
import Paper from "@mui/material/Paper";
import Stack from "@mui/material/Stack";
import Table from "@mui/material/Table";
import TableBody from "@mui/material/TableBody";
import TableCell from "@mui/material/TableCell";
import TableContainer from "@mui/material/TableContainer";
import TableHead from "@mui/material/TableHead";
import TableRow from "@mui/material/TableRow";
import Toolbar from "@mui/material/Toolbar";
import Typography from "@mui/material/Typography";
import React, { FC } from "react";
import DeviceCredentialsTable from "../components/DeviceCredentialsTable";
import {
Session,
User,
WebAuthnCreationOptions,
WebAuthnRequestOptions,
} from "../types";
import WebAuthnAuthenticateButton from "./WebAuthnAuthenticateButton";
import WebAuthnRegisterButton from "./WebAuthnRegisterButton";
export type SessionDeviceCredentialsProps = {
csrfToken: string;
user: User;
session: Session;
webAuthnCreationOptions: WebAuthnCreationOptions;
webAuthnRequestOptions: WebAuthnRequestOptions;
webAuthnUrl: string;
};
export const SessionDeviceCredentials: FC<SessionDeviceCredentialsProps> = ({
csrfToken,
user,
session,
webAuthnUrl
webAuthnCreationOptions,
webAuthnRequestOptions,
webAuthnUrl,
}) => {
const currentSessionDeviceCredentialIds = [];
const otherDeviceCredentialIds = [];
@ -37,45 +42,62 @@ export const SessionDeviceCredentials: FC<SessionDeviceCredentialsProps> = ({
});
return (
<Paper sx={{ overflow: "hidden" }}>
<Stack>
<Toolbar>
<Typography variant="h4" flexGrow={1}>
Current Session Device Credentials
</Typography>
</Toolbar>
<Box sx={{ padding: 3, paddingTop: 0 }}>
<DeviceCredentialsTable
csrfToken={csrfToken}
ids={currentSessionDeviceCredentialIds}
webAuthnUrl={webAuthnUrl}
/>
</Box>
{otherDeviceCredentialIds?.length > 0 ? (
<>
<Toolbar>
<Typography variant="h4" flexGrow={1}>
Other Device Credentials
</Typography>
</Toolbar>
<Box sx={{ padding: 3, paddingTop: 0 }}>
<DeviceCredentialsTable
<>
<Paper sx={{ overflow: "hidden" }}>
<Stack>
<Toolbar>
<Typography variant="h4" flexGrow={1}>
Current Session Device Credentials
</Typography>
<Stack direction="row" justifyContent="center" spacing={1}>
<WebAuthnRegisterButton
creationOptions={webAuthnCreationOptions}
csrfToken={csrfToken}
ids={otherDeviceCredentialIds}
webAuthnUrl={webAuthnUrl}
url={webAuthnUrl}
size="small"
/>
</Box>
</>
) : (
<></>
)}
<SectionFooter>
<Typography variant="caption">
Register device with <a href={webAuthnUrl}>WebAuthn</a>.
</Typography>
</SectionFooter>
</Stack>
</Paper>
<WebAuthnAuthenticateButton
requestOptions={webAuthnRequestOptions}
csrfToken={csrfToken}
url={webAuthnUrl}
size="small"
/>
</Stack>
</Toolbar>
<Box sx={{ padding: 3, paddingTop: 0 }}>
<DeviceCredentialsTable
csrfToken={csrfToken}
ids={currentSessionDeviceCredentialIds}
webAuthnUrl={webAuthnUrl}
/>
</Box>
</Stack>
</Paper>
{otherDeviceCredentialIds?.length > 0 ? (
<>
<Paper sx={{ overflow: "hidden" }}>
<Stack>
<Toolbar>
<Typography variant="h4" flexGrow={1}>
Other Device Credentials
</Typography>
</Toolbar>
<Box sx={{ padding: 3, paddingTop: 0 }}>
<DeviceCredentialsTable
csrfToken={csrfToken}
ids={otherDeviceCredentialIds}
webAuthnUrl={webAuthnUrl}
/>
</Box>
</Stack>
</Paper>
</>
) : (
<></>
)}
</>
);
};
export default SessionDeviceCredentials;