@memberjunction/ng-skip-chat 2.48.0 → 2.49.0

package/dist/lib/skip-single-message/skip-single-message.component.js

@@ -1,12 +1,3 @@
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
 import { Component, EventEmitter, Input, Output, ViewChild, ViewContainerRef } from '@angular/core';
 import { LogError, RunView } from '@memberjunction/core';
 import { SkipResponsePhase } from '@memberjunction/skip-types';
@@ -174,120 +165,126 @@ function SkipSingleMessageComponent_Conditional_19_Template(rf, ctx) { if (rf &
     i0.ɵɵconditional(ctx_r0.ConversationDetailRecord.UserRating === 10 ? 3 : 4);
 } }
 export class SkipSingleMessageComponent extends BaseAngularComponent {
+    cdRef;
+    notificationService;
+    ConversationRecord;
+    ConversationDetailRecord;
+    ConversationUser;
+    DataContext;
+    ConversationMessages;
+    /**
+     * This variable should be set by the component instantiating this one, it should be bound to the state
+     * of the conversation processing, so that this component can handle its internal functionality correctly,
+     * for example when the conversation is processing, don't show the buttons to edit or delete the message
+     */
+    ConversationProcessing = false;
+    /**
+     * Set this property in order to set the Skip logo. This can either be a URL or a Blob
+     */
+    SkipMarkOnlyLogoURL = "assets/Skip - Mark Only - Small.png";
+    /**
+     * Set this property in order to set the user image. This can either be a URL or a Blob
+     */
+    UserImage = undefined;
+    /**
+     * Default user image to use if the user image is not set
+     */
+    DefaultUserImage = undefined;
+    /**
+     * Optional timestamp when the message was loaded/created
+     * If not provided, it will be set to Date.now() in ngAfterViewInit
+     */
+    loadTime = undefined;
+    /**
+     * If set to true, user messages will be shown with a button to allow delete/edit
+     */
+    ShowMessageEditPanel = true;
+    /**
+     * If set to true, AI messages that are the last in the conversation will show thumbs up/down rating
+     */
+    ShowMessageRating = true;
+    /**
+     * If set to true, messages with linked artifacts will show an artifact indicator
+     */
+    ShowArtifactIndicator = true;
+    /**
+     * Indicates if the message is currently being rated and saved to the database
+     */
+    RatingBeingSaved = false;
+    /**
+     * This is an internal property that is turned on just after a user succesfully rates a message, and is never true otherwise. This allows the UI to show a thank you message for the rating.
+     */
+    UserJustRated = false;
+    /**
+     * Controls the visibility of the feedback dialog
+     */
+    ShowingFeedbackDialog = false;
+    /**
+     * Stores the rating value selected by the user before submitting feedback
+     */
+    SelectedRating = null;
+    /**
+     * Stores the feedback text entered by the user
+     */
+    UserFeedbackText = '';
+    /**
+     * The title to show in the feedback dialog based on the rating
+     */
+    FeedbackDialogTitle = 'Share more feedback';
+    /**
+     * Name of the artifact associated with this message, if any
+     */
+    ArtifactName = null;
+    /**
+     * Description of the artifact associated with this message, if any
+     */
+    ArtifactDescription = null;
+    /**
+     * Version of the artifact associated with this message, if any
+     */
+    ArtifactVersion = null;
+    SuggestedQuestionSelected = new EventEmitter();
+    SuggestedAnswerSelected = new EventEmitter();
+    /**
+     * Event emitted when the user clicks on a matching report and the application needs to handle the navigation
+     */
+    NavigateToMatchingReport = new EventEmitter();
+    /**
+     * This event fires whenever a new report is created.
+     */
+    NewReportCreated = new EventEmitter();
+    /**
+     * This event fires when the user is requesting to edit a message, the container of this component will handle
+     */
+    EditMessageRequested = new EventEmitter();
+    /**
+     * This event fires when the user is requesting to delete a message, the container of this component will handle
+     */
+    DeleteMessageRequested = new EventEmitter();
+    /**
+     * This event fires whenever a drill down is requested within a given report.
+     */
+    DrillDownEvent = new EventEmitter();
+    /**
+     * This event fires when the user clicks on an artifact indicator to view the artifact
+     */
+    ArtifactSelected = new EventEmitter();
+    SuggestedQuestions = [];
+    SuggestedAnswers = [];
+    ShowSuggestedQuestions = true;
+    HideSuggestedQuestionsAfterClick = true;
+    ShowSuggestedAnswers = true;
+    HideSuggestedAnswersAfterClick = true;
+    SuggestedQuestionsClicked = false;
+    SuggestedAnswersClicked = false;
     constructor(cdRef, notificationService) {
         super();
         this.cdRef = cdRef;
         this.notificationService = notificationService;
-        /**
-         * This variable should be set by the component instantiating this one, it should be bound to the state
-         * of the conversation processing, so that this component can handle its internal functionality correctly,
-         * for example when the conversation is processing, don't show the buttons to edit or delete the message
-         */
-        this.ConversationProcessing = false;
-        /**
-         * Set this property in order to set the Skip logo. This can either be a URL or a Blob
-         */
-        this.SkipMarkOnlyLogoURL = "assets/Skip - Mark Only - Small.png";
-        /**
-         * Set this property in order to set the user image. This can either be a URL or a Blob
-         */
-        this.UserImage = undefined;
-        /**
-         * Default user image to use if the user image is not set
-         */
-        this.DefaultUserImage = undefined;
-        /**
-         * Optional timestamp when the message was loaded/created
-         * If not provided, it will be set to Date.now() in ngAfterViewInit
-         */
-        this.loadTime = undefined;
-        /**
-         * If set to true, user messages will be shown with a button to allow delete/edit
-         */
-        this.ShowMessageEditPanel = true;
-        /**
-         * If set to true, AI messages that are the last in the conversation will show thumbs up/down rating
-         */
-        this.ShowMessageRating = true;
-        /**
-         * If set to true, messages with linked artifacts will show an artifact indicator
-         */
-        this.ShowArtifactIndicator = true;
-        /**
-         * Indicates if the message is currently being rated and saved to the database
-         */
-        this.RatingBeingSaved = false;
-        /**
-         * This is an internal property that is turned on just after a user succesfully rates a message, and is never true otherwise. This allows the UI to show a thank you message for the rating.
-         */
-        this.UserJustRated = false;
-        /**
-         * Controls the visibility of the feedback dialog
-         */
-        this.ShowingFeedbackDialog = false;
-        /**
-         * Stores the rating value selected by the user before submitting feedback
-         */
-        this.SelectedRating = null;
-        /**
-         * Stores the feedback text entered by the user
-         */
-        this.UserFeedbackText = '';
-        /**
-         * The title to show in the feedback dialog based on the rating
-         */
-        this.FeedbackDialogTitle = 'Share more feedback';
-        /**
-         * Name of the artifact associated with this message, if any
-         */
-        this.ArtifactName = null;
-        /**
-         * Description of the artifact associated with this message, if any
-         */
-        this.ArtifactDescription = null;
-        /**
-         * Version of the artifact associated with this message, if any
-         */
-        this.ArtifactVersion = null;
-        this.SuggestedQuestionSelected = new EventEmitter();
-        this.SuggestedAnswerSelected = new EventEmitter();
-        /**
-         * Event emitted when the user clicks on a matching report and the application needs to handle the navigation
-         */
-        this.NavigateToMatchingReport = new EventEmitter();
-        /**
-         * This event fires whenever a new report is created.
-         */
-        this.NewReportCreated = new EventEmitter();
-        /**
-         * This event fires when the user is requesting to edit a message, the container of this component will handle
-         */
-        this.EditMessageRequested = new EventEmitter();
-        /**
-         * This event fires when the user is requesting to delete a message, the container of this component will handle
-         */
-        this.DeleteMessageRequested = new EventEmitter();
-        /**
-         * This event fires whenever a drill down is requested within a given report.
-         */
-        this.DrillDownEvent = new EventEmitter();
-        /**
-         * This event fires when the user clicks on an artifact indicator to view the artifact
-         */
-        this.ArtifactSelected = new EventEmitter();
-        this.SuggestedQuestions = [];
-        this.SuggestedAnswers = [];
-        this.ShowSuggestedQuestions = true;
-        this.HideSuggestedQuestionsAfterClick = true;
-        this.ShowSuggestedAnswers = true;
-        this.HideSuggestedAnswersAfterClick = true;
-        this.SuggestedQuestionsClicked = false;
-        this.SuggestedAnswersClicked = false;
-        this._loadTime = 0;
-        this._elapsedTimeFormatted = "";
-        this._elapsedTimeInterval = null;
-        this._cachedMessage = null;
     }
+    reportContainerRef;
+    static _detailHtml = {};
+    _loadTime = 0;
     get ElapsedTimeSinceLoad() {
         return Date.now() - this._loadTime;
     }
@@ -304,6 +301,8 @@ export class SkipSingleMessageComponent extends BaseAngularComponent {
         }
         return this._elapsedTimeFormatted;
     }
