how to use redux toolkit with firestore in react native

Question

I am using redux toolkit and firebase firestore for backend. I just want to get an array of objects from the database. Below is the code for slice. When I log the payload in the console I am unable to get the data. Thanks in advance.

import { createAsyncThunk, createSlice } from "@reduxjs/toolkit";
import firestore from '@react-native-firebase/firestore';

export const getCarouselImages = createAsyncThunk("/carouselImages", () =>
  firestore().collection('Users').get()
);

const initialState = {
  isLoading: false,
  failed: true,
  success: false,
  imageArray:[],
};

const carouselData = createSlice({
  name: "carouselImageSlice",
  initialState,
  reducers: {
    resetCarouselData: () => initialState,
  },
  extraReducers: (builder) => {
    builder.addCase(getCarouselImages.fulfilled, (state, { payload }) => {
      state.isLoading = false;
      state.failed = false;
      state.success = true;
      payload.forEach(doc => {
        state.userData.push(doc.data())
      });
      console.log(payload)
    });
    builder.addCase(getCarouselImages.rejected, (state, action) => {
      state.isLoading = false;
      state.failed = true;
      state.success = false;
    });
    builder.addCase(getCarouselImages.pending, (state, { payload }) => {
      state.isLoading = true;
      state.failed = false;
      state.success = false;
    });
  },
});

export const { resetCarouselData } = carouselData.actions;

export default carouselData.reducer;