import { React, PropTypes } from '@gravityforms/libraries';
import { RingLoader } from '../modules/Loaders';

/**
 * @module PageLoader
 * @description Represents a component that displays a loading spinner.
 *
 * @since 4.1.5
 *
 * @param {object}  props         The options for the PageLoader component.
 * @param {boolean} props.loading Determines if the spinner is shown or not.
 *
 * @return {JSX.Element|null}  The JSX element of the PageLoader component.
 */
const PageLoader = ( {
	loading = true,
} ) => {
	return loading ? (
		<RingLoader
			foreground="rgb(144, 146, 178)"
			lineWeight={ 4 }
			loaderCustomAttributes={ {
				mask: true,
				maskCustomClasses: [ 'gravitysmtp-page-loader__mask', 'gform-loader__mask--position-center' ],
			} }
			size={ 64 }
			loading={ true }
		/>
	) : null;
};

PageLoader.propTypes = {
	loading: PropTypes.bool,
};

export default PageLoader;
