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 && (
+
+
+
+
+
+ )}