diff --git a/packages/compass-crud/src/components/document-list.tsx b/packages/compass-crud/src/components/document-list.tsx
index f95846263b9..370b81ca7ef 100644
--- a/packages/compass-crud/src/components/document-list.tsx
+++ b/packages/compass-crud/src/components/document-list.tsx
@@ -578,6 +578,9 @@ const DocumentList: React.FunctionComponent
= (props) => {
onExpandAllClicked={onExpandAllClicked}
onCollapseAllClicked={onCollapseAllClicked}
openExportFileDialog={openExportFileDialog}
+ onOpenExportToLanguage={store.openQueryExportToLanguageDialog.bind(
+ store
+ )}
outdated={outdated}
readonly={!isEditable}
viewSwitchHandler={handleViewChanged}
diff --git a/packages/compass-crud/src/stores/crud-store.ts b/packages/compass-crud/src/stores/crud-store.ts
index 71c4393d5bb..1035af06fb7 100644
--- a/packages/compass-crud/src/stores/crud-store.ts
+++ b/packages/compass-crud/src/stores/crud-store.ts
@@ -99,6 +99,7 @@ export type CrudActions = {
runBulkUpdate(): Promise;
closeBulkDeleteDialog(): void;
runBulkDelete(): Promise;
+ openQueryExportToLanguageDialog(): void;
openDeleteQueryExportToLanguageDialog(): void;
saveUpdateQuery(name: string): Promise;
};
@@ -1988,6 +1989,22 @@ class CrudStoreImpl
}
}
+ openQueryExportToLanguageDialog(): void {
+ const query = this.queryBar.getLastAppliedQuery('crud');
+ this.localAppRegistry.emit(
+ 'open-query-export-to-language',
+ {
+ filter: toJSString(query.filter) || '{}',
+ project: query.project ? toJSString(query.project) : undefined,
+ sort: query.sort ? toJSString(query.sort) : undefined,
+ collation: query.collation ? toJSString(query.collation) : undefined,
+ skip: query.skip ? String(query.skip) : undefined,
+ limit: query.limit ? String(query.limit) : undefined,
+ },
+ 'Query'
+ );
+ }
+
openDeleteQueryExportToLanguageDialog(): void {
const { filter = {} } = this.queryBar.getLastAppliedQuery('crud');
this.localAppRegistry.emit(
diff --git a/packages/compass-e2e-tests/helpers/selectors.ts b/packages/compass-e2e-tests/helpers/selectors.ts
index 878243c1a25..f8cdded0908 100644
--- a/packages/compass-e2e-tests/helpers/selectors.ts
+++ b/packages/compass-e2e-tests/helpers/selectors.ts
@@ -843,7 +843,7 @@ export const AggregationSettingsApplyButton =
'[data-testid="aggregation-settings-apply"]';
export const AddStageButton = '[data-testid="add-stage"]';
export const ExportAggregationToLanguage =
- '[data-testid="pipeline-toolbar-export-button"]';
+ '[data-testid="pipeline-toolbar-export-code-button"]';
export const CreateNewPipelineButton =
'[data-testid="pipeline-toolbar-create-new-button"]';
export const NewPipelineActions = '#new-pipeline-actions';
@@ -863,7 +863,7 @@ export const AggregationErrorDetailsBtn =
export const RunPipelineButton = `[data-testid="pipeline-toolbar-run-button"]`;
export const EditPipelineButton = `[data-testid="pipeline-toolbar-edit-button"]`;
export const GoToCollectionButton = `[data-testid="pipeline-results-go-to-collection"]`;
-export const ExportAggregationResultsButton = `[data-testid="pipeline-toolbar-export-aggregation-button"]`;
+export const ExportAggregationResultsButton = `[data-testid="pipeline-toolbar-export-data-button"]`;
export const AggregationOpenSavedPipelinesButton = `[data-testid="pipeline-toolbar-open-pipelines-button"]`;
export const AggregationSavedPipelinesPopover = `[data-testid="saved-pipelines"]`;
@@ -1232,7 +1232,7 @@ export const queryBarResetFilterButton = (tabName: string): string => {
};
export const queryBarExportToLanguageButton = (tabName: string): string => {
const tabSelector = collectionContent(tabName);
- return `${tabSelector} [data-testid="query-bar-open-export-to-language-button"]`;
+ return `${tabSelector} [data-testid="crud-export-to-language-button"]`;
};
export const GenAIEntryButton = '[data-testid="open-ai-query-entry-button"]';
export const GenAITextInput = '[data-testid="ai-user-text-input"]';
diff --git a/packages/compass-e2e-tests/tests/collection-aggregations-tab.test.ts b/packages/compass-e2e-tests/tests/collection-aggregations-tab.test.ts
index fa9c346f181..75875058e36 100644
--- a/packages/compass-e2e-tests/tests/collection-aggregations-tab.test.ts
+++ b/packages/compass-e2e-tests/tests/collection-aggregations-tab.test.ts
@@ -979,7 +979,19 @@ describe('Collection aggregations tab', function () {
'{ i: 5 }'
);
- // Open the modal.
+ // Wait for the pipeline to be validated before trying to export
+ await browser.waitUntil(
+ async function () {
+ const textElement = browser.$(Selectors.stagePreviewToolbarTooltip(0));
+ const text = await textElement.getText();
+ return text === '(Sample of 1 document)';
+ },
+ {
+ timeoutMsg: 'Expected stage preview to show "(Sample of 1 document)"',
+ }
+ );
+
+ // Click the export data button to open the modal.
await browser.clickVisible(Selectors.ExportAggregationResultsButton);
const exportModal = browser.$(Selectors.ExportModal);
await exportModal.waitForDisplayed();
diff --git a/packages/compass-query-bar/src/components/query-bar.spec.tsx b/packages/compass-query-bar/src/components/query-bar.spec.tsx
index 340b236a1cd..d27cf6b9147 100644
--- a/packages/compass-query-bar/src/components/query-bar.spec.tsx
+++ b/packages/compass-query-bar/src/components/query-bar.spec.tsx
@@ -36,7 +36,6 @@ const noop = () => {
/* no op */
};
-const exportToLanguageButtonId = 'query-bar-open-export-to-language-button';
const queryHistoryButtonId = 'query-history-button';
const queryHistoryComponentTestId = 'query-history';
@@ -87,7 +86,6 @@ describe('QueryBar Component', function () {
onApply={noop}
onReset={noop}
resultId="123"
- showExportToLanguageButton
{...props}
/>
@@ -120,7 +118,6 @@ describe('QueryBar Component', function () {
renderQueryBar({
onApply: onApplySpy,
onReset: onResetSpy,
- showExportToLanguageButton: true,
});
});
@@ -207,26 +204,11 @@ describe('QueryBar Component', function () {
});
it('query controls are enabled', function () {
- expect(
- screen
- .getByTestId('query-bar-open-export-to-language-button')
- .getAttribute('aria-disabled')
- ).to.equal('false');
expect(
screen
.getByTestId('query-bar-apply-filter-button')
.getAttribute('aria-disabled')
).to.equal('false');
- expect(
- screen
- .getByTestId('query-bar-open-export-to-language-button')
- .getAttribute('aria-disabled')
- ).to.equal('false');
- expect(
- screen
- .getByTestId('query-bar-open-export-to-language-button')
- .getAttribute('aria-disabled')
- ).to.equal('false');
});
it('editors are not disabled', function () {
@@ -253,26 +235,11 @@ describe('QueryBar Component', function () {
});
rerender();
- expect(
- screen
- .getByTestId('query-bar-open-export-to-language-button')
- .getAttribute('aria-disabled')
- ).to.equal('true');
expect(
screen
.getByTestId('query-bar-apply-filter-button')
.getAttribute('aria-disabled')
).to.equal('true');
- expect(
- screen
- .getByTestId('query-bar-open-export-to-language-button')
- .getAttribute('aria-disabled')
- ).to.equal('true');
- expect(
- screen
- .getByTestId('query-bar-open-export-to-language-button')
- .getAttribute('aria-disabled')
- ).to.equal('true');
});
it('editors are disabled', function () {
@@ -368,21 +335,6 @@ describe('QueryBar Component', function () {
});
});
- describe('when showExportToLanguageButton is false', function () {
- beforeEach(function () {
- renderQueryBar({
- showExportToLanguageButton: false,
- });
- });
-
- it('does not render the exportToLanguage button', function () {
- const exportToLanguageButton = screen.queryByTestId(
- exportToLanguageButtonId
- );
- expect(exportToLanguageButton).to.not.exist;
- });
- });
-
describe('with three query options', function () {
beforeEach(function () {
renderQueryBar({
diff --git a/packages/compass-query-bar/src/components/query-bar.tsx b/packages/compass-query-bar/src/components/query-bar.tsx
index 585d1af6bca..b6c5e201447 100644
--- a/packages/compass-query-bar/src/components/query-bar.tsx
+++ b/packages/compass-query-bar/src/components/query-bar.tsx
@@ -1,7 +1,6 @@
import React, { useCallback, useMemo } from 'react';
import {
Button,
- Icon,
OptionsToggle,
css,
cx,
@@ -118,11 +117,6 @@ type QueryBarProps = {
applyId: number;
filterHasContent: boolean;
showExplainButton?: boolean;
- /**
- * Used by Cloud only to hide the export to language functionality
- * as it isn't supported.
- */
- showExportToLanguageButton?: boolean;
valid: boolean;
expanded: boolean;
placeholders?: Record;
@@ -137,7 +131,6 @@ export const QueryBar: React.FunctionComponent = ({
buttonLabel = 'Apply',
onApply,
onReset,
- onOpenExportToLanguage,
// Used to specify which query options to show and where they are positioned.
queryOptionsLayout = [
'project',
@@ -150,7 +143,6 @@ export const QueryBar: React.FunctionComponent = ({
applyId,
filterHasContent,
showExplainButton = false,
- showExportToLanguageButton = true,
valid: isQueryValid,
expanded: isQueryOptionsExpanded,
placeholders,
@@ -281,19 +273,6 @@ export const QueryBar: React.FunctionComponent = ({
>
{buttonLabel}
- {showExportToLanguageButton && (
-
- )}
{queryOptionsLayout && queryOptionsLayout.length > 0 && (