Hello Telerik,

We are using Conversation UI for chatting between two party.our requirement is initially its load 10 messages ,more older messages will be load as scroll reach at top. but there is not such event is available that fired when scroll reach at top in conversation UI.

See attached file.when scroll reach at top. it should fire an event and add new message before old messages   in conversation UI

Let me know how can I achieve this? sample code will be appreciated.

For more detail please see this video 

Version info

Kendo conversation UI 1.1.1

Thanks

Hi,

we want to build your fine conversational UI into our product? The idea in the first iteration is to use it to render message threads between different users. This means that we need to be able to track which messages the user has seen/read to provide a counter/badge with the number of unread messages. Do you have any examples showing something like that? Could you possibly give us a hint about how to achieve something like that with your API?

Thanks,

Anders

Currently, it is not possible to include additional buttons next to the send button in the Conversational UI.

Having such feature will provide a way for adding more action buttons such as file/image/video selection etc.

Hi,

It will be good to have the ability to change the format of the message timestamp.

Thank you for your consideration.

If you bind the messages property to an observable and use the async pipe it will throw the following error:

'Message[] | null' is not assignable to type 'Message[]'

The messages should be able to also receive null to avoid the error. The following workarounds can be used until the property is nullable:

<kendo-chat [messages]="(feed | async)!" [user]="patientUser"></kendo-chat>

Or use toSignal:

<kendo-chat [messages]="mySignal()" [user]="patientUser"></kendo-chat>

  public feed: Observable<Message[]>;
  public mySignal: Signal<Message[]>;
  public readonly patientUser: User = {
    id: 1,
  };

  public readonly practitionerUser: User = {
    id: 0,
  };

  constructor() {
    const hello: Message = {
      author: this.practitionerUser,
      suggestedActions: [
        {
          type: 'reply',
          value: 'Neat!',
        },
        {
          type: 'reply',
          value: 'Thanks, but this is boring.',
        },
      ],
      timestamp: new Date(),
      text: 'Hello, this is a demo bot. I don`t do much, but I can count symbols!',
    };

    this.feed = merge(from([hello])).pipe(
      scan((acc: Message[], x: Message) => [...acc, x], [])
    );
    this.mySignal = toSignal(this.feed ) as Signal<Message[]>;
  }

Such a directive will help in customizing the content of the attachments and I would also like to create a horizontal list that expands downward which will eliminate the scroll button.

Hi, Team!

Currently, the Output view of the AIPrompt component ignores any of the formatting that is applied to the text it renders and displays it as regular text. However, I want to retain the formatting of the text that was generated by the AI model that I am using.

For this reason, I would like to request the introduction of a designated template that would allow me to control the formatting of the prompts in the Output view.