class MessagerViewer { constructor(message) { this.message = message; this.create_elements(); } create_elements() { this.container = $("
") .addClass("row no-gutters message-viewer position-relative") .addClass(`message-${this.message.role}`); this.create_role_displayer(); this.create_content_displayer(); this.create_button_group(); this.container .append(this.role_displayer) .append(this.content_displayer) .append(this.button_group); } create_role_displayer() { this.role_displayer = $("
") .addClass("role-displayer") .css("z-index", "1"); if (this.message.role === "user") { this.role_displayer.append("You"); } else { this.role_displayer.append(this.message.model); } } create_content_displayer() { this.content_displayer = $("
") .addClass("content-displayer") .addClass(`chat-${this.message.role}`); this.content_displayer.text(this.message.content); this.content_displayer.data("raw_content", this.message.content); } create_button_group() { this.button_group = $("
") .addClass("position-absolute text-end px-1") .addClass("button-group") .css("z-index", "1") .css("padding", "auto"); let btn_class = "btn pt-0 pl-3"; if (this.message.role === "assistant") { this.regenerate_button = $("