React, Redux, Typescript. Problemy z aktualizacją tablicy obiektów w Reducer

Question

Witam serdecznie, 

piszę projekt w technologiach jak wyżej. Posiadam tablice produktów (obiektów - nazwa, cena, objętość ). Poszczególny obiekt jest przesyłany do Reducera 

export const getProducts = (
    searchValue: string
): ThunkAction<void, RootState, null, LoggedActions> => {

    return async (dispatch) => {
        try {

            await firebase
                .firestore()
                .collection("business")
                .where('productType', 'array-contains', searchValue)
                .get()
                .then(snapshot => {
                    snapshot.docs.forEach(doc => {
                        doc.data()

                        const products = doc.data().products

                        dispatch({
                            type: GET_PRODUCTS,
                            data: products
                        })
                    })
                })


        } catch (err) {
            console.log(err);
        }

    }
}

reducer wygląda tak 

import { GET_PRODUCTS, initialLoggedState, LoggedActions } from '../types'


const initialState: initialLoggedState = {
    products: null,
}

export default (state = initialState, action: LoggedActions): initialLoggedState => {

    switch (action.type) {
        case GET_PRODUCTS:
            return {
                ...state,
                products: [...state.products, action.data]
            }

        default:
            return state;
    }
}

chciałbym uaktualniać tablicę pobranymi obiektami 

typy zadeklarowane wyglądają tak

export interface Product {
    name: string,
    price: number,
    capacity: number,
}

export interface ProductsArr {
    [key: string]: Product
}


export const GET_PRODUCTS = 'GETPRODUCTS'


export interface initialLoggedState {
  products: ProductsArr | null,
}

export interface ProductData {
  products: ProductsArr | null,
}

interface GetProducts {
  type: typeof GET_PRODUCTS,
  data: Product
}

export type LoggedActions =
  | GetProducts

 

Comments

jakieś konkretne błędy masz? Nie myślałeś nad użyciem redux toolkit? Nie rozwiaze problemu ale uprości kod.

---

Dobra rozwiązałem 

typy

export interface Product {
    name: string,
    price: number,
    capacity: number,
}

export interface ProductsArr {
    product: Product
}

export const GET_PRODUCTS = 'GETPRODUCTS'


export interface initialLoggedState {
  products: ProductsArr[] | null,
}

export interface ProductData {
  products: ProductsArr[] | null,
}

interface GetProducts {
  type: typeof GET_PRODUCTS,
  data: ProductsArr[]
}

export type LoggedActions =
  | GetProducts

reducer

import { GET_PRODUCTS, initialLoggedState, LoggedActions } from '../types'


const initialState: initialLoggedState = {
    products: [],
}

export default (state = initialState, action: LoggedActions): initialLoggedState => {

    switch (action.type) {
        case GET_PRODUCTS:


            return {
                ...state,
                products: action.data
            }

        default:
            return state;
    }

Mam nadzieje, że komuś to pomoże pozdro!!