Merge pull request #5566 from gooddata/ach/gen-ai-user-feedback

RELATED: F1-645 apply user feedback from server
gooddata · Nov 22, 2024 · 44fcdff · 44fcdff
2 parents 2c4ede9 + a31a896
commit 44fcdff
Show file tree

Hide file tree

Showing 7 changed files with 48 additions and 38 deletions.
diff --git a/libs/api-client-tiger/src/index.ts b/libs/api-client-tiger/src/index.ts
@@ -183,6 +183,7 @@ export type {
     ChatHistoryRequest,
     ChatHistoryRequestUserFeedbackEnum,
     ChatHistoryInteraction,
+    ChatHistoryInteractionUserFeedbackEnum,
     ActionsApiAiChatRequest,
     ActionsApiAiChatStreamRequest,
     ActionsApiAiChatHistoryRequest,
@@ -196,7 +197,6 @@ export type {
     AttributePositiveFilter,
     DateAbsoluteFilter,
     DateRelativeFilter,
-    ChatHistoryInteractionUserFeedbackEnum,
 } from "./generated/afm-rest-api/api.js";
 export {
     AfmObjectIdentifierAttributeIdentifierTypeEnum as AfmModelObjectIdentifierAttributeIdentifierTypeEnum,

diff --git a/libs/sdk-model/api/sdk-model.api.md b/libs/sdk-model/api/sdk-model.api.md
@@ -1885,6 +1885,7 @@ export interface IGenAIChatInteraction {
     question: string;
     routing: IGenAIChatRouting;
     textResponse?: string;
+    userFeedback?: GenAIChatInteractionUserFeedback;
 }
 
 // @alpha

diff --git a/libs/sdk-model/src/genAI/chat.ts b/libs/sdk-model/src/genAI/chat.ts
@@ -259,6 +259,10 @@ export interface IGenAIChatInteraction {
      * A list of created visualizations for the interaction.
      */
     createdVisualizations?: IGenAICreatedVisualizations;
+    /**
+     * User feedback for the assistant reply.
+     */
+    userFeedback?: GenAIChatInteractionUserFeedback;
 }
 
 /**

diff --git a/libs/sdk-ui-gen-ai/src/components/messages/AssistantMessage.tsx b/libs/sdk-ui-gen-ai/src/components/messages/AssistantMessage.tsx
@@ -44,45 +44,47 @@ const AssistantMessageComponentCore: React.FC<AssistantMessageProps & WrappedCom
                     isComplete={Boolean(message.complete || message.cancelled)}
                     isCancelled={message.cancelled}
                 />
-                <div
-                    className={cx({
-                        "gd-gen-ai-chat__messages__feedback": true,
-                        "gd-gen-ai-chat__messages__feedback--assigned": message.feedback !== "NONE",
-                    })}
-                >
-                    <button
+                {message.complete ? (
+                    <div
                         className={cx({
-                            "gd-gen-ai-chat__messages__feedback__button": true,
-                            "gd-gen-ai-chat__messages__feedback__button--positive":
-                                message.feedback === "POSITIVE",
+                            "gd-gen-ai-chat__messages__feedback": true,
+                            "gd-gen-ai-chat__messages__feedback--assigned": message.feedback !== "NONE",
                         })}
-                        type="button"
-                        onClick={() =>
-                            setUserFeedback({
-                                assistantMessageId: message.localId,
-                                feedback: message.feedback === "POSITIVE" ? "NONE" : "POSITIVE",
-                            })
-                        }
                     >
-                        <Icon.ThumbsUp />
-                    </button>
-                    <button
-                        className={cx({
-                            "gd-gen-ai-chat__messages__feedback__button": true,
-                            "gd-gen-ai-chat__messages__feedback__button--negative":
-                                message.feedback === "NEGATIVE",
-                        })}
-                        type="button"
-                        onClick={() =>
-                            setUserFeedback({
-                                assistantMessageId: message.localId,
-                                feedback: message.feedback === "NEGATIVE" ? "NONE" : "NEGATIVE",
-                            })
-                        }
-                    >
-                        <Icon.ThumbsDown />
-                    </button>
-                </div>
+                        <button
+                            className={cx({
+                                "gd-gen-ai-chat__messages__feedback__button": true,
+                                "gd-gen-ai-chat__messages__feedback__button--positive":
+                                    message.feedback === "POSITIVE",
+                            })}
+                            type="button"
+                            onClick={() =>
+                                setUserFeedback({
+                                    assistantMessageId: message.localId,
+                                    feedback: message.feedback === "POSITIVE" ? "NONE" : "POSITIVE",
+                                })
+                            }
+                        >
+                            <Icon.ThumbsUp />
+                        </button>
+                        <button
+                            className={cx({
+                                "gd-gen-ai-chat__messages__feedback__button": true,
+                                "gd-gen-ai-chat__messages__feedback__button--negative":
+                                    message.feedback === "NEGATIVE",
+                            })}
+                            type="button"
+                            onClick={() =>
+                                setUserFeedback({
+                                    assistantMessageId: message.localId,
+                                    feedback: message.feedback === "NEGATIVE" ? "NONE" : "NEGATIVE",
+                                })
+                            }
+                        >
+                            <Icon.ThumbsDown />
+                        </button>
+                    </div>
+                ) : null}
             </div>
         </div>
     );

diff --git a/libs/sdk-ui-gen-ai/src/model.ts b/libs/sdk-ui-gen-ai/src/model.ts
@@ -213,13 +213,14 @@ export const makeAssistantMessage = (
     content: Contents[],
     complete = false,
     id?: number,
+    feedback: GenAIChatInteractionUserFeedback = "NONE",
 ): AssistantMessage => ({
     id: id,
     localId: uuidv4(),
     role: "assistant",
-    feedback: "NONE",
     created: Date.now(),
     cancelled: false,
+    feedback,
     complete,
     content,
 });

diff --git a/libs/sdk-ui-gen-ai/src/store/sideEffects/converters/interactionsToMessages.ts b/libs/sdk-ui-gen-ai/src/store/sideEffects/converters/interactionsToMessages.ts
@@ -33,6 +33,7 @@ export const interactionsToMessages = (interactions: IGenAIChatInteraction[]): M
                     assistantMessageContents,
                     interaction.interactionFinished,
                     interaction.chatHistoryInteractionId,
+                    interaction.userFeedback,
                 ),
             );
         }

diff --git a/libs/sdk-ui-gen-ai/styles/scss/messages.scss b/libs/sdk-ui-gen-ai/styles/scss/messages.scss
@@ -29,6 +29,7 @@
     display: flex;
     flex-direction: column;
     gap: 5px;
+    flex-grow: 1;
 }
 
 .gd-gen-ai-chat__messages__feedback {