Select Items and Sub Items using checkboxes

I'm working on a react native project and it has multiple item selection (only some items) component as below.

When the first time I select the values all the data will be stored correctly.

But When I remove the Items from the list, data will be cleared and I'm getting empty list.

My code as follows. I did lots of code changes and fixes but it won't work. Please help me to resolve this matter, Thanks in advance.

select sub categories :

const subCategotySelectionHandler = (subCategoryName, isItemChecked) => {
            console.log(selectedSubCategoryNames);
            if (isItemChecked && !selectedSubCategoryNames?.includes(subCategoryName)) {
                setSelectedSubCategoryNames([...selectedSubCategoryNames, subCategoryName]);
                setItemSelection(true);
                categorySelectHandler(item.category_name, item.value, true)
            }
            if (!isItemChecked && selectedSubCategoryNames.includes(subCategoryName)) {
                console.log(subCategoryName);
                setSelectedSubCategoryNames(selectedSubCategoryNames.filter(item => item !== subCategoryName));
                setSelectedSubCategoryNames(selectedSubCategoryNames.filter(item => console.log(item !== subCategoryName)));
          categorySelectHandler(null, null, false)
                 }
            }
        }

get the selected main categories :

 const categorySelectHandler = (categoryName, categoryValue, itemSelected) => {
                if (itemSelected) {
if (isItemChecked && !selectedCategoryName?.includes(categoryName)){
                // increaseSelectedTagCount();
                setSelectedCategoryName([...selectedCategoryName, categoryName]);
            }
                    setSelectedCategoryValue(categoryValue);
                } else {
                    if (isItemChecked && !selectedCategoryName?.includes(categoryName)){
                // decreaseSelectedTagCount();
                setCheckedTagItemList(selectedCategoryName.filter(item => item !== categoryName));
            }
                    setSelectedCategoryValue(null);
                }
            }

create the object to share with parent component,

useEffect(() => {
            console.log(selectedSubCategoryNames);
            let obj = {
                categoryName: selectedCategoryName,
                value: selectedCategoryValue,
                subCategoryList: selectedSubCategoryNames
            };
            getSelectedCategoriesObj(obj);
        }, [selectedCategoryName, selectedSubCategoryNames]);