Skip to content

Commit

Permalink
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Support dark mode and session for sql, minor bug fixes (#165)
Browse files Browse the repository at this point in the history
* suport dark mode and editor theming from dev tools

Signed-off-by: Shenoy Pratik <[email protected]>

* remove sql editor theme, add session check

Signed-off-by: Shenoy Pratik <[email protected]>

* update snapshots

Signed-off-by: Shenoy Pratik <[email protected]>

* minor fixes

Signed-off-by: Shenoy Pratik <[email protected]>

* fix import

Signed-off-by: Shenoy Pratik <[email protected]>

* fix job query url

Signed-off-by: Shenoy Pratik <[email protected]>

* update poll interval to 2000

Signed-off-by: Shenoy Pratik <[email protected]>

---------

Signed-off-by: Shenoy Pratik <[email protected]>
(cherry picked from commit 937ff30)
Signed-off-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
github-actions[bot] committed Oct 20, 2023
1 parent 50e2d1a commit f88003f
Showing 20 changed files with 357 additions and 529 deletions.
10 changes: 6 additions & 4 deletions common/constants/index.ts
Original file line number Diff line number Diff line change
@@ -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'
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';
62 changes: 62 additions & 0 deletions common/utils/async_query_helpers.ts
Original file line number Diff line number Diff line change
@@ -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([]);
});
};
19 changes: 0 additions & 19 deletions public/ace-themes/sql_console.js

This file was deleted.

