Possible unreachable code in ValueSelector component

[nateplusplus]

While refactoring to TypeScript (#456), I noticed the property "array" is added in the following code snippet (Ln 153):

react-json-schema-form-builder/src/formBuilder/dependencies/ValueSelector.js

Lines 107 to 209 in 58ed4fc

	{
	{
	string: (
	<Input
	value={val || ''}
	placeholder='String value'
	type='string'
	onChange={(ev: any) => {
	const newVal = ev.target.value;
	const oldCombo = possibility.value.enum[index];
	onChange({
	...possibility,
	value: {
	enum: [
	...enumArr.slice(0, index),
	{ ...oldCombo, [key]: newVal },
	...enumArr.slice(index + 1),
	],
	},
	});
	}}
	className='card-modal-text'
	/>
	),
	number: (
	<Input
	value={val || ''}
	placeholder='Number value'
	type='number'
	onChange={(ev: any) => {
	const newVal = Number.parseFloat(ev.target.value);
	const oldCombo = possibility.value.enum[index];
	onChange({
	...possibility,
	value: {
	enum: [
	...enumArr.slice(0, index),
	{ ...oldCombo, [key]: newVal },
	...enumArr.slice(index + 1),
	],
	},
	});
	}}
	className='card-modal-number'
	/>
	),
	array: (
	<Input
	value={JSON.stringify(val) || ''}
	placeholder='Array in JSON'
	type='string'
	onChange={(ev: any) => {
	let newVal = val;
	try {
	newVal = JSON.parse(ev.target.value);
	} catch (error) {
	// eslint-disable-next-line no-console
	console.error('invalid JSON array input');
	}
	const oldCombo = possibility.value.enum[index];
	onChange({
	...possibility,
	value: {
	enum: [
	...enumArr.slice(0, index),
	{ ...oldCombo, [key]: newVal },
	...enumArr.slice(index + 1),
	],
	},
	});
	}}
	className='card-modal-text'
	/>
	),
	object: (
	<Input
	value={JSON.stringify(val) || ''}
	placeholder='Object in JSON'
	type='string'
	onChange={(ev: any) => {
	let newVal = val;
	try {
	newVal = JSON.parse(ev.target.value);
	} catch (error) {
	// eslint-disable-next-line no-console
	console.error('invalid JSON object input');
	}
	const oldCombo = possibility.value.enum[index];
	onChange({
	...possibility,
	value: {
	enum: [
	...enumArr.slice(0, index),
	{ ...oldCombo, [key]: newVal },
	...enumArr.slice(index + 1),
	],
	},
	});
	}}
	className='card-modal-text'
	/>
	),
	}[typeof val]

As I understand it, in this code, square brackets after the object are being used to dynamically compute a property name based on the type of data that the val variable holds. So if val is a string, it would return the value associated with the string property in the object.

However, if the val variable holds an array, JavaScript's typeof would return 'object', not 'array'.

For this reason, the code inside the array property of this object may not be reachable. It might be worth further testing to ensure there is no missing functionality here.