redux-namespace
redux-namespace copied to clipboard
Add value pipes
The primary use case of redux-namespace is transient data in forms. Validation of those values could done by defining a pipeline on that value or namespace.
A primitive version could be a simple as:
function touched(value, key) {
return { touched: true }
}
function isNumber(value, key, meta) {
return {
isNumber: meta.touched ? /\d+/.test(value) : null
}
}
let result = pipe('someValue', touched, isNumber)
<input
className={pipe.touched ? pipe.isNumber ? "good" : "bad" : ""}
value={select('someValue')}
onChange={flow(property('e.value.assign'), assign('someValue'))}/>
But there's no advantage here, as pipe reduces a set of object properties, which can already be done without great effort.
Touched is not specific to forms, it would be useful to the purpose of the library #3
An alternative api could provide methods to extend the namespace and how values are set.
import { connect, parameter, meta, pipe } form "redux-namespace";
@connect(
'someForm',
meta('someValue', 'isValid', isEmail)
// or perhaps
meta('someValue', { isValid: isEmail } ),
// or perhaps
pipe('validateEmail', isEmail)
)
class SomeForm extends Component {
render() {
let { select } = this.props;
select('someValue|validateEmail');
select('someValue@isValid')
}
}