React-native-gifted-chat: How to use redux to manage messages ?

Created on 20 Mar 2018  路  4Comments  路  Source: FaridSafi/react-native-gifted-chat

I am trying to use redux to manage my chat state, i need to keep my message state out of the component.

but when i'm using this method

GiftedChat.append(messagesInMyRedux, notificationMessage)

I'm getting this error

Warning:Value appears more than once in array

messagesinMyRedux in an array and notificationMessage is a string.

I've tried to not use GiftedChat.append and tested messagesInMyRedux.push(notificationMessage) but nothing occurs.

Any idea ?

question waiting-response wontfix

Most helpful comment

I do not believe that you need to use Gifted chats append method for achieving what you're after.
Personally I do something like this to append new messages to the message array:

const initialState = {
  messages: [],
};

export default (state = initialState, action) => {
...
  case INCOMING_MESSAGE:
    return {
      ...state,
      messages: [action.message, ...state.messages],
    }; 
...
};

All 4 comments

@jackmatrix
onSend(messages = []) { this.setState(previousState => ({ messages: GiftedChat.append(previousState.messages, messages), })) }
Maybe your notificationMessage must be array with message-object?

you say your error is

Warning:Value appears more than once in array

can you provide more info? other then that

You have to dispatch the action to redux which you dont seem to be doing it would look something like

Your Reducer:

const ADD_MESSAGES = 'ADD_MESSAGES';

let dataState = {
    messages: []
}

export default chatReducer = (state = dataState , action) => {
  switch (action.type) {
    case ADD_MESSAGES:
      state.messages = GiftedChat.append(state.messages, action.messages)
      return state;
    default:
      return state;
  }
};

your Action:

const ADD_MESSAGES = 'ADD_MESSAGES';

export const addMessages = (messages) => ({
  type: ADD_MESSAGES,
  messages
})

used in onsend function:

onSend(messages = []) {
    this.props.addMessages(messages)
}

not the best examples but maybe itll get you going

I do not believe that you need to use Gifted chats append method for achieving what you're after.
Personally I do something like this to append new messages to the message array:

const initialState = {
  messages: [],
};

export default (state = initialState, action) => {
...
  case INCOMING_MESSAGE:
    return {
      ...state,
      messages: [action.message, ...state.messages],
    }; 
...
};

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

SytzeAndr picture SytzeAndr  路  3Comments

arayaryoma picture arayaryoma  路  3Comments

cassioseffrin picture cassioseffrin  路  3Comments

jasonwcfan picture jasonwcfan  路  3Comments

cerberusv2px picture cerberusv2px  路  3Comments