diff --git a/x-pack/plugins/enterprise_search/public/applications/app_search/components/library/library.tsx b/x-pack/plugins/enterprise_search/public/applications/app_search/components/library/library.tsx index 55c9cc7958346..df5c5499424c1 100644 --- a/x-pack/plugins/enterprise_search/public/applications/app_search/components/library/library.tsx +++ b/x-pack/plugins/enterprise_search/public/applications/app_search/components/library/library.tsx @@ -237,6 +237,26 @@ export const Library: React.FC = () => { /> + +

With a document position

+
+ + + +

With an id and a score and an engine

diff --git a/x-pack/plugins/enterprise_search/public/applications/app_search/components/result/result.test.tsx b/x-pack/plugins/enterprise_search/public/applications/app_search/components/result/result.test.tsx index dfb01a1a793c4..6f8f0fdcf34ff 100644 --- a/x-pack/plugins/enterprise_search/public/applications/app_search/components/result/result.test.tsx +++ b/x-pack/plugins/enterprise_search/public/applications/app_search/components/result/result.test.tsx @@ -12,9 +12,10 @@ import { DraggableProvidedDragHandleProps } from 'react-beautiful-dnd'; import { shallow, ShallowWrapper } from 'enzyme'; -import { EuiPanel } from '@elastic/eui'; +import { EuiBadge, EuiPanel } from '@elastic/eui'; import { SchemaType } from '../../../shared/schema/types'; +import { mountWithIntl } from '../../../test_helpers'; import { Result } from './result'; import { ResultField } from './result_field'; @@ -87,6 +88,12 @@ describe('Result', () => { expect(header.prop('documentLink')).toBe('/engines/my-engine/documents/1'); }); + + it('contains the result position if one is passed', () => { + const wrapper = mountWithIntl(); + const header = wrapper.find(ResultHeader); + expect(header.find(EuiBadge).text()).toContain('#4'); + }); }); describe('actions', () => { diff --git a/x-pack/plugins/enterprise_search/public/applications/app_search/components/result/result.tsx b/x-pack/plugins/enterprise_search/public/applications/app_search/components/result/result.tsx index 9be9afa051351..ea73296d66b30 100644 --- a/x-pack/plugins/enterprise_search/public/applications/app_search/components/result/result.tsx +++ b/x-pack/plugins/enterprise_search/public/applications/app_search/components/result/result.tsx @@ -28,6 +28,7 @@ interface Props { result: ResultType; isMetaEngine: boolean; showScore?: boolean; + resultPosition?: number; shouldLinkToDetailPage?: boolean; schemaForTypeHighlights?: Schema; actions?: ResultAction[]; @@ -44,6 +45,7 @@ export const Result: React.FC = ({ schemaForTypeHighlights, actions = [], dragHandleProps, + resultPosition, }) => { const [isOpen, setIsOpen] = useState(false); @@ -100,6 +102,7 @@ export const Result: React.FC = ({ isMetaEngine={isMetaEngine} documentLink={documentLink} actions={actions} + resultPosition={resultPosition} /> {resultFields .slice(0, isOpen ? resultFields.length : RESULT_CUTOFF) diff --git a/x-pack/plugins/enterprise_search/public/applications/app_search/components/result/result_header.tsx b/x-pack/plugins/enterprise_search/public/applications/app_search/components/result/result_header.tsx index f577b481b39cf..fd524e126b258 100644 --- a/x-pack/plugins/enterprise_search/public/applications/app_search/components/result/result_header.tsx +++ b/x-pack/plugins/enterprise_search/public/applications/app_search/components/result/result_header.tsx @@ -7,7 +7,9 @@ import React from 'react'; -import { EuiFlexGroup, EuiFlexItem } from '@elastic/eui'; +import { EuiBadge, EuiFlexGroup, EuiFlexItem } from '@elastic/eui'; + +import { FormattedMessage } from '@kbn/i18n/react'; import { ResultActions } from './result_actions'; import { ResultHeaderItem } from './result_header_item'; @@ -21,6 +23,7 @@ interface Props { resultMeta: ResultMeta; actions: ResultAction[]; documentLink?: string; + resultPosition?: number; } export const ResultHeader: React.FC = ({ @@ -29,6 +32,7 @@ export const ResultHeader: React.FC = ({ isMetaEngine, actions, documentLink, + resultPosition, }) => { return (
@@ -39,6 +43,19 @@ export const ResultHeader: React.FC = ({ responsive={false} wrap > + {resultPosition && ( + + + + + + )}