How does user-chat will not display blank messages

[Much-Arisz]

When user type a blank message, I don't want to show user-chat. Pls Help me

[FredrikOseberg]

Hello. Previously you had to manipulate the state in the action provider and remove the input message from the message array. But I've now released version 1.1.16 which will allow you to do the following:

const validator = (input) => {
     if (input.length > 3) return true;
     return false
}

<Chatbot messageParser={messageParser} config={config) actionProvider={actionProvider} validator={validator} />

This will allow you to create custom rules for when you want to add a message to the array or not.

[Much-Arisz]

Thank you so much.

[dtcyad1]

Hi Fredrik,

I have included this code in App.js as shown above - but it is throwing a "Uncaught TypeError: Cannot read property 'length' of undefined at validator (App.js?be94:28)" . Am I using this incorrectly?

Thanks

[FredrikOseberg]

Hi Fredrik,

I have included this code in App.js as shown above - but it is throwing a "Uncaught TypeError: Cannot read property 'length' of undefined at validator (App.js?be94:28)" . Am I using this incorrectly?

Thanks

That should be correct. Can you please try updating to version 1.1.18? I found a bug that should be corrected in this version.

[dtcyad1]

Hi Fredrik,

Thanks for your quick response - really appreciate it. It did remove the error - but it was still showing an empty bubble or a user chat bubble with anything less than 3. I modified my local copy of the chat.jsx with this:

const handleSubmit = (e) => { e.preventDefault();

if (validator && typeof validator === "function") {
  if (validator(input)) {
    setState((state) => ({
      ...state,
      messages: [...state.messages, createChatMessage(input, "user")],
    }));
    messageParser.parse(input);
    scrollIntoView();
    setInputValue("");
  }
} else {
  messageParser.parse(input);
  scrollIntoView();
  setInputValue("");
}

};

By doing this, it now does not print out any user chats if the validator fails and it also does not add it to the message history!!! It also keeps the user input even if the validator fails - instead of clearing it out.

Please let me know if this is not correct.

[FredrikOseberg]

Hi Fredrik,

Thanks for your quick response - really appreciate it. It did remove the error - but it was still showing an empty bubble or a user chat bubble with anything less than 3. I modified my local copy of the chat.jsx with this:

const handleSubmit = (e) => { e.preventDefault();

if (validator && typeof validator === "function") {
  if (validator(input)) {
    setState((state) => ({
      ...state,
      messages: [...state.messages, createChatMessage(input, "user")],
    }));
    messageParser.parse(input);
    scrollIntoView();
    setInputValue("");
  }
} else {
  messageParser.parse(input);
  scrollIntoView();
  setInputValue("");
}

};

By doing this, it now does not print out any user chats if the validator fails and it also does not add it to the message history!!! It also keeps the user input even if the validator fails - instead of clearing it out.

Please let me know if this is not correct.

You're right. Version 1.1.19 fixes this.