//
// SPDX-License-Identifier: AGPL-3.0
-import * as React from 'react';
+import React from 'react';
import { Dispatch } from 'redux';
import { connect } from 'react-redux';
import { Grid, Typography, Button } from '@material-ui/core';
import { StyleRulesCallback, WithStyles, withStyles } from '@material-ui/core/styles';
-import { ArvadosTheme } from '~/common/custom-theme';
-import { navigateToLinkAccount } from '~/store/navigation/navigation-action';
-import { RootState } from '~/store/store';
+import { ArvadosTheme } from 'common/custom-theme';
+import { navigateToLinkAccount } from 'store/navigation/navigation-action';
+import { RootState } from 'store/store';
+import { sanitizeHTML } from 'common/html-sanitize';
-type CssRules = 'root' | 'ontop' | 'title';
+export type CssRules = 'root' | 'ontop' | 'title';
const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
root: {
position: 'relative',
backgroundColor: theme.palette.grey["200"],
- '&::after': {
- content: `''`,
- position: 'absolute',
- top: 0,
- left: 0,
- bottom: 0,
- right: 0,
- background: 'url("arvados-logo-big.png") no-repeat center center',
- opacity: 0.2,
- }
+ background: 'url("arvados-logo-big.png") no-repeat center center',
+ backgroundBlendMode: 'soft-light',
},
ontop: {
zIndex: 10
}
});
+const mapStateToProps = (state: RootState): InactivePanelStateProps => ({
+ inactivePageText: state.auth.config.clusterConfig.Workbench.InactivePageHTML,
+ isLoginClusterFederation: state.auth.config.clusterConfig.Login.LoginCluster !== '',
+});
+
export interface InactivePanelStateProps {
inactivePageText: string;
+ isLoginClusterFederation: boolean;
}
type InactivePanelProps = WithStyles<CssRules> & InactivePanelActionProps & InactivePanelStateProps;
-export const InactivePanel = connect((state: RootState) => ({
- inactivePageText: state.auth.config.clusterConfig.Workbench.InactivePageHTML
-}), mapDispatchToProps)(withStyles(styles)((({ classes, startLinking, inactivePageText }: InactivePanelProps) =>
+export const InactivePanelRoot = ({ classes, startLinking, inactivePageText, isLoginClusterFederation }: InactivePanelProps) =>
<Grid container justify="center" alignItems="center" direction="column" spacing={24}
className={classes.root}
style={{ marginTop: 56, height: "100%" }}>
<Grid item>
<Typography>
- <div dangerouslySetInnerHTML={{ __html: inactivePageText }} style={{ margin: "1em" }} />
+ <span dangerouslySetInnerHTML={{ __html: sanitizeHTML(inactivePageText) }} style={{ margin: "1em" }} />
</Typography>
</Grid>
- <Grid item>
+ { !isLoginClusterFederation
+ ? <><Grid item>
<Typography align="center">
- If you would like to use this login to access another account click "Link Account".
- </Typography>
+ If you would like to use this login to access another account click "Link Account".
+ </Typography>
</Grid>
<Grid item>
<Button className={classes.ontop} color="primary" variant="contained" onClick={() => startLinking()}>
Link Account
- </Button>
- </Grid>
- </Grid >
-)));
+ </Button>
+ </Grid></>
+ : <><Grid item>
+ <Typography align="center">
+ If you would like to use this login to access another account, please contact your administrator.
+ </Typography>
+ </Grid></> }
+ </Grid >;
+
+export const InactivePanel = connect(mapStateToProps, mapDispatchToProps)(
+ withStyles(styles)(InactivePanelRoot));