fix: lint

pull/4372/head
James Elliott 2022-11-13 10:18:57 +11:00
parent 9b66bb4fe2
commit bbc9e6422e
No known key found for this signature in database
GPG Key ID: 0F1C4A096E857E49
5 changed files with 120 additions and 66 deletions

View File

@ -131,17 +131,17 @@ export interface AssertionPublicKeyCredentialResultJSON {
}
export interface WebauthnDevice {
id: string;
created_at: Date;
last_used_at?: Date;
rpid: string;
username: string;
description: string;
kid: string;
public_key: Uint8Array;
attestation_type: string;
transport: string;
aaguid: string;
sign_count: number;
clone_warning: boolean;
id: string;
created_at: Date;
last_used_at?: Date;
rpid: string;
username: string;
description: string;
kid: string;
public_key: Uint8Array;
attestation_type: string;
transport: string;
aaguid: string;
sign_count: number;
clone_warning: boolean;
}

View File

@ -1,9 +1,9 @@
import { WebauthnDevice } from "@root/models/Webauthn";
import { WebauthnDevicesPath } from "./Api";
import { Get } from "./Client";
// getWebauthnDevices returns the list of webauthn devices for the authenticated user.
export async function getWebauthnDevices(): Promise<WebauthnDevice[]> {
return Get<WebauthnDevice[]>(WebauthnDevicesPath);
}
}

View File

@ -1,28 +1,36 @@
import { Button, Dialog, DialogActions, DialogContent, DialogContentText, DialogProps, DialogTitle, TextField } from "@mui/material";
import React from "react";
interface Props extends DialogProps {};
import {
Button,
Dialog,
DialogActions,
DialogContent,
DialogContentText,
DialogProps,
DialogTitle,
TextField,
} from "@mui/material";
interface Props extends DialogProps {}
export default function AddSecurityKeyDialog(props: Props) {
const handleAddClick = () => {
if (props.onClose) {
props.onClose({}, "backdropClick");
}
}
};
const handleCancelClick = () => {
if (props.onClose) {
props.onClose({}, "backdropClick");
}
}
};
return (
<Dialog {...props}>
<DialogTitle>Add new Security Key</DialogTitle>
<DialogContent>
<DialogContentText>
Provide the details for the new security key.
</DialogContentText>
<DialogContentText>Provide the details for the new security key.</DialogContentText>
<TextField
autoFocus
margin="dense"
@ -39,4 +47,4 @@ export default function AddSecurityKeyDialog(props: Props) {
</DialogActions>
</Dialog>
);
}
}

View File

