1 // Copyright (C) The Arvados Authors. All rights reserved.
3 // SPDX-License-Identifier: AGPL-3.0
5 import * as React from 'react';
7 StyleRulesCallback, WithStyles, withStyles, Card, CardContent, Grid,
8 Table, TableHead, TableRow, TableCell, TableBody, Tooltip, IconButton
9 } from '@material-ui/core';
10 import { ArvadosTheme } from '~/common/custom-theme';
11 import { MoreOptionsIcon, HelpIcon } from '~/components/icon/icon';
12 import { ApiClientAuthorization } from '~/models/api-client-authorization';
13 import { formatDate } from '~/common/formatters';
15 type CssRules = 'root' | 'tableRow' | 'helpIconGrid' | 'tableGrid';
17 const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
26 marginTop: theme.spacing.unit
35 export interface ApiClientAuthorizationPanelRootActionProps {
36 openRowOptions: (event: React.MouseEvent<HTMLElement>, keepService: ApiClientAuthorization) => void;
37 openHelpDialog: () => void;
40 export interface ApiClientAuthorizationPanelRootDataProps {
41 apiClientAuthorizations: ApiClientAuthorization[];
42 hasApiClientAuthorizations: boolean;
45 type ApiClientAuthorizationPanelRootProps = ApiClientAuthorizationPanelRootActionProps
46 & ApiClientAuthorizationPanelRootDataProps & WithStyles<CssRules>;
48 export const ApiClientAuthorizationPanelRoot = withStyles(styles)(
49 ({ classes, hasApiClientAuthorizations, apiClientAuthorizations, openRowOptions, openHelpDialog }: ApiClientAuthorizationPanelRootProps) =>
50 <Card className={classes.root}>
52 {hasApiClientAuthorizations && <Grid container direction="row" justify="flex-end">
53 <Grid item xs={12} className={classes.helpIconGrid}>
54 <Tooltip title="Api token - help">
55 <IconButton onClick={openHelpDialog}>
63 <TableRow className={classes.tableRow}>
64 <TableCell>UUID</TableCell>
65 <TableCell>API Client ID</TableCell>
66 <TableCell>API Token</TableCell>
67 <TableCell>Created by IP address</TableCell>
68 <TableCell>Default owner</TableCell>
69 <TableCell>Expires at</TableCell>
70 <TableCell>Last used at</TableCell>
71 <TableCell>Last used by IP address</TableCell>
72 <TableCell>Scopes</TableCell>
73 <TableCell>User ID</TableCell>
78 {apiClientAuthorizations.map((apiClientAuthorizatio, index) =>
79 <TableRow key={index} className={classes.tableRow}>
80 <TableCell>{apiClientAuthorizatio.uuid}</TableCell>
81 <TableCell>{apiClientAuthorizatio.apiClientId}</TableCell>
82 <TableCell>{apiClientAuthorizatio.apiToken}</TableCell>
83 <TableCell>{apiClientAuthorizatio.createdByIpAddress || '(none)'}</TableCell>
84 <TableCell>{apiClientAuthorizatio.defaultOwnerUuid || '(none)'}</TableCell>
85 <TableCell>{formatDate(apiClientAuthorizatio.expiresAt) || '(none)'}</TableCell>
86 <TableCell>{formatDate(apiClientAuthorizatio.lastUsedAt) || '(none)'}</TableCell>
87 <TableCell>{apiClientAuthorizatio.lastUsedByIpAddress || '(none)'}</TableCell>
88 <TableCell>{JSON.stringify(apiClientAuthorizatio.scopes)}</TableCell>
89 <TableCell>{apiClientAuthorizatio.userId}</TableCell>
91 <Tooltip title="More options" disableFocusListener>
92 <IconButton onClick={event => openRowOptions(event, apiClientAuthorizatio)}>