Skip to content

Commit 37fda7f

Browse files
committed
remove fakerArgs, fix faker import, adjust next button disable logic, update tests
1 parent fc8713f commit 37fda7f

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-screen.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
@@ -123,7 +119,6 @@ const FakerSchemaEditorScreen = () => {
123119
<FakerMappingSelector
124120
activeJsonType={activeJsonType}
125121
activeFakerFunction={activeFakerFunction}
126-
activeFakerArgs={activeFakerArgs || []}
127122
onJsonTypeSelect={onJsonTypeSelect}
128123
onFakerFunctionSelect={onFakerFunctionSelect}
129124
/>

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,
@@ -284,8 +299,8 @@ describe('MockDataGeneratorModal', () => {
284299
});
285300

286301
describe('on the schema editor step', () => {
287-
const mockServicesWithAiResponse = createMockServices();
288-
mockServicesWithAiResponse.atlasAiService.getMockDataSchema = () =>
302+
const mockServicesWithMockDataResponse = createMockServices();
303+
mockServicesWithMockDataResponse.atlasAiService.getMockDataSchema = () =>
289304
Promise.resolve({
290305
content: {
291306
fields: [
@@ -340,7 +355,7 @@ describe('MockDataGeneratorModal', () => {
340355
});
341356

342357
it('shows the faker schema editor when the faker schema generation is completed', async () => {
343-
await renderModal({ mockServices: mockServicesWithAiResponse });
358+
await renderModal({ mockServices: mockServicesWithMockDataResponse });
344359

345360
// advance to the schema editor step
346361
userEvent.click(screen.getByText('Confirm'));
@@ -350,13 +365,56 @@ describe('MockDataGeneratorModal', () => {
350365
expect(screen.getByText('age')).to.exist;
351366
});
352367

368+
it('shows correct values for the faker schema editor', async () => {
369+
sandbox.stub(faker, 'person').returns('Jane');
370+
sandbox.stub(faker, 'number').returns(30);
371+
sandbox.stub(faker, 'internet').throws(new Error('Invalid faker method'));
372+
await renderModal({ mockServices: mockServicesWithMockDataResponse });
373+
374+
// advance to the schema editor step
375+
userEvent.click(screen.getByText('Confirm'));
376+
await waitFor(() => {
377+
expect(screen.getByTestId('faker-schema-editor')).to.exist;
378+
});
379+
// the "name" field should be selected by default
380+
expect(screen.getByText('name')).to.exist;
381+
expect(screen.getByLabelText('JSON Type')).to.have.value('string');
382+
expect(screen.getByLabelText('Faker Function')).to.have.value(
383+
'person.firstName'
384+
);
385+
// select the "age" field
386+
userEvent.click(screen.getByText('age'));
387+
expect(screen.getByText('age')).to.exist;
388+
expect(screen.getByLabelText('JSON Type')).to.have.value('int');
389+
expect(screen.getByLabelText('Faker Function')).to.have.value(
390+
'number.int'
391+
);
392+
// select the "email" field
393+
userEvent.click(screen.getByText('email'));
394+
expect(screen.getByText('email')).to.exist;
395+
expect(screen.getByLabelText('JSON Type')).to.have.value('string');
396+
// the "email" field should have a warning banner since the faker method is invalid
397+
expect(screen.getByLabelText('Faker Function')).to.have.value(
398+
'Unrecognized'
399+
);
400+
expect(
401+
screen.getByText(
402+
'Please select a function or we will default fill this field with the string "Unrecognized"'
403+
)
404+
).to.exist;
405+
});
406+
353407
it('disables the Next button when the faker schema mapping is not confirmed', async () => {
354408
await renderModal({
355-
mockServices: mockServicesWithAiResponse,
409+
mockServices: mockServicesWithMockDataResponse,
356410
});
357411

358412
// advance to the schema editor step
359413
userEvent.click(screen.getByText('Confirm'));
414+
await waitFor(() => {
415+
expect(screen.getByTestId('faker-schema-editor')).to.exist;
416+
});
417+
360418
expect(
361419
screen.getByTestId('next-step-button').getAttribute('aria-disabled')
362420
).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
@@ -111,8 +111,7 @@ const MockDataGeneratorModal = ({
111111

112112
const isNextButtonDisabled =
113113
currentStep === MockDataGeneratorStep.SCHEMA_EDITOR &&
114-
!isSchemaConfirmed &&
115-
fakerSchemaGenerationState.status === 'in-progress';
114+
(!isSchemaConfirmed || fakerSchemaGenerationState.status === 'in-progress');
116115

117116
const handleNextClick = () => {
118117
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
@@ -44,7 +44,7 @@ import type {
4444
} from '../components/mock-data-generator-modal/types';
4545

4646
/* eslint-disable @typescript-eslint/no-require-imports */
47-
const faker = require('@faker-js/faker/locale/en');
47+
const { faker } = require('@faker-js/faker/locale/en');
4848

4949
const DEFAULT_SAMPLE_SIZE = 100;
5050

0 commit comments

Comments
 (0)