/* eslint-disable @typescript-eslint/no-explicit-any */
import React, { useEffect, useState } from 'react';
import { useNavigation } from '@react-navigation/native';
import InviteUserArtistFilterModal from './InviteUserArtistFilterModal';
import useInviteUserArtistFilter from '../../hooks/useInviteUserArtistFilter';
import type { FilterArtistItem } from '../../components/FilterArtist/types';

const InviteUserArtistFilterModalContainer = () => {
    const navigation = useNavigation();
    const { filter, setArtist } = useInviteUserArtistFilter();
    const [selectedArtist, setSelectedArtist] = useState<any>(filter.artist);

    useEffect(() => {
        if (!filter.artist) {
            setArtist(filter.defaultArtist);
        }
    }, []);

    const artistToFilterArtistItem = (
        rawArtist: any | undefined
    ): FilterArtistItem | undefined => {
        const { id, name, imageUrl } = rawArtist ?? {};
        return id && name && imageUrl ? { id, name, imageUrl } : undefined;
    };
    const onArtistPress = (rawArtist: any) =>
        setSelectedArtist(
            selectedArtist?.id === rawArtist?.id ? undefined : rawArtist
        );
    const onApplyPress = () => {
        const filterArtistItem = artistToFilterArtistItem(selectedArtist);
        setArtist(filterArtistItem);
        navigation.goBack();
    };
    const onBackPress = () => navigation.goBack();
    const onResetPress = () => setSelectedArtist(filter.defaultArtist);

    return (
        <InviteUserArtistFilterModal
            selectedRawArtist={selectedArtist}
            onArtistPress={onArtistPress}
            onApplyPress={onApplyPress}
            onBackPress={onBackPress}
            onResetPress={onResetPress}
        />
    );
};

export default InviteUserArtistFilterModalContainer;