Why is it throwing an error in the function?

Question

JavaScript

I have a couple of functions in which the same errors can not understand why they occur there
error TS2345: Argument of type 'Products | undefined' is not assignable to parameter of type 'Products'. Type 'undefined' is not assignable to type 'Products'.

export type Products = {
    id: number,
    title: string,
    images: string[],
    currentImageIndex: number,
    isCycleMode: boolean,
    cantGoPrev: boolean,
    cantGoNext: boolean,
    price: number,
    company: string,
    info: string,
    inCart: boolean,
    count: number,
    total: number
}

getItem = (id: number) => {
        return this.state.products.find(item => item.id === id);
    };

    addToCart = (id: number) => {
        let tempProduct: Products[] = [...this.state.products];
                                                            //тут ошибка(this.getItem(id))
        const index = tempProduct.indexOf(this.getItem(id));
        const product = tempProduct[index];
        product.inCart = true;
        product.count = 1;
        const price = product.price;
        product.total = price;
        this.setState(
            () => {
                return {
                    products: tempProduct,
                    cart: [...this.state.cart, product]
                }
            }
            ,
            () => {
                this.addTotals();
            }
        );
    };

    increment = (id: number) => {
        let tempCart = [...this.state.cart];
        const selectedProduct = tempCart.find(item => item.id === id);
                                         // тут такая же ошибка  indexOf(selectedProduct)
        const index = tempCart.indexOf(selectedProduct);
        const product = tempCart[index];
        product.count = product.count + 1;
        product.total = product.count * product.price;
        this.setState(
            () => {
                return {
                    cart: [...tempCart]
                };
            },
            () => {
                this.addTotals();
            }
        );
    };

Answer 1

Good afternoon.
The getItem method returns either Products or undefined if no product is found. Make a terminal condition and specify strong typing for the used array next.

addToCart = (id: number) => {
  let tempProduct: Products[] = [...this.state.products];
  const item = this.getItem(id);
  if(item === undefined) {
    // ... инструкция при возникновении терминального условия, например, ошибка
    return;
  }
  const index = tempProduct.indexOf(item as Products); // строгая типизация для item
        
  // ...
};

Perhaps, if you specify the type of the return value, then the terminal condition is not required (but this needs to be checked, I can’t say offhand with 100% certainty). This approach is prone to bugs when executing js.

getItem = (id: number): Products => {
  return this.state.products.find(item => item.id === id);
};

BTW, if I were you, I wouldn't call the Products type in the plural. h. Simply Product, because in fact, it is a single entity.