oxaliq/feature-change-applier
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

patch epochs hook update function for rule validation

Browse source
This commit is contained in:
Sorrel Bri 2019-11-30 14:39:10 -08:00
parent a23671d3f9
commit 4a76e08fad
2 changed files with 41 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

21
src/components/Epochs.js
View file

@ -3,23 +3,32 @@ import './Epochs.scss';
import SoundChangeSuite from './SoundChangeSuite';
const addEpoch = (e, props) => {
e.preventDefault()
let index = props.epochs.length + 1;
props.setEpochs([...props.epochs, {name: `epoch ${index}`, changes:['[+ feature]>[- feature]/_#']}])
}
const Epochs = props => {
const addEpoch = (e, props) => {
e.preventDefault()
let index = props.epochs.length + 1;
props.setEpochs([...props.epochs, {name: `epoch ${index}`, changes:['[+ feature]>[- feature]/_#']}])
}
const removeEpoch = (e, epochName) => {
e.preventDefault()
let newEpochs = props.epochs.filter(epoch => epoch.name !== epochName);
props.setEpochs(newEpochs)
}
const updateEpoch = (epoch, epochIndex) => {
let updatedEpochs = [...props.epochs]
updatedEpochs[epochIndex] = epoch
props.setEpochs(updatedEpochs)
}
return (
<div className="Epochs" data-testid="Epochs">
<h3>Sound Change Epochs</h3>
{props.epochs ? props.epochs.map((epoch, idx) => <SoundChangeSuite key={`epochname-${idx}`} epoch={epoch} removeEpoch={removeEpoch}/>) : <></>}
{props.epochs ? props.epochs.map((epoch, idx) => <SoundChangeSuite key={`epochname-${idx}`} epochIndex={idx} epoch={epoch} updateEpoch={updateEpoch} removeEpoch={removeEpoch}/>) : <></>}
<form onSubmit={e=>addEpoch(e, props)}>
<input type="submit" name="add-epoch" value="Add Epoch" ></input>
</form>

29
src/components/SoundChangeSuite.js
View file

@ -4,14 +4,37 @@ import './SoundChangeSuite.scss';
const SoundChangeSuite = props => {
const [ epoch, setEpoch ] = useState(props.epoch ? props.epoch : {name:'', changes:['']});
const changeHandler = (e,cb) => {
cb(e);
props.updateEpoch(epoch, props.epochIndex);
}
return (
<div className="SoundChangeSuite" data-testid={`${epoch.name}_SoundChangeSuite`}>
<h4>{epoch.name}</h4>
<form className="SoundChangeSuite__form" data-testid={`${epoch.name}_SoundChangeSuite_changes`}>
<textarea name="epoch" id="" cols="30" rows="1" value={epoch.name} onChange={e=>setEpoch({...epoch, name:e.target.value})} ></textarea>
<textarea name="changes" id="" cols="30" rows="10"
<textarea
name="epoch"
id="" cols="30" rows="1"
value={epoch.name}
onChange={e=>changeHandler(
e, () => setEpoch({...epoch, name:e.target.value})
)}
></textarea>
<textarea
name="changes"
id="" cols="30" rows="10"
value={epoch.changes.join('\n')}
onChange={e=>setEpoch({...epoch, changes:e.target.value.split(/\n/).map(change=>change === ' ' ? '[+ feature]>[- feature]/_#' : change)})}
onChange={e=> changeHandler(
e, ()=>setEpoch(
{...epoch, changes:e.target.value.split(/\n/).map(change=>change === ' '
? '[+ feature]>[- feature]/_#'
: change
)}
)
)}
></textarea>
</form>
<form onSubmit={e=>props.removeEpoch(e, epoch.name)}>