Display element in a grid and conditionally add to redux or remove if not selected I have some logic on my JSX for an element in a grid, if element is selected, then add to redux, if element is not selected then remove from redux...
is working ok, but I sense a bad smell...
&lt;GridSelector
          items={items}
          onChange={(categoryId, isSelected) =&gt; {
            favorites[categoryId] = isSelected;
            const favsArraya = Object.values(onboarding.favoriteCategories);
            let index;

            if(isSelected){
              if (favsArraya.indexOf(categoryId) === -1){
                //doesnt exist, add it
                 favsArraya.push(categoryId)
              }
            }else{
              if (favsArraya.indexOf(categoryId) !== -1){
                // exists, delete it
                index = favsArraya.indexOf(categoryId);
                favsArraya.splice(index, 1);
              }
            }

            dispatchData({ [DATA_KEY.FAVORITE_CATEGORIES]: favsArraya})

          }}
        /&gt;
First of all, there's way too much going on here for an inline function. Let's seperate that out. Also, the splicing can be replaced with the more expressive filter.
const addIfMissing = (array, item) =&gt;
    array.includes(item) ? array : array.concat([item]);

const without = (array, exclude) =&gt;
    array.filter(x=&gt; x!==exclude);

const onGridSelectorChange = (categoryId, isSelected) =&gt; {
    favorites[categoryId] = isSelected;
    const categoryIds = Object.values(onboarding.favoriteCategories);
    const newCategoryIds = isSelected ?
        addIfMissing(categoryIds,categoryId) :
        without(categoryIds,categoryId);

    dispatchData({ [DATA_KEY.FAVORITE_CATEGORIES]: newCategoryIds})

}