Skip to content

Commit

Permalink
added the skipping index queries, covering index queries,updates the … (
Browse files Browse the repository at this point in the history
opensearch-project#134)

* added the skipping index queries, covering index queries,updates the data picker

Signed-off-by: sumukhswamy <[email protected]>

* added the skipping index queries, covering index queries,updates the data picker

Signed-off-by: sumukhswamy <[email protected]>

* reverted updates to yarn

Signed-off-by: sumukhswamy <[email protected]>

* updated tests, snapshots

Signed-off-by: sumukhswamy <[email protected]>

---------

Signed-off-by: sumukhswamy <[email protected]>
  • Loading branch information
sumukhswamy authored Oct 4, 2023
1 parent 086a7ef commit e1c28e9
Show file tree
Hide file tree
Showing 13 changed files with 419 additions and 391 deletions.
268 changes: 36 additions & 232 deletions public/components/Main/__snapshots__/main.test.tsx.snap

Large diffs are not rendered by default.

54 changes: 28 additions & 26 deletions public/components/Main/main.test.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,40 +3,35 @@
* SPDX-License-Identifier: Apache-2.0
*/


import React from "react";
import "@testing-library/jest-dom/extend-expect";
import { render, fireEvent } from "@testing-library/react";
import { httpClientMock } from "../../../test/mocks";
import '@testing-library/jest-dom/extend-expect';
import { fireEvent, render } from '@testing-library/react';
import React from 'react';
import { httpClientMock } from '../../../test/mocks';
import {
mockQueryResultJDBCResponse,
mockDatasourcesQuery,
mockHttpQuery,
mockNotOkQueryResultResponse,
mockQueryResultJDBCResponse,
mockQueryTranslationResponse,
mockResultWithNull,
mockHttpQuery
} from "../../../test/mocks/mockData";
import Main from "./main";
} from '../../../test/mocks/mockData';
import Main from './main';

const setBreadcrumbsMock = jest.fn();

