From 937ff30faf54c1cc4159c706129f8fff77057964 Mon Sep 17 00:00:00 2001 From: Shenoy Pratik Date: Fri, 20 Oct 2023 16:35:26 -0700 Subject: [PATCH] Support dark mode and session for sql, minor bug fixes (#165) * suport dark mode and editor theming from dev tools Signed-off-by: Shenoy Pratik * remove sql editor theme, add session check Signed-off-by: Shenoy Pratik * update snapshots Signed-off-by: Shenoy Pratik * minor fixes Signed-off-by: Shenoy Pratik * fix import Signed-off-by: Shenoy Pratik * fix job query url Signed-off-by: Shenoy Pratik * update poll interval to 2000 Signed-off-by: Shenoy Pratik --------- Signed-off-by: Shenoy Pratik --- common/constants/index.ts | 10 +- common/utils/async_query_helpers.ts | 62 ++++ public/ace-themes/sql_console.js | 19 - .../Main/__snapshots__/main.test.tsx.snap | 63 ++-- public/components/Main/main.tsx | 17 +- public/components/PPLPage/PPLPage.tsx | 9 +- .../__snapshots__/PPLPage.test.tsx.snap | 12 +- .../components/QueryResults/QueryResults.tsx | 2 +- .../QueryResults/QueryResultsBody.tsx | 43 +-- .../QueryResultsBody.test.tsx.snap | 348 +++++++++--------- public/components/SQLPage/SQLPage.tsx | 10 +- .../__snapshots__/SQLPage.test.tsx.snap | 16 +- public/components/SQLPage/table_view.tsx | 12 +- public/components/SQLPage/utils.tsx | 51 --- .../selectors/index_type_selector.tsx | 2 +- .../selectors/source_selector.tsx | 2 +- public/index.scss | 142 ------- public/index.ts | 3 - public/utils/PanelWrapper.tsx | 20 +- webpack.config.js | 43 --- 20 files changed, 357 insertions(+), 529 deletions(-) create mode 100644 common/utils/async_query_helpers.ts delete mode 100644 public/ace-themes/sql_console.js delete mode 100644 public/components/SQLPage/utils.tsx delete mode 100644 public/index.scss delete mode 100644 webpack.config.js diff --git a/common/constants/index.ts b/common/constants/index.ts index db990084..0f78c810 100644 --- a/common/constants/index.ts +++ b/common/constants/index.ts @@ -16,7 +16,7 @@ export const TREE_ITEM_MATERIALIZED_VIEW_DEFAULT_NAME = `materialized_view`; export const TREE_ITEM_DATABASE_NAME_DEFAULT_NAME = `database`; export const TREE_ITEM_TABLE_NAME_DEFAULT_NAME = `table`; export const TREE_ITEM_LOAD_MATERIALIZED_BADGE_NAME = `Load Materialized View`; -export const TREE_ITEM_BADGE_NAME =`badge` +export const TREE_ITEM_BADGE_NAME = `badge`; export const LOAD_OPENSEARCH_INDICES_QUERY = `SHOW tables LIKE '%';`; export const SKIPPING_INDEX_QUERY = `CREATE SKIPPING INDEX ON myS3.logs_db.http_logs (status VALUE_SET) @@ -89,6 +89,8 @@ export const ACCELERATION_INDEX_NAME_INFO = `All OpenSearch acceleration indices - All user given index names must be in lowercase letters. Index name cannot begin with underscores. Spaces, commas, and characters -, :, ", *, +, /, \, |, ?, #, >, or < are not allowed. `; -export const SIDEBAR_POLL_INTERVAL_MS = 5000; - -export const FETCH_OPENSEARCH_INDICES_PATH = '/api/sql_console/sqlquery' \ No newline at end of file +export const FETCH_OPENSEARCH_INDICES_PATH = '/api/sql_console/sqlquery'; +export const POLL_INTERVAL_MS = 2000; +export const ASYNC_QUERY_ENDPOINT = '/api/spark_sql_console'; +export const ASYNC_QUERY_JOB_ENDPOINT = ASYNC_QUERY_ENDPOINT + '/job/'; +export const ASYNC_QUERY_SESSION_ID = 'async-query-session-id'; diff --git a/common/utils/async_query_helpers.ts b/common/utils/async_query_helpers.ts new file mode 100644 index 00000000..689727b3 --- /dev/null +++ b/common/utils/async_query_helpers.ts @@ -0,0 +1,62 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +import _ from 'lodash'; +import { CoreStart } from '../../../../src/core/public'; +import { + ASYNC_QUERY_ENDPOINT, + ASYNC_QUERY_JOB_ENDPOINT, + ASYNC_QUERY_SESSION_ID, + POLL_INTERVAL_MS, +} from '../constants'; + +export const setAsyncSessionId = (value: string | null) => { + if (value === null) sessionStorage.removeItem(ASYNC_QUERY_SESSION_ID); + else sessionStorage.setItem(ASYNC_QUERY_SESSION_ID, value); +}; + +export const getAsyncSessionId = () => { + return sessionStorage.getItem(ASYNC_QUERY_SESSION_ID); +}; + +export const getJobId = (query: {}, http: CoreStart['http'], callback) => { + http + .post(ASYNC_QUERY_ENDPOINT, { + body: JSON.stringify({ ...query, sessionId: getAsyncSessionId() ?? undefined }), + }) + .then((res) => { + const id = res.data.resp.queryId; + setAsyncSessionId(_.get(res.data.resp, 'sessionId', null)); + callback(id); + }) + .catch((err) => { + console.error(err); + }); +}; + +export const pollQueryStatus = (id: string, http: CoreStart['http'], callback) => { + http + .get(ASYNC_QUERY_JOB_ENDPOINT + id) + .then((res) => { + const status = res.data.resp.status.toLowerCase(); + if ( + status === 'pending' || + status === 'running' || + status === 'scheduled' || + status === 'waiting' + ) { + setTimeout(() => pollQueryStatus(id, http, callback), POLL_INTERVAL_MS); + } else if (status === 'failed') { + callback([]); + } else if (status === 'success') { + const results = _.get(res.data.resp, 'datarows'); + callback(results); + } + }) + .catch((err) => { + console.error(err); + callback([]); + }); +}; diff --git a/public/ace-themes/sql_console.js b/public/ace-themes/sql_console.js deleted file mode 100644 index b0d4898c..00000000 --- a/public/ace-themes/sql_console.js +++ /dev/null @@ -1,19 +0,0 @@ -/* - * Copyright OpenSearch Contributors - * SPDX-License-Identifier: Apache-2.0 - */ - -import * as ace from 'brace'; - -ace.define('ace/theme/sql_console', ['require', 'exports', 'module', 'ace/lib/dom'], function ( - acequire, - exports, - module -) { - exports.isDark = false; - exports.cssClass = 'ace-sql-console'; - exports.cssText = require('../index.scss'); - - const dom = acequire('../lib/dom'); - dom.importCssString(exports.cssText, exports.cssClass); -}); diff --git a/public/components/Main/__snapshots__/main.test.tsx.snap b/public/components/Main/__snapshots__/main.test.tsx.snap index 6d65fd66..f34fea4e 100644 --- a/public/components/Main/__snapshots__/main.test.tsx.snap +++ b/public/components/Main/__snapshots__/main.test.tsx.snap @@ -296,7 +296,7 @@ exports[`
spec click clear button 1`] = ` />
spec click clear button 1`] = `