Programmatically submit the preset text to deepchat

[UsmanKhawar010]

I want to implement a functionality that when a preset prompt is received, it populates the text-input field of model. without re-rendering the page.

useEffect(() => { if (selectedPrompt) { console.log('Selected prompt received:', selectedPrompt);

  if (ref.current) {
    const deepChatComponent = ref.current.children[0] as DeepChatCore;
    if (deepChatComponent) {
      const inputElement = deepChatComponent.shadowRoot?.getElementById('text-input') as HTMLElement;
      if (inputElement) {
        inputElement.innerText = selectedPrompt;
        deepChatComponent.submitUserMessage({text:selectedPrompt});
      }
    }
  }
}

}, [selectedPrompt]);

return (

<Box
  display="flex"
  flexDirection="column" // Changed from row to column for consistency
  justifyContent="center"
  alignItems="stretch" // Stretch to use all available space for better alignment
  height="100%" // Use full height
  width="100%" // Use full width
  ref={ref}
  >
  <DeepChat
    onNewMessage={(message) => {
              console.log(message);
            }}

    in this part of code I need help. I need to populate the text input of the deepchat on prompt select just like the way we type usual message. so that it can properly be added in the conversation without  re-rendering the page.

[OvidijusParsiunas]

Hi @UsmanKhawar010.

Having looked at your code, I am not quite sure what causes the re-render of the chat, did you leave some code out? When you use the submitUserMessage method, the chat should send a message to the API and add a message bubble to the top, hence I am not quite sure why would that cause a re-render problem.

If possible, can you please provide more information.

Thankyou!

[UsmanKhawar010]

I am no longer working on it.