15736: Add uuid column to site manager page

[arvados-workbench2.git] / src / views / site-manager-panel / site-manager-panel-root.tsx

diff --git a/src/views/site-manager-panel/site-manager-panel-root.tsx b/src/views/site-manager-panel/site-manager-panel-root.tsx
index 303995b8d2ea09265b4def5507c29587ca04022d..a8f7439a012b8c6c03f2e6f214cb594b53addf36 100644 (file)
--- a/src/views/site-manager-panel/site-manager-panel-root.tsx
+++ b/src/views/site-manager-panel/site-manager-panel-root.tsx
@@ -26,6 +26,8 @@ import { Field, FormErrors, InjectedFormProps, reduxForm, reset, stopSubmit } fr
 import { TextField } from "~/components/text-field/text-field";
 import { addSession } from "~/store/auth/auth-action-session";
 import { SITE_MANAGER_REMOTE_HOST_VALIDATION } from "~/validators/validators";
+import { Config } from '~/common/config';
+import { ResourceCluster } from '~/views-components/data-explorer/renderers';
 
 type CssRules = 'root' | 'link' | 'buttonContainer' | 'table' | 'tableRow' |
     'remoteSiteInfo' | 'buttonAdd' | 'buttonLoggedIn' | 'buttonLoggedOut' |
@@ -88,6 +90,7 @@ export interface SiteManagerPanelRootActionProps {
 
 export interface SiteManagerPanelRootDataProps {
     sessions: Session[];
+    remoteHostsConfig: { [key: string]: Config };
 }
 
 type SiteManagerPanelRootProps = SiteManagerPanelRootDataProps & SiteManagerPanelRootActionProps & WithStyles<CssRules> & InjectedFormProps;
@@ -114,14 +117,14 @@ export const SiteManagerPanelRoot = compose(
         }
     }),
     withStyles(styles))
-    (({ classes, sessions, handleSubmit, toggleSession }: SiteManagerPanelRootProps) =>
+    (({ classes, sessions, handleSubmit, toggleSession, remoteHostsConfig }: SiteManagerPanelRootProps) =>
         <Card className={classes.root}>
             <CardContent>
                 <Grid container direction="row">
                     <Grid item xs={12}>
                         <Typography paragraph={true} >
                             You can log in to multiple Arvados sites here, then use the multi-site search page to search collections and projects on all sites at once.
-                    </Typography>
+                   </Typography>
                     </Grid>
                 </Grid>
                 <Grid item xs={12}>
@@ -130,8 +133,8 @@ export const SiteManagerPanelRoot = compose(
                             <TableRow className={classes.tableRow}>
                                 <TableCell>Cluster ID</TableCell>
                                 <TableCell>Host</TableCell>
-                                <TableCell>Username</TableCell>
                                 <TableCell>Email</TableCell>
+                                <TableCell>UUID</TableCell>
                                 <TableCell>Status</TableCell>
                             </TableRow>
                         </TableHead>
@@ -139,10 +142,12 @@ export const SiteManagerPanelRoot = compose(
                             {sessions.map((session, index) => {
                                 const validating = session.status === SessionStatus.BEING_VALIDATED;
                                 return <TableRow key={index} className={classes.tableRow}>
-                                    <TableCell>{session.clusterId}</TableCell>
+                                    <TableCell>{remoteHostsConfig[session.clusterId] ?
+                                        <a href={remoteHostsConfig[session.clusterId].workbench2Url} style={{ textDecoration: 'none' }}> <ResourceCluster uuid={session.clusterId} /></a>
+                                        : session.clusterId}</TableCell>
                                     <TableCell>{session.remoteHost}</TableCell>
-                                    <TableCell>{validating ? <CircularProgress size={20} /> : session.username}</TableCell>
                                     <TableCell>{validating ? <CircularProgress size={20} /> : session.email}</TableCell>
+                                    <TableCell>{validating ? <CircularProgress size={20} /> : session.uuid}</TableCell>
                                     <TableCell className={classes.statusCell}>
                                         <Button fullWidth
                                             disabled={validating || session.status === SessionStatus.INVALIDATED || session.active}
@@ -161,7 +166,7 @@ export const SiteManagerPanelRoot = compose(
                         <Grid item xs={12}>
                             <Typography paragraph={true} className={classes.remoteSiteInfo}>
                                 To add a remote Arvados site, paste the remote site's host here (see "ARVADOS_API_HOST" on the "current token" page).
-                            </Typography>
+                        </Typography>
                         </Grid>
                         <Grid item xs={8}>
                             <Field