From 65323ba8e92d7ad478b4ea7146f876454aadf9b2 Mon Sep 17 00:00:00 2001
From: Steph Milovic <stephanie.milovic@elastic.co>
Date: Wed, 19 Feb 2025 16:05:26 -0700
Subject: [PATCH] better

---
 .../data_quality_panel/actions/chat/index.tsx | 26 +++++++++----------
 .../components/ai_assistant/index.tsx         |  9 +++++--
 .../rules_table/rules_table_toolbar.tsx       | 23 +++++++---------
 .../rule_status_failed_callout.tsx            | 26 +++++++++----------
 4 files changed, 43 insertions(+), 41 deletions(-)

diff --git a/x-pack/solutions/security/packages/ecs-data-quality-dashboard/impl/data_quality_panel/actions/chat/index.tsx b/x-pack/solutions/security/packages/ecs-data-quality-dashboard/impl/data_quality_panel/actions/chat/index.tsx
index 67dc79ea7a507..6cdf688fd5172 100644
--- a/x-pack/solutions/security/packages/ecs-data-quality-dashboard/impl/data_quality_panel/actions/chat/index.tsx
+++ b/x-pack/solutions/security/packages/ecs-data-quality-dashboard/impl/data_quality_panel/actions/chat/index.tsx
@@ -6,7 +6,7 @@
  */
 
 import React, { FC, useCallback } from 'react';
-import { NewChatByTitle, useAssistantOverlay } from '@kbn/elastic-assistant';
+import { NewChat } from '@kbn/elastic-assistant';
 import { css } from '@emotion/react';
 import { useEuiTheme } from '@elastic/eui';
 
