action not dispatching react native, state is coming out fine

Question

I am unable to dispatch an action to reducer. State comes out just fine. Not sure where I have gone wrong. For other user reducer, dispatch works just fine. my project has nested drawer navigation > tabs navigation > stack navigation and current page is the 3rd stack screen. Not sure if that is the issue or what. Store.js

import { combineReducers, createStore } from '@reduxjs/toolkit';
import cartReducer from './cartSlice';
import userReducer from './userSlice';

const rootReducer = combineReducers({
    userReducer: userReducer,
    cartReducer: cartReducer,
})

const configureStore = () => createStore(rootReducer)

export default configureStore

cartSlice.js

const initialState = {
    cart: [{ key: 1, data: { freq: 'Daily', duration: 30 } }]
}

const cartReducer = (state = initialState, action) => {
    switch (action.types) {
        case "ADD_TO_CART":
            console.log(action)
            return {
                ...state,
                cart: [...state.cart, { key: 2, data: action.data }]
            }

        case "REMOVE_FROM_CART":
            const idx = state.cart.map((cartItem) => (
                cartItem.key === action.id
            ))

            const tempNewCart = [...state.cart]
            if (idx >= 0) {
                tempNewCart.splice(idx, 1)
            }
            return { ...state, cart: tempNewCart }

        case "CLEAR_CART":
            return {
                ...state,
                cart: []
            }
        default:
            return state
    }
}

export default cartReducer

SubscriptionQuantity Component

const mapStateToProps = (state) => {
    console.log(state)
    return {
        cart: state.cartReducer.cart
    }
}

const mapDispatchToProps = (dispatch) => {
    // console.log(dispatch)
    return {
        addtoCartStore: (freq, duration) => dispatch({
            type: 'ADD_TO_CART',
            data: {
                freq: freq,
                duration: duration
            }
        })
    }
}

export default connect(mapStateToProps, mapDispatchToProps)(SubscriptionQuantity)

function call for dispatch

const addtoCart = () => {
addtoCartStore('Alternate', 30)
navigation.navigate("CartScreen")
}

Answer 1

The issue was with the switch statement!!!! it should be switch(action.type) not action.types. that's why it was going in on the default route. changed the typo and works fine now.!