import { Grid, Typography, FormControlLabel, Checkbox, FormHelperText, Box } from '@mui/material';
import DESCRIPTIONS from '../constants/descriptions';
import { useSelector } from 'react-redux';

const LiftgateDelivery = ({ state = {}, handleChange = (name = '', val = '') => {} }) => {
	const settings = useSelector(state => state.globalSettings);
	const enabled = value => [true, 1, '1', 'true', 'yes', 'on'].includes(value);
	const automaticDetectionUnavailable = enabled(settings?.suspend_rad_use) || enabled(settings?.always_quote_residential_delivery);

	return (
		<Grid container spacing={1} flex mt={3} mb={3}>
			<Grid item flex={1} xs={4}>
				<Typography variant='subtitle1' fontWeight='bold'>
					Lift gate settings
				</Typography>
				<p>
					<strong>Always quote lift gate delivery</strong> -{' '}
					{DESCRIPTIONS.quote_lift_gate}
				</p>
				<p>
					<strong>Offer lift gate delivery as an option</strong> -{' '}
					{DESCRIPTIONS.offer_lift_gate}
				</p>
				<p>
					<strong>
						Always include lift gate delivery when a residential address is detected
					</strong>{' '}
					- {DESCRIPTIONS.always_quote_lift_gate_when_residential}
				</p>
			</Grid>

			<Grid item flex={2} xs={8} mt={2}>
				<Box>
					<FormControlLabel
						control={
							<Checkbox
								checked={state?.always_quote_liftgate_delivery || false}
								onChange={e => {
									handleChange(
										'always_quote_liftgate_delivery',
										e.target.checked
									);
									handleChange('offer_liftgate_as_option', false);
									handleChange('auto_detected_residential_addresses_Lfg', false);
								}}
							/>
						}
						label='Always quote lift gate delivery'
						title='Always quote lift gate delivery'
					/>
				</Box>
				<Box>
					<FormControlLabel
						control={
							<Checkbox
								checked={state?.offer_liftgate_as_option || false}
								onChange={e => {
									handleChange('offer_liftgate_as_option', e.target.checked);
									handleChange('always_quote_liftgate_delivery', false);
								}}
							/>
						}
						label='Offer lift gate delivery as an option'
						title='Offer lift gate delivery as an option'
					/>
				</Box>

				<FormControlLabel
					control={
						<Checkbox
							checked={state?.auto_detected_residential_addresses_Lfg || false}
							onChange={e => {
								handleChange(
									'auto_detected_residential_addresses_Lfg',
									e.target.checked
								);
								handleChange('always_quote_liftgate_delivery', false);
							}}
							disabled={automaticDetectionUnavailable}
						/>
					}
					label='Always include lift gate delivery when a residential address is detected'
					title='Always include lift gate delivery when a residential address is detected'
				/>

				{automaticDetectionUnavailable && (
					<Box ml={3}>
						<FormHelperText sx={{ color: 'error.main' }}>
							This option requires automatic residential address detection. Turn off
							“Always quote residential delivery” and enable address detection to use it.
						</FormHelperText>
					</Box>
				)}
			</Grid>
		</Grid>
	);
};

export default LiftgateDelivery;