@ -1,11 +1,36 @@
import React, { useEffect, useState } from "react";
import { AppBar, Box, Button, Drawer, Grid, IconButton, List, ListItem, ListItemButton, ListItemIcon, ListItemText, Paper, Stack, Switch, Table, TableBody, TableCell, TableHead, TableRow, Toolbar, Tooltip, Typography } from "@mui/material";
import SystemSecurityUpdateGoodIcon from '@mui/icons-material/SystemSecurityUpdateGood';
import DeleteIcon from '@mui/icons-material/Delete';
import EditIcon from '@mui/icons-material/Edit';
import { getWebauthnDevices } from "@root/services/UserWebauthnDevices";
import DeleteIcon from "@mui/icons-material/Delete";
import EditIcon from "@mui/icons-material/Edit";
import SystemSecurityUpdateGoodIcon from "@mui/icons-material/SystemSecurityUpdateGood";
import {
AppBar,
Box,
Button,
Drawer,
Grid,
IconButton,
List,
ListItem,
ListItemButton,
ListItemIcon,
ListItemText,
Paper,
Stack,
Switch,
Table,
TableBody,
TableCell,
TableHead,
TableRow,
Toolbar,
Tooltip,
Typography,
} from "@mui/material";
import { WebauthnDevice } from "@root/models/Webauthn";
import { getWebauthnDevices } from "@root/services/UserWebauthnDevices";
import AddSecurityKeyDialog from "./AddSecurityDialog";
interface Props {}
@ -17,22 +42,22 @@ export default function SettingsView(props: Props) {
const [addKeyOpen, setAddKeyOpen] = useState<boolean>(false);
useEffect(() => {
(async function() {
(async function () {
const devices = await getWebauthnDevices();
setWebauthnDevices(devices);
})()
})();
}, []);
const handleKeyClose = () => {
setAddKeyOpen(false);
}
};
const handleAddKeyButtonClick = () => {
setAddKeyOpen(true);
}
};
return (
<Box sx={{ display: 'flex' }}>
<Box sx={{ display: "flex" }}>
<AppBar position="fixed" sx={{ zIndex: (theme) => theme.zIndex.drawer + 1 }}>
<Toolbar variant="dense">
<Typography style={{ flexGrow: 1 }}>Settings</Typography>
@ -41,13 +66,13 @@ export default function SettingsView(props: Props) {
<Drawer
variant="permanent"
sx={{
width: drawerWidth,
flexShrink: 0,
[`& .MuiDrawer-paper`]: { width: drawerWidth, boxSizing: 'border-box' },
width: drawerWidth,
flexShrink: 0,
[`& .MuiDrawer-paper`]: { width: drawerWidth, boxSizing: "border-box" },
}}
>
<Toolbar variant="dense" />
<Box sx={{ overflow: 'auto' }}>
<Box sx={{ overflow: "auto" }}>
<List>
<ListItem disablePadding>
<ListItemButton selected={true}>
@ -67,7 +92,9 @@ export default function SettingsView(props: Props) {
</Grid>
<Grid item xs={12}>
<Stack spacing={1} direction="row">
<Button color="primary" variant="contained" onClick={handleAddKeyButtonClick}>Add</Button>
<Button color="primary" variant="contained" onClick={handleAddKeyButtonClick}>
Add
</Button>
</Stack>
</Grid>
<Grid item xs={12}>
@ -79,36 +106,48 @@ export default function SettingsView(props: Props) {
<TableCell>Enabled</TableCell>
<TableCell>Activation</TableCell>
<TableCell>Public Key</TableCell>
<TableCell>Actions</TableCell>
<TableCell>Actions</TableCell>
</TableRow>
</TableHead>
<TableBody>
{webauthnDevices ? webauthnDevices.map((x, idx) => {
return (
<TableRow key={x.description}>
<TableCell>{x.description}</TableCell>
<TableCell><Switch defaultChecked={false} size="small" /></TableCell>
<TableCell><Typography>{(false) ? "<ADATE>" : "Not enabled"}</Typography></TableCell>
<TableCell>
<Tooltip title={x.public_key}>
<div style={{overflow: "hidden", textOverflow: "ellipsis", width: '300px'}}>
<Typography noWrap>{x.public_key}</Typography>
</div>
</Tooltip>
</TableCell>
<TableCell>
<Stack direction="row" spacing={1}>
<IconButton aria-label="edit">
<EditIcon />
</IconButton>
<IconButton aria-label="delete">
<DeleteIcon />
</IconButton>
</Stack>
</TableCell>
</TableRow>
)
}) : null}
{webauthnDevices
? webauthnDevices.map((x, idx) => {
return (
<TableRow key={x.description}>
<TableCell>{x.description}</TableCell>
<TableCell>
<Switch defaultChecked={false} size="small" />
</TableCell>
<TableCell>
<Typography>{false ? "<ADATE>" : "Not enabled"}</Typography>
</TableCell>
<TableCell>
<Tooltip title={x.public_key}>
<div
style={{
overflow: "hidden",
textOverflow: "ellipsis",
width: "300px",
}}
>
<Typography noWrap>{x.public_key}</Typography>
</div>
</Tooltip>
</TableCell>
<TableCell>
<Stack direction="row" spacing={1}>
<IconButton aria-label="edit">
<EditIcon />
</IconButton>
<IconButton aria-label="delete">
<DeleteIcon />
</IconButton>
</Stack>
</TableCell>
</TableRow>
);
})
: null}
</TableBody>
</Table>
</Paper>

View File

@ -58,6 +58,13 @@ export default defineConfig(({ mode }) => {
port: 3000,
open: false,
},
plugins: [/* eslintPlugin({ cache: false }) */, htmlPlugin(), istanbulPlugin, react(), svgr(), tsconfigPaths()],
plugins: [
,
/* eslintPlugin({ cache: false }) */ htmlPlugin(),
istanbulPlugin,
react(),
svgr(),
tsconfigPaths(),
],
};
});