[Explorer] Fixes for cancel button and saved object loading (#1197)

* remove unused files Signed-off-by: Eric Wei <menwe@amazon.com> * missing snapshots Signed-off-by: Eric Wei <menwe@amazon.com> * remove unused files Signed-off-by: Eric Wei <menwe@amazon.com> * move explorer button out of actions Signed-off-by: Eric <menwe@amazon.com> * fix cancel button isn't working issue Signed-off-by: Eric <menwe@amazon.com> * add sessionId to saved object loader Signed-off-by: Eric <menwe@amazon.com> * update snapshots Signed-off-by: Eric <menwe@amazon.com> * status update issue on object loading Signed-off-by: Eric <menwe@amazon.com> --------- Signed-off-by: Eric Wei <menwe@amazon.com> Signed-off-by: Eric <menwe@amazon.com>
opensearch-project · Oct 27, 2023 · e4e2bca · e4e2bca
1 parent be978bf
commit e4e2bca
Show file tree

Hide file tree

Showing 5 changed files with 55 additions and 34 deletions.
diff --git a/common/constants/data_sources.ts b/common/constants/data_sources.ts
@@ -19,3 +19,4 @@ export enum DATA_SOURCE_TYPES {
  SPARK = 'spark',
  S3Glue = 's3glue',
 }
+export const ASYNC_POLLING_INTERVAL = 2000;
diff --git a/public/components/common/search/sql_search.tsx b/public/components/common/search/sql_search.tsx
@@ -21,7 +21,7 @@ import {
 import { isEqual } from 'lodash';
 import React, { useEffect, useState } from 'react';
 import { batch, useDispatch, useSelector } from 'react-redux';
-import { QUERY_LANGUAGE } from '../../../../common/constants/data_sources';
+import { ASYNC_POLLING_INTERVAL, QUERY_LANGUAGE } from '../../../../common/constants/data_sources';
 import { APP_ANALYTICS_TAB_ID_REGEX, RAW_QUERY } from '../../../../common/constants/explorer';
 import { PPL_NEWLINE_REGEX, PPL_SPAN_REGEX } from '../../../../common/constants/shared';
 import { DirectQueryLoadingStatus, DirectQueryRequest } from '../../../../common/types/explorer';
@@ -103,7 +103,7 @@ export const DirectSearch = (props: any) => {
  stopPolling,
  } = usePolling<any, any>((params) => {
  return sqlService.fetchWithJobId(params);
- }, 2000);
+ }, ASYNC_POLLING_INTERVAL);
 
  const requestParams = { tabId };
  const { dispatchOnGettingHis } = useFetchEvents({

diff --git a/public/components/event_analytics/explorer/direct_query_running.tsx b/public/components/event_analytics/explorer/direct_query_running.tsx
@@ -20,23 +20,22 @@ export const DirectQueryRunning = ({ tabId }: { tabId: string }) => {
  const sqlService = new SQLService(coreRefs.http);
 
  const cancelQuery = () => {
- if (explorerSearchMeta.queryId !== '') {
- sqlService
- .deleteWithJobId({ queryId: explorerSearchMeta.queryId })
- .catch((e) => {
- console.error(e);
- })
- .finally(() => {
- dispatch(
- updateSearchMetaData({
- tabId,
- data: {
- isPolling: false,
- },
- })
- );
- });
+ if (explorerSearchMeta.queryId) {
+ sqlService.deleteWithJobId({ queryId: explorerSearchMeta.queryId }).catch((e) => {
+ console.error(e);
+ });
  }
+
+ // reset isPolling flag to remove loading page and queryId to empty
+ dispatch(
+ updateSearchMetaData({
+ tabId,
+ data: {
+ isPolling: false,
+ queryId: '',
+ },
+ })
+ );
  };
 
  return (

diff --git a/public/components/event_analytics/home/home.tsx b/public/components/event_analytics/home/home.tsx
@@ -229,16 +229,6 @@ const EventAnalyticsHome = (props: IHomeProps) => {
  >
  Delete
  </EuiContextMenuItem>,
- <EuiContextMenuItem
- key="redirect"
- onClick={() => {
- setIsActionsPopoverOpen(false);
- history.push(`/explorer`);
- }}
- data-test-subj="eventHomeAction__explorer"
- >
- Event Explorer
- </EuiContextMenuItem>,
  <EuiContextMenuItem
  key="addSample"
  onClick={() => {
@@ -294,6 +284,19 @@ const EventAnalyticsHome = (props: IHomeProps) => {
  <EuiContextMenuPanel items={popoverItems} />
  </EuiPopover>
  </EuiFlexItem>
+ <EuiFlexItem>
+ <EuiButton
+ key="redirect"
+ onClick={() => {
+ setIsActionsPopoverOpen(false);
+ history.push(`/explorer`);
+ }}
+ data-test-subj="eventHomeAction__explorer"
+ fill
+ >
+ Event Explorer
+ </EuiButton>
+ </EuiFlexItem>
  </EuiFlexGroup>
  </EuiPageContentHeaderSection>
  </EuiPageContentHeader>

diff --git a/public/services/saved_objects/saved_object_loaders/explorer_saved_object_loader.ts b/public/services/saved_objects/saved_object_loaders/explorer_saved_object_loader.ts
@@ -29,6 +29,7 @@ import {
 import { QueryManager } from '../../../../common/query_manager';
 import { statsChunk } from '../../../../common/query_manager/ast/types/stats';
 import {
+ DirectQueryRequest,
  IField,
  SavedQuery,
  SavedVisualization,
@@ -43,6 +44,9 @@ import { PollingConfigurations } from '../../../components/hooks';
 import { SQLService } from '../../requests/sql';
 import { coreRefs } from '../../../framework/core_refs';
 import { UsePolling } from '../../../components/hooks/use_polling';
+import { getAsyncSessionId, setAsyncSessionId } from '../../../../common/utils/query_session_utils';
+import { get as getObjValue } from '../../../../common/utils/shared';
+import { ASYNC_POLLING_INTERVAL } from '../../../../common/constants/data_sources';
 
 enum DIRECT_DATA_SOURCE_TYPES {
  DEFAULT_INDEX_PATTERNS = 'DEFAULT_INDEX_PATTERNS',
@@ -300,6 +304,12 @@ export class ExplorerSavedObjectLoader extends SavedObjectLoaderBase implements
  dispatchOnGettingHis(pollingResult, '');
  return true;
  }
+ dispatch(
+ updateSearchMetaData({
+ tabId,
+ data: { status: pollingResult.status },
+ })
+ );
  return false;
  };
 
@@ -316,13 +326,23 @@ export class ExplorerSavedObjectLoader extends SavedObjectLoaderBase implements
  loadSparkGlue = ({ objectData, dataSources, tabId }) => {
  const { dispatch } = this.dispatchers;
  const sqlService = new SQLService(coreRefs.http);
+ const sessionId = getAsyncSessionId();
+ const requestPayload = {
+ lang: objectData.query_lang.toLowerCase(),
+ query: objectData.query,
+ datasource: dataSources[0].label,
+ } as DirectQueryRequest;
+
+ if (sessionId) {
+ requestPayload.sessionId = sessionId;
+ }
 
  // Create an instance of UsePolling
  const polling = new UsePolling<any, any>(
  (params) => {
  return sqlService.fetchWithJobId(params);
  },
- 5000,
+ ASYNC_POLLING_INTERVAL,
  this.handleDirectQuerySuccess,
  this.handleDirectQueryError,
  { tabId }
@@ -343,13 +363,11 @@ export class ExplorerSavedObjectLoader extends SavedObjectLoaderBase implements
  );
 
  sqlService
- .fetch({
- lang: objectData.query_lang.toLowerCase(),
- query: objectData.query,
- datasource: dataSources[0].label,
- })
+ .fetch(requestPayload)
  .then((result) => {
+ setAsyncSessionId(getObjValue(result, 'sessionId', null));
  if (result.queryId) {
+ dispatch(updateSearchMetaData({ tabId, data: { queryId: result.queryId } }));
  startPolling({ queryId: result.queryId });
  } else {
  console.log('no query id found in response');