[Lens] Integrate searchSessionId into Lens app

x-pack/plugins/lens/public/app_plugin/app.test.tsx

@@ -74,6 +74,16 @@ function createMockFrame(): jest.Mocked<EditorFrameInstance> {
   };
 }
 
+function createMockSearchService() {
+  let sessionIdCounter = 1;
+  return {
+    session: {
+      start: jest.fn(() => `sessionId-${sessionIdCounter++}`),
+      clear: jest.fn(),
+    },
+  };
+}
+
 function createMockFilterManager() {
   const unsubscribe = jest.fn();
 
@@ -118,11 +128,19 @@ function createMockQueryString() {
 function createMockTimefilter() {
   const unsubscribe = jest.fn();
 
+  let timeFilter = { from: 'now-7d', to: 'now' };
+  let subscriber: () => void;
   return {
-    getTime: jest.fn(() => ({ from: 'now-7d', to: 'now' })),
-    setTime: jest.fn(),
+    getTime: jest.fn(() => timeFilter),
+    setTime: jest.fn((newTimeFilter) => {
+      timeFilter = newTimeFilter;
+      if (subscriber) {
+        subscriber();
+      }
+    }),
     getTimeUpdate$: () => ({
       subscribe: ({ next }: { next: () => void }) => {
+        subscriber = next;
         return unsubscribe;
       },
     }),
@@ -209,6 +227,7 @@ describe('Lens App', () => {
             return new Promise((resolve) => resolve({ id }));
           }),
         },
+        search: createMockSearchService(),
       } as unknown) as DataPublicPluginStart,
       storage: {
         get: jest.fn(),
@@ -295,6 +314,7 @@ describe('Lens App', () => {
               "query": "",
             },
             "savedQuery": undefined,
+            "searchSessionId": "sessionId-1",
             "showNoDataPopover": [Function],
           },
         ],
@@ -1072,6 +1092,53 @@ describe('Lens App', () => {
         })
       );
     });
+
+    it('updates the searchSessionId when the user changes query or time in the search bar', () => {
+      const { component, frame, services } = mountWith({});
+      act(() =>
+        component.find(TopNavMenu).prop('onQuerySubmit')!({
+          dateRange: { from: 'now-14d', to: 'now-7d' },
+          query: { query: '', language: 'lucene' },
+        })
+      );
+      component.update();
+      expect(frame.mount).toHaveBeenCalledWith(
+        expect.any(Element),
+        expect.objectContaining({
+          searchSessionId: `sessionId-1`,
+        })
+      );
+
+      // trigger again, this time changing just the query
+      act(() =>
+        component.find(TopNavMenu).prop('onQuerySubmit')!({
+          dateRange: { from: 'now-14d', to: 'now-7d' },
+          query: { query: 'new', language: 'lucene' },
+        })
+      );
+      component.update();
+      expect(frame.mount).toHaveBeenCalledWith(
+        expect.any(Element),
+        expect.objectContaining({
+          searchSessionId: `sessionId-2`,
+        })
+      );
+
+      const indexPattern = ({ id: 'index1' } as unknown) as IIndexPattern;
+      const field = ({ name: 'myfield' } as unknown) as IFieldType;
+      act(() =>
+        services.data.query.filterManager.setFilters([
+          esFilters.buildExistsFilter(field, indexPattern),
+        ])
+      );
+      component.update();
+      expect(frame.mount).toHaveBeenCalledWith(
+        expect.any(Element),
+        expect.objectContaining({
+          searchSessionId: `sessionId-3`,
+        })
+      );
+    });
   });
 
   describe('saved query handling', () => {
@@ -1165,6 +1232,37 @@ describe('Lens App', () => {
       );
     });
 
+    it('updates the searchSessionId when the query is updated', () => {
+      const { component, frame } = mountWith({});
+      act(() => {
+        component.find(TopNavMenu).prop('onSaved')!({
+          id: '1',
+          attributes: {
+            title: '',
+            description: '',
+            query: { query: '', language: 'lucene' },
+          },
+        });
+      });
+      act(() => {
+        component.find(TopNavMenu).prop('onSavedQueryUpdated')!({
+          id: '2',
+          attributes: {
+            title: 'new title',
+            description: '',
+            query: { query: '', language: 'lucene' },
+          },
+        });
+      });
+      component.update();
+      expect(frame.mount).toHaveBeenCalledWith(
+        expect.any(Element),
+        expect.objectContaining({
+          searchSessionId: `sessionId-1`,
+        })
+      );
+    });
+
     it('clears all existing unpinned filters when the active saved query is cleared', () => {
       const { component, frame, services } = mountWith({});
       act(() =>
@@ -1190,6 +1288,32 @@ describe('Lens App', () => {
         })
       );
     });
+
+    it('updates the searchSessionId when the active saved query is cleared', () => {
+      const { component, frame, services } = mountWith({});
+      act(() =>
+        component.find(TopNavMenu).prop('onQuerySubmit')!({
+          dateRange: { from: 'now-14d', to: 'now-7d' },
+          query: { query: 'new', language: 'lucene' },
+        })
+      );
+      const indexPattern = ({ id: 'index1' } as unknown) as IIndexPattern;
+      const field = ({ name: 'myfield' } as unknown) as IFieldType;
+      const pinnedField = ({ name: 'pinnedField' } as unknown) as IFieldType;
+      const unpinned = esFilters.buildExistsFilter(field, indexPattern);
+      const pinned = esFilters.buildExistsFilter(pinnedField, indexPattern);
+      FilterManager.setFiltersStore([pinned], esFilters.FilterStateStore.GLOBAL_STATE);
+      act(() => services.data.query.filterManager.setFilters([pinned, unpinned]));
+      component.update();
+      act(() => component.find(TopNavMenu).prop('onClearSavedQuery')!());
+      component.update();
+      expect(frame.mount).toHaveBeenCalledWith(
+        expect.any(Element),
+        expect.objectContaining({
+          searchSessionId: `sessionId-2`,
+        })
+      );
+    });
   });
 
   describe('showing a confirm message when leaving', () => {
@@ -1316,5 +1440,13 @@ describe('Lens App', () => {
       expect(confirmLeave).toHaveBeenCalled();
       expect(defaultLeave).not.toHaveBeenCalled();
     });
+
+    it('should clear the session when leaving the app', () => {
+      const { props, services } = mountWith({});
+      const { clear } = services.data.search.session;
+      const lastCall = props.onAppLeave.mock.calls[props.onAppLeave.mock.calls.length - 1][0];
+      lastCall({ default: defaultLeave, confirm: confirmLeave });
+      expect(clear).toHaveBeenCalled();
+    });
   });
 });