describe("<Main /> spec", () => {

it("renders the component", async () => {

describe('<Main /> spec', () => {
it('renders the component', async () => {
const client = httpClientMock;
client.post = jest.fn().mockResolvedValue(mockHttpQuery)

client.post = jest.fn().mockResolvedValue(mockHttpQuery);
client.get = jest.fn().mockResolvedValue(mockDatasourcesQuery);
const asyncTest = () => {
render(
<Main httpClient={client} setBreadcrumbs={setBreadcrumbsMock} />
);
render(<Main httpClient={client} setBreadcrumbs={setBreadcrumbsMock} />);
};
await asyncTest();
expect(document.body.children[0]).toMatchSnapshot();
});


it("click run button, and response is ok", async () => {
it('click run button, and response is ok', async () => {
const client = httpClientMock;
client.post = jest.fn().mockResolvedValue(mockQueryResultJDBCResponse);

Expand All @@ -51,9 +46,10 @@ describe("<Main /> spec", () => {
expect(document.body.children[0]).toMatchSnapshot();
});

it("click run button, response fills null and missing values", async () => {
it('click run button, response fills null and missing values', async () => {
const client = httpClientMock;
client.post = jest.fn().mockResolvedValue(mockResultWithNull);
client.get = jest.fn().mockResolvedValue(mockDatasourcesQuery);

const { getByText } = await render(
<Main httpClient={client} setBreadcrumbs={setBreadcrumbsMock} />
Expand All @@ -64,11 +60,12 @@ describe("<Main /> spec", () => {
};
await asyncTest();
expect(document.body.children[0]).toMatchSnapshot();
})
});

it("click run button, and response causes an error", async () => {
it('click run button, and response causes an error', async () => {
const client = httpClientMock;
client.post = jest.fn().mockRejectedValue('err');
client.get = jest.fn().mockResolvedValue(mockDatasourcesQuery);

const { getByText } = await render(
<Main httpClient={client} setBreadcrumbs={setBreadcrumbsMock} />
Expand All @@ -81,9 +78,10 @@ describe("<Main /> spec", () => {
expect(document.body.children[0]).toMatchSnapshot();
});

it("click run button, and response is not ok", async () => {
it('click run button, and response is not ok', async () => {
const client = httpClientMock;
client.post = jest.fn().mockResolvedValue(mockNotOkQueryResultResponse);
client.get = jest.fn().mockResolvedValue(mockDatasourcesQuery);

const { getByText } = await render(
<Main httpClient={client} setBreadcrumbs={setBreadcrumbsMock} />
Expand All @@ -96,9 +94,11 @@ describe("<Main /> spec", () => {
expect(document.body.children[0]).toMatchSnapshot();
});

it("click translation button, and response is ok", async () => {
it('click translation button, and response is ok', async () => {
const client = httpClientMock;
client.post = jest.fn().mockResolvedValue(mockQueryTranslationResponse);
client.get = jest.fn().mockResolvedValue(mockDatasourcesQuery);

const { getByText } = await render(
<Main httpClient={client} setBreadcrumbs={setBreadcrumbsMock} />
);
Expand All @@ -110,8 +110,10 @@ describe("<Main /> spec", () => {
expect(document.body.children[0]).toMatchSnapshot();
});

it("click clear button", async () => {
it('click clear button', async () => {
const client = httpClientMock;
client.get = jest.fn().mockResolvedValue(mockDatasourcesQuery);

const { getByText } = await render(
<Main httpClient={client} setBreadcrumbs={setBreadcrumbsMock} />
);
Expand Down
39 changes: 13 additions & 26 deletions public/components/Main/main.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@

import {
EuiButton,
EuiComboBox,
EuiComboBoxOptionOption,
EuiFlexGroup,
EuiFlexItem,
EuiPage,
Expand All @@ -14,12 +14,13 @@ import {
EuiPageSideBar,
EuiPanel,
EuiSpacer,
EuiText,
EuiText
} from '@elastic/eui';
import { IHttpResponse } from 'angular';
import _ from 'lodash';
import React from 'react';
import { ChromeBreadcrumb, CoreStart } from '../../../../../src/core/public';
import { AsyncQueryLoadingStatus } from '../../../common/types';
import { MESSAGE_TAB_LABEL } from '../../utils/constants';
import {
Tree,
Expand All @@ -31,9 +32,9 @@ import {
import { PPLPage } from '../PPLPage/PPLPage';
import Switch from '../QueryLanguageSwitch/Switch';
import QueryResults from '../QueryResults/QueryResults';
import { DataSelect } from '../SQLPage/DataSelect';
import { SQLPage } from '../SQLPage/SQLPage';
import { TableView } from '../SQLPage/TableView';
import { AsyncQueryLoadingStatus } from '../../../common/types';

interface ResponseData {
ok: boolean;
Expand Down Expand Up @@ -101,7 +102,7 @@ interface MainState {
itemIdToExpandedRowMap: ItemIdToExpandedRowMap;
messages: Array<QueryMessage>;
isResultFullScreen: boolean;
selectedDatasource: string;
selectedDatasource: EuiComboBoxOptionOption[];
asyncLoading: boolean;
asyncLoadingStatus: AsyncQueryLoadingStatus;
asyncJobId: string;
Expand Down Expand Up @@ -238,7 +239,7 @@ export class Main extends React.Component<MainProps, MainState> {
itemIdToExpandedRowMap: {},
messages: [],
isResultFullScreen: false,
selectedDatasource: 'Opensearch',
selectedDatasource: [{ label: 'OpenSearch' }],
asyncLoading: false,
asyncLoadingStatus: 'SUCCESS',
asyncJobId: '',
Expand Down Expand Up @@ -416,7 +417,7 @@ export class Main extends React.Component<MainProps, MainState> {
queries.map((query: string) =>
this.httpClient
.post(endpoint, {
body: JSON.stringify({ lang: language, query: query, datasource: 'my_glue' }), // TODO: dynamically datasource when accurate
body: JSON.stringify({ lang: language, query: query, datasource: this.state.selectedDatasource[0].label}), // TODO: dynamically datasource when accurate
})
.catch((error: any) => {
this.setState({
Expand Down Expand Up @@ -781,9 +782,9 @@ export class Main extends React.Component<MainProps, MainState> {
});
}

handleComboOptionChange = (selectedOption: string) => {
handleDataSelect = (selectedItems: []) => {
this.setState({
selectedDatasource: selectedOption,
selectedDatasource: selectedItems,
});
};

Expand All @@ -796,7 +797,7 @@ export class Main extends React.Component<MainProps, MainState> {
page = (
<SQLPage
onRun={
_.isEqual(this.state.selectedDatasource, 'Opensearch') ? this.onRun : this.onRunAsync
_.isEqual(this.state.selectedDatasource[0].label, 'OpenSearch') ? this.onRun : this.onRunAsync
}
onTranslate={this.onTranslate}
onClear={this.onClear}
Expand All @@ -813,7 +814,7 @@ export class Main extends React.Component<MainProps, MainState> {
page = (
<PPLPage
onRun={
_.isEqual(this.state.selectedDatasource, 'Opensearch') ? this.onRun : this.onRunAsync
_.isEqual(this.state.selectedDatasource[0].label, 'OpenSearch') ? this.onRun : this.onRunAsync
}
onTranslate={this.onTranslate}
onClear={this.onClear}
Expand Down Expand Up @@ -875,21 +876,7 @@ export class Main extends React.Component<MainProps, MainState> {
<EuiFlexGroup direction="row" alignItems="center">
<EuiFlexItem>
<EuiText>Data Sources</EuiText>
<EuiComboBox
singleSelection={true}
placeholder="Connection Name"
options={[
{ label: 'S3', value: 'S3' },
{ label: 'Opensearch', value: 'Opensearch' },
]}
selectedOptions={
this.state.selectedDatasource ? [{ label: this.state.selectedDatasource }] : []
}
onChange={(selectedOptions) => {
const selectedValue = selectedOptions[0] ? selectedOptions[0].value : '';
this.handleComboOptionChange(selectedValue);
}}
/>
<DataSelect http={this.httpClient} onSelect={this.handleDataSelect} />
<EuiSpacer />
</EuiFlexItem>
<EuiFlexItem grow={false}>
Expand All @@ -915,7 +902,7 @@ export class Main extends React.Component<MainProps, MainState> {
<EuiSpacer />
<TableView
http={this.httpClient}
dataConnection={this.state.selectedDatasource}
selectedItems={this.state.selectedDatasource}
/>
<EuiSpacer />
</EuiFlexItem>
Expand Down
76 changes: 76 additions & 0 deletions public/components/SQLPage/DataSelect.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,76 @@
/*
* Copyright OpenSearch Contributors
* SPDX-License-Identifier: Apache-2.0
*/

import { EuiComboBox, EuiComboBoxOptionOption } from '@elastic/eui';
import React, { useEffect, useState } from 'react';
import { CoreStart } from '../../../../../src/core/public';

interface CustomView {
http: CoreStart['http'];
onSelect: (selectedItems: []) => void;
}

export const DataSelect = ({ http, onSelect }: CustomView) => {
const [selectedOptions, setSelectedOptions] = useState<EuiComboBoxOptionOption[]>([{ label: 'OpenSearch' }]);
const [options, setOptions] = useState<any[]>([]);

const datasources = () => {
http
.get(`/api/get_datasources`)
.then((res) => {
const data = res.data.resp;

const connectorGroups = {};

data.forEach((item) => {
const connector = item.connector;
const name = item.name;

if (connector === 'S3GLUE') {
if (!connectorGroups[connector]) {
connectorGroups[connector] = [];
}

connectorGroups[connector].push(name);
}
});
options.push({ label: 'OpenSearch' });
for (const connector in connectorGroups) {
if (connectorGroups.hasOwnProperty(connector)) {
const connectorNames = connectorGroups[connector];

options.push({
label: connector,
options: connectorNames.map((name) => ({ label: name })),
});
}
}

setOptions(options);
})
.catch((err) => {
console.error(err);
});
};

useEffect(() => {
datasources();
}, []);

const handleSelectionChange = (selectedItems: any[]) => {
setSelectedOptions(selectedItems);
onSelect(selectedItems);
};

return (
<EuiComboBox
singleSelection={{ asPlainText: true }}
isClearable={false}
options={options}
selectedOptions={selectedOptions}
onChange={(selectedItems) => handleSelectionChange(selectedItems)}
/>
);
};
Loading

0 comments on commit e1c28e9

Please sign in to comment.