diff --git a/common/types/config.ts b/common/types/config.ts index 2b92644f..920a9521 100644 --- a/common/types/config.ts +++ b/common/types/config.ts @@ -9,6 +9,8 @@ export const configSchema = schema.object({ enabled: schema.boolean({ defaultValue: true }), chat: schema.object({ enabled: schema.boolean({ defaultValue: false }), + trace: schema.boolean({ defaultValue: true }), + feedback: schema.boolean({ defaultValue: true }), }), incontextInsight: schema.object({ enabled: schema.boolean({ defaultValue: true }), diff --git a/public/components/incontext_insight/generate_popover_body.tsx b/public/components/incontext_insight/generate_popover_body.tsx index ede3a119..7233fba3 100644 --- a/public/components/incontext_insight/generate_popover_body.tsx +++ b/public/components/incontext_insight/generate_popover_body.tsx @@ -321,6 +321,7 @@ export const GeneratePopoverBody: React.FC<{ }; const renderInnerFooter = () => { + const traceTip = 'Insight With RAG'; return ( { @@ -332,6 +333,7 @@ export const GeneratePopoverBody: React.FC<{ onViewTrace={() => { setShowInsight(true); }} + traceTip={traceTip} usageCollection={usageCollection} isOnTrace={showInsight} metricAppName={metricAppName} @@ -345,6 +347,7 @@ export const GeneratePopoverBody: React.FC<{ showFeedback showTraceIcon={insightAvailable} onViewTrace={() => {}} + traceTip={traceTip} usageCollection={usageCollection} isOnTrace={showInsight} metricAppName={metricAppName} diff --git a/public/tabs/chat/messages/message_action.tsx b/public/tabs/chat/messages/message_action.tsx index e2b84b24..d1cbdca9 100644 --- a/public/tabs/chat/messages/message_action.tsx +++ b/public/tabs/chat/messages/message_action.tsx @@ -22,6 +22,7 @@ interface MessageActionsProps { showTraceIcon?: boolean; isOnTrace?: boolean; traceInteractionId?: string; + traceTip?: string; onViewTrace?: () => void; shouldActionBarVisibleOnHover?: boolean; isFullWidth?: boolean; @@ -44,6 +45,7 @@ export const MessageActions: React.FC = ({ showTraceIcon = false, isOnTrace = false, traceInteractionId = null, + traceTip = 'info', onViewTrace, shouldActionBarVisibleOnHover = false, isFullWidth = false, @@ -146,7 +148,7 @@ export const MessageActions: React.FC = ({ trace: { show: showTraceIcon && onViewTrace, component: renderButtonWithTooltip( - 'Insight with RAG', + traceTip, ', () => { const reportUiStatsMock = jest.fn(); beforeEach(() => { + jest + .spyOn(services, 'getConfigSchema') + .mockReturnValue({ chat: { trace: true, feedback: true } }); jest .spyOn(useFeedbackHookExports, 'useFeedback') .mockReturnValue({ feedbackResult: undefined, sendFeedback: sendFeedbackMock }); @@ -289,4 +293,78 @@ describe('', () => { ); expect(screen.queryByTestId('trace-icon-bar')).toBeNull(); }); + + it('should control view trace through config flag', () => { + render( + + ); + expect(screen.queryByTestId('trace-icon-bar1')).toBeVisible(); + + jest.spyOn(services, 'getConfigSchema').mockReturnValue({ chat: { trace: false } }); + render( + + ); + expect(screen.queryByTestId('trace-icon-bar2')).toBeNull(); + }); + + it('should control feedback buttons through config flag', () => { + const { rerender } = render( + + ); + expect(screen.queryByLabelText('feedback thumbs down')).toBeVisible(); + expect(screen.queryByLabelText('feedback thumbs up')).toBeVisible(); + + jest.spyOn(services, 'getConfigSchema').mockReturnValue({ chat: { feedback: false } }); + rerender( + + ); + expect(screen.queryByLabelText('feedback thumbs down')).toBeNull(); + expect(screen.queryByLabelText('feedback thumbs up')).toBeNull(); + }); }); diff --git a/public/tabs/chat/messages/message_bubble.tsx b/public/tabs/chat/messages/message_bubble.tsx index d86997b1..708e5a5c 100644 --- a/public/tabs/chat/messages/message_bubble.tsx +++ b/public/tabs/chat/messages/message_bubble.tsx @@ -17,6 +17,7 @@ import React from 'react'; import { IconType } from '@elastic/eui/src/components/icon/icon'; import { MessageActions } from './message_action'; import { useCore } from '../../../contexts'; +import { getConfigSchema } from '../../../services'; // TODO: Replace with getChrome().logos.Chat.url import { useChatActions } from '../../../hooks'; @@ -46,8 +47,11 @@ type MessageBubbleProps = { export const MessageBubble: React.FC = React.memo((props) => { const { executeAction } = useChatActions(); const core = useCore(); + const configSchema = getConfigSchema(); + // According to the design of the feedback, only markdown type output is supported. const showFeedback = + configSchema.chat.feedback && 'message' in props && props.message.type === 'output' && props.message.contentType === 'markdown'; @@ -159,7 +163,8 @@ export const MessageBubble: React.FC = React.memo((props) => interaction={props.interaction} message={props.message as IOutput} showFeedback={showFeedback} - showTraceIcon={!!props.message.interactionId} + showTraceIcon={configSchema.chat.trace && !!props.message.interactionId} + traceTip="How was this generated?" traceInteractionId={props.message.interactionId || ''} onViewTrace={() => { const message = props.message as IOutput;