React-select how to render only option values that are not undefined

I need to render my Option values based on if/else that will show only option related to parameter from query

const renderLsit = useMemo(() => {
    return mediaCategories?.Entities?.map((category, _) => {
      if (
        category.CategoryTypeCode === MediaCategoryType.Other &&
        params.type === "categories"
      ) {
        return {
          value: category.CategoryId,
          label: category.CategoryName,
          index: category.CategoryId,
        };
      } else if (
        category.CategoryTypeCode === MediaCategoryType.Main &&
        params.type === "genre"
      ) {
        return {
          value: category.CategoryId,
          label: category.CategoryName,
          index: category.CategoryId,
        };
      }
    });
  }, [params, mediaCategories.Entities]);

But renderList contains undefined values after map and this is braking react-select. So it is returning something like this:

this is for else if and my Entities list dose not have undefined

>Solution :

Could do a .filter() before .map()

return mediaCategories?.Entities?.filter(c => c !== undefined /*or whatever you want filter on*/).map((category, _) => {
      if (
        category.CategoryTypeCode === MediaCategoryType.Other &&
        params.type === "categories"
      ) {
        return {
          value: category.CategoryId,
          label: category.CategoryName,
          index: category.CategoryId,
        };
      } else if (
        category.CategoryTypeCode === MediaCategoryType.Main &&
        params.type === "genre"
      ) {
        return {
          value: category.CategoryId,
          label: category.CategoryName,
          index: category.CategoryId,
        };
      }
    });