@@ -41,23 +41,23 @@ const ChatActionComponent: FC<Props> = ({ indexName, markdownComment, chatTitle
   const styles = useStyles();
   const { isAssistantEnabled } = useDataQualityContext();
   const getPromptContext = useCallback(async () => markdownComment, [markdownComment]);
-  const { showAssistantOverlay } = useAssistantOverlay(
-    'data-quality-dashboard',
-    chatTitle ?? DATA_QUALITY_DASHBOARD_CONVERSATION_ID,
-    DATA_QUALITY_PROMPT_CONTEXT_PILL(indexName),
-    getPromptContext,
-    null,
-    DATA_QUALITY_SUGGESTED_USER_PROMPT,
-    DATA_QUALITY_PROMPT_CONTEXT_PILL_TOOLTIP,
-    isAssistantEnabled
-  );
   return (
-    <NewChatByTitle asLink showAssistantOverlay={showAssistantOverlay}>
+    <NewChat
+      asLink={true}
+      category="data-quality-dashboard"
+      conversationId={chatTitle ?? DATA_QUALITY_DASHBOARD_CONVERSATION_ID}
+      description={DATA_QUALITY_PROMPT_CONTEXT_PILL(indexName)}
+      getPromptContext={getPromptContext}
+      suggestedUserPrompt={DATA_QUALITY_SUGGESTED_USER_PROMPT}
+      tooltip={DATA_QUALITY_PROMPT_CONTEXT_PILL_TOOLTIP}
+      isAssistantEnabled={isAssistantEnabled}
+      iconType={null}
+    >
       <span css={styles.linkText}>
         <AssistantIcon />
         {ASK_ASSISTANT}
       </span>
-    </NewChatByTitle>
+    </NewChat>
   );
 };
 
diff --git a/x-pack/solutions/security/plugins/security_solution/public/detection_engine/rule_creation_ui/components/ai_assistant/index.tsx b/x-pack/solutions/security/plugins/security_solution/public/detection_engine/rule_creation_ui/components/ai_assistant/index.tsx
index 8900e69254753..855591d5da792 100644
--- a/x-pack/solutions/security/plugins/security_solution/public/detection_engine/rule_creation_ui/components/ai_assistant/index.tsx
+++ b/x-pack/solutions/security/plugins/security_solution/public/detection_engine/rule_creation_ui/components/ai_assistant/index.tsx
@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import React, { useCallback } from 'react';
+import React, { useCallback, useMemo } from 'react';
 import { EuiSpacer } from '@elastic/eui';
 import { FormattedMessage } from '@kbn/i18n-react';
 
@@ -91,6 +91,11 @@ Proposed solution should be valid and must not contain new line symbols (\\n)`;
     },
     [getFields, setFieldValue]
   );
+  const chatTitle = useMemo(() => {
+    const queryField = getFields().queryBar;
+    const { query } = (queryField.value as DefineStepRule['queryBar']).query;
+    return `${i18nAssistant.DETECTION_RULES_CREATE_FORM_CONVERSATION_ID} - ${query ?? 'query'}`;
+  }, [getFields]);
 
   if (!hasAssistantPrivilege) {
     return null;
@@ -108,7 +113,7 @@ Proposed solution should be valid and must not contain new line symbols (\\n)`;
             <NewChat
               asLink={true}
               category="detection-rules"
-              conversationId={i18nAssistant.DETECTION_RULES_CREATE_FORM_CONVERSATION_ID}
+              conversationId={chatTitle}
               description={i18n.ASK_ASSISTANT_DESCRIPTION}
               getPromptContext={getPromptContext}
               suggestedUserPrompt={i18n.ASK_ASSISTANT_USER_PROMPT(languageName)}
diff --git a/x-pack/solutions/security/plugins/security_solution/public/detection_engine/rule_management_ui/components/rules_table/rules_table_toolbar.tsx b/x-pack/solutions/security/plugins/security_solution/public/detection_engine/rule_management_ui/components/rules_table/rules_table_toolbar.tsx
index 6fff6dfb4cbcc..1ee5608d1d532 100644
--- a/x-pack/solutions/security/plugins/security_solution/public/detection_engine/rule_management_ui/components/rules_table/rules_table_toolbar.tsx
+++ b/x-pack/solutions/security/plugins/security_solution/public/detection_engine/rule_management_ui/components/rules_table/rules_table_toolbar.tsx
@@ -7,7 +7,7 @@
 
 import React, { useCallback, useMemo } from 'react';
 import { EuiFlexGroup, EuiFlexItem } from '@elastic/eui';
-import { NewChatByTitle, useAssistantOverlay } from '@kbn/elastic-assistant';
+import { NewChat } from '@kbn/elastic-assistant';
 import { useUserData } from '../../../../detections/components/user_info';
 import { TabNavigation } from '../../../../common/components/navigation/tab_navigation';
 import { usePrebuiltRulesStatus } from '../../../rule_management/logic/prebuilt_rules/use_prebuilt_rules_status';
@@ -97,17 +97,6 @@ export const RulesTableToolbar = React.memo(() => {
     return `${i18nAssistant.DETECTION_RULES_CONVERSATION_ID} - ${selectedRuleNames.join(', ')}`;
   }, [selectedRuleNames]);
 
-  const { showAssistantOverlay } = useAssistantOverlay(
-    'detection-rules',
-    chatTitle,
-    i18nAssistant.RULE_MANAGEMENT_CONTEXT_DESCRIPTION,
-    getPromptContext,
-    null,
-    i18nAssistant.EXPLAIN_THEN_SUMMARIZE_RULE_DETAILS,
-    i18nAssistant.RULE_MANAGEMENT_CONTEXT_TOOLTIP,
-    isAssistantEnabled
-  );
-
   return (
     <EuiFlexGroup justifyContent={'spaceBetween'}>
       <EuiFlexItem grow={false}>
@@ -115,7 +104,15 @@ export const RulesTableToolbar = React.memo(() => {
       </EuiFlexItem>
       <EuiFlexItem grow={false}>
         {hasAssistantPrivilege && selectedRules.length > 0 && (
-          <NewChatByTitle showAssistantOverlay={showAssistantOverlay} />
+          <NewChat
+            category="detection-rules"
+            conversationId={chatTitle}
+            description={i18nAssistant.RULE_MANAGEMENT_CONTEXT_DESCRIPTION}
+            getPromptContext={getPromptContext}
+            suggestedUserPrompt={i18nAssistant.EXPLAIN_THEN_SUMMARIZE_RULE_DETAILS}
+            tooltip={i18nAssistant.RULE_MANAGEMENT_CONTEXT_TOOLTIP}
+            isAssistantEnabled={isAssistantEnabled}
+          />
         )}
       </EuiFlexItem>
     </EuiFlexGroup>
diff --git a/x-pack/solutions/security/plugins/security_solution/public/detections/components/rules/rule_execution_status/rule_status_failed_callout.tsx b/x-pack/solutions/security/plugins/security_solution/public/detections/components/rules/rule_execution_status/rule_status_failed_callout.tsx
index 4602d2f56bb56..0dcf5b1590114 100644
--- a/x-pack/solutions/security/plugins/security_solution/public/detections/components/rules/rule_execution_status/rule_status_failed_callout.tsx
+++ b/x-pack/solutions/security/plugins/security_solution/public/detections/components/rules/rule_execution_status/rule_status_failed_callout.tsx
@@ -10,7 +10,7 @@ import React, { useCallback, useMemo } from 'react';
 import { css } from '@emotion/react';
 import { EuiCallOut, EuiCodeBlock } from '@elastic/eui';
 
-import { NewChatByTitle, useAssistantOverlay } from '@kbn/elastic-assistant';
+import { NewChat } from '@kbn/elastic-assistant';
 import { FormattedDate } from '../../../../common/components/formatted_date';
 import type { RuleExecutionStatus } from '../../../../../common/api/detection_engine/rule_monitoring';
 import { RuleExecutionStatusEnum } from '../../../../../common/api/detection_engine/rule_monitoring';
@@ -48,16 +48,7 @@ const RuleStatusFailedCallOutComponent: React.FC<RuleStatusFailedCallOutProps> =
   const chatTitle = useMemo(() => {
     return `${ruleNameForChat} - ${title} ${date}`;
   }, [date, title, ruleNameForChat]);
-  const { showAssistantOverlay } = useAssistantOverlay(
-    'detection-rules',
-    chatTitle,
-    i18n.ASK_ASSISTANT_DESCRIPTION,
-    getPromptContext,
-    null,
-    i18n.ASK_ASSISTANT_USER_PROMPT,
-    i18n.ASK_ASSISTANT_TOOLTIP,
-    isAssistantEnabled
-  );
+
   if (!shouldBeDisplayed) {
     return null;
   }
@@ -92,9 +83,18 @@ const RuleStatusFailedCallOutComponent: React.FC<RuleStatusFailedCallOutProps> =
           {message}
         </EuiCodeBlock>
         {hasAssistantPrivilege && (
-          <NewChatByTitle showAssistantOverlay={showAssistantOverlay} color={color}>
+          <NewChat
+            category="detection-rules"
+            color={color}
+            conversationId={chatTitle}
+            description={i18n.ASK_ASSISTANT_DESCRIPTION}
+            getPromptContext={getPromptContext}
+            suggestedUserPrompt={i18n.ASK_ASSISTANT_USER_PROMPT}
+            tooltip={i18n.ASK_ASSISTANT_TOOLTIP}
+            isAssistantEnabled={isAssistantEnabled}
+          >
             {i18n.ASK_ASSISTANT_ERROR_BUTTON}
-          </NewChatByTitle>
+          </NewChat>
         )}
       </EuiCallOut>
     </div>