IconButton,
} from '@material-ui/core';
import { ArvadosTheme } from 'common/custom-theme';
-import { DataTableDefaultView } from 'components/data-table-default-view/data-table-default-view';
import { PROFILE_EMAIL_VALIDATION, PROFILE_URL_VALIDATION } from "validators/validators";
import { USER_PROFILE_PANEL_ID } from 'store/user-profile/user-profile-actions';
import { noop } from 'lodash';
-import { DetailsIcon, GroupsIcon, MoreOptionsIcon } from 'components/icon/icon';
+import { DetailsIcon, GroupsIcon, MoreVerticalIcon } from 'components/icon/icon';
import { DataColumns } from 'components/data-table/data-table';
import { ResourceLinkHeadUuid, ResourceLinkHeadPermissionLevel, ResourceLinkHead, ResourceLinkDelete, ResourceLinkTailIsVisible, UserResourceAccountStatus } from 'views-components/data-explorer/renderers';
import { createTree } from 'models/tree';
import { getResource, ResourcesState } from 'store/resources/resources';
import { DefaultView } from 'components/default-view/default-view';
import { CopyToClipboardSnackbar } from 'components/copy-to-clipboard-snackbar/copy-to-clipboard-snackbar';
+import { PermissionResource } from 'models/permission';
-type CssRules = 'root' | 'emptyRoot' | 'gridItem' | 'label' | 'readOnlyValue' | 'title' | 'description' | 'actions' | 'content' | 'copyIcon';
+type CssRules = 'root' | 'emptyRoot' | 'gridItem' | 'label' | 'readOnlyValue' | 'title' | 'description' | 'actions' | 'content' | 'copyIcon' | 'userProfileFormMessage';
const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
root: {
'& svg': {
fontSize: '1rem'
}
+ },
+ userProfileFormMessage: {
+ fontSize: '1.1rem',
}
});
userUuid: string;
resources: ResourcesState;
localCluster: string;
+ userProfileFormMessage: string;
}
const RoleTypes = [
}
-export const userProfileGroupsColumns: DataColumns<string> = [
+export const userProfileGroupsColumns: DataColumns<string, PermissionResource> = [
{
name: UserProfileGroupsColumnNames.NAME,
selected: true,
];
const ReadOnlyField = withStyles(styles)(
- (props: ({ label: string, input: {value: string} }) & WithStyles<CssRules> ) => (
+ (props: ({ label: string, input: { value: string } }) & WithStyles<CssRules>) => (
<Grid item xs={12} data-cy="field">
<Typography className={props.classes.label}>
{props.label}
};
componentDidMount() {
- this.setState({ value: TABS.PROFILE});
+ this.setState({ value: TABS.PROFILE });
}
render() {
</Grid>
<Grid item>
<Grid container alignItems="center">
- <Grid item style={{marginRight: '10px'}}><UserResourceAccountStatus uuid={this.props.userUuid} /></Grid>
+ <Grid item style={{ marginRight: '10px' }}><UserResourceAccountStatus uuid={this.props.userUuid} /></Grid>
<Grid item>
<Tooltip title="Actions" disableFocusListener>
<IconButton
data-cy='user-profile-panel-options-btn'
aria-label="Actions"
onClick={(event) => this.handleContextMenu(event, this.props.userUuid)}>
- <MoreOptionsIcon />
+ <MoreVerticalIcon />
</IconButton>
</Tooltip>
</Grid>
disabled
/>
</Grid>
+ <Grid item className={this.props.classes.gridItem} xs={12}>
+ <span className={this.props.classes.userProfileFormMessage}>{this.props.userProfileFormMessage}</span>
+ </Grid>
<Grid item className={this.props.classes.gridItem} sm={6} xs={12}>
<Field
label="Organization"
{this.state.value === TABS.GROUPS &&
<div className={this.props.classes.content}>
<DataExplorer
- id={USER_PROFILE_PANEL_ID}
- data-cy="user-profile-groups-data-explorer"
- onRowClick={noop}
- onRowDoubleClick={noop}
- onContextMenu={noop}
- contextMenuColumn={false}
- hideColumnSelector
- hideSearchInput
- paperProps={{
- elevation: 0,
- }}
- dataTableDefaultView={
- <DataTableDefaultView
- icon={GroupsIcon}
- messages={['Group list is empty.']} />
- } />
+ id={USER_PROFILE_PANEL_ID}
+ data-cy="user-profile-groups-data-explorer"
+ onRowClick={noop}
+ onRowDoubleClick={noop}
+ onContextMenu={noop}
+ contextMenuColumn={false}
+ hideColumnSelector
+ hideSearchInput
+ paperProps={{
+ elevation: 0,
+ }}
+ defaultViewIcon={GroupsIcon}
+ defaultViewMessages={['Group list is empty.']} />
</div>}
</Paper >;
}