From 3e743fee00195a7c074c9308941d75e28df1e5cc Mon Sep 17 00:00:00 2001 From: Joe McElroy Date: Mon, 13 May 2024 10:55:54 +0100 Subject: [PATCH] [Search] [Playground] present message when no documents are returned (#183219) ## Summary Happens when index uses bm25 retrieval. Currently if no documents are returned, no message appears and confusing to the user happened and how they can improve it. With this change, it tells them what happened and a link to how to improve this. image ### Checklist Delete any items that are not applicable to this PR. - [ ] Any text added follows [EUI's writing guidelines](https://elastic.github.io/eui/#/guidelines/writing), uses sentence case text and includes [i18n support](https://github.com/elastic/kibana/blob/main/packages/kbn-i18n/README.md) - [x] [Documentation](https://www.elastic.co/guide/en/kibana/master/development-documentation.html) was added for features that require explanation or tutorials - [x] [Unit or functional tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html) were updated or added to match the most common scenarios - [ ] [Flaky Test Runner](https://ci-stats.kibana.dev/trigger_flaky_test_runner/1) was used on any tests changed - [ ] Any UI touched in this PR is usable by keyboard only (learn more about [keyboard accessibility](https://webaim.org/techniques/keyboard/)) - [ ] Any UI touched in this PR does not create any new axe failures (run axe in browser: [FF](https://addons.mozilla.org/en-US/firefox/addon/axe-devtools/), [Chrome](https://chrome.google.com/webstore/detail/axe-web-accessibility-tes/lhdoppojpmngadmnindnejefpokejbdd?hl=en-US)) - [ ] If a plugin configuration key changed, check if it needs to be allowlisted in the cloud and added to the [docker list](https://github.com/elastic/kibana/blob/main/src/dev/build/tasks/os_packages/docker_generator/resources/base/bin/kibana-docker) - [ ] This renders correctly on smaller devices using a responsive layout. (You can test this [in your browser](https://www.browserstack.com/guide/responsive-testing-on-local-server)) - [x] This was checked for [cross-browser compatibility](https://www.elastic.co/support/matrix#matrix_browsers) --------- Co-authored-by: Liam Thompson <32779855+leemthompo@users.noreply.github.com> Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com> --- docs/playground/playground-query.asciidoc | 19 +++- packages/kbn-doc-links/src/get_doc_links.ts | 4 + packages/kbn-doc-links/src/types.ts | 4 + .../search_playground/common/doc_links.ts | 8 ++ .../edit_context/edit_context_flyout.tsx | 2 +- .../message_list/assistant_message.test.tsx | 88 +++++++++++++++++++ .../message_list/assistant_message.tsx | 45 +++++++++- .../sources_panel_for_start_chat.test.tsx | 2 +- .../view_query/view_query_flyout.tsx | 15 +++- 9 files changed, 181 insertions(+), 6 deletions(-) create mode 100644 x-pack/plugins/search_playground/public/components/message_list/assistant_message.test.tsx diff --git a/docs/playground/playground-query.asciidoc b/docs/playground/playground-query.asciidoc index 11ed2e71b1a2d..d07f5c30dccbd 100644 --- a/docs/playground/playground-query.asciidoc +++ b/docs/playground/playground-query.asciidoc @@ -48,4 +48,21 @@ Refer to <> for more information. Retrievers make it easier to compose and test different retrieval strategies in your search pipelines. ==== // TODO: uncomment and add to note once following page is live -//Refer to {ref}/retrievers-overview.html[documentation] for a high level overview of retrievers. \ No newline at end of file +Refer to {ref}/retrievers-overview.html[documentation] for a high level overview of retrievers. +[float] +[[playground-hidden-fields]] +=== Hidden fields + +The query editor shows fields which make sense for the user to search on, but not all fields in your documents are visible from the editor. + +Available field types: + +- Semantic fields like `sparse_vector` or `dense_vector` fields where the embeddings have been created from a inference processor +- `text` fields + +Hidden Field Types: + +- non `text` fields like `keyword` fields +- fields that are not indexed +- semantic fields where the embeddings have not been created from a inference processor +- nested fields \ No newline at end of file diff --git a/packages/kbn-doc-links/src/get_doc_links.ts b/packages/kbn-doc-links/src/get_doc_links.ts index 16d4fc648c3c6..136e5f7bc95b1 100644 --- a/packages/kbn-doc-links/src/get_doc_links.ts +++ b/packages/kbn-doc-links/src/get_doc_links.ts @@ -961,6 +961,10 @@ export const getDocLinks = ({ kibanaBranch, buildFlavor }: GetDocLinkOptions): D }, playground: { chatPlayground: `${KIBANA_DOCS}playground.html`, + retrievalOptimize: `${KIBANA_DOCS}playground-query.html#playground-query-relevance`, + retrieval: `${KIBANA_DOCS}playground-query.html`, + context: `${KIBANA_DOCS}playground-context.html`, + hiddenFields: `${KIBANA_DOCS}playground-query.html#playground-hidden-fields`, }, }); }; diff --git a/packages/kbn-doc-links/src/types.ts b/packages/kbn-doc-links/src/types.ts index 261165dcd7ec9..29e09d8b25672 100644 --- a/packages/kbn-doc-links/src/types.ts +++ b/packages/kbn-doc-links/src/types.ts @@ -651,6 +651,10 @@ export interface DocLinks { }; readonly playground: { readonly chatPlayground: string; + readonly retrievalOptimize: string; + readonly retrieval: string; + readonly context: string; + readonly hiddenFields: string; }; } diff --git a/x-pack/plugins/search_playground/common/doc_links.ts b/x-pack/plugins/search_playground/common/doc_links.ts index 6e499dd205b7b..931546908785e 100644 --- a/x-pack/plugins/search_playground/common/doc_links.ts +++ b/x-pack/plugins/search_playground/common/doc_links.ts @@ -9,11 +9,19 @@ import { DocLinks } from '@kbn/doc-links'; class PlaygroundDocLinks { public chatPlayground: string = ''; + public retrievalOptimize: string = ''; + public retrieval: string = ''; + public context: string = ''; + public hiddenFields: string = ''; constructor() {} setDocLinks(newDocLinks: DocLinks) { this.chatPlayground = newDocLinks.playground.chatPlayground; + this.retrievalOptimize = newDocLinks.playground.retrievalOptimize; + this.retrieval = newDocLinks.playground.retrieval; + this.context = newDocLinks.playground.context; + this.hiddenFields = newDocLinks.playground.hiddenFields; } } diff --git a/x-pack/plugins/search_playground/public/components/edit_context/edit_context_flyout.tsx b/x-pack/plugins/search_playground/public/components/edit_context/edit_context_flyout.tsx index c56b1848e70f4..8b401b1e6ff8e 100644 --- a/x-pack/plugins/search_playground/public/components/edit_context/edit_context_flyout.tsx +++ b/x-pack/plugins/search_playground/public/components/edit_context/edit_context_flyout.tsx @@ -103,7 +103,7 @@ export const EditContextFlyout: React.FC = ({ onClose }) defaultMessage="Context is the information you provide to the LLM, by selecting fields from your Elasticsearch documents. Optimize context for better results." /> diff --git a/x-pack/plugins/search_playground/public/components/message_list/assistant_message.test.tsx b/x-pack/plugins/search_playground/public/components/message_list/assistant_message.test.tsx new file mode 100644 index 0000000000000..f3a903331cf3b --- /dev/null +++ b/x-pack/plugins/search_playground/public/components/message_list/assistant_message.test.tsx @@ -0,0 +1,88 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License + * 2.0; you may not use this file except in compliance with the Elastic License + * 2.0. + */ + +import React from 'react'; +import { render, screen } from '@testing-library/react'; +import { AssistantMessage } from './assistant_message'; +import { FormProvider, useForm } from 'react-hook-form'; +import { __IntlProvider as IntlProvider } from '@kbn/i18n-react'; + +// for tooltip +jest.mock('../../hooks/use_llms_models', () => ({ + useLLMsModels: () => [ + { value: 'model1', promptTokenLimit: 100 }, + { value: 'model2', promptTokenLimit: 200 }, + ], +})); + +const MockFormProvider = ({ children }: { children: React.ReactElement }) => { + const methods = useForm({ + values: { + indices: ['index1', 'index2'], + }, + }); + return ( + + {children} + + ); +}; + +describe('AssistantMessage component', () => { + const mockMessage = { + content: 'Test content', + createdAt: new Date(), + citations: [], + retrievalDocs: [{ content: '', metadata: { _id: '1', _index: 'index', _score: 1 } }], + inputTokens: { context: 20, total: 10 }, + }; + + it('renders message content correctly', () => { + const { getByText } = render( + + + + ); + expect(getByText('Test content')).toBeInTheDocument(); + expect(screen.getByTestId('retrieval-docs-comment')).toBeInTheDocument(); + expect(screen.getByTestId('retrieval-docs-button')).toHaveTextContent('1 document sources'); + expect(screen.getByTestId('token-tooltip-button')).toHaveTextContent('10 tokens sent'); + }); + + it('renders message content correctly with no retrieval docs', () => { + const { getByText } = render( + + + + ); + expect(getByText('Test content')).toBeInTheDocument(); + expect(screen.queryByTestId('retrieval-docs-comment')).not.toBeInTheDocument(); + expect(screen.getByTestId('retrieval-docs-comment-no-docs')).toBeInTheDocument(); + }); + + it('renders message content correctly with citations', () => { + render( + + + + ); + + expect(screen.getByTestId('assistant-message-citations')).toBeInTheDocument(); + }); +}); diff --git a/x-pack/plugins/search_playground/public/components/message_list/assistant_message.tsx b/x-pack/plugins/search_playground/public/components/message_list/assistant_message.tsx index 8476e537600eb..7bfa49e7a3758 100644 --- a/x-pack/plugins/search_playground/public/components/message_list/assistant_message.tsx +++ b/x-pack/plugins/search_playground/public/components/message_list/assistant_message.tsx @@ -13,6 +13,7 @@ import { EuiButtonEmpty, EuiComment, EuiFlexGroup, + EuiLink, EuiSpacer, EuiText, EuiTitle, @@ -21,6 +22,7 @@ import { i18n } from '@kbn/i18n'; import { FormattedMessage } from '@kbn/i18n-react'; import { css } from '@emotion/react'; +import { docLinks } from '../../../common/doc_links'; import { RetrievalDocsFlyout } from './retrieval_docs_flyout'; import type { AIMessage as AIMessageType } from '../../types'; @@ -52,6 +54,7 @@ export const AssistantMessage: React.FC = ({ message }) = @@ -68,6 +71,7 @@ export const AssistantMessage: React.FC = ({ message }) = css={{ blockSize: 'auto' }} size="s" flush="left" + data-test-subj="retrieval-docs-button" onClick={() => setIsDocsFlyoutOpen(true)} > = ({ message }) = } /> )} + {retrievalDocs?.length === 0 && ( + + +

+ + {` `} +

+ + + + + + + {isDocsFlyoutOpen && ( + setIsDocsFlyoutOpen(false)} + retrievalDocs={retrievalDocs} + /> + )} + + } + /> + )} = ({ message }) = {!!citations?.length && ( <> - +

{ noFieldsIndicesWarning: 'index1', }); - render(); + render(, { wrapper: Wrapper }); expect(screen.getByTestId('NoIndicesFieldsMessage')).toBeInTheDocument(); expect(screen.getByTestId('NoIndicesFieldsMessage')).toHaveTextContent('index1'); }); diff --git a/x-pack/plugins/search_playground/public/components/view_query/view_query_flyout.tsx b/x-pack/plugins/search_playground/public/components/view_query/view_query_flyout.tsx index d808fec85aaa4..53362cd5fd2fb 100644 --- a/x-pack/plugins/search_playground/public/components/view_query/view_query_flyout.tsx +++ b/x-pack/plugins/search_playground/public/components/view_query/view_query_flyout.tsx @@ -144,6 +144,17 @@ export const ViewQueryFlyout: React.FC = ({ onClose }) => defaultMessage="This query will be used to search your indices. Customize by choosing which fields in your Elasticsearch documents to search." /> + {` `} + + +

@@ -236,9 +247,9 @@ export const ViewQueryFlyout: React.FC = ({ onClose }) =>