63 changes: 28 additions & 35 deletions public/components/Main/__snapshots__/main.test.tsx.snap
Original file line number Diff line number Diff line change
@@ -296,15 +296,15 @@ exports[`<Main /> spec click clear button 1`] = `
/>
<div>
<div
class="euiPanel euiPanel--paddingMedium euiPanel--borderRadiusMedium euiPanel--plain euiPanel--hasShadow sql-console-query-editor container-panel"
class="euiPanel euiPanel--paddingMedium euiPanel--borderRadiusMedium euiPanel--plain euiPanel--hasShadow sql-console-query-editor container-panel coreSystemRootDomElement"
>
<div
class="euiSpacer euiSpacer--s"
/>
<div
class="euiCodeEditorWrapper"
data-test-subj="codeEditorContainer"
style="width: 100%; height: 7rem;"
style="width: 100%; height: 10rem;"
>
<button
class="euiCodeEditorKeyboardHint"
@@ -323,9 +323,9 @@ exports[`<Main /> spec click clear button 1`] = `
</p>
</button>
<div
class=" ace_editor ace-sql-console"
class=" ace_editor ace-tm"
id="some_html_id"
style="width: 100%; height: 7rem; font-size: 14px;"
style="width: 100%; height: 10rem; font-size: 14px;"
>
<textarea
aria-label="Code Editor"
@@ -523,7 +523,6 @@ exports[`<Main /> spec click clear button 1`] = `
/>
<div
class="euiText euiText--medium"
style="color: rgb(63, 63, 63);"
>
<div
class="euiTextAlign euiTextAlign--center"
@@ -850,15 +849,15 @@ exports[`<Main /> spec click run button, and response causes an error 1`] = `
/>
<div>
<div
class="euiPanel euiPanel--paddingMedium euiPanel--borderRadiusMedium euiPanel--plain euiPanel--hasShadow sql-console-query-editor container-panel"
class="euiPanel euiPanel--paddingMedium euiPanel--borderRadiusMedium euiPanel--plain euiPanel--hasShadow sql-console-query-editor container-panel coreSystemRootDomElement"
>
<div
class="euiSpacer euiSpacer--s"
/>
<div
class="euiCodeEditorWrapper"
data-test-subj="codeEditorContainer"
style="width: 100%; height: 7rem;"
style="width: 100%; height: 10rem;"
>
<button
class="euiCodeEditorKeyboardHint"
@@ -877,9 +876,9 @@ exports[`<Main /> spec click run button, and response causes an error 1`] = `
</p>
</button>
<div
class=" ace_editor ace-sql-console"
class=" ace_editor ace-tm"
id="some_html_id"
style="width: 100%; height: 7rem; font-size: 14px;"
style="width: 100%; height: 10rem; font-size: 14px;"
>
<textarea
aria-label="Code Editor"
@@ -1077,7 +1076,6 @@ exports[`<Main /> spec click run button, and response causes an error 1`] = `
/>
<div
class="euiText euiText--medium"
style="color: rgb(63, 63, 63);"
>
<div
class="euiTextAlign euiTextAlign--center"
@@ -1404,15 +1402,15 @@ exports[`<Main /> spec click run button, and response is not ok 1`] = `
/>
<div>
<div
class="euiPanel euiPanel--paddingMedium euiPanel--borderRadiusMedium euiPanel--plain euiPanel--hasShadow sql-console-query-editor container-panel"
class="euiPanel euiPanel--paddingMedium euiPanel--borderRadiusMedium euiPanel--plain euiPanel--hasShadow sql-console-query-editor container-panel coreSystemRootDomElement"
>
<div
class="euiSpacer euiSpacer--s"
/>
<div
class="euiCodeEditorWrapper"
data-test-subj="codeEditorContainer"
style="width: 100%; height: 7rem;"
style="width: 100%; height: 10rem;"
>
<button
class="euiCodeEditorKeyboardHint"
@@ -1431,9 +1429,9 @@ exports[`<Main /> spec click run button, and response is not ok 1`] = `
</p>
</button>
<div
class=" ace_editor ace-sql-console"
class=" ace_editor ace-tm"
id="some_html_id"
style="width: 100%; height: 7rem; font-size: 14px;"
style="width: 100%; height: 10rem; font-size: 14px;"
>
<textarea
aria-label="Code Editor"
@@ -1631,7 +1629,6 @@ exports[`<Main /> spec click run button, and response is not ok 1`] = `
/>
<div
class="euiText euiText--medium"
style="color: rgb(63, 63, 63);"
>
<div
class="euiTextAlign euiTextAlign--center"
@@ -2046,15 +2043,15 @@ exports[`<Main /> spec click run button, and response is ok 1`] = `
/>
<div>
<div
class="euiPanel euiPanel--paddingMedium euiPanel--borderRadiusMedium euiPanel--plain euiPanel--hasShadow sql-console-query-editor container-panel"
class="euiPanel euiPanel--paddingMedium euiPanel--borderRadiusMedium euiPanel--plain euiPanel--hasShadow sql-console-query-editor container-panel coreSystemRootDomElement"
>
<div
class="euiSpacer euiSpacer--s"
/>
<div
class="euiCodeEditorWrapper"
data-test-subj="codeEditorContainer"
style="width: 100%; height: 7rem;"
style="width: 100%; height: 10rem;"
>
<button
class="euiCodeEditorKeyboardHint"
@@ -2073,9 +2070,9 @@ exports[`<Main /> spec click run button, and response is ok 1`] = `
</p>
</button>
<div
class=" ace_editor ace-sql-console"
class=" ace_editor ace-tm"
id="some_html_id"
style="width: 100%; height: 7rem; font-size: 14px;"
style="width: 100%; height: 10rem; font-size: 14px;"
>
<textarea
aria-label="Code Editor"
@@ -2273,7 +2270,6 @@ exports[`<Main /> spec click run button, and response is ok 1`] = `
/>
<div
class="euiText euiText--medium"
style="color: rgb(63, 63, 63);"
>
<div
class="euiTextAlign euiTextAlign--center"
@@ -2684,15 +2680,15 @@ exports[`<Main /> spec click run button, response fills null and missing values
/>
<div>
<div
class="euiPanel euiPanel--paddingMedium euiPanel--borderRadiusMedium euiPanel--plain euiPanel--hasShadow sql-console-query-editor container-panel"
class="euiPanel euiPanel--paddingMedium euiPanel--borderRadiusMedium euiPanel--plain euiPanel--hasShadow sql-console-query-editor container-panel coreSystemRootDomElement"
>
<div
class="euiSpacer euiSpacer--s"
/>
<div
class="euiCodeEditorWrapper"
data-test-subj="codeEditorContainer"
style="width: 100%; height: 7rem;"
style="width: 100%; height: 10rem;"
>
<button
class="euiCodeEditorKeyboardHint"
@@ -2711,9 +2707,9 @@ exports[`<Main /> spec click run button, response fills null and missing values
</p>
</button>
<div
class=" ace_editor ace-sql-console"
class=" ace_editor ace-tm"
id="some_html_id"
style="width: 100%; height: 7rem; font-size: 14px;"
style="width: 100%; height: 10rem; font-size: 14px;"
>
<textarea
aria-label="Code Editor"
@@ -2911,7 +2907,6 @@ exports[`<Main /> spec click run button, response fills null and missing values
/>
<div
class="euiText euiText--medium"
style="color: rgb(63, 63, 63);"
>
<div
class="euiTextAlign euiTextAlign--center"
@@ -3241,15 +3236,15 @@ exports[`<Main /> spec click translation button, and response is ok 1`] = `
/>
<div>
<div
class="euiPanel euiPanel--paddingMedium euiPanel--borderRadiusMedium euiPanel--plain euiPanel--hasShadow sql-console-query-editor container-panel"
class="euiPanel euiPanel--paddingMedium euiPanel--borderRadiusMedium euiPanel--plain euiPanel--hasShadow sql-console-query-editor container-panel coreSystemRootDomElement"
>
<div
class="euiSpacer euiSpacer--s"
/>
<div
class="euiCodeEditorWrapper"
data-test-subj="codeEditorContainer"
style="width: 100%; height: 7rem;"
style="width: 100%; height: 10rem;"
>
<button
class="euiCodeEditorKeyboardHint"
@@ -3268,9 +3263,9 @@ exports[`<Main /> spec click translation button, and response is ok 1`] = `
</p>
</button>
<div
class=" ace_editor ace-sql-console"
class=" ace_editor ace-tm"
id="some_html_id"
style="width: 100%; height: 7rem; font-size: 14px;"
style="width: 100%; height: 10rem; font-size: 14px;"
>
<textarea
aria-label="Code Editor"
@@ -3468,7 +3463,6 @@ exports[`<Main /> spec click translation button, and response is ok 1`] = `
/>
<div
class="euiText euiText--medium"
style="color: rgb(63, 63, 63);"
>
<div
class="euiTextAlign euiTextAlign--center"
@@ -3817,15 +3811,15 @@ exports[`<Main /> spec renders the component 1`] = `
/>
<div>
<div
class="euiPanel euiPanel--paddingMedium euiPanel--borderRadiusMedium euiPanel--plain euiPanel--hasShadow sql-console-query-editor container-panel"
class="euiPanel euiPanel--paddingMedium euiPanel--borderRadiusMedium euiPanel--plain euiPanel--hasShadow sql-console-query-editor container-panel coreSystemRootDomElement"
>
<div
class="euiSpacer euiSpacer--s"
/>
<div
class="euiCodeEditorWrapper"
data-test-subj="codeEditorContainer"
style="width: 100%; height: 7rem;"
style="width: 100%; height: 10rem;"
>
<button
class="euiCodeEditorKeyboardHint"
@@ -3844,9 +3838,9 @@ exports[`<Main /> spec renders the component 1`] = `
</p>
</button>
<div
class=" ace_editor ace-sql-console"
class=" ace_editor ace-tm"
id="some_html_id"
style="width: 100%; height: 7rem; font-size: 14px;"
style="width: 100%; height: 10rem; font-size: 14px;"
>
<textarea
aria-label="Code Editor"
@@ -4044,7 +4038,6 @@ exports[`<Main /> spec renders the component 1`] = `
/>
<div
class="euiText euiText--medium"
style="color: rgb(63, 63, 63);"
>
<div
class="euiTextAlign euiTextAlign--center"
17 changes: 12 additions & 5 deletions public/components/Main/main.tsx
Original file line number Diff line number Diff line change
@@ -22,7 +22,13 @@ import { IHttpResponse } from 'angular';
import _ from 'lodash';
import React from 'react';
import { ChromeBreadcrumb, CoreStart } from '../../../../../src/core/public';
import {
ASYNC_QUERY_ENDPOINT,
ASYNC_QUERY_JOB_ENDPOINT,
POLL_INTERVAL_MS,
} from '../../../common/constants';
import { AsyncQueryLoadingStatus } from '../../../common/types';
import { getAsyncSessionId, setAsyncSessionId } from '../../../common/utils/async_query_helpers';
import { MESSAGE_TAB_LABEL } from '../../utils/constants';
import {
Tree,
@@ -428,15 +434,15 @@ export class Main extends React.Component<MainProps, MainState> {
const queries: string[] = getQueries(queriesString);
const language = this.state.language;
if (queries.length > 0) {
let endpoint = '/api/spark_sql_console';
const responsePromise = Promise.all(
queries.map((query: string) =>
this.httpClient
.post(endpoint, {
.post(ASYNC_QUERY_ENDPOINT, {
body: JSON.stringify({
lang: language,
query: query,
datasource: this.state.selectedDatasource[0].label,
sessionId: getAsyncSessionId() ?? undefined,
}),
})
.catch((error: any) => {
@@ -469,6 +475,7 @@ export class Main extends React.Component<MainProps, MainState> {
: '';

const queryId: string = _.get(responseObj, 'queryId');
setAsyncSessionId(_.get(responseObj, 'sessionId', null));

// clear state from previous results and start async loading
this.setState({
@@ -493,7 +500,7 @@ export class Main extends React.Component<MainProps, MainState> {
clearInterval(interval);
}
this.callGetStartPolling(queries);
}, 2 * 1000);
}, POLL_INTERVAL_MS);
}
}
);
@@ -503,7 +510,7 @@ export class Main extends React.Component<MainProps, MainState> {

callGetStartPolling = async (queries: string[]) => {
const nextP = this.httpClient
.get('/api/spark_sql_console/job/' + this.state.asyncJobId)
.get(ASYNC_QUERY_JOB_ENDPOINT + this.state.asyncJobId)
.catch((error: any) => {
this.setState({
messages: [
@@ -562,7 +569,7 @@ export class Main extends React.Component<MainProps, MainState> {
cancelAsyncQuery = async () => {
Promise.all([
this.httpClient
.delete('/api/spark_sql_console/job/' + this.state.asyncJobId)
.delete(ASYNC_QUERY_JOB_ENDPOINT + this.state.asyncJobId)
.catch((error: any) => {
this.setState({
messages: [
9 changes: 6 additions & 3 deletions public/components/PPLPage/PPLPage.tsx
Original file line number Diff line number Diff line change
@@ -98,15 +98,18 @@ export class PPLPage extends React.Component<PPLPageProps, PPLPageState> {
}

return (
<EuiPanel className="sql-console-query-editor container-panel" paddingSize="l">
<EuiPanel
className="sql-console-query-editor container-panel coreSystemRootDomElement"
paddingSize="l"
>
<EuiText className="sql-query-panel-header">
<h3>Query editor</h3>
</EuiText>
<EuiSpacer size="s" />
<EuiCodeEditor
theme="sql_console"
theme="textmate"
width="100%"
height="7rem"
height="10rem"
value={this.props.pplQuery}
onChange={this.props.updatePPLQueries}
showPrintMargin={false}
12 changes: 6 additions & 6 deletions public/components/PPLPage/__snapshots__/PPLPage.test.tsx.snap
Original file line number Diff line number Diff line change
@@ -3,7 +3,7 @@
exports[`<PPLPage /> spec renders the component 1`] = `
<div>
<div
class="euiPanel euiPanel--paddingLarge euiPanel--borderRadiusMedium euiPanel--plain euiPanel--hasShadow sql-console-query-editor container-panel"
class="euiPanel euiPanel--paddingLarge euiPanel--borderRadiusMedium euiPanel--plain euiPanel--hasShadow sql-console-query-editor container-panel coreSystemRootDomElement"
>
<div
class="euiText euiText--medium sql-query-panel-header"
@@ -18,7 +18,7 @@ exports[`<PPLPage /> spec renders the component 1`] = `
<div
class="euiCodeEditorWrapper"
data-test-subj="codeEditorContainer"
style="width: 100%; height: 7rem;"
style="width: 100%; height: 10rem;"
>
<button
class="euiCodeEditorKeyboardHint"
@@ -39,7 +39,7 @@ exports[`<PPLPage /> spec renders the component 1`] = `
<div
class=" ace_editor ace-tm"
id="some_html_id"
style="width: 100%; height: 7rem; font-size: 14px;"
style="width: 100%; height: 10rem; font-size: 14px;"
>
<textarea
aria-label="Code Editor"
@@ -196,7 +196,7 @@ exports[`<PPLPage /> spec renders the component 1`] = `
exports[`<PPLPage /> spec tests the action buttons 1`] = `
<div>
<div
class="euiPanel euiPanel--paddingLarge euiPanel--borderRadiusMedium euiPanel--plain euiPanel--hasShadow sql-console-query-editor container-panel"
class="euiPanel euiPanel--paddingLarge euiPanel--borderRadiusMedium euiPanel--plain euiPanel--hasShadow sql-console-query-editor container-panel coreSystemRootDomElement"
>
<div
class="euiText euiText--medium sql-query-panel-header"
@@ -211,7 +211,7 @@ exports[`<PPLPage /> spec tests the action buttons 1`] = `
<div
class="euiCodeEditorWrapper"
data-test-subj="codeEditorContainer"
style="width: 100%; height: 7rem;"
style="width: 100%; height: 10rem;"
>
<button
class="euiCodeEditorKeyboardHint"
@@ -232,7 +232,7 @@ exports[`<PPLPage /> spec tests the action buttons 1`] = `
<div
class=" ace_editor ace-tm"
id="some_html_id"
style="width: 100%; height: 7rem; font-size: 14px;"
style="width: 100%; height: 10rem; font-size: 14px;"
>
<textarea
aria-label="Code Editor"
2 changes: 1 addition & 1 deletion public/components/QueryResults/QueryResults.tsx
Original file line number Diff line number Diff line change
@@ -343,7 +343,7 @@ class QueryResults extends React.Component<QueryResultsProps, QueryResultsState>
<>
<EuiSpacer size="xxl" />
<EuiSpacer size="xl" />
<EuiText style={{ color: '#3f3f3f' }}>
<EuiText>
<EuiTextAlign textAlign="center">
<h4>No result</h4>
</EuiTextAlign>
43 changes: 22 additions & 21 deletions public/components/QueryResults/QueryResultsBody.tsx
Original file line number Diff line number Diff line change
@@ -37,7 +37,6 @@ import {
Pager,
} from '@elastic/eui';
import _ from 'lodash';
import '../../ace-themes/sql_console';
import { COLUMN_WIDTH, PAGE_OPTIONS, SMALL_COLUMN_WIDTH } from '../../utils/constants';
import {
Node,
@@ -587,26 +586,28 @@ class QueryResultsBody extends React.Component<QueryResultsBodyProps, QueryResul

renderMessagesTab(): JSX.Element {
return (
<EuiCodeEditor
className={
this.props.messages && this.props.messages.length > 0
? this.props.messages[0].className
: 'successful-message'
}
mode="text"
theme="sql_console"
width="100%"
value={getMessageString(this.props.messages, this.props.tabNames)}
showPrintMargin={false}
readOnly={true}
setOptions={{
fontSize: '14px',
readOnly: true,
highlightActiveLine: false,
highlightGutterLine: false,
}}
aria-label="Code Editor"
/>
<div className="coreSystemRootDomElement">
<EuiCodeEditor
className={
this.props.messages && this.props.messages.length > 0
? this.props.messages[0].className
: 'successful-message'
}
mode="text"
theme="textmate"
width="100%"
value={getMessageString(this.props.messages, this.props.tabNames)}
showPrintMargin={false}
readOnly={true}
setOptions={{
fontSize: '14px',
readOnly: true,
highlightActiveLine: false,
highlightGutterLine: false,
}}
aria-label="Code Editor"
/>
</div>
);
}

Large diffs are not rendered by default.

10 changes: 6 additions & 4 deletions public/components/SQLPage/SQLPage.tsx
Original file line number Diff line number Diff line change
@@ -23,7 +23,6 @@ import 'brace/ext/language_tools';
import 'brace/mode/sql';
import React from 'react';
import { CoreStart } from '../../../../../src/core/public';
import '../../ace-themes/sql_console';
import { ResponseDetail, TranslateResult } from '../Main/main';
import { CreateAcceleration } from '../acceleration/create/create_acceleration';

@@ -142,13 +141,16 @@ export class SQLPage extends React.Component<SQLPageProps, SQLPageState> {

return (
<>
<EuiPanel className="sql-console-query-editor container-panel" paddingSize="m">
<EuiPanel
className="sql-console-query-editor container-panel coreSystemRootDomElement"
paddingSize="m"
>
<EuiSpacer size="s" />
<EuiCodeEditor
mode="sql"
theme="sql_console"
theme="textmate"
width="100%"
height="7rem"
height="10rem"
value={this.props.sqlQuery}
onChange={this.props.updateSQLQueries}
showPrintMargin={false}
16 changes: 8 additions & 8 deletions public/components/SQLPage/__snapshots__/SQLPage.test.tsx.snap
Original file line number Diff line number Diff line change
@@ -3,15 +3,15 @@
exports[`<SQLPage /> spec renders the component 1`] = `
<div>
<div
class="euiPanel euiPanel--paddingMedium euiPanel--borderRadiusMedium euiPanel--plain euiPanel--hasShadow sql-console-query-editor container-panel"
class="euiPanel euiPanel--paddingMedium euiPanel--borderRadiusMedium euiPanel--plain euiPanel--hasShadow sql-console-query-editor container-panel coreSystemRootDomElement"
>
<div
class="euiSpacer euiSpacer--s"
/>
<div
class="euiCodeEditorWrapper"
data-test-subj="codeEditorContainer"
style="width: 100%; height: 7rem;"
style="width: 100%; height: 10rem;"
>
<button
class="euiCodeEditorKeyboardHint"
@@ -30,9 +30,9 @@ exports[`<SQLPage /> spec renders the component 1`] = `
</p>
</button>
<div
class=" ace_editor ace-sql-console"
class=" ace_editor ace-tm"
id="some_html_id"
style="width: 100%; height: 7rem; font-size: 14px;"
style="width: 100%; height: 10rem; font-size: 14px;"
>
<textarea
aria-label="Code Editor"
@@ -196,15 +196,15 @@ exports[`<SQLPage /> spec renders the component 1`] = `
exports[`<SQLPage /> spec tests the action buttons 1`] = `
<div>
<div
class="euiPanel euiPanel--paddingMedium euiPanel--borderRadiusMedium euiPanel--plain euiPanel--hasShadow sql-console-query-editor container-panel"
class="euiPanel euiPanel--paddingMedium euiPanel--borderRadiusMedium euiPanel--plain euiPanel--hasShadow sql-console-query-editor container-panel coreSystemRootDomElement"
>
<div
class="euiSpacer euiSpacer--s"
/>
<div
class="euiCodeEditorWrapper"
data-test-subj="codeEditorContainer"
style="width: 100%; height: 7rem;"
style="width: 100%; height: 10rem;"
>
<button
class="euiCodeEditorKeyboardHint"
@@ -223,9 +223,9 @@ exports[`<SQLPage /> spec tests the action buttons 1`] = `
</p>
</button>
<div
class=" ace_editor ace-sql-console"
class=" ace_editor ace-tm"
id="some_html_id"
style="width: 100%; height: 7rem; font-size: 14px;"
style="width: 100%; height: 10rem; font-size: 14px;"
>
<textarea
aria-label="Code Editor"
12 changes: 6 additions & 6 deletions public/components/SQLPage/table_view.tsx
Original file line number Diff line number Diff line change
@@ -30,8 +30,8 @@ import {
TREE_ITEM_SKIPPING_INDEX_DEFAULT_NAME,
TREE_ITEM_TABLE_NAME_DEFAULT_NAME,
} from '../../../common/constants';
import { getJobId, pollQueryStatus } from '../../../common/utils/async_query_helpers';
import { AccelerationIndexFlyout } from './acceleration_index_flyout';
import { getJobId, pollQueryStatus } from './utils';

interface CustomView {
http: CoreStart['http'];
@@ -373,11 +373,11 @@ export const TableView = ({ http, selectedItems, updateSQLQueries, refreshTree }
</EuiFlexItem>
<EuiFlexItem grow={false}>Loading data</EuiFlexItem>
<EuiFlexItem grow={false}>
<div style ={{ padding: '10px' }}>
<EuiText textAlign="center" color="subdued">
Loading can take more than 30s. Queries can be made after the data has loaded. Any
queries run before the data is loaded will be queued
</EuiText>
<div style={{ padding: '10px' }}>
<EuiText textAlign="center" color="subdued">
Loading can take more than 30s. Queries can be made after the data has loaded. Any
queries run before the data is loaded will be queued
</EuiText>
</div>
</EuiFlexItem>
</EuiFlexGroup>
51 changes: 0 additions & 51 deletions public/components/SQLPage/utils.tsx

This file was deleted.

Original file line number Diff line number Diff line change
@@ -23,7 +23,7 @@ import {
CreateAccelerationForm,
DataTableFieldsType,
} from '../../../../common/types';
import { getJobId, pollQueryStatus } from '../../SQLPage/utils';
import { getJobId, pollQueryStatus } from '../../../../common/utils/async_query_helpers';

interface IndexTypeSelectorProps {
http: CoreStart['http'];
Original file line number Diff line number Diff line change
@@ -8,7 +8,7 @@ import producer from 'immer';
import React, { useEffect, useState } from 'react';
import { CoreStart } from '../../../../../../src/core/public';
import { CreateAccelerationForm } from '../../../../common/types';
import { getJobId, pollQueryStatus } from '../../SQLPage/utils';
import { getJobId, pollQueryStatus } from '../../../../common/utils/async_query_helpers';
import { hasError, validateDataSource } from '../create/utils';

interface AccelerationDataSourceSelectorProps {
142 changes: 0 additions & 142 deletions public/index.scss

This file was deleted.

3 changes: 0 additions & 3 deletions public/index.ts
Original file line number Diff line number Diff line change
@@ -3,9 +3,6 @@
* SPDX-License-Identifier: Apache-2.0
*/


import './index.scss';

import { WorkbenchPlugin } from './plugin';

// This exports static code and TypeScript types,
20 changes: 14 additions & 6 deletions public/utils/PanelWrapper.tsx
Original file line number Diff line number Diff line change
@@ -3,13 +3,21 @@
* SPDX-License-Identifier: Apache-2.0
*/


import React from 'react'
import { EuiPanel } from '@elastic/eui';
import React from 'react';

export function PanelWrapper({ shouldWrap, children }: { shouldWrap: boolean; children: React.ReactNode }) {
return shouldWrap ?
<div style={{ backgroundColor: "#f5f7fa", padding: 25 }}>
export function PanelWrapper({
shouldWrap,
children,
}: {
shouldWrap: boolean;
children: React.ReactNode;
}) {
return shouldWrap ? (
<div style={{ padding: 25 }}>
<EuiPanel paddingSize="none">{children}</EuiPanel>
</div> : <>{children}</>;
</div>
) : (
<>{children}</>
);
}
43 changes: 0 additions & 43 deletions webpack.config.js

This file was deleted.

0 comments on commit f88003f

Please sign in to comment.