Add Tracks event: calypso_refer_visit_response

client/signup/main.jsx

@@ -217,13 +217,13 @@ class Signup extends React.Component {
 		const subId = parsedUrl.query.sid;
 
 		if ( affiliateId && ! isNaN( affiliateId ) ) {
-			this.props.trackAffiliateReferral( { affiliateId, campaignId, subId, urlPath } );
 			// Record the referral in Tracks
 			analytics.tracks.recordEvent( 'calypso_refer_visit', {
 				flow: this.props.flowName,
 				// The current page without any query params
 				page: `${ parsedUrl.host }${ parsedUrl.pathname }`,
 			} );
+			this.props.trackAffiliateReferral( { affiliateId, campaignId, subId, urlPath } );
 		}
 	}
 

client/state/data-layer/third-party/refer/index.js

@@ -3,17 +3,31 @@
 /**
  * External dependencies
  */
-import { noop } from 'lodash';
+import { pick } from 'lodash';
 
 /**
  * Internal dependencies
  */
-import { registerHandlers } from 'state/data-layer/handler-registry';
-import { dispatchRequestEx } from 'state/data-layer/wpcom-http/utils';
 import { http } from 'state/http/actions';
 import { AFFILIATE_REFERRAL } from 'state/action-types';
+import { recordTracksEvent } from 'state/analytics/actions';
+import { registerHandlers } from 'state/data-layer/handler-registry';
+import { dispatchRequestEx } from 'state/data-layer/wpcom-http/utils';
 
-const trackAffiliatePageLoad = action => {
+const whitelistedEventProps = [
+	'status',
+	'success',
+	'duplicate',
+	'description',
+	'cookie_id',
+	'vendor_id',
+	'affiliate_id',
+	'campaign_id',
+	'sub_id',
+	'referrer',
+];
+
+const fetch = action => {
 	const { affiliateId, campaignId, subId, urlPath } = action;
 
 	if ( ! affiliateId || isNaN( affiliateId ) ) {
@@ -38,12 +52,35 @@ const trackAffiliatePageLoad = action => {
 	);
 };
 
+const onSuccess = ( action, eventProps ) => {
+	return recordTracksEvent( 'calypso_refer_visit_response', eventProps );
+};
+
+const onError = ( action, error ) => {
+	if ( ! ( error && error.response && 'string' === typeof error.response.text ) ) {
+		return;
+	}
+
+	const response = JSON.parse( error.response.text );
+	if ( 'object' !== typeof response ) {
+		return;
+	}
+
+	return recordTracksEvent( 'calypso_refer_visit_response', {
+		...pick( response.data || {}, whitelistedEventProps ),
+		status: error.response.status || '',
+		success: response.success || '',
+		description: response.message || 'error',
+	} );
+};
+
+const fromApi = ( { status, body: { success, message, data } } ) => ( {
+	...pick( data, whitelistedEventProps ),
+	status: status || '',
+	success: success || '',
+	description: message || 'success',
+} );
+
 registerHandlers( 'state/data-layer/third-party/refer', {
-	[ AFFILIATE_REFERRAL ]: [
-		dispatchRequestEx( {
-			fetch: trackAffiliatePageLoad,
-			onSuccess: noop,
-			onError: noop,
-		} ),
-	],
+	[ AFFILIATE_REFERRAL ]: [ dispatchRequestEx( { fetch, fromApi, onSuccess, onError } ) ],
 } );