Skip to content

Commit

Permalink
[Search] [Playground] present message when no documents are returned (#…
Browse files Browse the repository at this point in the history
…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.

<img width="1018" alt="image"
src="https://github.com/elastic/kibana/assets/49480/88564932-377f-4c7a-9c83-f7b3d0651a73">

### 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>
  • Loading branch information
3 people committed May 13, 2024
1 parent 5ef0536 commit 3e743fe
Show file tree
Hide file tree
Showing 9 changed files with 181 additions and 6 deletions.
19 changes: 18 additions & 1 deletion docs/playground/playground-query.asciidoc
Original file line number Diff line number Diff line change
Expand Up @@ -48,4 +48,21 @@ Refer to <<playground-context, Optimize context>> 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.
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
4 changes: 4 additions & 0 deletions packages/kbn-doc-links/src/get_doc_links.ts
Original file line number Diff line number Diff line change
Expand Up @@ -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`,
},
});
};
4 changes: 4 additions & 0 deletions packages/kbn-doc-links/src/types.ts
Original file line number Diff line number Diff line change
Expand Up @@ -651,6 +651,10 @@ export interface DocLinks {
};
readonly playground: {
readonly chatPlayground: string;
readonly retrievalOptimize: string;
readonly retrieval: string;
readonly context: string;
readonly hiddenFields: string;
};
}

Expand Down
8 changes: 8 additions & 0 deletions x-pack/plugins/search_playground/common/doc_links.ts
Original file line number Diff line number Diff line change
Expand Up @@ -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;
}
}

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -103,7 +103,7 @@ export const EditContextFlyout: React.FC<EditContextFlyoutProps> = ({ onClose })
defaultMessage="Context is the information you provide to the LLM, by selecting fields from your Elasticsearch documents. Optimize context for better results."
/>
<EuiLink
href={docLinks.chatPlayground}
href={docLinks.context}
target="_blank"
data-test-subj="context-optimization-documentation-link"
>
Expand Down
Original file line number Diff line number Diff line change
@@ -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 (
<IntlProvider locale="en">
<FormProvider {...methods}>{children}</FormProvider>
</IntlProvider>
);
};

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(
<MockFormProvider>
<AssistantMessage message={mockMessage} />
</MockFormProvider>
);
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(
<MockFormProvider>
<AssistantMessage
message={{
...mockMessage,
retrievalDocs: [],
}}
/>
</MockFormProvider>
);
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(
<MockFormProvider>
<AssistantMessage
message={{
...mockMessage,
citations: [
{ content: 'Citation content', metadata: { _id: '1', _index: 'index', _score: 1 } },
],
}}
/>
</MockFormProvider>
);

expect(screen.getByTestId('assistant-message-citations')).toBeInTheDocument();
});
});
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,7 @@ import {
EuiButtonEmpty,
EuiComment,
EuiFlexGroup,
EuiLink,
EuiSpacer,
EuiText,
EuiTitle,
Expand All @@ -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';

Expand Down Expand Up @@ -52,6 +54,7 @@ export const AssistantMessage: React.FC<AssistantMessageProps> = ({ message }) =
<EuiComment
username={username}
timelineAvatar="dot"
data-test-subj="retrieval-docs-comment"
event={
<>
<EuiText size="s">
Expand All @@ -68,6 +71,7 @@ export const AssistantMessage: React.FC<AssistantMessageProps> = ({ message }) =
css={{ blockSize: 'auto' }}
size="s"
flush="left"
data-test-subj="retrieval-docs-button"
onClick={() => setIsDocsFlyoutOpen(true)}
>
<FormattedMessage
Expand All @@ -87,11 +91,50 @@ export const AssistantMessage: React.FC<AssistantMessageProps> = ({ message }) =
}
/>
)}
{retrievalDocs?.length === 0 && (
<EuiComment
username={username}
timelineAvatar="dot"
data-test-subj="retrieval-docs-comment-no-docs"
event={
<>
<EuiText size="s">
<p>
<FormattedMessage
id="xpack.searchPlayground.chat.message.assistant.noRetrievalDocs"
defaultMessage="Unable to retrieve documents based on the provided question and query."
/>
{` `}
</p>
</EuiText>

<EuiLink
href={docLinks.retrievalOptimize}
target="_blank"
data-test-subj="retrieval-optimization-documentation-link"
>
<FormattedMessage
id="xpack.searchPlayground.chat.message.assistant.noRetrievalDocs.learnMore"
defaultMessage=" Learn more."
/>
</EuiLink>

{isDocsFlyoutOpen && (
<RetrievalDocsFlyout
onClose={() => setIsDocsFlyoutOpen(false)}
retrievalDocs={retrievalDocs}
/>
)}
</>
}
/>
)}
<EuiComment
username={username}
event={i18n.translate('xpack.searchPlayground.chat.message.assistant.event.responded', {
defaultMessage: 'responded',
})}
data-test-subj="assistant-message"
timestamp={
createdAt &&
i18n.translate('xpack.searchPlayground.chat.message.assistant.createdAt', {
Expand Down Expand Up @@ -137,7 +180,7 @@ export const AssistantMessage: React.FC<AssistantMessageProps> = ({ message }) =
{!!citations?.length && (
<>
<EuiSpacer size="l" />
<EuiTitle size="xs">
<EuiTitle size="xs" data-test-subj="assistant-message-citations">
<p>
<FormattedMessage
id="xpack.searchPlayground.chat.message.assistant.citations.title"
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -101,7 +101,7 @@ describe('SourcesPanelForStartChat component', () => {
noFieldsIndicesWarning: 'index1',
});

render(<SourcesPanelForStartChat />);
render(<SourcesPanelForStartChat />, { wrapper: Wrapper });
expect(screen.getByTestId('NoIndicesFieldsMessage')).toBeInTheDocument();
expect(screen.getByTestId('NoIndicesFieldsMessage')).toHaveTextContent('index1');
});
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -144,6 +144,17 @@ export const ViewQueryFlyout: React.FC<ViewQueryFlyoutProps> = ({ onClose }) =>
defaultMessage="This query will be used to search your indices. Customize by choosing which
fields in your Elasticsearch documents to search."
/>
{` `}
<EuiLink
href={docLinks.retrievalOptimize}
target="_blank"
data-test-subj="query-optimize-documentation-link"
>
<FormattedMessage
id="xpack.searchPlayground.viewQuery.flyout.learnMoreQueryOptimizeLink"
defaultMessage="Learn more."
/>
</EuiLink>
</p>
</EuiText>
</EuiFlyoutHeader>
Expand Down Expand Up @@ -236,9 +247,9 @@ export const ViewQueryFlyout: React.FC<ViewQueryFlyoutProps> = ({ onClose }) =>
</EuiFlexItem>
<EuiFlexItem grow={false}>
<EuiLink
href={docLinks.chatPlayground}
href={docLinks.hiddenFields}
target="_blank"
data-test-subj="context-optimization-documentation-link"
data-test-subj="hidden-fields-documentation-link"
>
<FormattedMessage
id="xpack.searchPlayground.viewQuery.flyout.learnMoreLink"
Expand Down

0 comments on commit 3e743fe

Please sign in to comment.