Skip to content
This repository was archived by the owner on Aug 25, 2021. It is now read-only.

Commit 52ad87b

Browse files
Hyperkid123Hyperkid123
committed
Fix enable/disable buttons for rbac users form.
<?.?.x>
1 parent 912777e commit 52ad87b

File tree

5 files changed

+95
-85
lines changed

5 files changed

+95
-85
lines changed

‎src/forms/finalFormComponent.jsx

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -11,8 +11,7 @@ const componentTypes = ['radio', 'checkbox', 'textarea', 'select', 'textfield',
1111
const switchComponents = ['radio', 'checkbox'];
1212
const inputTypes = ['text', 'email', 'number', 'password'];
1313
const selectValue = (option, labelKey, valueKey) =>
14-
option.sort((a, b) => (a[labelKey].toLowerCase() > b[labelKey].toLowerCase()))
15-
.map(item => item[valueKey]);
14+
option.sort((a, b) => a[labelKey].localeCompare(b[labelKey], 'en', { sensitivity: 'base' }).map(item => item[valueKey]));
1615

1716
const componentSelect = (componentType, { input, meta, ...rest }) => ({
1817
textfield: <FormControl type={rest.type || 'text'} {...input} placeholder={rest.placeholder} />,

‎src/rbac-forms/rbacUserForm.jsx

Lines changed: 81 additions & 70 deletions
Original file line numberDiff line numberDiff line change
@@ -31,82 +31,93 @@ const RbacUserForm = ({
3131
initialValues={initialValues}
3232
render={({
3333
invalid,
34-
pristine,
3534
handleSubmit,
35+
values,
3636
form: { change, reset },
37-
}) => (
38-
<PfForm horizontal>
39-
<Grid fluid>
40-
<Row>
41-
<Col xs={12}>
42-
<Field
43-
name="name"
44-
validate={required({ msg: __('Required') })}
45-
component={FinalFormField}
46-
label={__('Full Name')}
47-
disabled={!newRecord && editDisabled}
37+
}) => {
38+
const pristine = JSON.stringify(initialValues) === JSON.stringify(values);
39+
return (
40+
<PfForm horizontal>
41+
<Grid fluid>
42+
<Row>
43+
<Col xs={12}>
44+
<Field
45+
name="name"
46+
validate={required({ msg: __('Required') })}
47+
component={FinalFormField}
48+
label={__('Full Name')}
49+
disabled={!newRecord && editDisabled}
50+
/>
51+
</Col>
52+
<Col xs={12}>
53+
<Field
54+
name="userid"
55+
validate={required({ msg: __('Required') })}
56+
component={FinalFormField}
57+
label={__('Username')}
58+
disabled={!newRecord && editDisabled}
59+
/>
60+
</Col>
61+
<PasswordFragment
62+
changeValue={change}
63+
isEditing={!newRecord}
64+
passwordValidators={[required({ msg: __('Required') })]}
4865
/>
49-
</Col>
50-
<Col xs={12}>
51-
<Field
52-
name="userid"
53-
validate={required({ msg: __('Required') })}
54-
component={FinalFormField}
55-
label={__('Username')}
56-
disabled={!newRecord && editDisabled}
57-
/>
58-
</Col>
59-
<PasswordFragment
60-
changeValue={change}
61-
isEditing={!newRecord}
62-
passwordValidators={[required({ msg: __('Required') })]}
63-
/>
64-
<Col xs={12}>
65-
<Field
66-
name="email"
67-
type="email"
68-
validate={email({
66+
<Col xs={12}>
67+
<Field
68+
name="email"
69+
type="email"
70+
validate={email({
6971
msg: __('Email must be a valid email address'),
7072
allowBlank: true,
7173
})}
72-
component={FinalFormField}
73-
label={__('Email Address')}
74-
/>
75-
</Col>
76-
<Col xs={12}>
77-
<Field
78-
name="groups"
79-
validate={composeValidators(required({ msg: __('A User must be assigned to a Group') }), validateEmpty)}
80-
component={FinalFormSelect}
81-
label={__('Available Groups')}
82-
options={groups}
83-
placeholder={__('Choose one or more Groups')}
84-
multi
85-
searchable
86-
clearable
87-
/>
88-
</Col>
89-
</Row>
90-
<Row>
91-
<Col xs={10}>
92-
<ButtonGroup className="pull-right">
93-
<Button
94-
id="user-submit"
95-
bsStyle="primary"
96-
disabled={pristine || invalid}
97-
type="button"
98-
onClick={handleSubmit}
99-
>
100-
{newRecord ? __('Add') : __('Save')}
101-
</Button>
102-
{!newRecord && <Button disabled={pristine} onClick={reset} type="button">{__('Reset')}</Button>}
103-
<Button onClick={onCancel}>{__('Cancel')}</Button>
104-
</ButtonGroup>
105-
</Col>
106-
</Row>
107-
</Grid>
108-
</PfForm>
109-
)}
74+
component={FinalFormField}
75+
label={__('Email Address')}
76+
/>
77+
</Col>
78+
<Col xs={12}>
79+
<Field
80+
name="groups"
81+
validate={composeValidators(required({ msg: __('A User must be assigned to a Group') }), validateEmpty)}
82+
component={FinalFormSelect}
83+
label={__('Available Groups')}
84+
options={groups}
85+
placeholder={__('Choose one or more Groups')}
86+
multi
87+
searchable
88+
clearable
89+
/>
90+
</Col>
91+
</Row>
92+
<Row>
93+
<Col xs={10}>
94+
<ButtonGroup className="pull-right">
95+
<Button
96+
id="user-submit"
97+
bsStyle="primary"
98+
disabled={pristine || invalid}
99+
type="button"
100+
onClick={handleSubmit}
101+
>
102+
{newRecord ? __('Add') : __('Save')}
103+
</Button>
104+
{!newRecord && (
105+
<Button
106+
disabled={pristine}
107+
onClick={reset}
108+
type="button"
109+
>
110+
{__('Reset')}
111+
</Button>
112+
)}
113+
<Button onClick={onCancel}>{__('Cancel')}</Button>
114+
</ButtonGroup>
115+
</Col>
116+
</Row>
117+
</Grid>
118+
</PfForm>
119+
);
120+
}}
110121
/>
111122
);
112123

‎src/rbac-forms/stories/data.js

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,42 +1,42 @@
11
export const groups = [
22
{
3-
value: 1,
3+
value: '1',
44
label: 'Hope',
55
},
66
{
7-
value: 2,
7+
value: '2',
88
label: 'Christa',
99
},
1010
{
11-
value: 3,
11+
value: '3',
1212
label: 'Tania',
1313
},
1414
{
15-
value: 4,
15+
value: '4',
1616
label: 'Mcintyre',
1717
},
1818
{
19-
value: 5,
19+
value: '5',
2020
label: 'Tonya',
2121
},
2222
{
23-
value: 6,
23+
value: '6',
2424
label: 'Marcie',
2525
},
2626
{
27-
value: 7,
27+
value: '7',
2828
label: 'Cara',
2929
},
3030
{
31-
value: 8,
31+
value: '8',
3232
label: 'Becker',
3333
},
3434
{
35-
value: 9,
35+
value: '9',
3636
label: 'Foley',
3737
},
3838
{
39-
value: 10,
39+
value: '10',
4040
label: 'Perkins',
4141
},
4242
];

‎src/rbac-forms/stories/rbacUserForm.stories.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -49,7 +49,7 @@ storiesOf('Rbac forms', module).add('Rbac add user form', withInfo()(() => (
4949
name: 'User name',
5050
userid: 'User id',
5151
email: '[email protected]',
52-
groups: ['1', '2', '5'],
52+
groups: ['2', '1', '5'],
5353
}}
5454
/>
5555
)))

‎src/rbac-forms/tests/__snapshots__/rbacUserForm.test.jsx.snap

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1459,13 +1459,13 @@ exports[`RbacUserForm component Should render correctly 1`] = `
14591459
block={false}
14601460
bsClass="btn"
14611461
bsStyle="default"
1462-
disabled={true}
1462+
disabled={false}
14631463
onClick={[Function]}
14641464
type="button"
14651465
>
14661466
<button
14671467
className="btn btn-default"
1468-
disabled={true}
1468+
disabled={false}
14691469
onClick={[Function]}
14701470
type="button"
14711471
>

0 commit comments

Comments
 (0)