x-pack/plugins/lens/public/app_plugin/app.tsx

@@ -89,6 +89,7 @@ export function App({
       isSaveModalVisible: false,
       indicateNoData: false,
       isSaveable: false,
+      searchSessionId: data.search.session.start(),
     };
   });
 
@@ -160,7 +161,11 @@ export function App({
 
     const filterSubscription = data.query.filterManager.getUpdates$().subscribe({
       next: () => {
-        setState((s) => ({ ...s, filters: data.query.filterManager.getFilters() }));
+        setState((s) => ({
+          ...s,
+          filters: data.query.filterManager.getFilters(),
+          searchSessionId: data.search.session.start(),
+        }));
         trackUiEvent('app_filters_updated');
       },
     });
@@ -174,6 +179,7 @@ export function App({
             fromDate: currentRange.from,
             toDate: currentRange.to,
           },
+          searchSessionId: data.search.session.start(),
         }));
       },
     });
@@ -196,6 +202,7 @@ export function App({
   }, [
     data.query.filterManager,
     data.query.timefilter.timefilter,
+    data.search.session,
     notifications.toasts,
     uiSettings,
     data.query,
@@ -205,6 +212,8 @@ export function App({
 
   useEffect(() => {
     onAppLeave((actions) => {
+      // Clear the session when leaving Lens
+      data.search.session.clear();
       // Confirm when the user has made any changes to an existing doc
       // or when the user has configured something without saving
       if (
@@ -231,6 +240,7 @@ export function App({
     state.persistedDoc,
     getLastKnownDocWithoutPinnedFilters,
     application.capabilities.visualize.save,
+    data.search.session,
   ]);
 
   // Sync Kibana breadcrumbs any time the saved document's title changes
@@ -428,13 +438,15 @@ export function App({
       if (saveProps.returnToOrigin && redirectToOrigin) {
         // disabling the validation on app leave because the document has been saved.
         onAppLeave((actions) => {
+          data.search.session.clear();
           return actions.default();
         });
         redirectToOrigin({ input: newInput, isCopied: saveProps.newCopyOnSave });
         return;
       } else if (saveProps.dashboardId && redirectToDashboard) {
         // disabling the validation on app leave because the document has been saved.
         onAppLeave((actions) => {
+          data.search.session.clear();
           return actions.default();
         });
         redirectToDashboard(newInput, saveProps.dashboardId);
@@ -541,6 +553,7 @@ export function App({
         if (savingPermitted && lastKnownDoc) {
           // disabling the validation on app leave because the document has been saved.
           onAppLeave((actions) => {
+            data.search.session.clear();
             return actions.default();
           });
           runSave(
@@ -601,14 +614,16 @@ export function App({
                 data.query.timefilter.timefilter.setTime(dateRange);
                 trackUiEvent('app_date_change');
               } else {
+                // Query has changed, renew the session id.
+                // Time change will be picked up by the time subscription
+                setState((s) => ({
+                  ...s,
+                  searchSessionId: data.search.session.start(),
+                }));
                 trackUiEvent('app_query_change');
               }
               setState((s) => ({
                 ...s,
-                dateRange: {
-                  fromDate: dateRange.from,
-                  toDate: dateRange.to,
-                },
                 query: query || s.query,
               }));
             }}
@@ -650,6 +665,7 @@ export function App({
             className="lnsApp__frame"
             render={editorFrame.mount}
             nativeProps={{
+              searchSessionId: state.searchSessionId,
               dateRange: state.dateRange,
               query: state.query,
               filters: state.filters,

x-pack/plugins/lens/public/app_plugin/types.ts

@@ -65,6 +65,7 @@ export interface LensAppState {
   savedQuery?: SavedQuery;
   isSaveable: boolean;
   activeData?: TableInspectorAdapter;
+  searchSessionId: string;
 }
 
 export interface RedirectToOriginProps {

x-pack/plugins/lens/public/editor_frame_service/editor_frame/editor_frame.test.tsx

@@ -60,6 +60,7 @@ function getDefaultProps() {
     },
     palettes: chartPluginMock.createPaletteRegistry(),
     showNoDataPopover: jest.fn(),
+    searchSessionId: 'sessionId',
   };
 }
 
@@ -264,6 +265,7 @@ describe('editor_frame', () => {
         filters: [],
         dateRange: { fromDate: 'now-7d', toDate: 'now' },
         availablePalettes: defaultProps.palettes,
+        searchSessionId: 'sessionId',
       });
     });
 

x-pack/plugins/lens/public/editor_frame_service/editor_frame/editor_frame.tsx

@@ -43,6 +43,7 @@ export interface EditorFrameProps {
   query: Query;
   filters: Filter[];
   savedQuery?: SavedQuery;
+  searchSessionId: string;
   onChange: (arg: {
     filterableIndexPatterns: string[];
     doc: Document;
@@ -105,7 +106,7 @@ export function EditorFrame(props: EditorFrameProps) {
     dateRange: props.dateRange,
     query: props.query,
     filters: props.filters,
-
+    searchSessionId: props.searchSessionId,
     availablePalettes: props.palettes,
 
     addNewLayer() {

x-pack/plugins/lens/public/editor_frame_service/editor_frame/state_management.test.ts

@@ -39,6 +39,7 @@ describe('editor_frame state management', () => {
         query: { query: '', language: 'lucene' },
         filters: [],
         showNoDataPopover: jest.fn(),
+        searchSessionId: 'sessionId',
       };
     });
 

x-pack/plugins/lens/public/editor_frame_service/editor_frame/workspace_panel/workspace_panel.tsx

@@ -477,6 +477,7 @@ export const InnerVisualizationWrapper = ({
         padding="m"
         expression={expression!}
         searchContext={context}
+        searchSessionId={framePublicAPI.searchSessionId}
         reload$={autoRefreshFetch$}
         onEvent={onEvent}
         onData$={onData$}

x-pack/plugins/lens/public/editor_frame_service/mocks.tsx

@@ -132,6 +132,7 @@ export function createMockFramePublicAPI(): FrameMock {
       get: () => palette,
       getAll: () => [palette],
     },
+    searchSessionId: 'sessionId',
   };
 }
 

x-pack/plugins/lens/public/editor_frame_service/service.test.tsx

@@ -57,6 +57,7 @@ describe('editor_frame service', () => {
             indexPatternId: '1',
             fieldName: 'test',
           },
+          searchSessionId: 'sessionId',
         });
         instance.unmount();
       })()
@@ -78,6 +79,7 @@ describe('editor_frame service', () => {
       query: { query: '', language: 'lucene' },
       filters: [],
       showNoDataPopover: jest.fn(),
+      searchSessionId: 'sessionId',
     });
     instance.unmount();
 

x-pack/plugins/lens/public/editor_frame_service/service.tsx

@@ -138,6 +138,7 @@ export class EditorFrameService {
             onChange,
             showNoDataPopover,
             initialContext,
+            searchSessionId,
           }
         ) => {
           domElement = element;
@@ -172,6 +173,7 @@ export class EditorFrameService {
                 onChange={onChange}
                 showNoDataPopover={showNoDataPopover}
                 initialContext={initialContext}
+                searchSessionId={searchSessionId}
               />
             </I18nProvider>,
             domElement