Skip to content

Commit b640fc0

Browse files
committed
remove fakerArgs, fix faker import, adjust next button disable logic, update tests
1 parent e12f347 commit b640fc0

File tree

5 files changed

+68
-62
lines changed

5 files changed

+68
-62
lines changed

packages/compass-collection/src/components/mock-data-generator-modal/faker-mapping-selector.tsx

Lines changed: 4 additions & 50 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,6 @@ import {
77
palette,
88
Select,
99
spacing,
10-
TextInput,
1110
} from '@mongodb-js/compass-components';
1211
import React from 'react';
1312
import { UNRECOGNIZED_FAKER_METHOD } from '../../modules/collection-tab';
@@ -27,26 +26,20 @@ const labelStyles = css({
2726
interface Props {
2827
activeJsonType: string;
2928
activeFakerFunction: string;
30-
activeFakerArgs: Array<string | number | boolean | { json: string }>;
3129
onJsonTypeSelect: (jsonType: string) => void;
3230
onFakerFunctionSelect: (fakerFunction: string) => void;
3331
}
3432

3533
const FakerMappingSelector = ({
3634
activeJsonType,
3735
activeFakerFunction,
38-
activeFakerArgs,
3936
onJsonTypeSelect,
4037
onFakerFunctionSelect,
4138
}: Props) => {
4239
return (
43-
<div
44-
className={fieldMappingSelectorsStyles}
45-
data-testid="field-mapping-selectors"
46-
>
40+
<div className={fieldMappingSelectorsStyles}>
4741
<Body className={labelStyles}>Mapping</Body>
4842
<Select
49-
data-testid="document-field-type-select"
5043
label="JSON Type"
5144
value={activeJsonType}
5245
onChange={onJsonTypeSelect}
@@ -58,7 +51,6 @@ const FakerMappingSelector = ({
5851
))}
5952
</Select>
6053
<Select
61-
data-testid="faker-function-select"
6254
label="Faker Function"
6355
value={activeFakerFunction}
6456
onChange={onFakerFunctionSelect}
@@ -72,49 +64,11 @@ const FakerMappingSelector = ({
7264
{activeFakerFunction === UNRECOGNIZED_FAKER_METHOD && (
7365
<Banner variant={BannerVariant.Warning}>
7466
Please select a function or we will default fill this field with the
75-
string “PLACEHOLDER”
67+
string &quot;Unrecognized&quot;
7668
</Banner>
7769
)}
78-
{activeFakerArgs.map((arg, idx) => {
79-
if (typeof arg === 'string') {
80-
return (
81-
<TextInput
82-
key={idx}
83-
label={`Faker Function Parameter ${typeof arg}`}
84-
readOnly
85-
value={arg}
86-
/>
87-
);
88-
}
89-
if (typeof arg === 'number') {
90-
return (
91-
<TextInput
92-
key={idx}
93-
label={`Faker Function Parameter ${typeof arg}`}
94-
readOnly
95-
value={arg.toString()}
96-
/>
97-
);
98-
}
99-
if (typeof arg === 'boolean') {
100-
return (
101-
<TextInput
102-
key={idx}
103-
label={`Faker Function Parameter ${typeof arg}`}
104-
readOnly
105-
value={arg.toString()}
106-
/>
107-
);
108-
}
109-
return (
110-
<TextInput
111-
key={idx}
112-
label={`Faker Function Parameter ${typeof arg}`}
113-
readOnly
114-
value={arg.json}
115-
/>
116-
);
117-
})}
70+
71+
{/* TODO: CLOUDP-344400: Render faker function parameters once we have a way to validate them. */}
11872
</div>
11973
);
12074
};

packages/compass-collection/src/components/mock-data-generator-modal/faker-schema-editor.tsx

Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -62,10 +62,6 @@ const FakerSchemaEditor = ({
6262
(mapping) => mapping.fieldPath === activeField
6363
)?.fakerMethod;
6464

65-
const activeFakerArgs = fakerSchemaFormValues.find(
66-
(mapping) => mapping.fieldPath === activeField
67-
)?.fakerArgs;
68-
6965
const onJsonTypeSelect = (newJsonType: string) => {
7066
const updatedFakerFieldMapping = fakerSchemaFormValues.find(
7167
(mapping) => mapping.fieldPath === activeField
@@ -122,7 +118,6 @@ const FakerSchemaEditor = ({
122118
<FakerMappingSelector
123119
activeJsonType={activeJsonType}
124120
activeFakerFunction={activeFakerFunction}
125-
activeFakerArgs={activeFakerArgs || []}
126121
onJsonTypeSelect={onJsonTypeSelect}
127122
onFakerFunctionSelect={onFakerFunctionSelect}
128123
/>

packages/compass-collection/src/components/mock-data-generator-modal/mock-data-generator-modal.spec.tsx

Lines changed: 62 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -16,8 +16,23 @@ import type { CollectionState } from '../../modules/collection-tab';
1616
import { default as collectionTabReducer } from '../../modules/collection-tab';
1717
import type { ConnectionInfo } from '@mongodb-js/connection-info';
1818
import type { MockDataSchemaResponse } from '@mongodb-js/compass-generative-ai';
19+
import type { SinonSandbox } from 'sinon';
20+
import sinon from 'sinon';
21+
22+
// eslint-disable-next-line @typescript-eslint/no-require-imports
23+
const { faker } = require('@faker-js/faker/locale/en');
1924

2025
describe('MockDataGeneratorModal', () => {
26+
let sandbox: SinonSandbox;
27+
28+
beforeEach(() => {
29+
sandbox = sinon.createSandbox();
30+
});
31+
32+
afterEach(() => {
33+
sandbox.restore();
34+
});
35+
2136
async function renderModal({
2237
isOpen = true,
2338
currentStep = MockDataGeneratorStep.SCHEMA_CONFIRMATION,
@@ -247,8 +262,8 @@ describe('MockDataGeneratorModal', () => {
247262
});
248263

249264
describe('on the schema editor step', () => {
250-
const mockServicesWithAiResponse = createMockServices();
251-
mockServicesWithAiResponse.atlasAiService.getMockDataSchema = () =>
265+
const mockServicesWithMockDataResponse = createMockServices();
266+
mockServicesWithMockDataResponse.atlasAiService.getMockDataSchema = () =>
252267
Promise.resolve({
253268
content: {
254269
fields: [
@@ -303,7 +318,7 @@ describe('MockDataGeneratorModal', () => {
303318
});
304319

305320
it('shows the faker schema editor when the faker schema generation is completed', async () => {
306-
await renderModal({ mockServices: mockServicesWithAiResponse });
321+
await renderModal({ mockServices: mockServicesWithMockDataResponse });
307322

308323
// advance to the schema editor step
309324
userEvent.click(screen.getByText('Confirm'));
@@ -313,13 +328,56 @@ describe('MockDataGeneratorModal', () => {
313328
expect(screen.getByText('age')).to.exist;
314329
});
315330

331+
it('shows correct values for the faker schema editor', async () => {
332+
sandbox.stub(faker, 'person').returns('Jane');
333+
sandbox.stub(faker, 'number').returns(30);
334+
sandbox.stub(faker, 'internet').throws(new Error('Invalid faker method'));
335+
await renderModal({ mockServices: mockServicesWithMockDataResponse });
336+
337+
// advance to the schema editor step
338+
userEvent.click(screen.getByText('Confirm'));
339+
await waitFor(() => {
340+
expect(screen.getByTestId('faker-schema-editor')).to.exist;
341+
});
342+
// the "name" field should be selected by default
343+
expect(screen.getByText('name')).to.exist;
344+
expect(screen.getByLabelText('JSON Type')).to.have.value('string');
345+
expect(screen.getByLabelText('Faker Function')).to.have.value(
346+
'person.firstName'
347+
);
348+
// select the "age" field
349+
userEvent.click(screen.getByText('age'));
350+
expect(screen.getByText('age')).to.exist;
351+
expect(screen.getByLabelText('JSON Type')).to.have.value('int');
352+
expect(screen.getByLabelText('Faker Function')).to.have.value(
353+
'number.int'
354+
);
355+
// select the "email" field
356+
userEvent.click(screen.getByText('email'));
357+
expect(screen.getByText('email')).to.exist;
358+
expect(screen.getByLabelText('JSON Type')).to.have.value('string');
359+
// the "email" field should have a warning banner since the faker method is invalid
360+
expect(screen.getByLabelText('Faker Function')).to.have.value(
361+
'Unrecognized'
362+
);
363+
expect(
364+
screen.getByText(
365+
'Please select a function or we will default fill this field with the string "Unrecognized"'
366+
)
367+
).to.exist;
368+
});
369+
316370
it('disables the Next button when the faker schema mapping is not confirmed', async () => {
317371
await renderModal({
318-
mockServices: mockServicesWithAiResponse,
372+
mockServices: mockServicesWithMockDataResponse,
319373
});
320374

321375
// advance to the schema editor step
322376
userEvent.click(screen.getByText('Confirm'));
377+
await waitFor(() => {
378+
expect(screen.getByTestId('faker-schema-editor')).to.exist;
379+
});
380+
323381
expect(
324382
screen.getByTestId('next-step-button').getAttribute('aria-disabled')
325383
).to.equal('true');

packages/compass-collection/src/components/mock-data-generator-modal/mock-data-generator-modal.tsx

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -103,8 +103,7 @@ const MockDataGeneratorModal = ({
103103

104104
const isNextButtonDisabled =
105105
currentStep === MockDataGeneratorStep.SCHEMA_EDITOR &&
106-
!isSchemaConfirmed &&
107-
fakerSchemaGenerationState.status === 'in-progress';
106+
(!isSchemaConfirmed || fakerSchemaGenerationState.status === 'in-progress');
108107

109108
const handleNextClick = () => {
110109
if (currentStep === MockDataGeneratorStep.GENERATE_DATA) {

packages/compass-collection/src/modules/collection-tab.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -41,7 +41,7 @@ import type {
4141
} from '../components/mock-data-generator-modal/types';
4242

4343
/* eslint-disable @typescript-eslint/no-require-imports */
44-
const faker = require('@faker-js/faker/locale/en');
44+
const { faker } = require('@faker-js/faker/locale/en');
4545

4646
const DEFAULT_SAMPLE_SIZE = 100;
4747

0 commit comments

Comments
 (0)