+
+ renderContent() {
+ const { classes, onCloseDrawer, res, tabNr, authConfig } = this.props;
+
+ let shouldShowInlinePreview = false;
+ if (!('kind' in res)) {
+ shouldShowInlinePreview = isInlineFileUrlSafe(
+ res ? res.url : "",
+ authConfig.keepWebServiceUrl,
+ authConfig.keepWebInlineServiceUrl
+ ) || authConfig.clusterConfig.Collections.TrustAllContent;
+ }
+
+ const item = getItem(res);
+ return <Grid
+ data-cy='details-panel'
+ container
+ direction="column"
+ item
+ xs
+ className={classes.container} >
+ <Grid
+ item
+ className={classes.headerContainer}
+ container
+ alignItems='center'
+ justify='space-around'
+ wrap="nowrap">
+ <Grid item xs={2}>
+ {item.getIcon(classes.headerIcon)}
+ </Grid>
+ <Grid item xs={8}>
+ <Tooltip title={item.getTitle()}>
+ <Typography variant='h6' noWrap>
+ {item.getTitle()}
+ </Typography>
+ </Tooltip>
+ </Grid>
+ <Grid item>
+ <IconButton color="inherit" onClick={onCloseDrawer}>
+ <CloseIcon />
+ </IconButton>
+ </Grid>
+ </Grid>
+ <Grid item>
+ <Tabs onChange={this.handleChange}
+ value={(item.getTabLabels().length >= tabNr+1) ? tabNr : 0}>
+ { item.getTabLabels().map((tabLabel, idx) =>
+ <Tab key={`tab-label-${idx}`} disableRipple label={tabLabel} />)
+ }
+ </Tabs>
+ </Grid>
+ <Grid item xs className={this.props.classes.tabContainer} >
+ {item.getDetails({tabNr, showPreview: shouldShowInlinePreview})}
+ </Grid>
+ </Grid >;
+ }