Is there a way to initialize a chat like Claude or Chatgpt?

[toy-crane]

I’d like to make automatically start conversation on chat/[id] page after insert message at chat/new route segment.
I saw the pattern vercel AI sdk team used in gemini chatbot and ai chatbot in github

 useEffect(() => {
    // when the user is create a new chat, two messages created.
    if (path.includes("new") && messages.length === 2) {
      window.history.replaceState({}, "", `/chats/${id}`);
    }
  }, [id, path, messages]);

  useEffect(() => {
    const messagesLength = aiState.messages?.length;
    if (messagesLength === 2) {
      router.refresh();
    }
  }, [aiState.messages, router]);

It works very well when I didn’t have an image or a non-scrollable section.
But when I have an image, it causes flickering. Also, when I have a long message, it scrolls up and down again.
I’ve tried method like using useEffect. it doesn’t work as what I expected because of react dev strict mode.
Has anyone found an answer to this?

[andreasnett]

I have a similar problem. I do a similar action on new chats and the useEffect is giving me issues because of strict mode. I tried calling stop, returned from useChat, but it didn't help. The stop reason is "stop", same as when the chat completion finishes