how to fix useEffect has a missing dependency "Dispatch" - reactjs

Question

Hello I have a problem with my eslint and I'm not sure how to respond with my dispatch's:
const { messages } = ChatReducer;
const [isTyping, setIsTyping] = useState(false);
console.log(isTyping)
useEffect(() => {
if (messages[messages.length - 1].type === 'bot') {
setIsTyping(true);
const timeoutId = setTimeout(() => {
setIsTyping(false);
dispatch(wait_end());
}, 3000);
}
}, [messages]);
useEffect(() =>
dispatch(answer_Message(['hi 😃','hi two'])
), []);
return (
<>
{messages.map((message, index) => (
<>
{message.text ? (
<Styled.MessageFlexColumn ref={messagesEndRef} key={index}>
{message.type === 'user' ? (
<UserText key={index}>{message.text}</UserText>
) : (
<BotText
key={index}
isTyping={isTyping && index === messages.length - 1}
>
{message.text}
</BotText>
)}
<Styled.Status />
</Styled.MessageFlexColumn>
) : (
''
)}
<div ref={messagesEndRef} />
</>
))}
</>
)
action:
export const checkMessage = text => {
return dispatch => {
dispatch(sendMessage(text));
dispatch(wait_anwser());
dispatch(botMessage(verify(text)));
};
};
export const answer_Message = text => {
return dispatch => {
text.map((message, index) => {
dispatch(botMessage(message));
})
}
}
Well I also have a problem with my useEffect and my state
I'm basically using it to send an array of initial messages to display in my chat:
useEffect(() =>
dispatch(answer_Message(['hi 😃','hi two'])
), []);
The problem is that when sending 2 texts
and my isTyping state is true only once
even being 2 texts and not enter on my if:
if (messages[messages.length - 1].type === 'bot'
alert eslint:
Line 70:6: React Hook useEffect has a missing dependency: 'dispatch'. Either include it or remove the dependency array
Line 74:6: React Hook useEffect has a missing dependency: 'dispatch'. Either include it or remove the dependency array

Answer 1

I don't think you need to dispatch that as your function dispatches as well, or you could try adding the dispatch as a dependency inside the [dispatch]