Skip to content

Commit

Permalink
Merge branch 'main' into remove-id-cache
Browse files Browse the repository at this point in the history
Signed-off-by: Paul Sebastian <[email protected]>
  • Loading branch information
paulstn authored Mar 15, 2024
2 parents bf6da7b + 9a4e532 commit 59ee9b5
Show file tree
Hide file tree
Showing 27 changed files with 1,129 additions and 411 deletions.
2 changes: 2 additions & 0 deletions common/constants/query_assist.ts
Original file line number Diff line number Diff line change
Expand Up @@ -11,3 +11,5 @@ export const QUERY_ASSIST_API = {
};

export const ML_COMMONS_API_PREFIX = '/_plugins/_ml';

export const ERROR_DETAILS = { GUARDRAILS_TRIGGERED: 'guardrail triggered' };
1 change: 1 addition & 0 deletions common/constants/shared.ts
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@ export const DSL_BASE = '/api/dsl';
export const DSL_SEARCH = '/search';
export const DSL_CAT = '/cat.indices';
export const DSL_MAPPING = '/indices.getFieldMapping';
export const DSL_SETTINGS = '/indices.getFieldSettings';
export const OBSERVABILITY_BASE = '/api/observability';
export const INTEGRATIONS_BASE = '/api/integrations';
export const JOBS_BASE = '/query/jobs';
Expand Down
8 changes: 8 additions & 0 deletions public/components/common/search/query_area.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
/*
* Copyright OpenSearch Contributors
* SPDX-License-Identifier: Apache-2.0
*/

.ppl-query-accordion {
padding: $euiSizeS;
}
101 changes: 59 additions & 42 deletions public/components/common/search/query_area.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,11 +3,12 @@
* SPDX-License-Identifier: Apache-2.0
*/

import { EuiCodeEditor, EuiFlexGroup, EuiFlexItem, EuiPanel } from '@elastic/eui';
import React, { useEffect, useMemo } from 'react';
import { EuiAccordion, EuiCodeEditor, EuiPanel, EuiSpacer } from '@elastic/eui';
import React, { useEffect, useMemo, useState } from 'react';
import { coreRefs } from '../../../framework/core_refs';
import { QueryAssistInput } from '../../event_analytics/explorer/query_assist/input';
import { useFetchEvents } from '../../event_analytics/hooks/use_fetch_events';
import './query_area.scss';

