Skip to content

Commit a78716b

Browse files
DavidResende0DavidResende0
committed
temp
1 parent 213955a commit a78716b

File tree

5 files changed

+143
-105
lines changed

5 files changed

+143
-105
lines changed

‎app/javascript/components/provider-form/validate-provider-credentials.jsx

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,6 @@ const ValidateProviderCredentials = ({ ...props }) => {
1313
const url = providerId ? `/api/providers/${providerId}` : '/api/providers';
1414
const resource = pick(fields, fieldNames);
1515

16-
console.log(resource);
1716
const updatedResource = trimFieldValue(resource);
1817

1918
API.post(url, { action: 'verify_credentials', resource: updatedResource }).then(({ results: [result] = [], ...single }) => {

‎app/javascript/components/settings-replication-form/helper.js

Lines changed: 31 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -1,43 +1,34 @@
1-
import React from 'react';
2-
import { useFieldApi, useFormApi } from '@@ddf';
3-
import { Button } from 'carbon-components-react';
4-
import MiqDataTable from '../miq-data-table';
1+
// Creates the rows for the 'subscriptions-table' component
2+
export const createRows = (subscriptions) => {
3+
const rows = [];
54

6-
export const SubscriptionsTableComponent = (props) => {
7-
const {
8-
rows, onCellClick, addButtonLabel, onButtonClick,
9-
} = useFieldApi(props);
10-
const formOptions = useFormApi();
5+
subscriptions.forEach((value, index) => {
6+
rows.push({
7+
id: index.toString(),
8+
dbname: { text: value.dbname },
9+
host: { text: value.host },
10+
user: { text: value.user },
11+
password: { text: value.password },
12+
port: { text: value.port },
13+
backlog: { text: value.backlog ? value.backlog : '' },
14+
status: { text: value.status ? value.status : '' },
15+
provider_region: { text: value.provider_region || value.provider_region === 0 ? value.provider_region : '' },
16+
edit: {
17+
is_button: true,
18+
text: __('Update'),
19+
kind: 'tertiary',
20+
size: 'md',
21+
callback: 'editSubscription',
22+
},
23+
delete: {
24+
is_button: true,
25+
text: __('Delete'),
26+
kind: 'danger',
27+
size: 'md',
28+
callback: 'deleteSubscription',
29+
},
30+
});
31+
});
1132

12-
return (
13-
<div className="subscriptions-table">
14-
<Button
15-
kind="primary"
16-
className="subscription-add bx--btn bx--btn--primary pull-right"
17-
type="button"
18-
variant="contained"
19-
onClick={() => onButtonClick(formOptions)}
20-
>
21-
{addButtonLabel}
22-
</Button>
23-
24-
<MiqDataTable
25-
headers={[
26-
{ key: 'dbname', header: __('Database') },
27-
{ key: 'host', header: __('Host') },
28-
{ key: 'user', header: __('Username') },
29-
{ key: 'password', header: __('Password') },
30-
{ key: 'port', header: __('Port') },
31-
{ key: 'backlog', header: __('Backlog') },
32-
{ key: 'status', header: __('Status') },
33-
{ key: 'provider_region', header: __('Region') },
34-
{ key: 'edit', header: __('Edit') },
35-
{ key: 'delete', header: __('Delete') },
36-
]}
37-
rows={rows}
38-
size="md"
39-
onCellClick={(selectedRow, cellType) => onCellClick(selectedRow, cellType, formOptions)}
40-
/>
41-
</div>
42-
);
33+
return rows;
4334
};

‎app/javascript/components/settings-replication-form/index.jsx

Lines changed: 53 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
33

44
import MiqFormRenderer from '@@ddf';
55
import createSchema from './settings-replication-form.schema';
6-
import { SubscriptionsTableComponent } from './helper';
6+
import { SubscriptionsTableComponent } from './subscriptions-table';
77
import ValidateSubscription from './validate-subscription';
88
import miqRedirectBack from '../../helpers/miq-redirect-back';
99
import mapper from '../../forms/mappers/componentMapper';
@@ -51,29 +51,58 @@ const SettingsReplicationForm = ({ pglogicalReplicationFormId }) => {
5151

5252
const onSubmit = (values) => {
5353
if (form.type === 'subscription') {
54-
const newSubscriptions = [];
55-
56-
newSubscriptions.push({
57-
dbname: values.dbname,
58-
host: values.host,
59-
user: values.user,
60-
password: values.password,
61-
port: values.port,
62-
});
54+
if (form.action === 'add') {
55+
const newSubscriptions = [];
6356

64-
setState((state) => ({
65-
...state,
66-
initialValues: {
67-
replication_type: state.initialValues.replication_type,
68-
subscriptions: state.initialValues.subscriptions,
69-
},
70-
subscriptions: subscriptions.concat(newSubscriptions),
71-
form: {
72-
type: 'replication',
73-
className: 'replication_form',
74-
action: 'edit',
75-
},
76-
}));
57+
newSubscriptions.push({
58+
dbname: values.dbname,
59+
host: values.host,
60+
user: values.user,
61+
password: values.password,
62+
port: values.port,
63+
});
64+
65+
setState((state) => ({
66+
...state,
67+
initialValues: {
68+
replication_type: state.initialValues.replication_type,
69+
subscriptions: state.initialValues.subscriptions,
70+
},
71+
subscriptions: subscriptions.concat(newSubscriptions),
72+
form: {
73+
type: 'replication',
74+
className: 'replication_form',
75+
action: 'edit',
76+
},
77+
}));
78+
} else if (form.action === 'edit') {
79+
let modifiedSubscriptions = [];
80+
modifiedSubscriptions = modifiedSubscriptions.concat(subscriptions);
81+
82+
const editedSub = {
83+
dbname: values.dbname,
84+
host: values.host,
85+
password: values.password,
86+
port: values.port,
87+
user: values.user,
88+
};
89+
90+
modifiedSubscriptions[initialValues.subId] = editedSub;
91+
92+
setState((state) => ({
93+
...state,
94+
initialValues: {
95+
replication_type: state.initialValues.replication_type,
96+
subscriptions: state.initialValues.subscriptions,
97+
},
98+
subscriptions: modifiedSubscriptions,
99+
form: {
100+
type: 'replication',
101+
className: 'replication_form',
102+
action: 'edit',
103+
},
104+
}));
105+
}
77106
} else {
78107
// Redirect to Settings -> Tasks
79108

@@ -111,6 +140,7 @@ const SettingsReplicationForm = ({ pglogicalReplicationFormId }) => {
111140
onCancel={onCancel}
112141
canReset
113142
buttonsLabels={{ submitLabel }}
143+
clearOnUnmount={form.type !== 'replication'}
114144
/>
115145
);
116146
};

‎app/javascript/components/settings-replication-form/settings-replication-form.schema.js

Lines changed: 16 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -1,49 +1,20 @@
11
/* eslint-disable camelcase */
22
import { componentTypes, validatorTypes } from '@@ddf';
3+
import { createRows } from './helper';
34

45
const createSchema = (initialValues, subscriptions, form, replicationHelperText, setState) => {
5-
// Creates the rows for the 'subscriptions-table' component
6-
const createRows = () => {
7-
const rows = [];
8-
9-
subscriptions.forEach((value, index) => {
10-
rows.push({
11-
id: index.toString(),
12-
dbname: { text: value.dbname },
13-
host: { text: value.host },
14-
user: { text: value.user },
15-
password: { text: value.password },
16-
port: { text: value.port },
17-
backlog: { text: value.backlog ? value.backlog : '' },
18-
status: { text: value.status ? value.status : '' },
19-
provider_region: { text: value.provider_region || value.provider_region === 0 ? value.provider_region : '' },
20-
edit: {
21-
is_button: true,
22-
text: __('Update'),
23-
kind: 'tertiary',
24-
size: 'md',
25-
callback: 'editSubscription',
26-
},
27-
delete: {
28-
is_button: true,
29-
text: __('Delete'),
30-
kind: 'danger',
31-
size: 'md',
32-
callback: 'deleteSubscription',
33-
},
34-
});
35-
});
36-
37-
return rows;
38-
};
39-
406
const deleteSubscription = (selectedRow, cellType, formOptions) => {
417
subscriptions.splice(selectedRow.id, 1);
428

439
setState((state) => ({
4410
...state,
4511
subscriptions,
4612
}));
13+
14+
console.log(formOptions.getFieldState('subscriptions-table'));
15+
console.log(formOptions.getRegisteredFields());
16+
console.log(formOptions.getState());
17+
console.log(formOptions.schema);
4718
};
4819

4920
const editSubscription = (selectedRow) => {
@@ -56,6 +27,7 @@ const createSchema = (initialValues, subscriptions, form, replicationHelperText,
5627
user: selectedRow.cells[2].value,
5728
password: selectedRow.cells[3].value,
5829
port: selectedRow.cells[4].value,
30+
subId: selectedRow.id,
5931
},
6032
form: {
6133
type: 'subscription',
@@ -118,7 +90,7 @@ const createSchema = (initialValues, subscriptions, form, replicationHelperText,
11890
component: 'subscriptions-table',
11991
name: 'subscriptions-table',
12092
id: 'subscriptions-table',
121-
rows: createRows(),
93+
rows: createRows(subscriptions),
12294
onCellClick: (selectedRow, cellType, formOptions) => {
12395
switch (selectedRow.callbackAction) {
12496
case 'editSubscription':
@@ -133,11 +105,10 @@ const createSchema = (initialValues, subscriptions, form, replicationHelperText,
133105
},
134106
addButtonLabel: __('Add Subscription'),
135107
onButtonClick: (formOptions) => {
136-
formOptions.change('dbname', '');
137-
formOptions.change('host', '');
138-
formOptions.change('user', '');
139-
formOptions.change('password', '');
140-
formOptions.change('port', '');
108+
console.log(formOptions.getRegisteredFields());
109+
console.log(formOptions.getState());
110+
console.log(formOptions.schema);
111+
141112
setState((state) => ({
142113
...state,
143114
initialValues: {
@@ -150,6 +121,10 @@ const createSchema = (initialValues, subscriptions, form, replicationHelperText,
150121
action: 'add',
151122
},
152123
}));
124+
125+
console.log(formOptions.getRegisteredFields());
126+
console.log(formOptions.getState());
127+
console.log(formOptions.schema);
153128
},
154129
}],
155130
},

‎app/javascript/components/settings-replication-form/subscriptions-table.jsx

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
import React from 'react';
2+
import { useFieldApi, useFormApi } from '@@ddf';
3+
import { Button } from 'carbon-components-react';
4+
import MiqDataTable from '../miq-data-table';
5+
6+
export const SubscriptionsTableComponent = (props) => {
7+
const {
8+
rows, onCellClick, addButtonLabel, onButtonClick,
9+
} = useFieldApi(props);
10+
const formOptions = useFormApi();
11+
12+
return (
13+
<div className="subscriptions-table">
14+
<Button
15+
kind="primary"
16+
className="subscription-add bx--btn bx--btn--primary pull-right"
17+
type="button"
18+
variant="contained"
19+
onClick={() => onButtonClick(formOptions)}
20+
>
21+
{addButtonLabel}
22+
</Button>
23+
24+
<MiqDataTable
25+
headers={[
26+
{ key: 'dbname', header: __('Database') },
27+
{ key: 'host', header: __('Host') },
28+
{ key: 'user', header: __('Username') },
29+
{ key: 'password', header: __('Password') },
30+
{ key: 'port', header: __('Port') },
31+
{ key: 'backlog', header: __('Backlog') },
32+
{ key: 'status', header: __('Status') },
33+
{ key: 'provider_region', header: __('Region') },
34+
{ key: 'edit', header: __('Edit') },
35+
{ key: 'delete', header: __('Delete') },
36+
]}
37+
rows={rows}
38+
size="md"
39+
onCellClick={(selectedRow, cellType) => onCellClick(selectedRow, cellType, formOptions)}
40+
/>
41+
</div>
42+
);
43+
};

0 commit comments

Comments
 (0)