I get a object instead of a string while getting that state from the store

My reducer looks like :

const initialState = {
    name:{}
}

const setNameSlice = createSlice({
    name:"setName",
    initialState,
    reducers:{
        setName(state,action){
            state.name = action.payload;
        }
    }
});

export const {setName} = setNameSlice.actions;

code:

const mapStateToProps = (state: State) => ({
  nameId : state.setNameReducer.name
})

const mapDispatchToProps = (dispatch) => ({
  setName: (name) => dispatch(setName(name))
})

The dispatch function that is called takes in some name and stores it correctly(by checking the devtool) , the state now looks like setNameReducer : {name : "Something"} . But, Once i console.log that value console.log(this.props.nameId) i get state name {}__proto__: Object in the log.