Skip to content

Commit d6083ce

Browse files
ivandevpivandevp
authored
feat(export-code): improve query to language discoverability COMPASS-8348 (#7619)
* COMPASS-8348: improve quert to language discoverability * fix: remove duplicated option in aggregations tab * fix: selector name for e2e test * fix: selector name for e2e test * fix: condition to render export data * fix: e2e test for export data * fix: e2e test selector * fix: e2e test for export data modal * fix: e2e test for export data button * fix: export data button tests * fix: make export data a button instead of dropdown
1 parent 6f8febc commit d6083ce

File tree

20 files changed

+314
-271
lines changed

20 files changed

+314
-271
lines changed

‎packages/compass-aggregations/src/components/aggregations/aggregations.spec.tsx‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,6 @@ describe('Aggregations [Component]', function () {
99
beforeEach(async function () {
1010
await renderWithStore(
1111
<Aggregations
12-
showExportButton={true}
1312
showRunButton={true}
1413
showExplainButton={true}
1514
enableSearchActivationProgramP1={false}

‎packages/compass-aggregations/src/components/pipeline-toolbar/index.spec.tsx‎

Lines changed: 2 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -20,12 +20,7 @@ describe('PipelineToolbar', function () {
2020
let toolbar: HTMLElement;
2121
beforeEach(async function () {
2222
await renderWithStore(
23-
<PipelineToolbar
24-
isBuilderView
25-
showExportButton
26-
showRunButton
27-
showExplainButton
28-
/>,
23+
<PipelineToolbar isBuilderView showRunButton showExplainButton />,
2924
{ pipeline: [{ $match: { _id: 1 } }] },
3025
undefined,
3126
{
@@ -106,10 +101,6 @@ describe('PipelineToolbar', function () {
106101
within(settings).getByTestId('pipeline-toolbar-create-new-button'),
107102
'shows create-new button'
108103
).to.exist;
109-
expect(
110-
within(settings).getByTestId('pipeline-toolbar-export-button'),
111-
'shows export to language button'
112-
).to.exist;
113104

114105
expect(
115106
within(settings).getByTestId('pipeline-toolbar-preview-toggle'),
@@ -197,12 +188,7 @@ describe('PipelineToolbar', function () {
197188
assignExperiment={mockAssignExperiment}
198189
getAssignment={mockGetAssignment}
199190
>
200-
<PipelineToolbar
201-
isBuilderView
202-
showRunButton
203-
showExportButton
204-
showExplainButton
205-
/>
191+
<PipelineToolbar isBuilderView showRunButton showExplainButton />
206192
</CompassExperimentationProvider>,
207193
{ pipeline: [] }, // Initial state
208194
undefined, // Connection info

‎packages/compass-aggregations/src/components/pipeline-toolbar/index.tsx‎

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -53,15 +53,13 @@ export type PipelineToolbarProps = {
5353
isAggregationGeneratedFromQuery?: boolean;
5454
isBuilderView: boolean;
5555
showRunButton: boolean;
56-
showExportButton: boolean;
5756
showExplainButton: boolean;
5857
onHideAIInputClick?: () => void;
5958
};
6059

6160
export const PipelineToolbar: React.FunctionComponent<PipelineToolbarProps> = ({
6261
isBuilderView,
6362
showRunButton,
64-
showExportButton,
6563
showExplainButton,
6664
}) => {
6765
const darkMode = useDarkMode();
@@ -91,7 +89,6 @@ export const PipelineToolbar: React.FunctionComponent<PipelineToolbarProps> = ({
9189
isOptionsVisible={isOptionsVisible}
9290
onToggleOptions={() => setIsOptionsVisible(!isOptionsVisible)}
9391
showRunButton={showRunButton}
94-
showExportButton={showExportButton}
9592
showExplainButton={showExplainButton}
9693
/>
9794
{isOptionsVisible && (

‎packages/compass-aggregations/src/components/pipeline-toolbar/pipeline-header/index.spec.tsx‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,6 @@ describe('PipelineHeader', function () {
1717
isOpenPipelineVisible
1818
isOptionsVisible
1919
showRunButton
20-
showExportButton
2120
showExplainButton
2221
onToggleOptions={onToggleOptionsSpy}
2322
/>,

‎packages/compass-aggregations/src/components/pipeline-toolbar/pipeline-header/index.tsx‎

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -57,7 +57,6 @@ const savedAggregationsPopoverStyles = css({
5757
type PipelineHeaderProps = {
5858
isOptionsVisible: boolean;
5959
showRunButton: boolean;
60-
showExportButton: boolean;
6160
showExplainButton: boolean;
6261
onToggleOptions: () => void;
6362
isOpenPipelineVisible: boolean;
@@ -104,7 +103,6 @@ const SavedPipelinesButton: React.FunctionComponent = () => {
104103

105104
export const PipelineHeader: React.FunctionComponent<PipelineHeaderProps> = ({
106105
showRunButton,
107-
showExportButton,
108106
showExplainButton,
109107
onToggleOptions,
110108
isOptionsVisible,
@@ -126,7 +124,6 @@ export const PipelineHeader: React.FunctionComponent<PipelineHeaderProps> = ({
126124
onToggleOptions={onToggleOptions}
127125
isOptionsVisible={isOptionsVisible}
128126
showRunButton={showRunButton}
129-
showExportButton={showExportButton}
130127
showExplainButton={showExplainButton}
131128
/>
132129
</div>

‎packages/compass-aggregations/src/components/pipeline-toolbar/pipeline-header/pipeline-actions.spec.tsx‎

Lines changed: 0 additions & 78 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,6 @@ import { spy } from 'sinon';
1212
import type { SinonSpy } from 'sinon';
1313
import ConnectedPipelineActions, { PipelineActions } from './pipeline-actions';
1414
import { renderWithStore } from '../../../../test/configure-store';
15-
import { changeStageDisabled } from '../../../modules/pipeline-builder/stage-editor';
1615
import {
1716
type PreferencesAccess,
1817
createSandboxFromDefaultPreferences,
@@ -26,25 +25,21 @@ describe('PipelineActions', function () {
2625
describe('options visible', function () {
2726
let onRunAggregationSpy: SinonSpy;
2827
let onToggleOptionsSpy: SinonSpy;
29-
let onExportAggregationResultsSpy: SinonSpy;
3028
let onExplainAggregationSpy: SinonSpy;
3129

3230
beforeEach(function () {
3331
onRunAggregationSpy = spy();
3432
onToggleOptionsSpy = spy();
35-
onExportAggregationResultsSpy = spy();
3633
onExplainAggregationSpy = spy();
3734

3835
render(
3936
<PipelineActions
4037
isOptionsVisible={true}
4138
showAIEntry={false}
4239
showRunButton={true}
43-
showExportButton={true}
4440
showExplainButton={true}
4541
onRunAggregation={onRunAggregationSpy}
4642
onToggleOptions={onToggleOptionsSpy}
47-
onExportAggregationResults={onExportAggregationResultsSpy}
4843
isExplainButtonDisabled={false}
4944
onExplainAggregation={onExplainAggregationSpy}
5045
onUpdateView={() => {}}
@@ -64,17 +59,6 @@ describe('PipelineActions', function () {
6459
expect(onRunAggregationSpy.calledOnce).to.be.true;
6560
});
6661

67-
it('calls onExportAggregationResults on click', function () {
68-
const button = screen.getByTestId(
69-
'pipeline-toolbar-export-aggregation-button'
70-
);
71-
expect(button).to.exist;
72-
73-
userEvent.click(button);
74-
75-
expect(onExportAggregationResultsSpy.calledOnce).to.be.true;
76-
});
77-
7862
it('calls onExplainAggregation on click', function () {
7963
const button = screen.getByTestId(
8064
'pipeline-toolbar-explain-aggregation-button'
@@ -107,11 +91,9 @@ describe('PipelineActions', function () {
10791
isOptionsVisible={false}
10892
showAIEntry={false}
10993
showRunButton={true}
110-
showExportButton={true}
11194
showExplainButton={true}
11295
onRunAggregation={onRunAggregationSpy}
11396
onToggleOptions={onToggleOptionsSpy}
114-
onExportAggregationResults={() => {}}
11597
onUpdateView={() => {}}
11698
onExplainAggregation={() => {}}
11799
onCollectionScanInsightActionButtonClick={() => {}}
@@ -151,11 +133,9 @@ describe('PipelineActions', function () {
151133
isOptionsVisible={false}
152134
showAIEntry={false}
153135
showRunButton={true}
154-
showExportButton={true}
155136
showExplainButton={true}
156137
onRunAggregation={onRunAggregationSpy}
157138
onToggleOptions={onToggleOptionsSpy}
158-
onExportAggregationResults={() => {}}
159139
onUpdateView={() => {}}
160140
onExplainAggregation={() => {}}
161141
onCollectionScanInsightActionButtonClick={() => {}}
@@ -174,26 +154,21 @@ describe('PipelineActions', function () {
174154

175155
describe('disables actions when pipeline is invalid', function () {
176156
let onRunAggregationSpy: SinonSpy;
177-
let onExportAggregationResultsSpy: SinonSpy;
178157
let onExplainAggregationSpy: SinonSpy;
179158

180159
beforeEach(function () {
181160
onRunAggregationSpy = spy();
182-
onExportAggregationResultsSpy = spy();
183161
onExplainAggregationSpy = spy();
184162
render(
185163
<PipelineActions
186164
isExplainButtonDisabled={true}
187-
isExportButtonDisabled={true}
188165
isRunButtonDisabled={true}
189166
isOptionsVisible={true}
190167
showAIEntry={false}
191168
showRunButton={true}
192-
showExportButton={true}
193169
showExplainButton={true}
194170
onRunAggregation={onRunAggregationSpy}
195171
onToggleOptions={() => {}}
196-
onExportAggregationResults={onExportAggregationResultsSpy}
197172
onExplainAggregation={onExplainAggregationSpy}
198173
onUpdateView={() => {}}
199174
onCollectionScanInsightActionButtonClick={() => {}}
@@ -213,18 +188,6 @@ describe('PipelineActions', function () {
213188
expect(onRunAggregationSpy.calledOnce).to.be.false;
214189
});
215190

216-
it('export action disabled', function () {
217-
const button = screen.getByTestId(
218-
'pipeline-toolbar-export-aggregation-button'
219-
);
220-
expect(button.getAttribute('aria-disabled')).to.equal('true');
221-
222-
userEvent.click(button, undefined, {
223-
skipPointerEventsCheck: true,
224-
});
225-
expect(onExportAggregationResultsSpy.calledOnce).to.be.false;
226-
});
227-
228191
it('explain action disabled', function () {
229192
const button = screen.getByTestId(
230193
'pipeline-toolbar-explain-aggregation-button'
@@ -243,7 +206,6 @@ describe('PipelineActions', function () {
243206
const result = await renderWithStore(
244207
<ConnectedPipelineActions
245208
showExplainButton={true}
246-
showExportButton={true}
247209
showRunButton={true}
248210
onToggleOptions={() => {}}
249211
></ConnectedPipelineActions>,
@@ -264,12 +226,6 @@ describe('PipelineActions', function () {
264226
.getAttribute('aria-disabled')
265227
).to.equal('true');
266228

267-
expect(
268-
screen
269-
.getByTestId('pipeline-toolbar-export-aggregation-button')
270-
.getAttribute('aria-disabled')
271-
).to.equal('true');
272-
273229
expect(
274230
screen
275231
.getByTestId('pipeline-toolbar-run-button')
@@ -294,46 +250,12 @@ describe('PipelineActions', function () {
294250
.getAttribute('aria-disabled')
295251
).to.equal('true');
296252

297-
expect(
298-
screen
299-
.getByTestId('pipeline-toolbar-export-aggregation-button')
300-
.getAttribute('aria-disabled')
301-
).to.equal('true');
302-
303253
expect(
304254
screen
305255
.getByTestId('pipeline-toolbar-run-button')
306256
.getAttribute('aria-disabled')
307257
).to.equal('true');
308258
});
309259
});
310-
311-
it('should disable export button when pipeline is $out / $merge', async function () {
312-
await renderPipelineActions({
313-
pipeline: [{ $out: 'foo' }],
314-
});
315-
316-
expect(
317-
screen
318-
.getByTestId('pipeline-toolbar-export-aggregation-button')
319-
.getAttribute('aria-disabled')
320-
).to.equal('true');
321-
});
322-
323-
it('should disable export button when last enabled stage is $out / $merge', async function () {
324-
const { store } = await renderPipelineActions({
325-
pipeline: [{ $out: 'foo' }, { $match: { _id: 1 } }],
326-
});
327-
328-
store.dispatch(changeStageDisabled(1, true));
329-
330-
await waitFor(() => {
331-
expect(
332-
screen
333-
.getByTestId('pipeline-toolbar-export-aggregation-button')
334-
.getAttribute('aria-disabled')
335-
).to.equal('true');
336-
});
337-
});
338260
});
339261
});

‎packages/compass-aggregations/src/components/pipeline-toolbar/pipeline-header/pipeline-actions.tsx‎

Lines changed: 1 addition & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -10,17 +10,13 @@ import {
1010
} from '@mongodb-js/compass-components';
1111
import { AIExperienceEntry } from '@mongodb-js/compass-generative-ai';
1212
import type { RootState } from '../../../modules';
13-
import {
14-
exportAggregationResults,
15-
runAggregation,
16-
} from '../../../modules/aggregation';
13+
import { runAggregation } from '../../../modules/aggregation';
1714
import { updateView } from '../../../modules/update-view';
1815
import { explainAggregation } from '../../../modules/explain';
1916
import {
2017
getIsPipelineInvalidFromBuilderState,
2118
getPipelineStageOperatorsFromBuilderState,
2219
} from '../../../modules/pipeline-builder/builder-helpers';
23-
import { isOutputStage } from '../../../utils/stage';
2420
import { openCreateIndexModal } from '../../../modules/insights';
2521
import {
2622
useIsAIFeatureEnabled,
@@ -40,10 +36,6 @@ type PipelineActionsProps = {
4036
isRunButtonDisabled?: boolean;
4137
onRunAggregation: () => void;
4238

43-
showExportButton?: boolean;
44-
isExportButtonDisabled?: boolean;
45-
onExportAggregationResults: () => void;
46-
4739
showUpdateViewButton?: boolean;
4840
isUpdateViewButtonDisabled?: boolean;
4941
onUpdateView: () => void;
@@ -68,8 +60,6 @@ export const PipelineActions: React.FunctionComponent<PipelineActionsProps> = ({
6860
isOptionsVisible,
6961
showRunButton,
7062
isRunButtonDisabled,
71-
showExportButton,
72-
isExportButtonDisabled,
7363
showUpdateViewButton,
7464
isUpdateViewButtonDisabled,
7565
isExplainButtonDisabled,
@@ -79,7 +69,6 @@ export const PipelineActions: React.FunctionComponent<PipelineActionsProps> = ({
7969
onUpdateView,
8070
onRunAggregation,
8171
onToggleOptions,
82-
onExportAggregationResults,
8372
onExplainAggregation,
8473
showCollectionScanInsight,
8574
onCollectionScanInsightActionButtonClick,
@@ -152,18 +141,6 @@ export const PipelineActions: React.FunctionComponent<PipelineActionsProps> = ({
152141
Explain
153142
</Button>
154143
)}
155-
{!showUpdateViewButton && showExportButton && (
156-
<Button
157-
aria-label="Export aggregation"
158-
data-testid="pipeline-toolbar-export-aggregation-button"
159-
variant="default"
160-
size="small"
161-
onClick={onExportAggregationResults}
162-
disabled={isExportButtonDisabled}
163-
>
164-
Export
165-
</Button>
166-
)}
167144
{!showUpdateViewButton && showRunButton && (
168145
<Button
169146
aria-label="Run aggregation"
@@ -191,17 +168,13 @@ export const PipelineActions: React.FunctionComponent<PipelineActionsProps> = ({
191168

192169
const mapState = (state: RootState) => {
193170
const resultPipeline = getPipelineStageOperatorsFromBuilderState(state);
194-
const lastStage = resultPipeline[resultPipeline.length - 1];
195-
const isMergeOrOutPipeline = isOutputStage(lastStage);
196171
const hasSyntaxErrors = getIsPipelineInvalidFromBuilderState(state, false);
197172
const isBuilderView = state.workspace === 'builder';
198173
const isAIFetching = state.pipelineBuilder.aiPipeline.status === 'fetching';
199174

200175
return {
201176
isRunButtonDisabled: hasSyntaxErrors || isAIFetching,
202177
isExplainButtonDisabled: hasSyntaxErrors || isAIFetching,
203-
isExportButtonDisabled:
204-
isMergeOrOutPipeline || hasSyntaxErrors || isAIFetching,
205178
showAIEntry:
206179
!state.pipelineBuilder.aiPipeline.isInputVisible &&
207180
resultPipeline.length > 0 &&
@@ -217,7 +190,6 @@ const mapState = (state: RootState) => {
217190
const mapDispatch = {
218191
onUpdateView: updateView,
219192
onRunAggregation: runAggregation,
220-
onExportAggregationResults: exportAggregationResults,
221193
onExplainAggregation: explainAggregation,
222194
onCollectionScanInsightActionButtonClick: openCreateIndexModal,
223195
onShowAIInputClick: showAIInput,

0 commit comments

Comments
 (0)