import { Grid, Typography, FormControlLabel, Checkbox } from '@mui/material';
import DESCRIPTIONS from '../constants/descriptions';

const InsideDelivery = ({ state = {}, handleChange = (name = '', val = '') => {} }) => {
	return (
		<Grid container spacing={1} flex mt={3} mb={3}>
			<Grid item flex={1} xs={4}>
				<Typography variant='subtitle1' fontWeight='bold'>
					Inside delivery settings
				</Typography>
				<p>
					<strong>Offer inside delivery as an option</strong> -{' '}
					{DESCRIPTIONS.offer_inside}
				</p>
			</Grid>

			<Grid item flex={2} xs={8} mt={2}>
				<FormControlLabel
					control={
						<Checkbox
							checked={state?.offer_inside_as_option || false}
							onChange={e => {
								handleChange('offer_inside_as_option', e.target.checked);
							}}
						/>
					}
					label='Offer inside delivery as an option'
					title='Offer inside delivery as an option'
				/>
			</Grid>
		</Grid>
	);
};

export default InsideDelivery;