Can't set custom button

[fdorantesm]

<FacebookLogin
    appId={process.env.REACT_APP_FACEBOOK_APP_ID}
    autoLoad={true}
    fields="name,email,picture,birthday"
    scope="public_profile,user_friends"
    callback={this.responseFacebook}
     render={renderProps => {
                      return(
                        <Button className="btn-facebook full-width-button mb-4"disabled={this.props.isWorking} onClick={e => this.props.socialLogin("/cart")} >
                          <FontAwesomeIcon size="lg" color="primary" icon={faFacebook} className="mr-2"/>Join with Facebook
                        </Button>
                      )
                    }}
                  />

It will be better if just render a single button with event handler.

[marius4896]

@fdorantesm make sure you import: import FacebookLogin from 'react-facebook-login/dist/facebook-login-render-props';

[chamupathiBlimpIT]

@marius4896 you saved me a lot of time. thanks

[VapiSoft]

It doesn't work for me. It doesn't compile and the error is "Unexpected token" and it points to the arraow =>

[gmarokov]

@fdorantesm make sure you import: import FacebookLogin from 'react-facebook-login/dist/facebook-login-render-props';

This doesn't work with TypeScript. Tried declaring types file for react-facebook-login/dist/facebook-login-render-props but that didn't work either.

[shrnayvi]

I know its a bit old question. But I am adding this reply so that it will help others who are having the issue:

After creating a folder "react-facebook-login/dist/facebook-login-render-props.d.ts", add following line of code: declare module 'react-facebook-login/dist/facebook-login-render-props'