import { ModalComponent } from './index';
import { MODAL_TYPES } from '../constants/constants';
import { Carriers } from '../pages';
import { useDispatch, useSelector } from 'react-redux';
import {
	dispatchAlert,
	useSaveActiveCarriersMutation,
	useGetCarriersMutation,
} from '../redux/Actions/ProvidersAction';
import { setAlert, setModal } from '../redux/features/providers/providersSlice';
import { useEffect, useState } from 'react';

const CarriersModal = () => {
	const [carriers, setCarriers] = useState([]);
	const [activeCarriers, setActiveCarriers] = useState([]);
	const admin_obj = eniture_rtsq || {};
	const { currentProvider } = useSelector(state => state.providers);
	const [getCarriers, { isLoading }] = useGetCarriersMutation();
	const [saveActiveCarriers, { isLoading: isSaving }] = useSaveActiveCarriersMutation();
	const dispatch = useDispatch();

	useEffect(() => {
		if (!currentProvider) return;

		getCarriers({
			action: 'get_carriers',
			url: admin_obj?.eniture_rtsq_rest_url,
			installed_provider_uuid: currentProvider?.uuid,
		})
			.unwrap()
			.then(res => {
				if (!res?.error) {
					setCarriers(res?.data?.carriers || []);
					setActiveCarriers(res?.data?.active_carriers || []);
				}
			})
			.catch(err => console.log(err));
	}, [currentProvider]);

	// function to handle save active carriers
	const handleSubmit = () => {
		// check if active carriers are selected
		if (!activeCarriers.length) {
			dispatch(setAlert(dispatchAlert(true, 'Please select at least one carrier.', 'error')));
			return;
		}

		const payload = {
			action: 'save_active_carriers',
			url: admin_obj?.eniture_rtsq_rest_url,
			installed_provider_uuid: currentProvider?.uuid,
			active_carriers: activeCarriers,
		};

		saveActiveCarriers(payload)
			.unwrap()
			.then(res => {
				dispatch(setAlert(dispatchAlert(true, res?.message, 'success')));
				dispatch(setModal({ open: false, type: '', data: {} }));
			})
			.catch(err => console.log('saveActiveCarriers error', err));
	};

	return (
		<ModalComponent
			title='Carriers'
			type={MODAL_TYPES.carriers}
			maxWidth='md'
			handleSubmit={handleSubmit}
			isLoading={isLoading || isSaving}>
			<Carriers
				carriers={carriers}
				activeCarriers={activeCarriers}
				setActiveCarriers={setActiveCarriers}
				isLoading={isLoading}
			/>
		</ModalComponent>
	);
};

export default CarriersModal;