export function QueryArea({
tabId,
Expand All @@ -17,7 +18,7 @@ export function QueryArea({
runQuery,
tempQuery,
setNeedsUpdate,
setFillRun,
runChanges,
selectedIndex,
nlqInput,
setNlqInput,
Expand All @@ -37,47 +38,63 @@ export function QueryArea({
memoizedHandleQueryChange(indexQuery);
memoizedGetAvailableFields(indexQuery);
}, [selectedIndex, memoizedGetAvailableFields, memoizedHandleQueryChange]);
const [lastFocusedInput, setLastFocusedInput] = useState<'query_area' | 'nlq_input'>('nlq_input');

const queryEditor = (
<EuiCodeEditor
theme="textmate"
width="100%"
height="4rem"
showPrintMargin={false}
setOptions={{
fontSize: '14px',
}}
aria-label="Code Editor"
onChange={(query) => {
handleQueryChange(query);
// query is considered updated when the last run query is not the same as whats in the editor
// setUpdatedQuery(runQuery !== query);
setNeedsUpdate(runQuery !== query);
}}
onFocus={() => setLastFocusedInput('query_area')}
value={tempQuery}
wrapEnabled={true}
/>
);

if (!coreRefs.queryAssistEnabled) {
return <EuiPanel paddingSize="m">{queryEditor}</EuiPanel>;
}

return (
<EuiPanel paddingSize="m">
<EuiFlexGroup gutterSize="m" direction="column">
<EuiFlexItem>
<EuiCodeEditor
theme="textmate"
width="100%"
height="4rem"
showPrintMargin={false}
setOptions={{
fontSize: '14px',
}}
aria-label="Code Editor"
onChange={(query) => {
handleQueryChange(query);
// query is considered updated when the last run query is not the same as whats in the editor
// setUpdatedQuery(runQuery !== query);
setNeedsUpdate(runQuery !== query);
}}
onFocus={() => setFillRun(true)}
onBlur={() => setFillRun(false)}
value={tempQuery}
wrapEnabled={true}
/>
</EuiFlexItem>
{coreRefs.queryAssistEnabled && (
<EuiFlexItem>
<QueryAssistInput
tabId={tabId}
handleTimePickerChange={handleTimePickerChange}
handleQueryChange={handleQueryChange}
handleTimeRangePickerRefresh={handleTimeRangePickerRefresh}
setNeedsUpdate={setNeedsUpdate}
selectedIndex={selectedIndex}
nlqInput={nlqInput}
setNlqInput={setNlqInput}
/>
</EuiFlexItem>
)}
</EuiFlexGroup>
<EuiPanel paddingSize="none">
<EuiAccordion
id="ppl-query-accordion"
buttonContent="PPL Query"
initialIsOpen
className="ppl-query-accordion"
// this paddingSize is for accordion children
paddingSize="none"
>
<>
<EuiSpacer size="s" />
<QueryAssistInput
tabId={tabId}
handleTimePickerChange={handleTimePickerChange}
handleQueryChange={handleQueryChange}
handleTimeRangePickerRefresh={handleTimeRangePickerRefresh}
setNeedsUpdate={setNeedsUpdate}
selectedIndex={selectedIndex}
nlqInput={nlqInput}
setNlqInput={setNlqInput}
lastFocusedInput={lastFocusedInput}
setLastFocusedInput={setLastFocusedInput}
runChanges={runChanges}
>
{queryEditor}
</QueryAssistInput>
</>
</EuiAccordion>
</EuiPanel>
);
}
47 changes: 24 additions & 23 deletions public/components/common/search/search.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -10,20 +10,20 @@ import {
EuiButtonEmpty,
EuiComboBox,
EuiComboBoxOptionOption,
EuiContextMenuItem,
EuiContextMenuPanel,
EuiFlexGroup,
EuiFlexItem,
EuiIcon,
EuiModal,
EuiModalBody,
EuiModalFooter,
EuiModalHeader,
EuiModalHeaderTitle,
EuiPopover,
EuiPopoverFooter,
EuiText,
EuiToolTip,
EuiContextMenuItem,
EuiModal,
EuiModalHeader,
EuiModalBody,
EuiModalHeaderTitle,
EuiModalFooter,
} from '@elastic/eui';
import { isEqual } from 'lodash';
import React, { useEffect, useState } from 'react';
Expand Down Expand Up @@ -59,11 +59,11 @@ import {
import { update as updateSearchMetaData } from '../../event_analytics/redux/slices/search_meta_data_slice';
import { PPLReferenceFlyout } from '../helpers';
import { LiveTailButton, StopLiveButton } from '../live_tail/live_tail_button';
import { Autocomplete } from './autocomplete';
import { DatePicker } from './date_picker';
import { QueryArea } from './query_area';
import './search.scss';
import { QueryAssistSummarization } from './query_assist_summarization';
import { Autocomplete } from './autocomplete';
import './search.scss';

export interface IQueryBarProps {
query: string;
Expand Down Expand Up @@ -136,7 +136,6 @@ export const Search = (props: any) => {
const [isFlyoutVisible, setIsFlyoutVisible] = useState(false);
const [queryLang, setQueryLang] = useState(QUERY_LANGUAGE.PPL);
const [needsUpdate, setNeedsUpdate] = useState(false);
const [fillRun, setFillRun] = useState(false);
const sqlService = new SQLService(coreRefs.http);
const { application } = coreRefs;
const [nlqInput, setNlqInput] = useState('');
Expand Down Expand Up @@ -475,19 +474,21 @@ export const Search = (props: any) => {
/>
)}
</EuiFlexItem>
<EuiFlexItem grow={false}>
<EuiToolTip position="bottom" content={needsUpdate ? 'Click to apply' : false}>
<EuiButton
color={needsUpdate ? 'success' : 'primary'}
iconType={needsUpdate ? 'kqlFunction' : 'play'}
fill={!showQueryArea || fillRun} // keep fill on all the time if not using query assistant
onClick={runChanges}
data-test-subj="superDatePickerApplyTimeButton" // mimic actual timepicker button
>
{needsUpdate ? 'Update' : 'Run'}
</EuiButton>
</EuiToolTip>
</EuiFlexItem>
{!showQueryArea && (
<EuiFlexItem grow={false}>
<EuiToolTip position="bottom" content={needsUpdate ? 'Click to apply' : false}>
<EuiButton
color={needsUpdate ? 'success' : 'primary'}
iconType={needsUpdate ? 'kqlFunction' : 'play'}
fill
onClick={runChanges}
data-test-subj="superDatePickerApplyTimeButton" // mimic actual timepicker button
>
{needsUpdate ? 'Update' : 'Run'}
</EuiButton>
</EuiToolTip>
</EuiFlexItem>
)}
{!showQueryArea && showSaveButton && !showSavePanelOptionsList && (
<EuiFlexItem className="euiFlexItem--flexGrowZero live-tail">
<EuiPopover
Expand Down Expand Up @@ -573,11 +574,11 @@ export const Search = (props: any) => {
runQuery={query}
tempQuery={tempQuery}
setNeedsUpdate={setNeedsUpdate}
setFillRun={setFillRun}
selectedIndex={selectedIndex}
nlqInput={nlqInput}
setNlqInput={setNlqInput}
pplService={pplService}
runChanges={runChanges}
/>
</EuiFlexItem>
{(queryAssistantSummarization?.summary?.length > 0 ||
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -1287,6 +1287,7 @@ exports[`Panels View Component renders panel view container with visualizations
"fetch": [Function],
"fetchFields": [Function],
"fetchIndices": [Function],
"fetchSettings": [Function],
"http": [MockFunction],
}
}
Expand Down Expand Up @@ -1754,6 +1755,7 @@ exports[`Panels View Component renders panel view container with visualizations
"fetch": [Function],
"fetchFields": [Function],
"fetchIndices": [Function],
"fetchSettings": [Function],
"http": [MockFunction],
}
}
Expand Down Expand Up @@ -3520,6 +3522,7 @@ exports[`Panels View Component renders panel view container without visualizatio
"fetch": [Function],
"fetchFields": [Function],
"fetchIndices": [Function],
"fetchSettings": [Function],
"http": [MockFunction],
}
}
Expand Down Expand Up @@ -3985,6 +3988,7 @@ exports[`Panels View Component renders panel view container without visualizatio
"fetch": [Function],
"fetchFields": [Function],
"fetchIndices": [Function],
"fetchSettings": [Function],
"http": [MockFunction],
}
}
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,95 @@
/*
* Copyright OpenSearch Contributors
* SPDX-License-Identifier: Apache-2.0
*/

import React from 'react';
import { mount, configure } from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';
import { AccelerationDetailsFlyout } from '../manage/accelerations/acceleration_details_flyout';
import * as coreRefsModule from '../../../../framework/core_refs';

jest.mock('../../../../framework/core_refs', () => {
const actualModule = jest.requireActual('../../../../framework/core_refs');
return {
coreRefs: {
...actualModule.coreRefs,
dslService: {
fetchFields: jest.fn().mockResolvedValue({ data: 'mockFieldData' }),
fetchSettings: jest.fn().mockResolvedValue({ data: 'mockSettingsData' }),
fetchIndices: jest.fn().mockResolvedValue({ data: 'mockIndexData' }),
},
},
};
});

jest.mock('../../../../framework/core_refs', () => {
return {
coreRefs: {
dslService: {
fetchFields: jest.fn().mockResolvedValue({ data: 'mockFieldData' }),
fetchSettings: jest.fn().mockResolvedValue({ data: 'mockSettingsData' }),
fetchIndices: jest.fn().mockResolvedValue({
status: 'fulfilled',
action: 'getIndexInfo',
data: [
{
health: 'yellow',
status: 'open',
index: 'flint_mys3_default_http_count_view',
uuid: 'VImREbK4SMqJ-i6hSB84eQ',
pri: '1',
rep: '1',
'docs.count': '0',
'docs.deleted': '0',
'store.size': '208b',
'pri.store.size': '208b',
},
],
}),
},
},
};
});

const mockAcceleration = {
index: 'mockIndex',
dataSourceName: 'mockDataSource',
acceleration: {
flintIndexName: 'testIndex',
},
};

configure({ adapter: new Adapter() });

describe('AccelerationDetailsFlyout Component Tests', () => {
beforeEach(() => {
jest.clearAllMocks();
});

it('fetches acceleration details on mount', async () => {
mount(<AccelerationDetailsFlyout acceleration={mockAcceleration} />);

expect(coreRefsModule.coreRefs.dslService!.fetchFields).toHaveBeenCalledWith('testIndex');
expect(coreRefsModule.coreRefs.dslService!.fetchSettings).toHaveBeenCalledWith('testIndex');
expect(coreRefsModule.coreRefs.dslService!.fetchIndices).toHaveBeenCalledWith('testIndex');
});

it('switches tabs correctly', async () => {
const wrapper = mount(<AccelerationDetailsFlyout acceleration={mockAcceleration} />);
await new Promise(setImmediate);
wrapper.update();

const schemaTabExists = wrapper.find('EuiTab').someWhere((node) => node.text() === 'Schema');
expect(schemaTabExists).toBeTruthy();

const schemaTab = wrapper.find('EuiTab').filterWhere((node) => node.text() === 'Schema');
schemaTab.simulate('click');
await new Promise(setImmediate);
wrapper.update();

expect(wrapper.find('AccelerationSchemaTab').exists()).toBe(true);

// TODO: SQL DEFINATION TAB CHECK
});
});
Loading

0 comments on commit 59ee9b5

Please sign in to comment.