aiChat

<aichat:aiChat id="chat" width="100%" height="100%"/>

@Autowired
private ChatClient.Builder chatClientBuilder;

private ChatClient chatClient;

@Subscribe
public void onInit(final InitEvent event) {
    chatClient = chatClientBuilder.build();
}

@Install(to = "chat", subject = "llmProvider")
private Flux<String> llmProvider(final LLMProvider.LLMRequest request) {
    return chatClient.prompt()
            .user(request.userMessage())
            .stream()
            .content();
}

            <aichat:systemPrompt><![CDATA[You are the support assistant for an order management application.

Answer only questions about orders, customers and deliveries. If a question is
about anything else, say so and suggest the user contact their account manager.

Always answer in the language the question was asked in. Keep answers short:
two or three sentences unless the user asks for detail. When you refer to an
order, always include its number.

Never invent an order number, a delivery date or a price. If the answer is not
in the conversation, say that you do not have it.]]></aichat:systemPrompt>

@JmixEntity
@Table(name = "CHAT_MESSAGE")
@Entity
public class ChatMessage implements AiChatMessage {

    @JmixGeneratedValue
    @Column(name = "ID", nullable = false)
    @Id
    private UUID id;

    @Version
    @Column(name = "VERSION", nullable = false)
    private Integer version;

    @Column(name = "ROLE", nullable = false, length = 50)
    private String role;

    @Column(name = "CONTENT")
    @Lob
    private String content;

    @CreatedDate
    @Column(name = "CREATED_DATE")
    private OffsetDateTime createdDate;

    @ElementCollection
    @CollectionTable(name = "CHAT_MESSAGE_ATTACHMENTS",
            joinColumns = @JoinColumn(name = "CHAT_MESSAGE_ID"))
    @OrderColumn(name = "ATTACHMENTS_ORDER")
    @Convert(converter = FileRefConverter.class)
    @Column(name = "ATTACHMENTS", length = 1024)
    private List<FileRef> attachments;

    @Override
    public AiMessageRole getRole() {
        return role == null ? null : AiMessageRole.fromId(role);
    }

    public void setRole(AiMessageRole role) {
        this.role = role == null ? null : role.getId();
    }

    @Override
    public String getContent() {
        return content == null ? "" : content;
    }

    public void setContent(@Nullable String content) {
        this.content = content;
    }

    @Override
    public @Nullable Instant getTime() {
        return createdDate == null ? null : createdDate.toInstant();
    }

    @Override
    public List<FileRef> getAttachments() {
        return attachments == null ? List.of() : attachments; (1)
    }

<collection id="messagesDc" class="com.company.demo.entity.ChatMessage">
    <fetchPlan extends="_base"/>
    <loader id="messagesDl">
        <query>
            <![CDATA[select e from ChatMessage e order by e.createdDate]]>
        </query>
    </loader>
</collection>

        <aichat:aiChat id="chat"
                       dataContainer="messagesDc"
                       autoSave="true"
                       width="100%"
                       height="100%">
            <aichat:actions>
                <aichat:action id="clearAction"
                               text="msg://clearAction.text"
                               icon="TRASH"/>
            </aichat:actions>
            <aichat:systemPrompt><![CDATA[You are the support assistant for an order management application.

Answer only questions about orders, customers and deliveries. If a question is
about anything else, say so and suggest the user contact their account manager.

Always answer in the language the question was asked in. Keep answers short:
two or three sentences unless the user asks for detail. When you refer to an
order, always include its number.

Never invent an order number, a delivery date or a price. If the answer is not
in the conversation, say that you do not have it.]]></aichat:systemPrompt>
            <aichat:inputHeader>
                <span id="contextSpan" text="msg://contextSpan.text"/>
            </aichat:inputHeader>
            <aichat:inputFooter>
                <span text="msg://disclaimer.text"/>
            </aichat:inputFooter>
            <aichat:emptyStateHeader>
                <h3 text="msg://emptyStateHeader.text"/>
            </aichat:emptyStateHeader>
            <aichat:emptyStateFooter>
                <span text="msg://emptyStateFooter.text"/>
            </aichat:emptyStateFooter>
        </aichat:aiChat>

@Install(to = "chat", subject = "messageFactory")
private ChatMessage messageFactory(final AiChatMessageContext context) {
    ChatMessage message = dataManager.create(ChatMessage.class);
    message.setRole(context.getRole());
    message.setContent(context.getContent());
    return message;
}

<aichat:emptyStateHeader>
    <h3 text="msg://emptyStateHeader.text"/>
</aichat:emptyStateHeader>
<aichat:emptyStateFooter>
    <span text="msg://emptyStateFooter.text"/>
</aichat:emptyStateFooter>

<aichat:inputHeader>
    <span id="contextSpan" text="msg://contextSpan.text"/>
</aichat:inputHeader>
<aichat:inputFooter>
    <span text="msg://disclaimer.text"/>
</aichat:inputFooter>

com.company.demo.view.chat/disclaimer.text=AI can make mistakes. Check important information.

@Subscribe("chat")
public void onChatGenerationStateChange(
        final GenerationStateChangeEvent<SimpleAiChatMessage> event) {
    stateSpan.setText(event.getNewState().name());
    stopButton.setEnabled(event.getNewState() == GenerationState.GENERATING);
}

@Subscribe("stopButton")
public void onStopButtonClick(final ClickEvent<JmixButton> event) {
    chat.stop();
}

@Subscribe("regenerateButton")
public void onRegenerateButtonClick(final ClickEvent<JmixButton> event) {
    chat.regenerate();
}

<aichat:assistantActions>
    <aichat:action id="assistantRegenerate"
                   type="aichat_messageRegenerate"/>
</aichat:assistantActions>

@Subscribe("chat")
public void onChatGenerationFailed(
        final GenerationFailedEvent<SimpleAiChatMessage> event) {
    notifications.show(messageBundle.formatMessage("generationFailed.notification",
            event.getError().getMessage()));
}

<aichat:actions>
    <aichat:action id="clearAction"
                   text="msg://clearAction.text"
                   icon="TRASH"/>
</aichat:actions>

<button id="clearButton" action="chat.clearAction"/>

<aichat:aiChat id="chat"
               classNames="branded-chat"
               themeNames="fixed-toolbar"
               width="100%"
               height="100%"/>

.branded-chat jmix-ai-message-input::part(input-container) {
    border-radius: 0;
    border-color: var(--vaadin-border-color-secondary);
}