21621: Add unit test for json copy to clipboard

[arvados.git] / services / workbench2 / src / views / user-profile-panel / user-profile-panel-root.tsx

diff --git a/services/workbench2/src/views/user-profile-panel/user-profile-panel-root.tsx b/services/workbench2/src/views/user-profile-panel/user-profile-panel-root.tsx
index 85eaaf0c985fb6c604e101fb37be4e56f6786fb1..4a2083711efbee0f3d996216609e45441ebc99a1 100644 (file)
--- a/services/workbench2/src/views/user-profile-panel/user-profile-panel-root.tsx
+++ b/services/workbench2/src/views/user-profile-panel/user-profile-panel-root.tsx
@@ -36,7 +36,7 @@ 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: {
@@ -81,6 +81,9 @@ const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
         '& svg': {
             fontSize: '1rem'
         }
+    },
+    userProfileFormMessage: {
+        fontSize: '1.1rem',
     }
 });
 
@@ -97,6 +100,7 @@ export interface UserProfilePanelRootDataProps {
     userUuid: string;
     resources: ResourcesState;
     localCluster: string;
+    userProfileFormMessage: string;
 }
 
 const RoleTypes = [
@@ -165,7 +169,7 @@ export const userProfileGroupsColumns: DataColumns<string, PermissionResource> =
 ];
 
 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}
@@ -184,7 +188,7 @@ export const UserProfilePanelRoot = withStyles(styles)(
         };
 
         componentDidMount() {
-            this.setState({ value: TABS.PROFILE});
+            this.setState({ value: TABS.PROFILE });
         }
 
         render() {
@@ -213,7 +217,7 @@ export const UserProfilePanelRoot = withStyles(styles)(
                                 </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
@@ -261,6 +265,9 @@ export const UserProfilePanelRoot = withStyles(styles)(
                                             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"
@@ -316,19 +323,19 @@ export const UserProfilePanelRoot = withStyles(styles)(
                     {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,
-                                    }}
-                                    defaultViewIcon={GroupsIcon}
-                                    defaultViewMessages={['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 >;
             }