[8.18] [Onboarding] Hide the semantic_text banner if there exists a s…

…emantic_text field (elastic#210676) (elastic#212792) # Backport This will backport the following commits from `main` to `8.18`: - [[Onboarding] Hide the semantic_text banner if there exists a semantic_text field (elastic#210676)](elastic#210676)  ### Questions ? Please refer to the [Backport tool documentation](https://github.com/sorenlouv/backport)  --------- Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com>
kibanamachine · Mar 4, 2025 · 3e10be9 · 3e10be9
1 parent 47001f3
commit 3e10be9
Show file tree

Hide file tree

Showing 10 changed files with 99 additions and 12 deletions.
diff --git a/src/platform/packages/shared/kbn-doc-links/src/get_doc_links.ts b/src/platform/packages/shared/kbn-doc-links/src/get_doc_links.ts
@@ -203,6 +203,7 @@ export const getDocLinks = ({ kibanaBranch, buildFlavor }: GetDocLinkOptions): D
       engines: `${ENTERPRISE_SEARCH_DOCS}engines.html`,
       indexApi: `${ELASTICSEARCH_DOCS}docs-index_.html`,
       inferenceApiCreate: `${ELASTICSEARCH_DOCS}put-inference-api.html`,
+      inferenceApisConfigureChunking: `${ELASTICSEARCH_DOCS}inference-apis.html#infer-chunking-config`,
       ingestionApis: `${ELASTICSEARCH_DOCS}search-with-elasticsearch.html`,
       ingestPipelines: `${ELASTICSEARCH_DOCS}ingest-pipeline-search.html`,
       knnSearch: `${ELASTICSEARCH_DOCS}knn-search.html`,

diff --git a/src/platform/packages/shared/kbn-doc-links/src/types.ts b/src/platform/packages/shared/kbn-doc-links/src/types.ts
@@ -168,6 +168,7 @@ export interface DocLinks {
     readonly engines: string;
     readonly indexApi: string;
     readonly inferenceApiCreate: string;
+    readonly inferenceApisConfigureChunking: string;
     readonly ingestionApis: string;
     readonly ingestPipelines: string;
     readonly knnSearch: string;

diff --git a/x-pack/platform/plugins/private/translations/translations/fr-FR.json b/x-pack/platform/plugins/private/translations/translations/fr-FR.json
@@ -22467,7 +22467,6 @@
     "xpack.idxMgmt.indexDetails.mappings.mappingsViewButtonGroupAriaLabel": "Groupe de bouton de l'affichage des mappings",
     "xpack.idxMgmt.indexDetails.mappings.reloadButtonLabel": "Recharger",
     "xpack.idxMgmt.indexDetails.mappings.saveMappings": "Enregistrer les mappings",
-    "xpack.idxMgmt.indexDetails.mappings.semanticTextBanner.description": "{label} Ajoutez un champ à votre mapping et choisissez \"Semantic text\" pour commencer.",
     "xpack.idxMgmt.indexDetails.mappings.semanticTextBanner.descriptionForPlatinumLicense": "{label} Mettez à niveau votre licence pour ajouter les types de champ semantic_text à vos index.\"",
     "xpack.idxMgmt.indexDetails.mappings.semanticTextBanner.dismiss": "Rejeter",
     "xpack.idxMgmt.indexDetails.mappings.semanticTextBanner.semanticTextFieldAvailable": "Le type de champ semantic_text est maintenant disponible !",

diff --git a/x-pack/platform/plugins/private/translations/translations/ja-JP.json b/x-pack/platform/plugins/private/translations/translations/ja-JP.json
@@ -22324,7 +22324,6 @@
     "xpack.idxMgmt.indexDetails.mappings.mappingsViewButtonGroupAriaLabel": "マッピングビューボタングループ",
     "xpack.idxMgmt.indexDetails.mappings.reloadButtonLabel": "再読み込み",
     "xpack.idxMgmt.indexDetails.mappings.saveMappings": "マッピングを保存",
-    "xpack.idxMgmt.indexDetails.mappings.semanticTextBanner.description": "{label} 開始するには、フィールドをマッピングに追加して、Semantic_textを選択してください。",
     "xpack.idxMgmt.indexDetails.mappings.semanticTextBanner.descriptionForPlatinumLicense": "{label} semantic_textフィールド型をインデックスに追加するには、ライセンスをアップグレードしてください。'",
     "xpack.idxMgmt.indexDetails.mappings.semanticTextBanner.dismiss": "閉じる",
     "xpack.idxMgmt.indexDetails.mappings.semanticTextBanner.semanticTextFieldAvailable": "semantic_textフィールド型が利用できるようになりました。",

diff --git a/x-pack/platform/plugins/private/translations/translations/zh-CN.json b/x-pack/platform/plugins/private/translations/translations/zh-CN.json
@@ -22407,7 +22407,6 @@
     "xpack.idxMgmt.indexDetails.mappings.mappingsViewButtonGroupAriaLabel": "映射视图按钮组",
     "xpack.idxMgmt.indexDetails.mappings.reloadButtonLabel": "重新加载",
     "xpack.idxMgmt.indexDetails.mappings.saveMappings": "保存映射",
-    "xpack.idxMgmt.indexDetails.mappings.semanticTextBanner.description": "{label} 将字段添加到您的映射并选择“语义文本”以开始使用。",
     "xpack.idxMgmt.indexDetails.mappings.semanticTextBanner.descriptionForPlatinumLicense": "{label} 升级许可证以将 semantic_text 字段类型添加到您的索引。'",
     "xpack.idxMgmt.indexDetails.mappings.semanticTextBanner.dismiss": "关闭",
     "xpack.idxMgmt.indexDetails.mappings.semanticTextBanner.semanticTextFieldAvailable": "semantic_text 字段类型现已可用！",

diff --git a/...dex_management/__jest__/client_integration/index_details_page/index_details_page.test.tsx b/...dex_management/__jest__/client_integration/index_details_page/index_details_page.test.tsx
@@ -533,6 +533,67 @@ describe('<IndexDetailsPage />', () => {
     });
   });
 
