[8.14] Update SearchReactEmbeddable example to use sessionId and abor…

…tSignal (elastic#181249) (elastic#181443)

# Backport

This will backport the following commits from `main` to `8.14`:
- [Update SearchReactEmbeddable example to use sessionId and abortSignal
(elastic#181249)](elastic#181249)

<!--- Backport version: 9.4.3 -->

### Questions ?
Please refer to the [Backport tool
documentation](https://github.com/sqren/backport)

<!--BACKPORT [{"author":{"name":"Nathan
Reese","email":"[email protected]"},"sourceCommit":{"committedDate":"2024-04-23T14:07:33Z","message":"Update
SearchReactEmbeddable example to use sessionId and abortSignal
(elastic#181249)\n\nFixes
https://github.com/elastic/kibana/issues/181199\r\n\r\nCo-authored-by:
Kibana Machine
<[email protected]>","sha":"46cb23a80deb106f29a5823b492ea75d94d6b8e8","branchLabelMapping":{"^v8.15.0$":"main","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["Team:Presentation","release_note:skip","project:embeddableRebuild","v8.14.0","v8.15.0"],"title":"Update
SearchReactEmbeddable example to use sessionId and
abortSignal","number":181249,"url":"https://github.com/elastic/kibana/pull/181249","mergeCommit":{"message":"Update
SearchReactEmbeddable example to use sessionId and abortSignal
(elastic#181249)\n\nFixes
https://github.com/elastic/kibana/issues/181199\r\n\r\nCo-authored-by:
Kibana Machine
<[email protected]>","sha":"46cb23a80deb106f29a5823b492ea75d94d6b8e8"}},"sourceBranch":"main","suggestedTargetBranches":["8.14"],"targetPullRequestStates":[{"branch":"8.14","label":"v8.14.0","branchLabelMappingKey":"^v(\\d+).(\\d+).\\d+$","isSourceBranch":false,"state":"NOT_CREATED"},{"branch":"main","label":"v8.15.0","branchLabelMappingKey":"^v8.15.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/181249","number":181249,"mergeCommit":{"message":"Update
SearchReactEmbeddable example to use sessionId and abortSignal
(elastic#181249)\n\nFixes
https://github.com/elastic/kibana/issues/181199\r\n\r\nCo-authored-by:
Kibana Machine
<[email protected]>","sha":"46cb23a80deb106f29a5823b492ea75d94d6b8e8"}}]}]
BACKPORT-->

Co-authored-by: Nathan Reese <[email protected]>

examples/embeddable_examples/public/react_embeddables/search/get_count.ts

@@ -16,7 +16,9 @@ export async function getCount(
   dataService: DataPublicPluginStart,
   filters: Filter[],
   query: Query | AggregateQuery | undefined,
-  timeRange: TimeRange | undefined
+  timeRange: TimeRange | undefined,
+  abortSignal: AbortSignal,
+  sessionId?: string
 ) {
   const searchSource = await dataService.search.searchSource.create();
   searchSource.setField('index', dataView);
@@ -38,7 +40,9 @@ export async function getCount(
 
   const { rawResponse: resp } = await lastValueFrom(
     searchSource.fetch$({
+      abortSignal,
       legacyHitsTotal: false,
+      sessionId,
     })
   );
   // eslint-disable-next-line no-console

examples/embeddable_examples/public/react_embeddables/search/search_react_embeddable.tsx

@@ -15,7 +15,7 @@ import {
   useBatchedPublishingSubjects,
 } from '@kbn/presentation-publishing';
 import React, { useEffect } from 'react';
-import { BehaviorSubject, switchMap } from 'rxjs';
+import { BehaviorSubject, switchMap, tap } from 'rxjs';
 import { SEARCH_EMBEDDABLE_ID } from './constants';
 import { getCount } from './get_count';
 import { Api, Services, State } from './types';
@@ -55,8 +55,14 @@ export const getSearchEmbeddableFactory = (services: Services) => {
 
       const error$ = new BehaviorSubject<Error | undefined>(undefined);
       const count$ = new BehaviorSubject<number>(0);
+      let prevRequestAbortController: AbortController | undefined;
       const fetchSubscription = fetch$(api)
         .pipe(
+          tap(() => {
+            if (prevRequestAbortController) {
+              prevRequestAbortController.abort();
+            }
+          }),
           switchMap(async (fetchContext) => {
             error$.next(undefined);
             if (!defaultDataView) {
@@ -65,6 +71,8 @@ export const getSearchEmbeddableFactory = (services: Services) => {
 
             try {
               dataLoading$.next(true);
+              const abortController = new AbortController();
+              prevRequestAbortController = abortController;
               const count = await getCount(
                 defaultDataView,
                 services.data,
@@ -79,11 +87,13 @@ export const getSearchEmbeddableFactory = (services: Services) => {
                       to: new Date(fetchContext.timeslice[1]).toISOString(),
                       mode: 'absolute' as 'absolute',
                     }
-                  : fetchContext.timeRange
+                  : fetchContext.timeRange,
+                abortController.signal,
+                fetchContext.searchSessionId
               );
               return { count };
             } catch (error) {
-              return { error };
+              return error.name === 'AbortError' ? undefined : { error };
             }
           })
         )