Skip to content

Commit cef7d95

Browse files
committed
[Library] Issue #7 part 2 : Add onSubmit Value Parser feature added
1 parent d8c4cba commit cef7d95

File tree

7 files changed

+48
-16
lines changed

7 files changed

+48
-16
lines changed

src/JsonTree.js

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -47,6 +47,7 @@ const propTypes = {
4747
beforeAddAction: PropTypes.func,
4848
beforeUpdateAction: PropTypes.func,
4949
logger: PropTypes.object,
50+
onSubmitValueParser: PropTypes.func,
5051
};
5152
// Default props
5253
const defaultProps = {
@@ -126,6 +127,7 @@ class JsonTree extends Component {
126127
beforeAddAction,
127128
beforeUpdateAction,
128129
logger,
130+
onSubmitValueParser,
129131
} = this.props;
130132

131133
// Node type
@@ -166,6 +168,7 @@ class JsonTree extends Component {
166168
beforeAddAction={beforeAddAction}
167169
beforeUpdateAction={beforeUpdateAction}
168170
logger={logger}
171+
onSubmitValueParser={onSubmitValueParser}
169172
/>);
170173
} else {
171174
node = 'Data must be an Array or Object';

src/components/JsonAddValue.js

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -25,13 +25,15 @@ const propTypes = {
2525
inputElementGenerator: PropTypes.func,
2626
keyPath: PropTypes.array,
2727
deep: PropTypes.number,
28+
onSubmitValueParser: PropTypes.func,
2829
};
2930
// Default props
3031
const defaultProps = {
3132
onlyValue: false,
3233
addButtonElement: <button>+</button>,
3334
cancelButtonElement: <button>c</button>,
3435
inputElementGenerator: () => <input />,
36+
onSubmitValueParser: (isEditMode, keyPath, deep, name, value) => parse(value),
3537
};
3638

3739
/* ************************************* */
@@ -64,11 +66,9 @@ class JsonAddValue extends Component {
6466
}
6567

6668
onSubmit() {
67-
const { handleAdd, onlyValue } = this.props;
69+
const { handleAdd, onlyValue, onSubmitValueParser, keyPath, deep } = this.props;
6870
const { inputRefKey, inputRefValue } = this.state;
69-
const result = {
70-
newValue: parse(inputRefValue.value),
71-
};
71+
const result = {};
7272
// Check if we have the key
7373
if (!onlyValue) {
7474
// Check that there is a key
@@ -79,6 +79,7 @@ class JsonAddValue extends Component {
7979

8080
result.key = inputRefKey.value;
8181
}
82+
result.newValue = onSubmitValueParser(false, keyPath, deep, result.key, inputRefValue.value);
8283
handleAdd(result);
8384
}
8485

src/components/JsonArray.js

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -40,6 +40,7 @@ const propTypes = {
4040
beforeAddAction: PropTypes.func,
4141
beforeUpdateAction: PropTypes.func,
4242
logger: PropTypes.object.isRequired,
43+
onSubmitValueParser: PropTypes.func,
4344
};
4445
// Default props
4546
const defaultProps = {
@@ -268,6 +269,7 @@ class JsonArray extends Component {
268269
beforeAddAction,
269270
beforeUpdateAction,
270271
logger,
272+
onSubmitValueParser,
271273
} = this.props;
272274
const { minus, plus, delimiter, ul, addForm } = getStyle(name, data, keyPath, deep, dataType);
273275

@@ -308,6 +310,7 @@ class JsonArray extends Component {
308310
beforeAddAction={beforeAddAction}
309311
beforeUpdateAction={beforeUpdateAction}
310312
logger={logger}
313+
onSubmitValueParser={onSubmitValueParser}
311314
/>);
312315

313316
const onlyValue = true;
@@ -329,6 +332,7 @@ class JsonArray extends Component {
329332
inputElementGenerator={inputElementGenerator}
330333
keyPath={keyPath}
331334
deep={deep}
335+
onSubmitValueParser={onSubmitValueParser}
332336
/></span>) :
333337
(<span>
334338
{plusMenuLayout} {minusElement}

src/components/JsonFunctionValue.js

Lines changed: 9 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -33,6 +33,7 @@ const propTypes = {
3333
textareaElementGenerator: PropTypes.func,
3434
minusMenuElement: PropTypes.element,
3535
logger: PropTypes.object.isRequired,
36+
onSubmitValueParser: PropTypes.func,
3637
};
3738
// Default props
3839
const defaultProps = {
@@ -44,6 +45,7 @@ const defaultProps = {
4445
cancelButtonElement: <button>c</button>,
4546
textareaElementGenerator: () => <textarea />,
4647
minusMenuElement: <span> - </span>,
48+
onSubmitValueParser: (isEditMode, keyPath, deep, name, value) => parse(value),
4749
};
4850

4951
/* ************************************* */
@@ -89,10 +91,10 @@ class JsonFunctionValue extends Component {
8991
}
9092

9193
handleEdit() {
92-
const { handleUpdateValue, originalValue, logger } = this.props;
93-
const { inputRef, name } = this.state;
94+
const { handleUpdateValue, originalValue, logger, onSubmitValueParser, keyPath } = this.props;
95+
const { inputRef, name, deep } = this.state;
9496

95-
const newValue = parse(inputRef.value);
97+
const newValue = onSubmitValueParser(true, keyPath, deep, name, inputRef.value);
9698

9799
const result = {
98100
value: newValue,
@@ -136,16 +138,17 @@ class JsonFunctionValue extends Component {
136138
cancelButtonElement,
137139
textareaElementGenerator,
138140
minusMenuElement,
141+
keyPath: comeFromKeyPath,
139142
} = this.props;
140143

141-
const style = getStyle(name, value, keyPath, deep, dataType);
144+
const style = getStyle(name, originalValue, keyPath, deep, dataType);
142145
let result = null;
143146
let minusElement = null;
144-
const resultOnlyResult = readOnly(name, value, keyPath, deep, dataType);
147+
const resultOnlyResult = readOnly(name, originalValue, keyPath, deep, dataType);
145148

146149
if (editEnabled && !resultOnlyResult) {
147150
const textareaElement =
148-
textareaElementGenerator(inputUsageTypes.VALUE, keyPath, deep, name, value, dataType);
151+
textareaElementGenerator(inputUsageTypes.VALUE, comeFromKeyPath, deep, name, originalValue, dataType);
149152

150153
const editButtonElementLayout = React.cloneElement(editButtonElement, {
151154
onClick: this.handleEdit,

src/components/JsonNode.js

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -42,6 +42,7 @@ const propTypes = {
4242
beforeAddAction: PropTypes.func,
4343
beforeUpdateAction: PropTypes.func,
4444
logger: PropTypes.object.isRequired,
45+
onSubmitValueParser: PropTypes.func,
4546
};
4647
// Default props
4748
const defaultProps = {
@@ -90,6 +91,7 @@ class JsonNode extends Component {
9091
beforeAddAction,
9192
beforeUpdateAction,
9293
logger,
94+
onSubmitValueParser,
9395
} = this.props;
9496
const readOnlyTrue = () => (true);
9597

@@ -119,6 +121,7 @@ class JsonNode extends Component {
119121
beforeAddAction={beforeAddAction}
120122
beforeUpdateAction={beforeUpdateAction}
121123
logger={logger}
124+
onSubmitValueParser={onSubmitValueParser}
122125
/>);
123126
case dataTypes.OBJECT:
124127
return (<JsonObject
@@ -144,6 +147,7 @@ class JsonNode extends Component {
144147
beforeAddAction={beforeAddAction}
145148
beforeUpdateAction={beforeUpdateAction}
146149
logger={logger}
150+
onSubmitValueParser={onSubmitValueParser}
147151
/>);
148152
case dataTypes.ARRAY:
149153
return (<JsonArray
@@ -169,6 +173,7 @@ class JsonNode extends Component {
169173
beforeAddAction={beforeAddAction}
170174
beforeUpdateAction={beforeUpdateAction}
171175
logger={logger}
176+
onSubmitValueParser={onSubmitValueParser}
172177
/>);
173178
case dataTypes.STRING:
174179
return (<JsonValue
@@ -187,6 +192,7 @@ class JsonNode extends Component {
187192
inputElementGenerator={inputElementGenerator}
188193
minusMenuElement={minusMenuElement}
189194
logger={logger}
195+
onSubmitValueParser={onSubmitValueParser}
190196
/>);
191197
case dataTypes.NUMBER:
192198
return (<JsonValue
@@ -205,6 +211,7 @@ class JsonNode extends Component {
205211
inputElementGenerator={inputElementGenerator}
206212
minusMenuElement={minusMenuElement}
207213
logger={logger}
214+
onSubmitValueParser={onSubmitValueParser}
208215
/>);
209216
case dataTypes.BOOLEAN:
210217
return (<JsonValue
@@ -223,6 +230,7 @@ class JsonNode extends Component {
223230
inputElementGenerator={inputElementGenerator}
224231
minusMenuElement={minusMenuElement}
225232
logger={logger}
233+
onSubmitValueParser={onSubmitValueParser}
226234
/>);
227235
case dataTypes.DATE:
228236
return (<JsonValue
@@ -241,6 +249,7 @@ class JsonNode extends Component {
241249
inputElementGenerator={inputElementGenerator}
242250
minusMenuElement={minusMenuElement}
243251
logger={logger}
252+
onSubmitValueParser={onSubmitValueParser}
244253
/>);
245254
case dataTypes.NULL:
246255
return (<JsonValue
@@ -259,6 +268,7 @@ class JsonNode extends Component {
259268
inputElementGenerator={inputElementGenerator}
260269
minusMenuElement={minusMenuElement}
261270
logger={logger}
271+
onSubmitValueParser={onSubmitValueParser}
262272
/>);
263273
case dataTypes.UNDEFINED:
264274
return (<JsonValue
@@ -277,6 +287,7 @@ class JsonNode extends Component {
277287
inputElementGenerator={inputElementGenerator}
278288
minusMenuElement={minusMenuElement}
279289
logger={logger}
290+
onSubmitValueParser={onSubmitValueParser}
280291
/>);
281292
case dataTypes.FUNCTION:
282293
return (<JsonFunctionValue
@@ -295,6 +306,7 @@ class JsonNode extends Component {
295306
textareaElementGenerator={textareaElementGenerator}
296307
minusMenuElement={minusMenuElement}
297308
logger={logger}
309+
onSubmitValueParser={onSubmitValueParser}
298310
/>);
299311
case dataTypes.SYMBOL:
300312
return (<JsonValue
@@ -313,6 +325,7 @@ class JsonNode extends Component {
313325
inputElementGenerator={inputElementGenerator}
314326
minusMenuElement={minusMenuElement}
315327
logger={logger}
328+
onSubmitValueParser={onSubmitValueParser}
316329
/>);
317330
default:
318331
return null;

src/components/JsonObject.js

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -40,6 +40,7 @@ const propTypes = {
4040
beforeAddAction: PropTypes.func,
4141
beforeUpdateAction: PropTypes.func,
4242
logger: PropTypes.object.isRequired,
43+
onSubmitValueParser: PropTypes.func,
4344
};
4445
// Default props
4546
const defaultProps = {
@@ -264,6 +265,7 @@ class JsonObject extends Component {
264265
beforeAddAction,
265266
beforeUpdateAction,
266267
logger,
268+
onSubmitValueParser,
267269
} = this.props;
268270

269271
const { minus, plus, addForm, ul, delimiter } = getStyle(name, data, keyPath, deep, dataType);
@@ -305,6 +307,7 @@ class JsonObject extends Component {
305307
beforeAddAction={beforeAddAction}
306308
beforeUpdateAction={beforeUpdateAction}
307309
logger={logger}
310+
onSubmitValueParser={onSubmitValueParser}
308311
/>);
309312

310313
const startObject = '{';
@@ -327,6 +330,7 @@ class JsonObject extends Component {
327330
inputElementGenerator={inputElementGenerator}
328331
keyPath={keyPath}
329332
deep={deep}
333+
onSubmitValueParser={onSubmitValueParser}
330334
/></span>) :
331335
(<span>
332336
{plusMenuLayout} {minusElement}

src/components/JsonValue.js

Lines changed: 10 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -33,6 +33,7 @@ const propTypes = {
3333
inputElementGenerator: PropTypes.func,
3434
minusMenuElement: PropTypes.element,
3535
logger: PropTypes.object.isRequired,
36+
onSubmitValueParser: PropTypes.func,
3637
};
3738
// Default props
3839
const defaultProps = {
@@ -43,6 +44,7 @@ const defaultProps = {
4344
cancelButtonElement: <button>c</button>,
4445
inputElementGenerator: () => <input />,
4546
minusMenuElement: <span> - </span>,
47+
onSubmitValueParser: (isEditMode, keyPath, deep, name, value) => parse(value),
4648
};
4749

4850
/* ************************************* */
@@ -88,10 +90,10 @@ class JsonValue extends Component {
8890
}
8991

9092
handleEdit() {
91-
const { handleUpdateValue, originalValue, logger } = this.props;
92-
const { inputRef, name } = this.state;
93+
const { handleUpdateValue, originalValue, logger, onSubmitValueParser, keyPath } = this.props;
94+
const { inputRef, name, deep } = this.state;
9395

94-
const newValue = parse(inputRef.value);
96+
const newValue = onSubmitValueParser(true, keyPath, deep, name, inputRef.value);
9597

9698
const result = {
9799
value: newValue,
@@ -135,15 +137,17 @@ class JsonValue extends Component {
135137
cancelButtonElement,
136138
inputElementGenerator,
137139
minusMenuElement,
140+
keyPath: comeFromKeyPath,
138141
} = this.props;
139142

140-
const style = getStyle(name, value, keyPath, deep, dataType);
143+
const style = getStyle(name, originalValue, keyPath, deep, dataType);
141144
let result = null;
142145
let minusElement = null;
143-
const readOnlyResult = readOnly(name, value, keyPath, deep, dataType);
146+
const readOnlyResult = readOnly(name, originalValue, keyPath, deep, dataType);
144147

145148
if (editEnabled && !readOnlyResult) {
146-
const inputElement = inputElementGenerator(inputUsageTypes.VALUE, keyPath, deep, name, value, dataType);
149+
const inputElement =
150+
inputElementGenerator(inputUsageTypes.VALUE, comeFromKeyPath, deep, name, originalValue, dataType);
147151

148152
const editButtonElementLayout = React.cloneElement(editButtonElement, {
149153
onClick: this.handleEdit,

0 commit comments

Comments
 (0)