Questions about names, stream mode and images

[devpulse01]

Hi Ovidijus,

I have some questions and feedback regarding my current experience with deep-chat. I'm combining different issues in this single message, so I apologize if this isn't the usual way to do it 🙏

---

Assistants API

When using the assistant's API, there is a log displayed in the developer console, and I don't see an option to hide it. It's really a minor detail, but I wanted to share it with you.

---

Names and initial buttons

I've developed a function that hide the name when a message takes the form of a button (class deep-chat-button), as I feel this looks more "user-friendly".

My solution feels a bit hacky. Do you have any suggestions for a cleaner approach? The function looks like this:

export function hideNamesOnButtonMessages(chatId) {
  const intervalId = setInterval(() => {
    const chat = document.getElementById(chatId);
    if (chat && chat.shadowRoot) {
      const outerMessageContainers = chat.shadowRoot.querySelectorAll('.outer-message-container');
      outerMessageContainers.forEach((container) => {
        if (container.querySelector('.deep-chat-button')) {
          const nameElement = container.querySelector('.name');
          if (nameElement) {
            nameElement.remove();
          }
        }
      });
      clearInterval(intervalId);
    }
  }, 0);
}

---

Stream

When using the OpenAI Chat completions API, I'm retrieving the token usage stats (completion, prompt and total) through the function bound with chatElementRef.responseInterceptor.

However, I haven't been successful in making this work when the stream mode is enabled. It seems that the function isn't called in this case. Do you have any insights on how to handle this scenario? Is there a specific event triggered in stream mode?

---

Image

Currently, on some use cases, I'm using the submitUserMessage(text) function for text messages, and it's working perfectly.

I'm interested in knowing if it's possible to do the same with files with the current version. So basically be able to use my own file uploader and pass the file(s) to a submit file method or something similar.

Alternatively, is there another way to achieve this?

---

Please let me know if you would prefer that I separate these into different issues. Thank you!

[OvidijusParsiunas]

Hi @devpulse01. Thankyou for your feedback! I'll try to answer each section as best as I can:

---

Assistans API

The polling logs are there for non-linear request use-cases where a response from the server requires the Deep Chat component to poll a particular endpoint to see when the job is done so the final response can be retrieved. I have left it in the console to give a little bit of extra clarity on what is happening and how frequently the component is polling the server. I can remove these logs if you feel like they are noise.

---

Names and initial buttons

In regards to using your own html for message bubbles alongside name/avatar attributes that Deep Chat provides; the only possible solution that I can think of at the moment would be to use a custom role for messages that you don't want to have a name/avatar for, and then set the styling for that role in either the Name or Avatar properties where they would be have display set to none or width+height set to 0px.

Other than this, you can also add your own custom name element to the html in the messages. That way you will be able to control where and when it appears in your messages.

---

Stream

The Open AI Completion Streaming API does not provide any extra metadata. See here for reference.

If this data is important for you - I will augment the Deep Chat's stream simulation API to allow you to call the standard completion API which would respond with all of the data at once and then it would be streamed for the user preference.

---

Image

I think this is an interesting use-case. I was thinking of refactoring the submitUserMessage method anyway. So I will add this along with it (some-time this week).

---

Thanks for your feedback and let me know if you need any more info in regards to the responses.

[devpulse01]

Thank you for your quick reply Ovidijus!

Assistants API: Yes, I would love that.

Names and initial buttons: Perfect, I'll try that. It looks much cleaner than what I did.

Stream: Okay, I didn’t know that it was not returned from the Streaming API. Thank you for the details. It would be really great if you could augment the Deep Chat's simulation API.

Images: this is really good news :)

Thank you so much! Best

[OvidijusParsiunas]

Hey, sorry for the hold up as there have been a lot of changes happening in the component code. These feature will be released in the main package later this week, but you can use them early in our deep-chat-dev and deep-chat-react-dev packages version 9.0.66. These packages work the same way it's just their names are different. Let me know if you have any issues. I will update this thread when the main package is released.

To note, the submitUserMessage method will now accept an object with a new type as follows:

submitUserMessage({text?: string; files?: File[] | FileList}) => void

The reason why files are not the standard file type used in MessageContent is because target servers may want the actual file, hence this API makes it simpler and future proof for these cases. The File or FileList types represent actual files that are uploaded to an app, e.g. via file input element. Let me know if you have any questions.

[OvidijusParsiunas]

Hi. The functionality discussed above has now been released in Deep Chat version 1.4.4. Please read the release notes for more information.

I will be closing this issue, but if you experience problems relating to this release feel free to comment below or raise a new issue for anything else. Thanks!

[devpulse01]

Thank you!

[OvidijusParsiunas]

The names and avatars functionality has been updated to automatically not reappear for consecutive messages in version 1.4.11.