+    _elapsedTimeFormatted = "";
+    _elapsedTimeInterval = null;
     FormatElapsedTime(elapsedTime) {
         let seconds = Math.floor(elapsedTime / 1000);
         let minutes = Math.floor(seconds / 60);
@@ -344,6 +343,7 @@ export class SkipSingleMessageComponent extends BaseAngularComponent {
     RefreshMessage() {
         this._cachedMessage = null;
     }
+    _cachedMessage = null;
     get Message() {
         if (this._cachedMessage === null) {
             if (this.ConversationDetailRecord.ID && this.ConversationDetailRecord.ID.length > 0 &&
@@ -441,59 +441,56 @@ export class SkipSingleMessageComponent extends BaseAngularComponent {
      * @param rating The rating to assign, 10 for thumbs up, 1 for thumbs down
      * @param feedback Optional text feedback from the user
      */
-    RateMessage(rating_1) {
-        return __awaiter(this, arguments, void 0, function* (rating, feedback = '') {
-            if (!this.ConversationDetailRecord || !this.IsAIMessage) {
-                return;
+    async RateMessage(rating, feedback = '') {
+        if (!this.ConversationDetailRecord || !this.IsAIMessage) {
+            return;
+        }
+        try {
+            this.RatingBeingSaved = true;
+            // Update the UserRating property in the local object
+            this.ConversationDetailRecord.UserRating = rating;
+            // Update the UserFeedback property if provided
+            if (feedback) {
+                this.ConversationDetailRecord.UserFeedback = feedback;
             }
-            try {
-                this.RatingBeingSaved = true;
-                // Update the UserRating property in the local object
-                this.ConversationDetailRecord.UserRating = rating;
-                // Update the UserFeedback property if provided
+            let objToSave = this.ConversationDetailRecord;
+            if (undefined === this.ConversationDetailRecord.Save) {
+                // this means that the current object is not a ConversationDetailEntity, so we can't save it directly, we must load an object first
+                const p = this.ProviderToUse;
+                const savedID = this.ConversationDetailRecord.ID;
+                objToSave = await p.GetEntityObject("Conversation Details", p.CurrentUser);
+                await objToSave.Load(savedID);
+                objToSave.UserRating = rating;
+                // Set feedback if provided
                 if (feedback) {
-                    this.ConversationDetailRecord.UserFeedback = feedback;
-                }
-                let objToSave = this.ConversationDetailRecord;
-                if (undefined === this.ConversationDetailRecord.Save) {
-                    // this means that the current object is not a ConversationDetailEntity, so we can't save it directly, we must load an object first
-                    const p = this.ProviderToUse;
-                    const savedID = this.ConversationDetailRecord.ID;
-                    objToSave = yield p.GetEntityObject("Conversation Details", p.CurrentUser);
-                    yield objToSave.Load(savedID);
-                    objToSave.UserRating = rating;
-                    // Set feedback if provided
-                    if (feedback) {
-                        objToSave.UserFeedback = feedback;
-                    }
-                    // now we have a real object, we can save it below
-                }
-                // Save the updated record
-                if (yield objToSave.Save()) {
-                    // Force change detection
-                    this.UserJustRated = true; // show the thank you message
-                    // set a timer to wait for 10 seconds and after that we'll set the UserJustRated to false
-                    setTimeout(() => {
-                        this.UserJustRated = false;
-                    }, 10000);
-                }
-                else {
-                    throw objToSave.LatestResult.Message;
+                    objToSave.UserFeedback = feedback;
                 }
+                // now we have a real object, we can save it below
             }
-            catch (error) {
-                LogError('Error rating message:' + error);
-                this.notificationService.CreateSimpleNotification('Error saving feedback', "error", 3500);
+            // Save the updated record
+            if (await objToSave.Save()) {
+                // Force change detection
+                this.UserJustRated = true; // show the thank you message
+                // set a timer to wait for 10 seconds and after that we'll set the UserJustRated to false
+                setTimeout(() => {
+                    this.UserJustRated = false;
+                }, 10000);
             }
-            finally {
-                this.RatingBeingSaved = false;
+            else {
+                throw objToSave.LatestResult.Message;
             }
-        });
+        }
+        catch (error) {
+            LogError('Error rating message:' + error);
+            this.notificationService.CreateSimpleNotification('Error saving feedback', "error", 3500);
+        }
+        finally {
+            this.RatingBeingSaved = false;
+        }
     }
     AddReportToConversation() {
-        var _a;
         const detail = this.ConversationDetailRecord;
-        if (this.reportContainerRef && ((_a = detail === null || detail === void 0 ? void 0 : detail.ID) === null || _a === void 0 ? void 0 : _a.length) > 0 && detail.Role.trim().toLowerCase() === 'ai') {
+        if (this.reportContainerRef && detail?.ID?.length > 0 && detail.Role.trim().toLowerCase() === 'ai') {
             const resultObject = JSON.parse(detail.Message);
             if (resultObject.success) {
                 if (resultObject.responsePhase === SkipResponsePhase.analysis_complete) {
@@ -547,9 +544,8 @@ export class SkipSingleMessageComponent extends BaseAngularComponent {
             return 'user-message';
     }
     get IsTemporaryMessage() {
-        var _a, _b, _c;
-        if (((_b = (_a = this.ConversationDetailRecord) === null || _a === void 0 ? void 0 : _a.Role) === null || _b === void 0 ? void 0 : _b.trim().toLowerCase()) === 'ai') {
-            if (((_c = this.ConversationDetailRecord.ID) === null || _c === void 0 ? void 0 : _c.length) > 0)
+        if (this.ConversationDetailRecord?.Role?.trim().toLowerCase() === 'ai') {
+            if (this.ConversationDetailRecord.ID?.length > 0)
                 return false;
             else
                 return true;
@@ -652,109 +648,105 @@ export class SkipSingleMessageComponent extends BaseAngularComponent {
     /**
      * Loads the artifact information if available
      */
-    loadArtifactInfo() {
-        return __awaiter(this, void 0, void 0, function* () {
-            var _a, _b;
-            if (!this.HasArtifact || !this.ConversationDetailRecord.ArtifactID) {
-                return;
+    async loadArtifactInfo() {
+        if (!this.HasArtifact || !this.ConversationDetailRecord.ArtifactID) {
+            return;
+        }
+        try {
+            const provider = this.ProviderToUse;
+            const rv = new RunView(this.RunViewToUse);
+            const params = [
+                {
+                    EntityName: 'MJ: Conversation Artifacts',
+                    ExtraFilter: "ID = '" + this.ConversationDetailRecord.ArtifactID + "'",
+                    ResultType: 'simple'
+                }
+            ];
+            if (this.ConversationDetailRecord.ArtifactVersionID) {
+                params.push({
+                    EntityName: 'MJ: Conversation Artifact Versions',
+                    ExtraFilter: "ID = '" + this.ConversationDetailRecord.ArtifactVersionID + "'",
+                    ResultType: 'simple'
+                });
             }
-            try {
-                const provider = this.ProviderToUse;
-                const rv = new RunView(this.RunViewToUse);
-                const params = [
-                    {
-                        EntityName: 'MJ: Conversation Artifacts',
-                        ExtraFilter: "ID = '" + this.ConversationDetailRecord.ArtifactID + "'",
-                        ResultType: 'simple'
+            const results = await rv.RunViews(params, this.ProviderToUse.CurrentUser);
+            if (results) {
+                const artifactResult = results[0];
+                if (artifactResult && artifactResult.Results?.length > 0) {
+                    const artifact = artifactResult.Results[0];
+                    if (artifact) {
+                        this.ArtifactName = artifact.Name;
+                        this.ArtifactDescription = artifact.Description;
                     }
-                ];
-                if (this.ConversationDetailRecord.ArtifactVersionID) {
-                    params.push({
-                        EntityName: 'MJ: Conversation Artifact Versions',
-                        ExtraFilter: "ID = '" + this.ConversationDetailRecord.ArtifactVersionID + "'",
-                        ResultType: 'simple'
-                    });
                 }
-                const results = yield rv.RunViews(params, this.ProviderToUse.CurrentUser);
-                if (results) {
-                    const artifactResult = results[0];
-                    if (artifactResult && ((_a = artifactResult.Results) === null || _a === void 0 ? void 0 : _a.length) > 0) {
-                        const artifact = artifactResult.Results[0];
-                        if (artifact) {
-                            this.ArtifactName = artifact.Name;
-                            this.ArtifactDescription = artifact.Description;
-                        }
-                    }
-                    if (this.ConversationDetailRecord.ArtifactVersionID) {
-                        const versionResult = results[1];
-                        if (versionResult && ((_b = versionResult.Results) === null || _b === void 0 ? void 0 : _b.length) > 0) {
-                            const version = versionResult.Results[0];
-                            if (version) {
-                                this.ArtifactVersion = version.Version;
-                            }
+                if (this.ConversationDetailRecord.ArtifactVersionID) {
+                    const versionResult = results[1];
+                    if (versionResult && versionResult.Results?.length > 0) {
+                        const version = versionResult.Results[0];
+                        if (version) {
+                            this.ArtifactVersion = version.Version;
                         }
                     }
                 }
             }
-            catch (err) {
-                console.error('Error loading artifact information', err);
-            }
-        });
+        }
+        catch (err) {
+            console.error('Error loading artifact information', err);
+        }
     }
+    static ɵfac = function SkipSingleMessageComponent_Factory(t) { return new (t || SkipSingleMessageComponent)(i0.ɵɵdirectiveInject(i0.ChangeDetectorRef), i0.ɵɵdirectiveInject(i1.MJNotificationService)); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SkipSingleMessageComponent, selectors: [["mj-skip-single-message"]], viewQuery: function SkipSingleMessageComponent_Query(rf, ctx) { if (rf & 1) {
+            i0.ɵɵviewQuery(_c0, 5, ViewContainerRef);
+        } if (rf & 2) {
+            let _t;
+            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.reportContainerRef = _t.first);
+        } }, inputs: { ConversationRecord: "ConversationRecord", ConversationDetailRecord: "ConversationDetailRecord", ConversationUser: "ConversationUser", DataContext: "DataContext", ConversationMessages: "ConversationMessages", ConversationProcessing: "ConversationProcessing", SkipMarkOnlyLogoURL: "SkipMarkOnlyLogoURL", UserImage: "UserImage", DefaultUserImage: "DefaultUserImage", loadTime: "loadTime", ShowMessageEditPanel: "ShowMessageEditPanel", ShowMessageRating: "ShowMessageRating", ShowArtifactIndicator: "ShowArtifactIndicator", ShowSuggestedQuestions: "ShowSuggestedQuestions", HideSuggestedQuestionsAfterClick: "HideSuggestedQuestionsAfterClick", ShowSuggestedAnswers: "ShowSuggestedAnswers", HideSuggestedAnswersAfterClick: "HideSuggestedAnswersAfterClick" }, outputs: { SuggestedQuestionSelected: "SuggestedQuestionSelected", SuggestedAnswerSelected: "SuggestedAnswerSelected", NavigateToMatchingReport: "NavigateToMatchingReport", NewReportCreated: "NewReportCreated", EditMessageRequested: "EditMessageRequested", DeleteMessageRequested: "DeleteMessageRequested", DrillDownEvent: "DrillDownEvent", ArtifactSelected: "ArtifactSelected" }, features: [i0.ɵɵInheritDefinitionFeature], decls: 20, vars: 15, consts: [["reportContainer", ""], [1, "message-row", 3, "ngClass"], [1, "message-image"], [1, "avatar", 3, "src"], [1, "fa-solid", "fa-user", "default-user-image"], [1, "message", 3, "id"], [1, "message-user-name"], ["title", "Message actions", 1, "message-actions"], [1, "completion-time"], [1, "artifact-indicator"], ["class", "suggested-container", 4, "ngIf"], [1, "message-rating"], [3, "title", "minWidth", "width", "close", 4, "ngIf"], [1, "rating-feedback"], [1, "elapsed-time"], ["title", "Edit message", 1, "fa-solid", "fa-edit", 3, "click"], ["title", "Delete message", 1, "fa-solid", "fa-trash", 3, "click"], [1, "artifact-indicator", 3, "click"], [1, "fa-solid", "fa-file-lines"], [1, "artifact-label"], [1, "suggested-container"], [1, "suggested-header"], [1, "suggested-questions-list"], ["class", "suggested-item", 3, "click", 4, "ngFor", "ngForOf"], [1, "suggested-item", 3, "click"], [1, "suggested-answers-list"], [1, "rating-prompt"], [1, "rating-buttons"], ["title", "This was helpful", 1, "fa-solid", "fa-thumbs-up", 3, "click"], ["title", "This wasn't helpful", 1, "fa-solid", "fa-thumbs-down", 3, "click"], [3, "close", "title", "minWidth", "width"], [1, "input-wrapper"], ["placeholder", "What feedback would you like to share about this response?", 3, "ngModelChange", "ngModel", "rows", "resizable"], ["kendoButton", "", "themeColor", "primary", 3, "click"], ["kendoButton", "", 3, "click"], [1, "rating-status-text"], [1, "fa-solid", "fa-thumbs-up", "rating-icon-selected"], [1, "fa-solid", "fa-thumbs-down", "rating-icon-selected"]], template: function SkipSingleMessageComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵelementStart(0, "div")(1, "div", 1)(2, "div", 2);
+            i0.ɵɵtemplate(3, SkipSingleMessageComponent_Conditional_3_Template, 1, 1, "img", 3)(4, SkipSingleMessageComponent_Conditional_4_Template, 1, 0, "span", 4);
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(5, "div", 5)(6, "div", 6);
+            i0.ɵɵtext(7);
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(8, "div");
+            i0.ɵɵtemplate(9, SkipSingleMessageComponent_Conditional_9_Template, 3, 1);
+            i0.ɵɵtext(10);
+            i0.ɵɵtemplate(11, SkipSingleMessageComponent_Conditional_11_Template, 3, 0, "div", 7)(12, SkipSingleMessageComponent_Conditional_12_Template, 2, 1, "div", 8)(13, SkipSingleMessageComponent_Conditional_13_Template, 4, 2, "div", 9);
+            i0.ɵɵelementEnd();
+            i0.ɵɵtemplate(14, SkipSingleMessageComponent_Conditional_14_Template, 2, 0, "div")(15, SkipSingleMessageComponent_div_15_Template, 5, 1, "div", 10)(16, SkipSingleMessageComponent_div_16_Template, 3, 1, "div", 10)(17, SkipSingleMessageComponent_Conditional_17_Template, 6, 0, "div", 11)(18, SkipSingleMessageComponent_kendo_dialog_18_Template, 10, 6, "kendo-dialog", 12)(19, SkipSingleMessageComponent_Conditional_19_Template, 5, 2, "div", 13);
+            i0.ɵɵelementEnd()()();
+        } if (rf & 2) {
+            i0.ɵɵadvance();
+            i0.ɵɵproperty("ngClass", ctx.GetMessageRowCssClass());
+            i0.ɵɵadvance(2);
+            i0.ɵɵconditional(ctx.GetUserImageSource() ? 3 : 4);
+            i0.ɵɵadvance(2);
+            i0.ɵɵproperty("id", "skip_message_" + ctx.ConversationDetailRecord.ID);
+            i0.ɵɵadvance(2);
+            i0.ɵɵtextInterpolate(ctx.IsAIMessage ? "Skip" : ctx.ConversationUser ? ctx.ConversationUser.FirstName + " " + ctx.ConversationUser.LastName : "You");
+            i0.ɵɵadvance(2);
+            i0.ɵɵconditional(ctx.IsTemporaryMessage ? 9 : -1);
+            i0.ɵɵadvance();
+            i0.ɵɵtextInterpolate1(" ", ctx.Message, " ");
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(!ctx.IsTemporaryMessage && !ctx.IsAIMessage && ctx.ShowMessageEditPanel && !ctx.ConversationProcessing ? 11 : -1);
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(ctx.ShouldShowCompletionTime ? 12 : -1);
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(ctx.HasArtifact ? 13 : -1);
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(!ctx.HasArtifact ? 14 : -1);
+            i0.ɵɵadvance();
+            i0.ɵɵproperty("ngIf", ctx.IsAIMessage && ctx.SuggestedQuestions.length > 0 && ctx.IsLastMessageInConversation && ctx.ShowSuggestedQuestions && (!ctx.HideSuggestedQuestionsAfterClick || !ctx.SuggestedQuestionsClicked));
+            i0.ɵɵadvance();
+            i0.ɵɵproperty("ngIf", ctx.IsAIMessage && ctx.SuggestedAnswers.length > 0 && ctx.IsLastMessageInConversation && ctx.ShowSuggestedAnswers && (!ctx.HideSuggestedAnswersAfterClick || !ctx.SuggestedAnswersClicked));
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(!ctx.IsTemporaryMessage && ctx.ShouldShowRating ? 17 : -1);
+            i0.ɵɵadvance();
+            i0.ɵɵproperty("ngIf", ctx.ShowingFeedbackDialog);
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(!ctx.IsTemporaryMessage && ctx.IsAIMessage && ctx.ConversationDetailRecord.UserRating !== null && ctx.UserJustRated ? 19 : -1);
+        } }, dependencies: [i2.NgClass, i2.NgForOf, i2.NgIf, i3.NgControlStatus, i3.NgModel, i4.LoaderComponent, i5.DialogComponent, i5.DialogActionsComponent, i6.TextAreaComponent, i7.ButtonComponent], styles: [".message-row[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: start; \n\n    \n\n    justify-content: center; \n\n   \n    padding: 10px;\n}\n\n.message[_ngcontent-%COMP%] {\n    word-wrap: break-word;\n    width: 100%;\n    margin-right: 20px;\n    padding-bottom: 30px; \n\n    min-height: 60px; \n\n    position: relative; \n\n    @media (min-width: 1280px) {\n        max-width: 48rem;\n    }\n}\n\n.message-actions[_ngcontent-%COMP%] {\n    position: absolute;\n    bottom: 5px;\n    right: 10px;\n    background-color: #ffffff;\n    border-radius: 20px;\n    padding: 6px 10px;\n    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);\n    z-index: 10;\n    transition: opacity 0.3s ease, transform 0.3s ease;\n    border: 1px solid #e0e0e0;\n    opacity: 0;\n    transform: translateY(5px) scale(0.95);\n    pointer-events: none;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n}\n\n.message[_ngcontent-%COMP%]:hover   .message-actions[_ngcontent-%COMP%] {\n    opacity: 1;\n    transform: translateY(0) scale(1);\n    pointer-events: auto;\n}\n \n.message-actions[_ngcontent-%COMP%]    > span[_ngcontent-%COMP%] {\n    margin: 0 5px;\n    color: #6e7072;\n    cursor: pointer;\n    font-size: 14px;\n    padding: 3px;\n    transition: all 0.2s ease;\n    width: 18px;\n    height: 18px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    border-radius: 50%;\n}\n\n.message-actions[_ngcontent-%COMP%]    > span[_ngcontent-%COMP%]:hover {\n    color: #333;\n    background-color: #f5f5f5;\n}\n\n.message-actions[_ngcontent-%COMP%]    > span.fa-edit[_ngcontent-%COMP%]:hover {\n    color: #4285f4;\n}\n\n.message-actions[_ngcontent-%COMP%]    > span.fa-trash[_ngcontent-%COMP%]:hover {\n    color: #ea4335;\n}\n\n.message-image[_ngcontent-%COMP%] {\n    max-width: 24px;\n    max-height: 24px;\n    margin-right: 10px;\n    margin-left: 5px;\n    margin-bottom: 10px;\n}\n.message-image[_ngcontent-%COMP%]    > img[_ngcontent-%COMP%] {\n    max-width: 100%;\n    max-height: 100%;\n}\n\n\n\n.error-message[_ngcontent-%COMP%] {\n    background-color:lightpink;\n}\n\n.ai-message-in-progress[_ngcontent-%COMP%] {\n    \n\n    opacity: 0.9;\n}\n\n.elapsed-time[_ngcontent-%COMP%] {\n    font-style: regular;\n    font-size: 0.8rem;\n    color: #124be7;\n    margin-left: 5px;\n    margin-right: 5px;\n}\n\n.message-user-name[_ngcontent-%COMP%] {\n    font-weight: 600;\n    margin-top: 0px;\n    margin-bottom: 10px;\n    padding-bottom: 7px;\n    height: .5rem;\n}\n\n.suggested-container[_ngcontent-%COMP%] {\n    margin-right: 20px; \n\n    display: flex;\n    flex-direction: column;\n    align-items: left;\n    justify-content: left;\n    padding: 10px;\n    margin-top: 10px;\n    margin-bottom: 10px;\n    border: solid 1px rgba(28, 103, 202, 0.08);\n    background-color: rgb(241, 236, 227);\n}\n.suggested-header[_ngcontent-%COMP%] {\n    font-weight: 600;\n    margin-bottom: 10px;\n}\n.suggested-questions-list[_ngcontent-%COMP%] {\n    display: flex;\n    flex-wrap: wrap;\n}\n.suggested-answers-list[_ngcontent-%COMP%] {\n    display: flex;\n    flex-wrap: none;\n}\n.suggested-item[_ngcontent-%COMP%] {\n    margin: 5px;\n    padding: 5px 10px;\n    border-radius: 5px;\n    background-color: #f5f5f5;\n    cursor: pointer;\n    transition: background-color 0.3s;\n}\n.suggested-item[_ngcontent-%COMP%]:hover {\n    background-color: #96d0f1;\n}\n\n.default-user-image[_ngcontent-%COMP%] {\n    width: 24px;\n    font-size: 22px;\n}\n\n\n\n.message-rating[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    margin-top: 15px;\n    padding: 8px 12px;\n    background-color: #f5f5f5;\n    border-radius: 8px;\n    width: fit-content;\n}\n\n.rating-prompt[_ngcontent-%COMP%] {\n    font-size: 0.9rem;\n    margin-bottom: 8px;\n    color: #555;\n}\n\n.rating-buttons[_ngcontent-%COMP%] {\n    display: flex;\n    gap: 15px;\n}\n\n.rating-buttons[_ngcontent-%COMP%]   span[_ngcontent-%COMP%] {\n    font-size: 1.2rem;\n    cursor: pointer;\n    padding: 5px;\n    border-radius: 4px;\n    transition: all 0.2s ease;\n}\n\n.fa-thumbs-up[_ngcontent-%COMP%] {\n    color: #4caf50;\n}\n\n.fa-thumbs-up[_ngcontent-%COMP%]:hover {\n    background-color: rgba(76, 175, 80, 0.1);\n    transform: scale(1.1);\n}\n\n.fa-thumbs-down[_ngcontent-%COMP%] {\n    color: #f44336;\n}\n\n.fa-thumbs-down[_ngcontent-%COMP%]:hover {\n    background-color: rgba(244, 67, 54, 0.1);\n    transform: scale(1.1);\n}\n\n.rating-feedback[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    margin-top: 12px;\n    color: #666;\n    font-size: 0.85rem;\n    font-style: italic;\n}\n\n.rating-status-text[_ngcontent-%COMP%] {\n    margin-right: 8px;\n}\n\n.rating-icon-selected[_ngcontent-%COMP%] {\n    font-size: 0.9rem;\n}\n\n\n\n.artifact-indicator[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    margin-top: 12px;\n    padding: 12px 16px;\n    background-color: #eef6ff;\n    border: 1px solid #d0e1fd;\n    border-radius: 6px;\n    cursor: pointer;\n    transition: all 0.2s ease;\n    width: 100%;\n    box-sizing: border-box;\n}\n\n.artifact-indicator[_ngcontent-%COMP%]:hover {\n    background-color: #d2e5ff;\n    border-color: #a9c9fc;\n}\n\n.artifact-indicator[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: 16px;\n    color: #4285f4;\n    margin-right: 10px;\n}\n\n.artifact-label[_ngcontent-%COMP%] {\n    font-size: 14px;\n    color: #4285f4;\n    font-weight: 500;\n}\n\n.completion-time[_ngcontent-%COMP%] {\n    font-size: 12px;\n    color: #666;\n    font-style: italic;\n    margin-top: 5px;\n    display: inline-block;\n}\n\n\n\n  .input-wrapper {\n    margin-bottom: 16px;\n}\n\n  .input-wrapper label {\n    display: block;\n    font-weight: 500;\n    margin-bottom: 8px;\n    color: #333;\n}\n\n  .k-dialog-actions {\n    padding: 16px 20px;\n    border-top: 1px solid #eee;\n}\n\n  .k-dialog button[kendoButton], \n  .k-window button[kendoButton] {\n    padding: 8px 16px;\n    border-radius: 4px;\n    font-weight: 500;\n    transition: all 0.2s ease;\n}\n\n  .k-textbox-container, \n  .k-textarea-container {\n    width: 100%;\n}\n\n  .k-textarea {\n    width: 100%;\n    font-family: inherit;\n    font-size: 1rem;\n    border-color: #ddd;\n    padding: 8px 12px;\n    border-radius: 4px;\n    resize: none;\n    box-sizing: border-box;\n}\n\n\n\n  .k-textarea-container .k-resize-handle {\n    background-color: #ddd;\n    height: 6px;\n    border-radius: 0 0 4px 4px;\n}\n\n  .k-textarea-container .k-resize-handle:hover {\n    background-color: #5cc0ed;\n}\n\n  .k-textarea:focus {\n    border-color: #5cc0ed;\n    box-shadow: 0 0 0 2px rgba(92, 192, 237, 0.2);\n}\n\n\n\n  .k-dialog {\n    max-height: 90vh;\n    overflow: auto;\n}"] });
 }
-SkipSingleMessageComponent._detailHtml = {};
-SkipSingleMessageComponent.ɵfac = function SkipSingleMessageComponent_Factory(t) { return new (t || SkipSingleMessageComponent)(i0.ɵɵdirectiveInject(i0.ChangeDetectorRef), i0.ɵɵdirectiveInject(i1.MJNotificationService)); };
-SkipSingleMessageComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SkipSingleMessageComponent, selectors: [["mj-skip-single-message"]], viewQuery: function SkipSingleMessageComponent_Query(rf, ctx) { if (rf & 1) {
-        i0.ɵɵviewQuery(_c0, 5, ViewContainerRef);
-    } if (rf & 2) {
-        let _t;
-        i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.reportContainerRef = _t.first);
-    } }, inputs: { ConversationRecord: "ConversationRecord", ConversationDetailRecord: "ConversationDetailRecord", ConversationUser: "ConversationUser", DataContext: "DataContext", ConversationMessages: "ConversationMessages", ConversationProcessing: "ConversationProcessing", SkipMarkOnlyLogoURL: "SkipMarkOnlyLogoURL", UserImage: "UserImage", DefaultUserImage: "DefaultUserImage", loadTime: "loadTime", ShowMessageEditPanel: "ShowMessageEditPanel", ShowMessageRating: "ShowMessageRating", ShowArtifactIndicator: "ShowArtifactIndicator", ShowSuggestedQuestions: "ShowSuggestedQuestions", HideSuggestedQuestionsAfterClick: "HideSuggestedQuestionsAfterClick", ShowSuggestedAnswers: "ShowSuggestedAnswers", HideSuggestedAnswersAfterClick: "HideSuggestedAnswersAfterClick" }, outputs: { SuggestedQuestionSelected: "SuggestedQuestionSelected", SuggestedAnswerSelected: "SuggestedAnswerSelected", NavigateToMatchingReport: "NavigateToMatchingReport", NewReportCreated: "NewReportCreated", EditMessageRequested: "EditMessageRequested", DeleteMessageRequested: "DeleteMessageRequested", DrillDownEvent: "DrillDownEvent", ArtifactSelected: "ArtifactSelected" }, features: [i0.ɵɵInheritDefinitionFeature], decls: 20, vars: 15, consts: [["reportContainer", ""], [1, "message-row", 3, "ngClass"], [1, "message-image"], [1, "avatar", 3, "src"], [1, "fa-solid", "fa-user", "default-user-image"], [1, "message", 3, "id"], [1, "message-user-name"], ["title", "Message actions", 1, "message-actions"], [1, "completion-time"], [1, "artifact-indicator"], ["class", "suggested-container", 4, "ngIf"], [1, "message-rating"], [3, "title", "minWidth", "width", "close", 4, "ngIf"], [1, "rating-feedback"], [1, "elapsed-time"], ["title", "Edit message", 1, "fa-solid", "fa-edit", 3, "click"], ["title", "Delete message", 1, "fa-solid", "fa-trash", 3, "click"], [1, "artifact-indicator", 3, "click"], [1, "fa-solid", "fa-file-lines"], [1, "artifact-label"], [1, "suggested-container"], [1, "suggested-header"], [1, "suggested-questions-list"], ["class", "suggested-item", 3, "click", 4, "ngFor", "ngForOf"], [1, "suggested-item", 3, "click"], [1, "suggested-answers-list"], [1, "rating-prompt"], [1, "rating-buttons"], ["title", "This was helpful", 1, "fa-solid", "fa-thumbs-up", 3, "click"], ["title", "This wasn't helpful", 1, "fa-solid", "fa-thumbs-down", 3, "click"], [3, "close", "title", "minWidth", "width"], [1, "input-wrapper"], ["placeholder", "What feedback would you like to share about this response?", 3, "ngModelChange", "ngModel", "rows", "resizable"], ["kendoButton", "", "themeColor", "primary", 3, "click"], ["kendoButton", "", 3, "click"], [1, "rating-status-text"], [1, "fa-solid", "fa-thumbs-up", "rating-icon-selected"], [1, "fa-solid", "fa-thumbs-down", "rating-icon-selected"]], template: function SkipSingleMessageComponent_Template(rf, ctx) { if (rf & 1) {
-        i0.ɵɵelementStart(0, "div")(1, "div", 1)(2, "div", 2);
-        i0.ɵɵtemplate(3, SkipSingleMessageComponent_Conditional_3_Template, 1, 1, "img", 3)(4, SkipSingleMessageComponent_Conditional_4_Template, 1, 0, "span", 4);
-        i0.ɵɵelementEnd();
-        i0.ɵɵelementStart(5, "div", 5)(6, "div", 6);
-        i0.ɵɵtext(7);
-        i0.ɵɵelementEnd();
-        i0.ɵɵelementStart(8, "div");
-        i0.ɵɵtemplate(9, SkipSingleMessageComponent_Conditional_9_Template, 3, 1);
-        i0.ɵɵtext(10);
-        i0.ɵɵtemplate(11, SkipSingleMessageComponent_Conditional_11_Template, 3, 0, "div", 7)(12, SkipSingleMessageComponent_Conditional_12_Template, 2, 1, "div", 8)(13, SkipSingleMessageComponent_Conditional_13_Template, 4, 2, "div", 9);
-        i0.ɵɵelementEnd();
-        i0.ɵɵtemplate(14, SkipSingleMessageComponent_Conditional_14_Template, 2, 0, "div")(15, SkipSingleMessageComponent_div_15_Template, 5, 1, "div", 10)(16, SkipSingleMessageComponent_div_16_Template, 3, 1, "div", 10)(17, SkipSingleMessageComponent_Conditional_17_Template, 6, 0, "div", 11)(18, SkipSingleMessageComponent_kendo_dialog_18_Template, 10, 6, "kendo-dialog", 12)(19, SkipSingleMessageComponent_Conditional_19_Template, 5, 2, "div", 13);
-        i0.ɵɵelementEnd()()();
-    } if (rf & 2) {
-        i0.ɵɵadvance();
-        i0.ɵɵproperty("ngClass", ctx.GetMessageRowCssClass());
-        i0.ɵɵadvance(2);
-        i0.ɵɵconditional(ctx.GetUserImageSource() ? 3 : 4);
-        i0.ɵɵadvance(2);
-        i0.ɵɵproperty("id", "skip_message_" + ctx.ConversationDetailRecord.ID);
-        i0.ɵɵadvance(2);
-        i0.ɵɵtextInterpolate(ctx.IsAIMessage ? "Skip" : ctx.ConversationUser ? ctx.ConversationUser.FirstName + " " + ctx.ConversationUser.LastName : "You");
-        i0.ɵɵadvance(2);
-        i0.ɵɵconditional(ctx.IsTemporaryMessage ? 9 : -1);
-        i0.ɵɵadvance();
-        i0.ɵɵtextInterpolate1(" ", ctx.Message, " ");
-        i0.ɵɵadvance();
-        i0.ɵɵconditional(!ctx.IsTemporaryMessage && !ctx.IsAIMessage && ctx.ShowMessageEditPanel && !ctx.ConversationProcessing ? 11 : -1);
-        i0.ɵɵadvance();
-        i0.ɵɵconditional(ctx.ShouldShowCompletionTime ? 12 : -1);
-        i0.ɵɵadvance();
-        i0.ɵɵconditional(ctx.HasArtifact ? 13 : -1);
-        i0.ɵɵadvance();
-        i0.ɵɵconditional(!ctx.HasArtifact ? 14 : -1);
-        i0.ɵɵadvance();
-        i0.ɵɵproperty("ngIf", ctx.IsAIMessage && ctx.SuggestedQuestions.length > 0 && ctx.IsLastMessageInConversation && ctx.ShowSuggestedQuestions && (!ctx.HideSuggestedQuestionsAfterClick || !ctx.SuggestedQuestionsClicked));
-        i0.ɵɵadvance();
-        i0.ɵɵproperty("ngIf", ctx.IsAIMessage && ctx.SuggestedAnswers.length > 0 && ctx.IsLastMessageInConversation && ctx.ShowSuggestedAnswers && (!ctx.HideSuggestedAnswersAfterClick || !ctx.SuggestedAnswersClicked));
-        i0.ɵɵadvance();
-        i0.ɵɵconditional(!ctx.IsTemporaryMessage && ctx.ShouldShowRating ? 17 : -1);
-        i0.ɵɵadvance();
-        i0.ɵɵproperty("ngIf", ctx.ShowingFeedbackDialog);
-        i0.ɵɵadvance();
-        i0.ɵɵconditional(!ctx.IsTemporaryMessage && ctx.IsAIMessage && ctx.ConversationDetailRecord.UserRating !== null && ctx.UserJustRated ? 19 : -1);
-    } }, dependencies: [i2.NgClass, i2.NgForOf, i2.NgIf, i3.NgControlStatus, i3.NgModel, i4.LoaderComponent, i5.DialogComponent, i5.DialogActionsComponent, i6.TextAreaComponent, i7.ButtonComponent], styles: [".message-row[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: start; \n\n    \n\n    justify-content: center; \n\n   \n    padding: 10px;\n}\n\n.message[_ngcontent-%COMP%] {\n    word-wrap: break-word;\n    width: 100%;\n    margin-right: 20px;\n    padding-bottom: 30px; \n\n    min-height: 60px; \n\n    position: relative; \n\n    @media (min-width: 1280px) {\n        max-width: 48rem;\n    }\n}\n\n.message-actions[_ngcontent-%COMP%] {\n    position: absolute;\n    bottom: 5px;\n    right: 10px;\n    background-color: #ffffff;\n    border-radius: 20px;\n    padding: 6px 10px;\n    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);\n    z-index: 10;\n    transition: opacity 0.3s ease, transform 0.3s ease;\n    border: 1px solid #e0e0e0;\n    opacity: 0;\n    transform: translateY(5px) scale(0.95);\n    pointer-events: none;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n}\n\n.message[_ngcontent-%COMP%]:hover   .message-actions[_ngcontent-%COMP%] {\n    opacity: 1;\n    transform: translateY(0) scale(1);\n    pointer-events: auto;\n}\n \n.message-actions[_ngcontent-%COMP%]    > span[_ngcontent-%COMP%] {\n    margin: 0 5px;\n    color: #6e7072;\n    cursor: pointer;\n    font-size: 14px;\n    padding: 3px;\n    transition: all 0.2s ease;\n    width: 18px;\n    height: 18px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    border-radius: 50%;\n}\n\n.message-actions[_ngcontent-%COMP%]    > span[_ngcontent-%COMP%]:hover {\n    color: #333;\n    background-color: #f5f5f5;\n}\n\n.message-actions[_ngcontent-%COMP%]    > span.fa-edit[_ngcontent-%COMP%]:hover {\n    color: #4285f4;\n}\n\n.message-actions[_ngcontent-%COMP%]    > span.fa-trash[_ngcontent-%COMP%]:hover {\n    color: #ea4335;\n}\n\n.message-image[_ngcontent-%COMP%] {\n    max-width: 24px;\n    max-height: 24px;\n    margin-right: 10px;\n    margin-left: 5px;\n    margin-bottom: 10px;\n}\n.message-image[_ngcontent-%COMP%]    > img[_ngcontent-%COMP%] {\n    max-width: 100%;\n    max-height: 100%;\n}\n\n\n\n.error-message[_ngcontent-%COMP%] {\n    background-color:lightpink;\n}\n\n.ai-message-in-progress[_ngcontent-%COMP%] {\n    \n\n    opacity: 0.9;\n}\n\n.elapsed-time[_ngcontent-%COMP%] {\n    font-style: regular;\n    font-size: 0.8rem;\n    color: #124be7;\n    margin-left: 5px;\n    margin-right: 5px;\n}\n\n.message-user-name[_ngcontent-%COMP%] {\n    font-weight: 600;\n    margin-top: 0px;\n    margin-bottom: 10px;\n    padding-bottom: 7px;\n    height: .5rem;\n}\n\n.suggested-container[_ngcontent-%COMP%] {\n    margin-right: 20px; \n\n    display: flex;\n    flex-direction: column;\n    align-items: left;\n    justify-content: left;\n    padding: 10px;\n    margin-top: 10px;\n    margin-bottom: 10px;\n    border: solid 1px rgba(28, 103, 202, 0.08);\n    background-color: rgb(241, 236, 227);\n}\n.suggested-header[_ngcontent-%COMP%] {\n    font-weight: 600;\n    margin-bottom: 10px;\n}\n.suggested-questions-list[_ngcontent-%COMP%] {\n    display: flex;\n    flex-wrap: wrap;\n}\n.suggested-answers-list[_ngcontent-%COMP%] {\n    display: flex;\n    flex-wrap: none;\n}\n.suggested-item[_ngcontent-%COMP%] {\n    margin: 5px;\n    padding: 5px 10px;\n    border-radius: 5px;\n    background-color: #f5f5f5;\n    cursor: pointer;\n    transition: background-color 0.3s;\n}\n.suggested-item[_ngcontent-%COMP%]:hover {\n    background-color: #96d0f1;\n}\n\n.default-user-image[_ngcontent-%COMP%] {\n    width: 24px;\n    font-size: 22px;\n}\n\n\n\n.message-rating[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    margin-top: 15px;\n    padding: 8px 12px;\n    background-color: #f5f5f5;\n    border-radius: 8px;\n    width: fit-content;\n}\n\n.rating-prompt[_ngcontent-%COMP%] {\n    font-size: 0.9rem;\n    margin-bottom: 8px;\n    color: #555;\n}\n\n.rating-buttons[_ngcontent-%COMP%] {\n    display: flex;\n    gap: 15px;\n}\n\n.rating-buttons[_ngcontent-%COMP%]   span[_ngcontent-%COMP%] {\n    font-size: 1.2rem;\n    cursor: pointer;\n    padding: 5px;\n    border-radius: 4px;\n    transition: all 0.2s ease;\n}\n\n.fa-thumbs-up[_ngcontent-%COMP%] {\n    color: #4caf50;\n}\n\n.fa-thumbs-up[_ngcontent-%COMP%]:hover {\n    background-color: rgba(76, 175, 80, 0.1);\n    transform: scale(1.1);\n}\n\n.fa-thumbs-down[_ngcontent-%COMP%] {\n    color: #f44336;\n}\n\n.fa-thumbs-down[_ngcontent-%COMP%]:hover {\n    background-color: rgba(244, 67, 54, 0.1);\n    transform: scale(1.1);\n}\n\n.rating-feedback[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    margin-top: 12px;\n    color: #666;\n    font-size: 0.85rem;\n    font-style: italic;\n}\n\n.rating-status-text[_ngcontent-%COMP%] {\n    margin-right: 8px;\n}\n\n.rating-icon-selected[_ngcontent-%COMP%] {\n    font-size: 0.9rem;\n}\n\n\n\n.artifact-indicator[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    margin-top: 12px;\n    padding: 12px 16px;\n    background-color: #eef6ff;\n    border: 1px solid #d0e1fd;\n    border-radius: 6px;\n    cursor: pointer;\n    transition: all 0.2s ease;\n    width: 100%;\n    box-sizing: border-box;\n}\n\n.artifact-indicator[_ngcontent-%COMP%]:hover {\n    background-color: #d2e5ff;\n    border-color: #a9c9fc;\n}\n\n.artifact-indicator[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: 16px;\n    color: #4285f4;\n    margin-right: 10px;\n}\n\n.artifact-label[_ngcontent-%COMP%] {\n    font-size: 14px;\n    color: #4285f4;\n    font-weight: 500;\n}\n\n.completion-time[_ngcontent-%COMP%] {\n    font-size: 12px;\n    color: #666;\n    font-style: italic;\n    margin-top: 5px;\n    display: inline-block;\n}\n\n\n\n  .input-wrapper {\n    margin-bottom: 16px;\n}\n\n  .input-wrapper label {\n    display: block;\n    font-weight: 500;\n    margin-bottom: 8px;\n    color: #333;\n}\n\n  .k-dialog-actions {\n    padding: 16px 20px;\n    border-top: 1px solid #eee;\n}\n\n  .k-dialog button[kendoButton], \n  .k-window button[kendoButton] {\n    padding: 8px 16px;\n    border-radius: 4px;\n    font-weight: 500;\n    transition: all 0.2s ease;\n}\n\n  .k-textbox-container, \n  .k-textarea-container {\n    width: 100%;\n}\n\n  .k-textarea {\n    width: 100%;\n    font-family: inherit;\n    font-size: 1rem;\n    border-color: #ddd;\n    padding: 8px 12px;\n    border-radius: 4px;\n    resize: none;\n    box-sizing: border-box;\n}\n\n\n\n  .k-textarea-container .k-resize-handle {\n    background-color: #ddd;\n    height: 6px;\n    border-radius: 0 0 4px 4px;\n}\n\n  .k-textarea-container .k-resize-handle:hover {\n    background-color: #5cc0ed;\n}\n\n  .k-textarea:focus {\n    border-color: #5cc0ed;\n    box-shadow: 0 0 0 2px rgba(92, 192, 237, 0.2);\n}\n\n\n\n  .k-dialog {\n    max-height: 90vh;\n    overflow: auto;\n}"] });
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SkipSingleMessageComponent, [{
         type: Component,
         args: [{ selector: 'mj-skip-single-message', template: "<div>\n    <div class=\"message-row\" [ngClass]=\"GetMessageRowCssClass()\" > \n        <div class=\"message-image\">\n            @if (GetUserImageSource()) {\n                <img [src]=\"GetUserImageSource()\" class=\"avatar\" />\n            }\n            @else {\n                <span class=\"fa-solid fa-user default-user-image\"></span>\n            }\n        </div>\n        <div class=\"message\" \n            [id]=\"'skip_message_' + ConversationDetailRecord.ID\">\n            <div class=\"message-user-name\">{{IsAIMessage ? 'Skip' : (ConversationUser ? ConversationUser.FirstName + ' ' + ConversationUser.LastName : 'You')}}</div>\n            <div>\n                @if(IsTemporaryMessage) {\n                    <kendo-loader></kendo-loader>\n                    <span class=\"elapsed-time\">{{ElapsedTimeSinceLoadFormatted}}</span>\n                }\n                {{Message}}\n                @if(!IsTemporaryMessage && !IsAIMessage && ShowMessageEditPanel && !ConversationProcessing) {\n                    <!-- this is a user message, so we need to offer the ability to edit/delete the message. -->\n                    <div class=\"message-actions\" title=\"Message actions\">\n                        <span class=\"fa-solid fa-edit\" (click)=\"RaiseMessageEditRequest()\" title=\"Edit message\"></span>\n                        <span class=\"fa-solid fa-trash\" (click)=\"RaiseMessageDeleteRequest()\" title=\"Delete message\"></span>\n                    </div>\n                }\n                \n                @if(ShouldShowCompletionTime) {\n                    <div class=\"completion-time\">{{CompletionTimeFormatted}}</div>\n                }\n                \n                @if(HasArtifact) {\n                    <!-- Artifact indicator for messages with associated artifacts -->\n                    <div class=\"artifact-indicator\" (click)=\"onArtifactIndicatorClick()\">\n                        <i class=\"fa-solid fa-file-lines\"></i>\n                        <span class=\"artifact-label\">{{ArtifactName || 'View Artifact'}}{{ArtifactVersion ? ' v' + ArtifactVersion : ''}}</span>\n                    </div>\n                }\n            </div>\n            @if (!HasArtifact) {\n                <div #reportContainer>\n                    <!-- this is where the report will go - dynamically instantiated -->\n                </div>\n            }\n            <div *ngIf=\"IsAIMessage && \n                        SuggestedQuestions.length > 0 && \n                        IsLastMessageInConversation && \n                        ShowSuggestedQuestions && \n                        (!HideSuggestedQuestionsAfterClick || !SuggestedQuestionsClicked)\" class=\"suggested-container\">\n                <div class=\"suggested-header\">Suggested Questions</div>\n                <div class=\"suggested-questions-list\">\n                    <div class=\"suggested-item\" *ngFor=\"let question of SuggestedQuestions\" (click)=\"RaiseSuggestedQuestionSelectedEvent(question)\">\n                        {{question}}\n                    </div>\n                </div>\n            </div>\n            <div *ngIf=\"IsAIMessage && \n                        SuggestedAnswers.length > 0 && \n                        IsLastMessageInConversation &&\n                        ShowSuggestedAnswers && \n                        (!HideSuggestedAnswersAfterClick || !SuggestedAnswersClicked)\" class=\"suggested-container\">\n                <div class=\"suggested-answers-list\">\n                    <div class=\"suggested-item\" *ngFor=\"let answer of SuggestedAnswers\" (click)=\"RaiseSuggestedAnswerSelectedEvent(answer)\">\n                        {{answer}}\n                    </div>\n                </div>\n            </div>\n\n            <!-- Rating UI for AI messages that haven't been rated yet -->\n            @if(!IsTemporaryMessage && ShouldShowRating) {\n                <div class=\"message-rating\">\n                    <div class=\"rating-prompt\">Was this response helpful?</div>\n                    <div class=\"rating-buttons\">\n                        <span class=\"fa-solid fa-thumbs-up\" (click)=\"ShowFeedbackDialog(10)\" title=\"This was helpful\"></span>\n                        <span class=\"fa-solid fa-thumbs-down\" (click)=\"ShowFeedbackDialog(1)\" title=\"This wasn't helpful\"></span>\n                    </div>\n                </div>\n            }\n            <!-- Kendo Dialog for feedback -->\n            <kendo-dialog *ngIf=\"ShowingFeedbackDialog\" \n                          [title]=\"FeedbackDialogTitle\"\n                          [minWidth]=\"400\"\n                          [width]=\"750\"\n                          (close)=\"CancelFeedback()\">\n                <div class=\"input-wrapper\">\n                    <label>Feedback</label>\n                    <kendo-textarea\n                        placeholder=\"What feedback would you like to share about this response?\" \n                        [(ngModel)]=\"UserFeedbackText\"\n                        [rows]=\"12\"\n                        [resizable]=\"'none'\">\n                    </kendo-textarea>\n                </div>\n                <kendo-dialog-actions>\n                    <button kendoButton (click)=\"SubmitFeedback()\" themeColor=\"primary\">Submit</button>\n                    <button kendoButton (click)=\"CancelFeedback()\">Cancel</button>\n                </kendo-dialog-actions>\n            </kendo-dialog>\n            <!-- Show rating feedback after user has rated  - ONLY AFTER THE USER JUST FINISHED RATING, never in future refreshes of the window -->\n            @if(!IsTemporaryMessage && IsAIMessage && ConversationDetailRecord.UserRating !== null && UserJustRated) {\n                <div class=\"rating-feedback\">\n                    <span class=\"rating-status-text\">{{RatingStatusText}}</span>\n                    @if(ConversationDetailRecord.UserRating === 10) {\n                        <span class=\"fa-solid fa-thumbs-up rating-icon-selected\"></span>\n                    } @else {\n                        <span class=\"fa-solid fa-thumbs-down rating-icon-selected\"></span>\n                    }\n                </div>\n            }\n        </div>\n    </div>\n</div>", styles: [".message-row {\n    display: flex;\n    align-items: start; /* if you want to align them at the top */\n    /* border-bottom: solid 1px rgba(0, 0, 0, 0.08); */\n    justify-content: center; /* Center align horizontally */\n   \n    padding: 10px;\n}\n\n.message {\n    word-wrap: break-word;\n    width: 100%;\n    margin-right: 20px;\n    padding-bottom: 30px; /* Increased to ensure space for action buttons */\n    min-height: 60px; /* Ensure minimum height for short messages */\n    position: relative; /* Ensure position relative for absolute positioning of child elements */\n    @media (min-width: 1280px) {\n        max-width: 48rem;\n    }\n}\n\n.message-actions {\n    position: absolute;\n    bottom: 5px;\n    right: 10px;\n    background-color: #ffffff;\n    border-radius: 20px;\n    padding: 6px 10px;\n    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);\n    z-index: 10;\n    transition: opacity 0.3s ease, transform 0.3s ease;\n    border: 1px solid #e0e0e0;\n    opacity: 0;\n    transform: translateY(5px) scale(0.95);\n    pointer-events: none;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n}\n\n.message:hover .message-actions {\n    opacity: 1;\n    transform: translateY(0) scale(1);\n    pointer-events: auto;\n}\n \n.message-actions > span {\n    margin: 0 5px;\n    color: #6e7072;\n    cursor: pointer;\n    font-size: 14px;\n    padding: 3px;\n    transition: all 0.2s ease;\n    width: 18px;\n    height: 18px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    border-radius: 50%;\n}\n\n.message-actions > span:hover {\n    color: #333;\n    background-color: #f5f5f5;\n}\n\n.message-actions > span.fa-edit:hover {\n    color: #4285f4;\n}\n\n.message-actions > span.fa-trash:hover {\n    color: #ea4335;\n}\n\n.message-image {\n    max-width: 24px;\n    max-height: 24px;\n    margin-right: 10px;\n    margin-left: 5px;\n    margin-bottom: 10px;\n}\n.message-image > img {\n    max-width: 100%;\n    max-height: 100%;\n}\n\n\n\n.error-message {\n    background-color:lightpink;\n}\n\n.ai-message-in-progress {\n    /* font-style: italic; */\n    opacity: 0.9;\n}\n\n.elapsed-time {\n    font-style: regular;\n    font-size: 0.8rem;\n    color: #124be7;\n    margin-left: 5px;\n    margin-right: 5px;\n}\n\n.message-user-name {\n    font-weight: 600;\n    margin-top: 0px;\n    margin-bottom: 10px;\n    padding-bottom: 7px;\n    height: .5rem;\n}\n\n.suggested-container {\n    margin-right: 20px; /*match the message class*/\n    display: flex;\n    flex-direction: column;\n    align-items: left;\n    justify-content: left;\n    padding: 10px;\n    margin-top: 10px;\n    margin-bottom: 10px;\n    border: solid 1px rgba(28, 103, 202, 0.08);\n    background-color: rgb(241, 236, 227);\n}\n.suggested-header {\n    font-weight: 600;\n    margin-bottom: 10px;\n}\n.suggested-questions-list {\n    display: flex;\n    flex-wrap: wrap;\n}\n.suggested-answers-list {\n    display: flex;\n    flex-wrap: none;\n}\n.suggested-item {\n    margin: 5px;\n    padding: 5px 10px;\n    border-radius: 5px;\n    background-color: #f5f5f5;\n    cursor: pointer;\n    transition: background-color 0.3s;\n}\n.suggested-item:hover {\n    background-color: #96d0f1;\n}\n\n.default-user-image {\n    width: 24px;\n    font-size: 22px;\n}\n\n/* Message rating styles */\n.message-rating {\n    display: flex;\n    flex-direction: column;\n    margin-top: 15px;\n    padding: 8px 12px;\n    background-color: #f5f5f5;\n    border-radius: 8px;\n    width: fit-content;\n}\n\n.rating-prompt {\n    font-size: 0.9rem;\n    margin-bottom: 8px;\n    color: #555;\n}\n\n.rating-buttons {\n    display: flex;\n    gap: 15px;\n}\n\n.rating-buttons span {\n    font-size: 1.2rem;\n    cursor: pointer;\n    padding: 5px;\n    border-radius: 4px;\n    transition: all 0.2s ease;\n}\n\n.fa-thumbs-up {\n    color: #4caf50;\n}\n\n.fa-thumbs-up:hover {\n    background-color: rgba(76, 175, 80, 0.1);\n    transform: scale(1.1);\n}\n\n.fa-thumbs-down {\n    color: #f44336;\n}\n\n.fa-thumbs-down:hover {\n    background-color: rgba(244, 67, 54, 0.1);\n    transform: scale(1.1);\n}\n\n.rating-feedback {\n    display: flex;\n    align-items: center;\n    margin-top: 12px;\n    color: #666;\n    font-size: 0.85rem;\n    font-style: italic;\n}\n\n.rating-status-text {\n    margin-right: 8px;\n}\n\n.rating-icon-selected {\n    font-size: 0.9rem;\n}\n\n/* Artifact indicator styles */\n.artifact-indicator {\n    display: flex;\n    align-items: center;\n    margin-top: 12px;\n    padding: 12px 16px;\n    background-color: #eef6ff;\n    border: 1px solid #d0e1fd;\n    border-radius: 6px;\n    cursor: pointer;\n    transition: all 0.2s ease;\n    width: 100%;\n    box-sizing: border-box;\n}\n\n.artifact-indicator:hover {\n    background-color: #d2e5ff;\n    border-color: #a9c9fc;\n}\n\n.artifact-indicator i {\n    font-size: 16px;\n    color: #4285f4;\n    margin-right: 10px;\n}\n\n.artifact-label {\n    font-size: 14px;\n    color: #4285f4;\n    font-weight: 500;\n}\n\n.completion-time {\n    font-size: 12px;\n    color: #666;\n    font-style: italic;\n    margin-top: 5px;\n    display: inline-block;\n}\n\n/* Input wrapper styles */\n::ng-deep .input-wrapper {\n    margin-bottom: 16px;\n}\n\n::ng-deep .input-wrapper label {\n    display: block;\n    font-weight: 500;\n    margin-bottom: 8px;\n    color: #333;\n}\n\n::ng-deep .k-dialog-actions {\n    padding: 16px 20px;\n    border-top: 1px solid #eee;\n}\n\n::ng-deep .k-dialog button[kendoButton],\n::ng-deep .k-window button[kendoButton] {\n    padding: 8px 16px;\n    border-radius: 4px;\n    font-weight: 500;\n    transition: all 0.2s ease;\n}\n\n::ng-deep .k-textbox-container,\n::ng-deep .k-textarea-container {\n    width: 100%;\n}\n\n::ng-deep .k-textarea {\n    width: 100%;\n    font-family: inherit;\n    font-size: 1rem;\n    border-color: #ddd;\n    padding: 8px 12px;\n    border-radius: 4px;\n    resize: none;\n    box-sizing: border-box;\n}\n\n/* Style the kendo-textarea resize handle */\n::ng-deep .k-textarea-container .k-resize-handle {\n    background-color: #ddd;\n    height: 6px;\n    border-radius: 0 0 4px 4px;\n}\n\n::ng-deep .k-textarea-container .k-resize-handle:hover {\n    background-color: #5cc0ed;\n}\n\n::ng-deep .k-textarea:focus {\n    border-color: #5cc0ed;\n    box-shadow: 0 0 0 2px rgba(92, 192, 237, 0.2);\n}\n\n/* Ensure dialog stays within viewport */\n::ng-deep .k-dialog {\n    max-height: 90vh;\n    overflow: auto;\n}"] }]