pedronauck/react-adopt

Feature Request - Add support for static methods to be available in the composed component

russelh15 opened this issue · 2 comments

I have the following code

import React, { Component } from 'react'
import { adopt } from 'react-adopt'
import { AppConsumer } from '@context/AppContext'
import Layout from './Layout'

class OrderDetails extends Component {
  static navigationOptions = ({ navigation }) => ({
    headerTitle: 'Order'
  })

  render() {
    return this.props.render()
  }
}

const Composed = adopt({
  _app: <AppConsumer />,
  _orderDetails: props => <OrderDetails {...props} />
})

export default props => <Composed {...props}>{cProps => <Layout {...cProps} />}</Composed>

The static method is not executed when that code is run.

I'm able to get it working by using hoist-non-react-statics

The following works

import hoistNonReactStatics from 'hoist-non-react-statics'

const Final = props => <Composed {...props}>{cProps => <Layout {...cProps} />}</Composed>

export default hoistNonReactStatics(Final, OrderDetails)

Any chance you would be able to add support for allowing static methods to be available in the composed component?

Thanks for the awesome work on the plugin!

Hi @russelh15, sorry to late response, I was trying to figure out how I could do that since adopt method wasn't dealing with ComponentTypes on mapper. So, I just release a new version giving support to pass a component as mapper value and all statics methods from this component will be hoisting for composed component. Like this:

import { React } from 'react'
import { adopt } from 'adopt'
import { Value } from 'react-powerplug'

const Greeter = ({ render, name }) => render(`Hi ${name.value}`)

Greeter.sayHi = (name) => `Hi ${name}`

const Composed = adopt({
  name: <Value name="John" />
  greet: Greet
})

console.log(Composed.sayHi('John')) // Hi John

const App = () => (
  <Composed>
    {({ greet, name }) => /* ... */ }
  </Composed>
)

closes in favor of v0.6.0