Doodle3D-Transform/src/js/components/BlockingSpinner.js

35 lines
865 B
JavaScript

import React from 'react';
import PropTypes from 'prop-types';
import injectSheet from 'react-jss';
import CircularProgress from 'material-ui/CircularProgress';
import { connect } from 'react-redux';
const styles = {
container: {
position: 'absolute',
backgroundColor: 'rgba(0, 0, 0, 0.5)',
bottom: 0,
top: 0,
right: 0,
left: 0,
display: 'flex',
justifyContent: 'center',
alignItems: 'center',
zIndex: 997
}
};
const BlockingSpinner = ({ classes, active }) => (active ? (
<div className={classes.container}>
<CircularProgress size={60} thickness={5} color="white"/>
</div>
) : null);
BlockingSpinner.propTypes = {
classes: PropTypes.object.isRequired,
active: PropTypes.bool.isRequired
};
export default connect(state => ({
active: state.blockingSpinner.active
}))(injectSheet(styles)(BlockingSpinner));