Skip to content

Commit e53b9a1

Browse files
jmfrancoisjsomsanith-tlnd
jmfrancois
authored and
jsomsanith-tlnd
committed
feat(UIForms) : rendering lib based on json-schema-form-core (#415)
1 parent b14580a commit e53b9a1

File tree

88 files changed

+5171
-35
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

88 files changed

+5171
-35
lines changed

‎output/cmf.eslint.txt

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
Lerna v2.0.0-beta.36
22
Scoping to packages that match 'react-cmf'
33

4-
> react-cmf@0.79.0 lint:es /home/travis/build/Talend/ui/packages/cmf
4+
> react-cmf@0.80.0 lint:es /home/travis/build/Talend/ui/packages/cmf
55
> eslint --config .eslintrc --ext .js src
66

77
The react/require-extension rule is deprecated. Please use the import/extensions rule from eslint-plugin-import instead.

‎output/components.eslint.txt

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
Lerna v2.0.0-beta.36
22
Scoping to packages that match 'react-talend-components'
33

4-
> react-talend-components@0.79.0 lint:es /home/travis/build/Talend/ui/packages/components
4+
> react-talend-components@0.80.0 lint:es /home/travis/build/Talend/ui/packages/components
55
> eslint --config .eslintrc src
66

77

‎output/components.sasslint.txt

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
Lerna v2.0.0-beta.36
22
Scoping to packages that match 'react-talend-components'
33

4-
> react-talend-components@0.79.0 lint:style /home/travis/build/Talend/ui/packages/components
4+
> react-talend-components@0.80.0 lint:style /home/travis/build/Talend/ui/packages/components
55
> sass-lint -v -q
66

77

‎output/containers.eslint.txt

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
Lerna v2.0.0-beta.36
22
Scoping to packages that match 'react-talend-containers'
33

4-
> react-talend-containers@0.79.0 lint:es /home/travis/build/Talend/ui/packages/containers
4+
> react-talend-containers@0.80.0 lint:es /home/travis/build/Talend/ui/packages/containers
55
> eslint --config .eslintrc src
66

77
The react/require-extension rule is deprecated. Please use the import/extensions rule from eslint-plugin-import instead.

‎output/forms.eslint.txt

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
Lerna v2.0.0-beta.36
22
Scoping to packages that match 'react-talend-forms'
33

4-
> react-talend-forms@0.79.0 lint:es /home/travis/build/Talend/ui/packages/forms
4+
> react-talend-forms@0.80.0 lint:es /home/travis/build/Talend/ui/packages/forms
55
> eslint --config .eslintrc src
66

77
The react/require-extension rule is deprecated. Please use the import/extensions rule from eslint-plugin-import instead.

‎output/forms.sasslint.txt

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
Lerna v2.0.0-beta.36
22
Scoping to packages that match 'react-talend-forms'
33

4-
> react-talend-forms@0.79.0 lint:style /home/travis/build/Talend/ui/packages/forms
4+
> react-talend-forms@0.80.0 lint:style /home/travis/build/Talend/ui/packages/forms
55
> sass-lint -v -q
66

‎output/logging.eslint.txt

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
Lerna v2.0.0-beta.36
22
Scoping to packages that match 'talend-log'
33

4-
> talend-log@0.79.0 lint:es /home/travis/build/Talend/ui/packages/logging
4+
> talend-log@0.80.0 lint:es /home/travis/build/Talend/ui/packages/logging
55
> eslint --config .eslintrc --ext .js src
66

77

‎output/theme.sasslint.txt

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
Lerna v2.0.0-beta.36
22
Scoping to packages that match 'bootstrap-talend-theme'
33

4-
> bootstrap-talend-theme@0.79.0 lint:style /home/travis/build/Talend/ui/packages/theme
4+
> bootstrap-talend-theme@0.80.0 lint:style /home/travis/build/Talend/ui/packages/theme
55
> sass-lint -q -v
66

77

@@ -16,12 +16,12 @@ src/theme/_forms.scss
1616
24:8 error Qualifying elements are not allowed for class selectors no-qualifying-elements
1717
41:10 error Qualifying elements are not allowed for class selectors no-qualifying-elements
1818
42:7 error Qualifying elements are not allowed for class selectors no-qualifying-elements
19-
79:8 error Qualifying elements are not allowed for class selectors no-qualifying-elements
20-
262:8 error Qualifying elements are not allowed for class selectors no-qualifying-elements
21-
275:8 error Qualifying elements are not allowed for class selectors no-qualifying-elements
22-
288:8 error Qualifying elements are not allowed for class selectors no-qualifying-elements
23-
311:9 error Qualifying elements are not allowed for class selectors no-qualifying-elements
24-
447:8 warning Vendor prefixes should not be used no-vendor-prefixes
19+
84:8 error Qualifying elements are not allowed for class selectors no-qualifying-elements
20+
267:8 error Qualifying elements are not allowed for class selectors no-qualifying-elements
21+
280:8 error Qualifying elements are not allowed for class selectors no-qualifying-elements
22+
293:8 error Qualifying elements are not allowed for class selectors no-qualifying-elements
23+
316:9 error Qualifying elements are not allowed for class selectors no-qualifying-elements
24+
457:8 warning Vendor prefixes should not be used no-vendor-prefixes
2525

2626
src/theme/_tables.scss
2727
21:2 warning Vendor prefixes should not be used no-vendor-prefixes

‎packages/forms/.storybook/config.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ setAddon(infoAddon);
77

88
function loadStories() {
99
require('../stories');
10+
require('../stories-core');
1011
}
1112

1213
configure(loadStories, module);

‎packages/forms/__mocks__/data.js

Lines changed: 99 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,99 @@
1+
import React from 'react';
2+
import configureMockStore from 'redux-mock-store';
3+
4+
export const data = {
5+
jsonSchema: {
6+
type: 'object',
7+
title: 'Comment',
8+
properties: {
9+
lastname: {
10+
type: 'string',
11+
minLength: 10,
12+
},
13+
firstname: {
14+
type: 'string',
15+
},
16+
check: {},
17+
},
18+
required: [
19+
'firstname',
20+
],
21+
},
22+
uiSchema: [
23+
{
24+
key: 'lastname',
25+
title: 'Last Name (with description)',
26+
description: 'Hint: this is the last name',
27+
autoFocus: true,
28+
},
29+
{
30+
key: 'firstname',
31+
title: 'First Name (with placeholder)',
32+
placeholder: 'Enter your firstname here',
33+
triggers: ['after'],
34+
},
35+
{
36+
key: 'check',
37+
type: 'button',
38+
title: 'Check the thing',
39+
triggers: ['after'],
40+
},
41+
],
42+
properties: {},
43+
errors: {},
44+
};
45+
46+
export const mergedSchema = [
47+
{
48+
autoFocus: true,
49+
description: 'Hint: this is the last name',
50+
key: ['lastname'],
51+
minlength: 10,
52+
ngModelOptions: {},
53+
schema: { minLength: 10, type: 'string' },
54+
title: 'Last Name (with description)',
55+
type: 'text',
56+
},
57+
{
58+
key: ['firstname'],
59+
ngModelOptions: {},
60+
placeholder: 'Enter your firstname here',
61+
required: true,
62+
schema: { type: 'string' },
63+
title: 'First Name (with placeholder)',
64+
triggers: ['after'],
65+
type: 'text',
66+
},
67+
{
68+
key: ['check'],
69+
title: 'Check the thing',
70+
triggers: ['after'],
71+
type: 'button',
72+
},
73+
];
74+
75+
export function initProps() {
76+
return {
77+
autoComplete: 'off',
78+
customValidation: jest.fn(),
79+
formName: 'myFormName',
80+
id: 'myFormId',
81+
onChange: jest.fn(),
82+
onSubmit: jest.fn(),
83+
onTrigger: jest.fn(),
84+
widgets: {
85+
custom: () => (<div>Custom</div>),
86+
},
87+
};
88+
}
89+
90+
export function initStore(formName, form) {
91+
const mockStore = configureMockStore();
92+
const state = { forms: {} };
93+
94+
if (formName && form) {
95+
state.forms[formName] = { ...form };
96+
}
97+
98+
return mockStore(state);
99+
}

‎packages/forms/package.json

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -46,9 +46,12 @@
4646
"react-bootstrap": "^0.30.3",
4747
"react-css-transition": "^0.7.4",
4848
"react-dom": "^15.4.0",
49+
"react-redux": "^5.0.4",
4950
"react-talend-components": "^0.80.0",
5051
"react-test-renderer": "15.4.0",
5152
"react-virtualized": "^9.1.0",
53+
"redux": "^3.6.0",
54+
"redux-mock-store": "^1.2.3",
5255
"rimraf": "^2.5.4",
5356
"sass-lint": "^1.10.2",
5457
"sass-loader": "^4.1.1",
@@ -60,13 +63,16 @@
6063
"classnames": "^2.2.5",
6164
"keycode": "^2.1.8",
6265
"react-autowhatever": "^7.0.0",
63-
"react-jsonschema-form": "^0.42.0"
66+
"react-jsonschema-form": "^0.42.0",
67+
"talend-json-schema-form-core": "1.0.2-alpha.2"
6468
},
6569
"peerDependencies": {
6670
"react": "^15.4.0",
6771
"react-bootstrap": "^0.30.3",
6872
"react-dom": "^15.4.0",
69-
"react-talend-components": "^0.80.0"
73+
"react-redux": "^5.0.4",
74+
"react-talend-components": "^0.80.0",
75+
"redux": "^3.6.0"
7076
},
7177
"scripts": {
7278
"prepublish": "rimraf lib && babel -d lib ./src/ && cpx \"./src/**/*.scss\" lib",

‎packages/forms/src/UIForm/Message/Message.component.js

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
import React, { PropTypes } from 'react';
2+
3+
export default function Message(props) {
4+
const {
5+
errorMessage,
6+
description,
7+
isValid,
8+
} = props;
9+
10+
const message = isValid ? description : errorMessage;
11+
return message ?
12+
(
13+
<p
14+
className="help-block"
15+
role="status"
16+
>
17+
{ message }
18+
</p>
19+
) :
20+
null;
21+
}
22+
23+
if (process.env.NODE_ENV !== 'production') {
24+
Message.propTypes = {
25+
errorMessage: PropTypes.string,
26+
description: PropTypes.string,
27+
isValid: PropTypes.bool,
28+
};
29+
}

‎packages/forms/src/UIForm/Message/Message.component.test.js

Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
import React from 'react';
2+
import { shallow } from 'enzyme';
3+
4+
import Message from './Message.component';
5+
6+
describe('Message component', () => {
7+
it('should render provided description if the field is valid', () => {
8+
// when
9+
const wrapper = shallow(
10+
<Message
11+
errorMessage={'My error message'}
12+
description={'My description'}
13+
isValid
14+
/>
15+
);
16+
17+
// then
18+
expect(wrapper.node).toMatchSnapshot();
19+
});
20+
21+
it('should render provided error message if the field is invalid', () => {
22+
// when
23+
const wrapper = shallow(
24+
<Message
25+
errorMessage={'My error message'}
26+
description={'My description'}
27+
isValid={false}
28+
/>
29+
);
30+
31+
// then
32+
expect(wrapper.node).toMatchSnapshot();
33+
});
34+
35+
it('should render nothing when field is valid and no description is provided', () => {
36+
// when
37+
const wrapper = shallow(
38+
<Message
39+
errorMessage={'My error message'}
40+
isValid
41+
/>
42+
);
43+
44+
// then
45+
expect(wrapper.node).toMatchSnapshot();
46+
});
47+
});

‎packages/forms/src/UIForm/Message/__snapshots__/Message.component.test.js.snap

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
exports[`Message component should render nothing when field is valid and no description is provided 1`] = `null`;
2+
3+
exports[`Message component should render provided description if the field is valid 1`] = `
4+
<p
5+
className="help-block"
6+
role="status">
7+
My description
8+
</p>
9+
`;
10+
11+
exports[`Message component should render provided error message if the field is invalid 1`] = `
12+
<p
13+
className="help-block"
14+
role="status">
15+
My error message
16+
</p>
17+
`;

‎packages/forms/src/UIForm/Message/index.js

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
import Message from './Message.component';
2+
3+
export default Message;

0 commit comments

Comments
 (0)