Closed Beerbill closed 3 years ago
You're right. I think I'll implement something like this:
// outside chatbot
const validator = (message) => {
if (message.length < 2 ) {
return false;
}
return true;
}
// Pass validator as props
<Chatbot ... validator={validator} />
// in chatbot code
const handleSubmit = (e) => {
e.preventDefault();
const valid = validator(input)
if (valid) {
setState((state) => ({
...state,
messages: [...state.messages, createChatMessage(input, "user")],
}));
messageParser.parse(input);
scrollIntoView();
setInputValue("");
}
};
Meanwhile. Here is a dirty hack:
// in messageparser:
parse(message) {
if (message.length < 2) {
return this.actionProvider.handleInvalidInput()
}
}
// in actionProvider
handleInvalidInput = () => {
this.setState(state => {
return { ...state, state.messages: [state.messages.slice(0, state.messages.length - 1)]}
})
}
Another simple option is just disabling the submit button. Made a fork for myself with it. Thanks again!
<button
className="react-chatbot-kit-chat-btn-send"
style={customButtonStyle}
disabled={input.length <= 0}
>
Hello,
Thank you so much for this bot, it's really amazing.
I caught a behavior that is not ideal, the chat bot allows the user to write empty strings "" as a valid input and it's impossible to treat it inside the MessageParser or ActionProvider.
react-chatbot-kit/src/components/Chat/Chat.jsx
this part should or be treated or extracted to allow modular user input treatment.