import React, { FC, Fragment } from 'react';
import cx from 'classnames';

import CircularProgress from '@mui/material/CircularProgress';
import { LoadingProps } from "./Loading.types";
import './styles.scss';


export const Loading: FC<LoadingProps> = ({
    overlay,
    show = true,
	full,
	size,
    style,
    className,
    children,
}) => {
	//let showw = show !== false;
	return (
		<Fragment>
			{
				show && !overlay && (
					<Fragment>
						<div
							style={{ ...style }}
							className={cx(
								'',
								full && 'gtc-rc-loading-container',
								overlay && 'gtc-rc-loading-container gtc-rc-loading-overlay',
								className,
							)}
						>
							<CircularProgress className="gtc-rc-loading-spinner" size={size || 40} />
						</div>

						{overlay && !full && children}
					</Fragment>
				)

			}
			{
				overlay &&
				<Fragment>
					{
						show &&
						<div
							style={{ ...style }}
							className={cx(
								'',
								overlay && 'gtc-rc-loading-container gtc-rc-loading-overlay',
								className,
							)}
						>
							<CircularProgress className="gtc-rc-loading-spinner" size={size || 40} />
						</div>
					}
					{
						overlay && !full && children
					}
				</Fragment>
			}
		</Fragment>
	);
};

