NGRX createSelector object get middle line, when create special selector with filter (Update to NGRX 2021)

Hello guys I am create a selector that filter some thinks from the store but when I implement that on selectors it create a line on the object.

The selector work properly but I see middle line on it like something isn't 100% well.

How can I fix it? Thanks for your help!

product.selector.ts

export const getAllProducts = createSelector(getProductsState, fromProduct.getAllProducts);

// createSelector with line in middle.
export const getProductsFilter = createSelector(
    getAllProducts,
    (products: IProduct[], filterData: string) => {

        if (filterData === '')
            return products;
        else
            return products.filter(value => value.name.includes(filterData) || value?.description.includes(filterData));

    }

);

from home component

      const data:string='data';
      this.subscription.push(this.store.pipe(select(getProductsFilter, data)).subscribe(....

All create with Ngrx && ngrx entities update to last version 2021.

When my mouse on createSelector show that message

The signature '(s1: SelectorWithProps<object, string, IProduct[]>, projector: (s1: IProduct[], props: string) => IProduct[]): MemoizedSelectorWithProps<object, string, IProduct[], DefaultProjectorFn<...>>' of 'createSelector' is deprecated.ts(6387)
selector.d.ts(32, 4): The declaration was marked as deprecated here.

Remember it work, but this line feel something wrong.

A small picture

As said in the comments above selectors with props are deprecated You just need to rewrite your selector as a factory selector

export const getProductsFilter = (props: { filterData: string }) => 
  createSelector(
    getAllProducts,
    (products: IProduct[]) => {
      if (props.filterData === '')
          return products;
      else
          return products.filter(value => value.name.includes(props.filterData) || value?.description.includes(props.filterData));
   }
);