+  describe('Semantic Text Banner', () => {
+    const mockIndexMappingResponseWithoutSemanticText: any = {
+      ...testIndexMappings.mappings,
+      properties: {
+        ...testIndexMappings.mappings.properties,
+        name: {
+          type: 'text',
+        },
+      },
+    };
+
+    const mockIndexMappingResponseWithSemanticText: any = {
+      ...testIndexMappings.mappings,
+      properties: {
+        ...testIndexMappings.mappings.properties,
+        name: {
+          type: 'text',
+        },
+        sem_text: {
+          type: 'semantic_text',
+          inference_id: '.elser-2-elasticsearch',
+        },
+        title: {
+          type: 'text',
+          copy_to: ['sem_text'],
+        },
+      },
+    };
+
+    beforeEach(async () => {
+      await act(async () => {
+        testBed = await setup({
+          httpSetup,
+          dependencies: {
+            core: {
+              application: { capabilities: { ml: { canGetTrainedModels: true } } },
+            },
+          },
+        });
+      });
+    });
+
+    it('semantic text banner is visible if there is no semantic_text field in the mapping', async () => {
+      httpRequestsMockHelpers.setLoadIndexMappingResponse(testIndexName, {
+        mappings: mockIndexMappingResponseWithoutSemanticText,
+      });
+      testBed.component.update();
+      await testBed.actions.clickIndexDetailsTab(IndexDetailsSection.Mappings);
+      expect(testBed.actions.mappings.isSemanticTextBannerVisible()).toBe(true);
+    });
+
+    it('semantic text banner is not visible if there exists a semantic_text field in the mapping', async () => {
+      httpRequestsMockHelpers.setLoadIndexMappingResponse(testIndexName, {
+        mappings: mockIndexMappingResponseWithSemanticText,
+      });
+      testBed.component.update();
+      await testBed.actions.clickIndexDetailsTab(IndexDetailsSection.Mappings);
+      expect(testBed.actions.mappings.isSemanticTextBannerVisible()).toBe(false);
+    });
+  });
+
   describe('Mappings tab', () => {
     beforeEach(async () => {
       await testBed.actions.clickIndexDetailsTab(IndexDetailsSection.Mappings);

diff --git a/..._management/__jest__/client_integration/index_details_page/semantic_text_bannner.test.tsx b/..._management/__jest__/client_integration/index_details_page/semantic_text_bannner.test.tsx
@@ -42,6 +42,10 @@ describe('When semantic_text is enabled', () => {
     expect(find('indexDetailsMappingsSemanticTextBanner').text()).toContain(
       'semantic_text field type now available!'
     );
+
+    expect(find('indexDetailsMappingsSemanticTextBanner').text()).toContain(
+      'Documents will be automatically chunked to fit model context limits, to avoid truncation.'
+    );
   });
 
   it('should hide the banner if dismiss is clicked', async () => {

diff --git a/...ublic/application/sections/home/index_list/details_page/details_page_mappings_content.tsx b/...ublic/application/sections/home/index_list/details_page/details_page_mappings_content.tsx
@@ -118,6 +118,8 @@ export const DetailsPageMappingsContent: FunctionComponent<{
     prefix: 'pendingFieldListId',
   });
 
+  const hasSemanticText = hasSemanticTextField(state.fields);
+
   const [isAddingFields, setAddingFields] = useState<boolean>(false);
 
   useUnsavedChangesPrompt({
@@ -220,7 +222,6 @@ export const DetailsPageMappingsContent: FunctionComponent<{
 
   const updateMappings = useCallback(
     async (forceSaveMappings?: boolean) => {
-      const hasSemanticText = hasSemanticTextField(state.fields);
       let inferenceToModelIdMap = state.inferenceToModelIdMap;
       setIsUpdatingMappings(true);
       try {
@@ -539,7 +540,7 @@ export const DetailsPageMappingsContent: FunctionComponent<{
               </EuiFilterGroup>
             </EuiFlexItem>
           </EuiFlexGroup>
-          {hasMLPermissions && (
+          {hasMLPermissions && !hasSemanticText && (
             <EuiFlexItem grow={true}>
               <SemanticTextBanner
                 isSemanticTextEnabled={isSemanticTextEnabled}

diff --git a/...agement/public/application/sections/home/index_list/details_page/semantic_text_banner.tsx b/...agement/public/application/sections/home/index_list/details_page/semantic_text_banner.tsx
@@ -4,10 +4,18 @@
  * 2.0; you may not use this file except in compliance with the Elastic License
  * 2.0.
  */
-import { EuiButtonEmpty, EuiFlexGroup, EuiFlexItem, EuiPanel, EuiText } from '@elastic/eui';
+import {
+  EuiButtonEmpty,
+  EuiFlexGroup,
+  EuiFlexItem,
+  EuiLink,
+  EuiPanel,
+  EuiText,
+} from '@elastic/eui';
 import { FormattedMessage } from '@kbn/i18n-react';
 import React from 'react';
 import useLocalStorage from 'react-use/lib/useLocalStorage';
+import { documentationService } from '../../../../services';
 
 interface SemanticTextBannerProps {
   isSemanticTextEnabled: boolean;
@@ -31,10 +39,10 @@ const defaultLicenseMessage = (
   />
 );
 
-const platinumLicenseMessage = (
+const getPlatinumLicenseMessage = () => (
   <FormattedMessage
     id="xpack.idxMgmt.indexDetails.mappings.semanticTextBanner.description"
-    defaultMessage="{label} Add a field to your mapping and choose 'Semantic text' to get started."
+    defaultMessage="{label} Add a field to your mapping and choose 'Semantic text' to get started. Documents will be automatically chunked to fit model context limits, to avoid truncation. {learnMore}"
     values={{
       label: (
         <strong>
@@ -44,6 +52,14 @@ const platinumLicenseMessage = (
           />
         </strong>
       ),
+      learnMore: (
+        <EuiLink href={documentationService.getConfigureChunkingDocLink()} target="_blank">
+          <FormattedMessage
+            id="xpack.idxMgmt.indexDetails.mappings.semanticTextBanner.learnMore"
+            defaultMessage="Learn more"
+          />
+        </EuiLink>
+      ),
     }}
   />
 );
@@ -57,11 +73,11 @@ export function SemanticTextBanner({
 
   return isSemanticTextBannerDisplayable && isSemanticTextEnabled ? (
     <>
-      <EuiPanel color="success" data-test-subj="indexDetailsMappingsSemanticTextBanner">
-        <EuiFlexGroup>
+      <EuiPanel color="accentSecondary" data-test-subj="indexDetailsMappingsSemanticTextBanner">
+        <EuiFlexGroup alignItems="center">
           <EuiFlexItem>
-            <EuiText size="m" color="success">
-              {isPlatinumLicense ? platinumLicenseMessage : defaultLicenseMessage}
+            <EuiText size="m" color="primary">
+              {isPlatinumLicense ? getPlatinumLicenseMessage() : defaultLicenseMessage}
             </EuiText>
           </EuiFlexItem>
           <EuiFlexItem grow={false}>

diff --git a/x-pack/platform/plugins/shared/index_management/public/application/services/documentation.ts b/x-pack/platform/plugins/shared/index_management/public/application/services/documentation.ts
@@ -21,6 +21,7 @@ class DocumentationService {
   private indexSettings: string = '';
   private indexTemplates: string = '';
   private indexV1: string = '';
+  private inferenceApisConfigureChunking: string = '';
   private mapping: string = '';
   private mappingAnalyzer: string = '';
   private mappingCoerce: string = '';
@@ -81,6 +82,7 @@ class DocumentationService {
     this.indexManagement = links.management.indexManagement;
     this.indexSettings = links.elasticsearch.indexSettings;
     this.indexTemplates = links.elasticsearch.indexTemplates;
+    this.inferenceApisConfigureChunking = links.enterpriseSearch.inferenceApisConfigureChunking;
     this.indexV1 = links.apis.putIndexTemplateV1;
     this.mapping = links.elasticsearch.mapping;
     this.mappingAnalyzer = links.elasticsearch.mappingAnalyzer;
@@ -159,6 +161,10 @@ class DocumentationService {
     return this.indexManagement;
   }
 
+  public getConfigureChunkingDocLink() {
+    return this.inferenceApisConfigureChunking;
+  }
+
   public getIndicesComponentTemplate() {
     return this.indicesComponentTemplate;
   }