services/workbench2/src/views/api-client-authorization-panel/api-client-authorization-panel-root.tsx

   1 // Copyright (C) The Arvados Authors. All rights reserved.
   2 //
   3 // SPDX-License-Identifier: AGPL-3.0
   4
   5 import React from 'react';
   6 import {
   7     StyleRulesCallback, WithStyles, withStyles
   8 } from '@material-ui/core';
   9 import { ArvadosTheme } from 'common/custom-theme';
  10 import { ShareMeIcon } from 'components/icon/icon';
  11 import { createTree } from 'models/tree';
  12 import { DataColumns } from 'components/data-table/data-table';
  13 import { SortDirection } from 'components/data-table/data-column';
  14 import { API_CLIENT_AUTHORIZATION_PANEL_ID } from '../../store/api-client-authorizations/api-client-authorizations-actions';
  15 import { DataExplorer } from 'views-components/data-explorer/data-explorer';
  16 import { ResourcesState } from 'store/resources/resources';
  17 import {
  18     CommonUuid, TokenApiClientId, TokenApiToken, TokenCreatedByIpAddress, TokenExpiresAt,
  19     TokenLastUsedAt, TokenLastUsedByIpAddress, TokenScopes, TokenUserId
  20 } from 'views-components/data-explorer/renderers';
  21 import { ApiClientAuthorization } from 'models/api-client-authorization';
  22
  23 type CssRules = 'root';
  24
  25 const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
  26     root: {
  27         width: '100%',
  28     }
  29 });
  30
  31
  32 export enum ApiClientAuthorizationPanelColumnNames {
  33     UUID = 'UUID',
  34     API_CLIENT_ID = 'API Client ID',
  35     API_TOKEN = 'API Token',
  36     CREATED_BY_IP_ADDRESS = 'Created by IP address',
  37     EXPIRES_AT = 'Expires at',
  38     LAST_USED_AT = 'Last used at',
  39     LAST_USED_BY_IP_ADDRESS = 'Last used by IP address',
  40     SCOPES = 'Scopes',
  41     USER_ID = 'User ID'
  42 }
  43
  44 export const apiClientAuthorizationPanelColumns: DataColumns<string, ApiClientAuthorization> = [
  45     {
  46         name: ApiClientAuthorizationPanelColumnNames.UUID,
  47         selected: true,
  48         configurable: true,
  49         sort: {direction: SortDirection.NONE, field: "uuid"},
  50         filters: createTree(),
  51         render: uuid => <CommonUuid uuid={uuid} />
  52     },
  53     {
  54         name: ApiClientAuthorizationPanelColumnNames.API_CLIENT_ID,
  55         selected: true,
  56         configurable: true,
  57         filters: createTree(),
  58         render: uuid => <TokenApiClientId uuid={uuid} />
  59     },
  60     {
  61         name: ApiClientAuthorizationPanelColumnNames.API_TOKEN,
  62         selected: true,
  63         configurable: true,
  64         filters: createTree(),
  65         render: uuid => <TokenApiToken uuid={uuid} />
  66     },
  67     {
  68         name: ApiClientAuthorizationPanelColumnNames.CREATED_BY_IP_ADDRESS,
  69         selected: true,
  70         configurable: true,
  71         filters: createTree(),
  72         render: uuid => <TokenCreatedByIpAddress uuid={uuid} />
  73     },
  74     {
  75         name: ApiClientAuthorizationPanelColumnNames.EXPIRES_AT,
  76         selected: true,
  77         configurable: true,
  78         filters: createTree(),
  79         render: uuid => <TokenExpiresAt uuid={uuid} />
  80     },
  81     {
  82         name: ApiClientAuthorizationPanelColumnNames.LAST_USED_AT,
  83         selected: true,
  84         configurable: true,
  85         filters: createTree(),
  86         render: uuid => <TokenLastUsedAt uuid={uuid} />
  87     },
  88     {
  89         name: ApiClientAuthorizationPanelColumnNames.LAST_USED_BY_IP_ADDRESS,
  90         selected: true,
  91         configurable: true,
  92         filters: createTree(),
  93         render: uuid => <TokenLastUsedByIpAddress uuid={uuid} />
  94     },
  95     {
  96         name: ApiClientAuthorizationPanelColumnNames.SCOPES,
  97         selected: true,
  98         configurable: true,
  99         filters: createTree(),
 100         render: uuid => <TokenScopes uuid={uuid} />
 101     },
 102     {
 103         name: ApiClientAuthorizationPanelColumnNames.USER_ID,
 104         selected: true,
 105         configurable: true,
 106         filters: createTree(),
 107         render: uuid => <TokenUserId uuid={uuid} />
 108     }
 109 ];
 110
 111 const DEFAULT_MESSAGE = 'Your api client authorization list is empty.';
 112
 113 export interface ApiClientAuthorizationPanelRootActionProps {
 114     onItemClick: (item: string) => void;
 115     onContextMenu: (event: React.MouseEvent<HTMLElement>, item: string) => void;
 116     onItemDoubleClick: (item: string) => void;
 117 }
 118
 119 export interface ApiClientAuthorizationPanelRootDataProps {
 120     resources: ResourcesState;
 121 }
 122
 123 type ApiClientAuthorizationPanelRootProps = ApiClientAuthorizationPanelRootActionProps
 124     & ApiClientAuthorizationPanelRootDataProps & WithStyles<CssRules>;
 125
 126 export const ApiClientAuthorizationPanelRoot = withStyles(styles)(
 127     ({ classes, onItemDoubleClick, onItemClick, onContextMenu }: ApiClientAuthorizationPanelRootProps) =>
 128         <div className={classes.root}><DataExplorer
 129             id={API_CLIENT_AUTHORIZATION_PANEL_ID}
 130             onRowClick={onItemClick}
 131             onRowDoubleClick={onItemDoubleClick}
 132             onContextMenu={onContextMenu}
 133             contextMenuColumn={true}
 134             hideColumnSelector
 135             hideSearchInput
 136             defaultViewIcon={ShareMeIcon}
 137             defaultViewMessages={[DEFAULT_MESSAGE]} />
 138         </div>
 139 );