How to use react-facebook-pixel - 10 common examples

idCounter = idGenerator(
        typeof __idCounterCurrent !== undefined
          ? __idCounterCurrent
          : getMaxId(storedDraft),
      );
    } catch (error) {
      defaultFromDraft = null;
    }
    const defaultState = defaultFromDraft || defaultForm;

    this.setState({
      // eslint-disable-line react/no-did-mount-set-state
      ...defaultState,
    });

    ReactPixel.track('InitiateCheckout', {
      content_category: PIXEL_CONTENT_CATEGORY.VISIT_INTERVIEW_FORM,
    });
  }

componentDidUpdate(prevProps) {
    this.props.queryMenuIfUnfetched();
    this.props.queryEntryIfUnfetched(idSelector(this.props));

    // send Facebook Pixel 'ViewContent' event if goto reading another labor rights unit
    if (idSelector(prevProps) !== idSelector(this.props)) {
      ReactPixel.track('ViewContent', {
        content_ids: [idSelector(this.props)],
        content_category: PIXEL_CONTENT_CATEGORY.VIEW_LABOR_RIGHT,
      });
    }
  }

componentDidMount() {
    this.props.queryMenuIfUnfetched();
    this.props.queryEntryIfUnfetched(idSelector(this.props));
    this.props.fetchPermission();

    // send Facebook Pixel 'ViewContent' event
    ReactPixel.track('ViewContent', {
      content_ids: [this.props.match.params.id],
      content_category: PIXEL_CONTENT_CATEGORY.VIEW_LABOR_RIGHT,
    });
  }

componentDidMount() {
    const defaultState =
      getDefaultFormFromLocation(this.props.location) ||
      getDefaultFormFromDraft() ||
      defaultForm;

    this.setState({
      // eslint-disable-line react/no-did-mount-set-state
      ...defaultState,
    });

    ReactPixel.track('InitiateCheckout', {
      content_category: PIXEL_CONTENT_CATEGORY.VISIT_TIME_AND_SALARY_FORM,
    });
  }

export const initPixelConvTrkr = () => {
  ReactPixel.init("146019056346104");
}

import thunk from 'redux-thunk';
import { Route, Switch, HashRouter } from 'react-router-dom';
import { createStore, applyMiddleware } from 'redux';
import { Provider } from 'react-redux';
import RPCProvider from './components/RPCProvider';
import MessageBoxModal from './components/modals';
import withTracker from './components/withTracker';
import reducer from './reducers';
import env from './env.json';
import IcosList from './containers/IcosList';
import InnerIcoPage from './containers/InnerIcoPage';
import ICOStatsPage from './containers/ICOStatsPage';
import './assets/css/index.css';
import { IframeCssTweaker } from './components/IframeCssTweaker';

ReactPixel.init(env.fbPixelId);
ReactPixel.pageView();

const root = document.getElementById('root');

const render = (store) => {
  ReactDOM.render(

throw new Error(
    'Invalid google tracking ID. or set to UA-000000-01 if you dont have any'
  )
}
const fbPixelTrackingID = process.env.REACT_APP_FACEBOOK_TRACKING_ID
if (!fbPixelTrackingID) {
  throw new Error('Invalid facebook pixel tracking ID.')
}
GoogleAnalytics.initialize(trackingId)

const fbPixelAdvancedMatching = {}
const fbPixelOptions = {
  autoConfig: true,
  debug: false,
}
ReactPixel.init(fbPixelTrackingID, fbPixelAdvancedMatching, fbPixelOptions)

const withTracker = (WrappedComponent, options = {}) => {
  const trackPage = page => {
    GoogleAnalytics.set({
      page,
      ...options,
    })
    GoogleAnalytics.pageview(page)

    ReactPixel.pageView()
  }

  const HOC = class extends React.Component {
    componentDidMount() {
      const page = this.props.location.pathname
      trackPage(page)

import { Route, Switch, HashRouter } from 'react-router-dom';
import { createStore, applyMiddleware } from 'redux';
import { Provider } from 'react-redux';
import RPCProvider from './components/RPCProvider';
import MessageBoxModal from './components/modals';
import withTracker from './components/withTracker';
import reducer from './reducers';
import env from './env.json';
import IcosList from './containers/IcosList';
import InnerIcoPage from './containers/InnerIcoPage';
import ICOStatsPage from './containers/ICOStatsPage';
import './assets/css/index.css';
import { IframeCssTweaker } from './components/IframeCssTweaker';

ReactPixel.init(env.fbPixelId);
ReactPixel.pageView();

const root = document.getElementById('root');

const render = (store) => {
  ReactDOM.render(

response => {
          const count = response.queries_count;

          ReactGA.event({
            category: GA_CATEGORY.SHARE_TIME_SALARY,
            action: GA_ACTION.UPLOAD_SUCCESS,
          });
          ReactPixel.track('Purchase', {
            value: 1,
            currency: 'TWD',
            content_category: PIXEL_CONTENT_CATEGORY.UPLOAD_TIME_AND_SALARY,
          });

          return () => (
             {
                window.location.replace(
                  `/time-and-salary/campaigns/${campaignName}/latest`,
                );
              }}
            />

response => {
          const count = response.queries_count;

          ReactGA.event({
            category: GA_CATEGORY.SHARE_TIME_SALARY,
            action: GA_ACTION.UPLOAD_SUCCESS,
          });
          ReactPixel.track('Purchase', {
            value: 1,
            currency: 'TWD',
            content_category: PIXEL_CONTENT_CATEGORY.UPLOAD_TIME_AND_SALARY,
          });

          return () => (
             {
                window.location.replace('/salary-work-times/latest');
              }}
            />
          );
        },