1 // Copyright (C) The Arvados Authors. All rights reserved.
3 // SPDX-License-Identifier: AGPL-3.0
5 import * as React from 'react';
6 import { Dispatch } from 'redux';
7 import { connect } from 'react-redux';
8 import { startLinking } from '~/store/link-account-panel/link-account-panel-actions';
9 import { Grid, Typography, Button } from '@material-ui/core';
10 import { StyleRulesCallback, WithStyles, withStyles } from '@material-ui/core/styles';
11 import { ArvadosTheme } from '~/common/custom-theme';
12 import { LinkAccountType } from '~/models/link-account';
15 type CssRules = 'root' | 'ontop' | 'title';
17 const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
20 backgroundColor: theme.palette.grey["200"],
28 background: 'url("arvados-logo-big.png") no-repeat center center',
36 marginBottom: theme.spacing.unit * 6,
37 color: theme.palette.grey["800"]
41 export interface InactivePanelActionProps {
42 startLinking: () => void;
45 const mapDispatchToProps = (dispatch: Dispatch): InactivePanelActionProps => ({
46 startLinking: () => dispatch<any>(startLinking(LinkAccountType.ACCESS_OTHER_ACCOUNT))
49 type InactivePanelProps = WithStyles<CssRules> & InactivePanelActionProps;
51 export const InactivePanel = connect(null, mapDispatchToProps)(withStyles(styles)((({ classes, startLinking }: InactivePanelProps) =>
52 <Grid container justify="center" alignItems="center" direction="column" spacing={24}
53 className={classes.root}
54 style={{ marginTop: 56, height: "100%" }}>
56 <Typography variant='h6' align="center" className={classes.title}>
57 Hi! You're logged in, but...
61 <Typography align="center">
62 Your account is inactive. An administrator must activate your account before you can get any further.
66 <Typography align="center">
67 If you would like to use this login to access another account click "Link Account".
71 <Button className={classes.ontop} color="primary" variant="contained" onClick={() => startLinking()}>