Custom attributes

[maxbureac]

Can not find how to add custom attributes to the intercom settings via props is that possible or not. In intercom documentation it is just a field but in double quotes. Tried with passing in a prop named: custom_attributes, customAttributes, and within the user props as well

[nhagen]

You should be able to do this by passing in props to the Intercom component. For example:

const exampleAttributes = { pizza: "5" };

...
  <Intercom { ...exampleAttributes } appID="xyz" />
...

Can you provide examples of code thats not working?

[maxbureac]

import React from 'react';
import Intercom from 'react-intercom';
import {createContainer} from 'meteor/react-meteor-data';
import {Meteor} from 'meteor/meteor';

class IntercomApp extends React.Component {
    constructor(){
        super();
        this.state = {
            loading: true
        }
    }
    componentDidMount() {
        if(this.props.user && this.props.user.isPartner()){
            let loggedUser = this.props.user;
            let user = {
                user_id: loggedUser._id,
                email: loggedUser.emails[0].address,
                name: loggedUser.emails[0].address,
                custom_attributes: {
                    group: loggedUser.isPartner() ? 'Partner' :  loggedUser.isAdmin() ? 'Admin' : 'End customer',
                    phone: loggedUser.profile && loggedUser.profile.phone ? loggedUser.profile.phone : ''
                }
            };
            if (loggedUser.partner && loggedUser.partner.categories){
                Meteor.call('partner.get_intercom_info', (err, res) =>{
                    if (!err) {
                        _.extend(user.custom_attributes, {
                            "categories": loggedUser.partner.categories.join(', '),
                            "answeredQuoteRequests": res.answeredQuoteRequests.toString(),
                            "quoteRequests": res.quoteRequests.toString(),
                        })
                    }
                });
            }
            this.setState({
                user: user,
                loading: false
            })
        } else {
            this.setState({
                loading: false
            })
        }
    }
    render () {
        if (this.state.loading) {
            return null;
        }
        let loggedUser = this.props.user;
        if (loggedUser) {
            const user = this.state.user;
            if (loggedUser.isPartner()){
                return (
                    <Intercom appID="xmrn2mgf" { ...user }
                              customLauncherSelector=".custom-intercom-launcher"
                    />
                )
            }
            return (
                <Intercom appID="xmrn2mgf" { ...user } custom_launcher_selector=".custom-intercom-launcher"/>
            )
        }

        return (
            <Intercom appID="xmrn2mgf" custom_launcher_selector=".custom-intercom-launcher"/>
        )
    }
}
const IntercomAppConainer = createContainer((props = {}) => {

    return {
        user: Meteor.user()
    }
}, IntercomApp);

export default IntercomAppConainer;

don't look that for isPartner() is rendering the same thing the issue it is because some stuff still has to be done

[maxbureac]

also even if I don't put them inside an object for custom properties it is not working

[maxbureac]

figured out the issue, it was because I was changing the state of the user but didn't call the update. changed to fix it :)

[nhagen]

Glad you were able to work through it!