Relay: [proposal] Curry higher order functions

[chollier]

It's a common practice to curry the higher order functions, lot of libraries do that and take the enhanced component as the last argument, this allows for easy composition.

### Example:

const Component = (props) => (
  <div>props.name</div>
);

const ComponentWithRedux = connect(... spec)(Component); 
const ComponentWithRadium = radium()(ComponentWithRedux);

// could also be written as
const EnhancedComponent = compose(
  radium(),
  connect(...spec...)
)(Component);

I've noticed that the new and compat API don't do that, hence I was wondering if it's something you would consider for the container functions ?

[kassens]

I like it, still holding my hopes up for decorators, but they seem to have trouble advancing to a more stable version.

[ekosz]

@chollier You should be able to write your own HOC pretty easily I think:

// withRelayFragment.js
import { createFragmentContainer } from 'react-relay';

export default (fragmentOptions: FragmentOptions) => (Component: ReactComponent) => (
  createFragmentContainer(Component, fragmentOptions)
);

Then in a component file:

import withRelayFragment from '../from/somewhere/withRelayFragment';
import { compose, withState, pure } from 'recompose';

const View = <div />;

export default compose(
  withRelayFragment({
    foo: graphql`fragment View_foo on bar { id }`
  }),
  withState('a', 'setA', null),
  connect(connectConfig),
  pure,
)(View);  

@kassens Please correct me if I'm wrong. This is what we're doing with Relay 1. Would this confuse the relay-compiler in modern?

[josephsavona]

@ekosz That should work. The compiler looks for graphql tags, so as long as you don't mask those then it will work. Wrapping the createFragmentContainer call may affect Flow-typing of the container, though.

[ekosz]

@josephsavona Ah, that's unfortunate. But I've already noticed flow really doesn't like working with the compose in any form. If an app is using Relay heavily would you recommend staying away from that pattern if you want to play nice with the rest of the Relay toolset?

[josephsavona]

@ekosz I think this is more of an issue with typing the behavior of compose in general, rather than anything Relay specific. Currying containers seems fine so long as you're okay with the (admittedly probably small) overhead.

[chollier]

@ekosz yes I can of course create my own HoC, as a matter of fact I've just done so to be able to keep using recompose-relay with the "react-relay/import" import until they adapt it (https://github.com/acdlite/recompose/pull/340)

I was just wondering here if Relay would consider adopting the same kind of API with currying as a default

[dwwoelfel]

Will close this for now to clean up old issues. Please reopen if it's still important to you!

[crosscompile]

I would love curried HoCs to be the default, but if not it looks like relay-compose is a small library that adds this functionality.