redux-namespace icon indicating copy to clipboard operation
redux-namespace copied to clipboard

Add value pipes

Open evanrs opened this issue 9 years ago • 2 comments

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.

evanrs avatar Feb 08 '16 02:02 evanrs

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.

evanrs avatar Feb 08 '16 02:02 evanrs

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')
  }
}

evanrs avatar Feb 08 '16 03:02 evanrs