@react-native-firebase/analytics 20.1.0 → 20.2.0

package/CHANGELOG.md

@@ -3,6 +3,12 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [20.2.0](https://github.com/invertase/react-native-firebase/compare/v20.1.0...v20.2.0) (2024-07-15)
+
+### Features
+
+- **other:** Add analytics support ([#7899](https://github.com/invertase/react-native-firebase/issues/7899)) ([cbdf9ec](https://github.com/invertase/react-native-firebase/commit/cbdf9ec78452a73751d1afeca428842898f63134))
+
 ## [20.1.0](https://github.com/invertase/react-native-firebase/compare/v20.0.0...v20.1.0) (2024-06-04)
 
 **Note:** Version bump only for package @react-native-firebase/analytics

package/lib/index.js

@@ -33,8 +33,10 @@ import {
   FirebaseModule,
   getFirebaseRoot,
 } from '@react-native-firebase/app/lib/internal';
+import { setReactNativeModule } from '@react-native-firebase/app/lib/internal/nativeModule';
 import { isBoolean } from '@react-native-firebase/app/lib/common';
 
+import fallBackModule from './web/RNFBAnalyticsModule';
 import version from './version';
 import * as structs from './structs';
 
@@ -828,3 +830,6 @@ export default createModuleNamespace({
 // analytics().logEvent(...);
 // firebase.analytics().logEvent(...);
 export const firebase = getFirebaseRoot();
+
+// Register the interop module for non-native platforms.
+setReactNativeModule(nativeModuleName, fallBackModule);

package/lib/version.js

@@ -1,2 +1,2 @@
 // Generated by genversion.
-module.exports = '20.1.0';
+module.exports = '20.2.0';

package/lib/web/RNFBAnalyticsModule.android.js

@@ -0,0 +1,2 @@
+// No-op for android.
+export default {};

package/lib/web/RNFBAnalyticsModule.ios.js

@@ -0,0 +1,2 @@
+// No-op for ios.
+export default {};

package/lib/web/RNFBAnalyticsModule.js

@@ -0,0 +1,119 @@
+import { getApp } from '@react-native-firebase/app/lib/internal/web/firebaseApp';
+import { guard } from '@react-native-firebase/app/lib/internal/web/utils';
+
+import { AnalyticsApi } from './api';
+
+let analyticsInstances = {};
+
+function getAnalyticsApi() {
+  const app = getApp('[DEFAULT]');
+  const measurementId = app.options.measurementId;
+  if (!measurementId) {
+    // eslint-disable-next-line no-console
+    console.warn(
+      'No measurement id found for Firebase Analytics. Analytics will be unavailable. Have you set gaTrackingId in your Firebase config?',
+    );
+  }
+  if (!analyticsInstances[measurementId]) {
+    analyticsInstances[measurementId] = new AnalyticsApi('[DEFAULT]', measurementId);
+    if (global.RNFBDebug) {
+      analyticsInstances[measurementId].setDebug(true);
+    }
+  }
+  return analyticsInstances[measurementId];
+}
+
+/**
+ * This is a 'NativeModule' for the web platform.
+ * Methods here are identical to the ones found in
+ * the native android/ios modules e.g. `@ReactMethod` annotated
+ * java methods on Android.
+ */
+export default {
+  logEvent(name, params) {
+    return guard(async () => {
+      const api = getAnalyticsApi('[DEFAULT]');
+      api.logEvent(name, params);
+      return null;
+    });
+  },
+
+  setUserId(userId) {
+    return guard(async () => {
+      const api = getAnalyticsApi('[DEFAULT]');
+      api.setUserId(userId);
+      return null;
+    });
+  },
+
+  setUserProperty(key, value) {
+    return guard(async () => {
+      const api = getAnalyticsApi('[DEFAULT]');
+      api.setUserProperty(key, value);
+      return null;
+    });
+  },
+
+  setUserProperties(properties) {
+    return guard(async () => {
+      const api = getAnalyticsApi('[DEFAULT]');
+      api.setUserProperties(properties);
+      return null;
+    });
+  },
+
+  setDefaultEventParameters(params) {
+    return guard(async () => {
+      const api = getAnalyticsApi('[DEFAULT]');
+      api.setDefaultEventParameters(params);
+      return null;
+    });
+  },
+
+  setConsent(consent) {
+    return guard(async () => {
+      const api = getAnalyticsApi('[DEFAULT]');
+      // TODO currently we only support ad_personalization
+      if (consent && consent.ad_personalization) {
+        api.setConsent({ ad_personalization: consent.ad_personalization });
+      }
+      return null;
+    });
+  },
+
+  setAnalyticsCollectionEnabled(enabled) {
+    return guard(async () => {
+      const api = getAnalyticsApi('[DEFAULT]');
+      api.setAnalyticsCollectionEnabled(enabled);
+      return null;
+    });
+  },
+
+  resetAnalyticsData() {
+    // Unsupported for web.
+    return guard(async () => {
+      return null;
+    });
+  },
+
+  setSessionTimeoutDuration() {
+    // Unsupported for web.
+    return guard(async () => {
+      return null;
+    });
+  },
+
+  getAppInstanceId() {
+    // Unsupported for web.
+    return guard(async () => {
+      return null;
+    });
+  },
+
+  getSessionId() {
+    // Unsupported for web.
+    return guard(async () => {
+      return null;
+    });
+  },
+};

package/lib/web/api.js

@@ -0,0 +1,297 @@
+/* eslint-disable no-console */
+import {
+  getApp,
+  getId,
+  onIdChange,
+  getInstallations,
+  makeIDBAvailable,
+} from '@react-native-firebase/app/lib/internal/web/firebaseInstallations';
+import { isNumber } from '@react-native-firebase/app/lib/common';
+
+/**
+ * Generates a Google Analytics client ID.
+ * @returns {string} The generated client ID.
+ */
+function generateGAClientId() {
+  const randomNumber = Math.round(Math.random() * 2147483647);
+  // TODO: Don't seem to need this for now.
+  // var hash = 1;
+  // if (seed) {
+  //   for (var i = seed.length - 1; i >= 0; i--) {
+  //     var char = seed.charCodeAt(i);
+  //     hash = ((hash << 6) & 268435455) + char + (char << 14);
+  //     var flag = hash & 266338304;
+  //     hash = flag !== 0 ? hash ^ (flag >> 21) : hash;
+  //   }
+  // }
+  // const randomPart = seed ? String(randomNumber ^ (hash & 2147483647)) : String(randomNumber);
+  const randomPart = String(randomNumber);
+  const timestamp = Math.round(Date.now() / 1000);
+  return randomPart + '.' + timestamp;
+}
+
+class AnalyticsApi {
+  constructor(appName, measurementId) {
+    this.appName = appName;
+    this.measurementId = measurementId;
+    this.eventQueue = [];
+    this.queueTimer = null;
+    this.queueInterval = 250;
+    this.defaultEventParameters = {};
+    this.userId = null;
+    this.userProperties = {};
+    this.consent = {};
+    this.analyticsCollectionEnabled = true;
+    this.started = false;
+    this.installationId = null;
+    this.debug = false;
+    this.currentScreen = null;
+
+    // TODO this should be persisted once we have a way to do so in app internals
+    this.cid = generateGAClientId();
+    this._getInstallationId().catch(error => {
+      if (global.RNFBDebug) {
+        console.debug('[RNFB->Analytics][🔴] Error getting Firebase Installation Id:', error);
+      } else {
+        // No-op. This is a non-critical error.
+      }
+    });
+  }
+
+  setDefaultEventParameters(params) {
+    if (params === null || params === undefined) {
+      this.defaultEventParameters = {};
+    } else {
+      for (const [key, value] of Object.entries(params)) {
+        this.defaultEventParameters[key] = value;
+        if (value === null) {
+          delete this.defaultEventParameters[key];
+        }
+      }
+    }
+  }
+
+  setDebug(enabled) {
+    this.debug = enabled;
+  }
+
+  setUserId(userId) {
+    this.userId = userId;
+  }
+
+  setCurrentScreen(screenName) {
+    this.currentScreen = screenName;
+  }
+
+  setUserProperty(key, value) {
+    this.userProperties[key] = value;
+    if (value === null) {
+      delete this.userProperties[key];
+    }
+  }
+
+  setUserProperties(properties) {
+    for (const [key, value] of Object.entries(properties)) {
+      this.setUserProperty(key, value);
+    }
+  }
+
+  setConsent(consentSettings) {
+    this.consent = { ...this.consent, ...consentSettings };
+  }
+
+  setAnalyticsCollectionEnabled(enabled) {
+    this.analyticsCollectionEnabled = enabled;
+    if (!enabled) {
+      this._stopQueueProcessing();
+    } else {
+      this._startQueueProcessing();
+    }
+  }
+
+  logEvent(eventName, eventParams = {}) {
+    if (!this.analyticsCollectionEnabled) return;
+    this.eventQueue.push({
+      name: eventName,
+      params: { ...this.defaultEventParameters, ...eventParams },
+    });
+    this._startQueueProcessing();
+  }
+
+  async _getInstallationId() {
+    navigator.onLine = true;
+    makeIDBAvailable();
+    const app = getApp(this.appName);
+    const installations = getInstallations(app);
+    const id = await getId(installations);
+    if (global.RNFBDebug) {
+      console.debug('[RNFB->Analytics][📊] Firebase Installation Id:', id);
+    }
+    this.installationId = id;
+    onIdChange(installations, newId => {
+      this.installationId = newId;
+    });
+  }
+
+  _startQueueProcessing() {
+    if (this.started) return;
+    this.sessionId = Math.floor(Date.now() / 1000);
+    this.started = true;
+    this.queueTimer = setInterval(
+      () => this._processQueue().catch(console.error),
+      this.queueInterval,
+    );
+  }
+
+  _stopQueueProcessing() {
+    if (!this.started) return;
+    this.started = false;
+    clearInterval(this.queueTimer);
+  }
+
+  async _processQueue() {
+    if (this.eventQueue.length === 0) return;
+    const events = this.eventQueue.splice(0, 5);
+    await this._sendEvents(events);
+    if (this.eventQueue.length === 0) {
+      this._stopQueueProcessing();
+    }
+  }
+
+  async _sendEvents(events) {
+    for (const event of events) {
+      const queryParams = new URLSearchParams({
+        v: '2',
+        tid: this.measurementId,
+        en: event.name,
+        cid: this.cid,
+        pscdl: 'noapi',
+        sid: this.sessionId,
+        'ep.origin': 'firebase',
+        _z: 'fetch',
+        _p: '' + Date.now(),
+        _s: 1,
+        _ee: 1,
+        dma: 0,
+        tfd: Math.round(performance.now()),
+        are: 1,
+        sct: 2,
+        seg: 1,
+        frm: 0,
+      });
+
+      if (this.debug) {
+        queryParams.append('_dbg', '1');
+        queryParams.append('ep.debug_mode', '1');
+      }
+
+      if (this.consent && !this.consent.ad_personalization) {
+        queryParams.append('npa', '1');
+      } else {
+        queryParams.append('npa', '0');
+      }
+
+      if (this.userId) {
+        queryParams.append('uid', this.userId);
+      }
+
+      if (this.installationId) {
+        queryParams.append('_fid', this.installationId);
+      }
+
+      if (this.userProperties && Object.keys(this.userProperties).length > 0) {
+        for (const [key, value] of Object.entries(this.userProperties)) {
+          queryParams.append(`up.${key}`, `${value}`);
+        }
+      }
+
+      if (this.currentScreen) {
+        queryParams.append('ep.screen_name', this.currentScreen);
+        queryParams.append('ep.firebase_screen', this.currentScreen);
+      }
+
+      if (event.params && Object.keys(event.params).length > 0) {
+        // TODO we need to handle 'items' arrays and also key name conversions based on the following map;
+        // const keyConvert = {
+        //   item_id: 'id',
+        //   item_name: 'nm',
+        //   item_brand: 'br',
+        //   item_category: 'ca',
+        //   item_category2: 'c2',
+        //   item_category3: 'c3',
+        //   item_category4: 'c4',
+        //   item_category5: 'c5',
+        //   item_variant: 'va',
+        //   price: 'pr',
+        //   quantity: 'qt',
+        //   coupon: 'cp',
+        //   item_list_name: 'ln',
+        //   index: 'lp',
+        //   item_list_id: 'li',
+        //   discount: 'ds',
+        //   affiliation: 'af',
+        //   promotion_id: 'pi',
+        //   promotion_name: 'pn',
+        //   creative_name: 'cn',
+        //   creative_slot: 'cs',
+        //   location_id: 'lo',
+        //   id: 'id',
+        //   name: 'nm',
+        //   brand: 'br',
+        //   variant: 'va',
+        //   list_name: 'ln',
+        //   list_position: 'lp',
+        //   list: 'ln',
+        //   position: 'lp',
+        //   creative: 'cn',
+        // };
+        // items array should for example become:
+        //   pr1 for items[0]
+        //   pr2 for items[1]
+        //   ... etc
+        // with the format for each looking something like:
+        //   iditem_id~nmitem_name~britem_brand~caitem_category~c2item_category2~c3item_category3~c4item_category4~c5item_category5~vaitem_variant~prprice~qtquantity~cpcoupon~lnitem_list_name~lpindex~liitem_list_id~dsdiscount~afaffiliation~pipromotion_id~pnpromotion_name~cncreative_name~cscreative_slot~lolocation_id
+        for (const [key, value] of Object.entries(event.params)) {
+          if (isNumber(value)) {
+            queryParams.append(`epn.${key}`, `${value}`);
+          } else {
+            queryParams.append(`ep.${key}`, `${value}`);
+          }
+        }
+      }
+
+      try {
+        const url = `https://www.google-analytics.com/g/collect?${queryParams.toString()}`;
+        if (global.RNFBDebug) {
+          console.debug(`[RNFB-->Fetch][📊] Sending analytics call: ${url}`);
+        }
+        const response = await fetch(url, {
+          method: 'POST',
+          headers: {
+            accept: '*/*',
+            'accept-encoding': 'gzip, deflate, br',
+            'Content-Type': 'text/plain;charset=UTF-8',
+            'accept-language': 'en-US,en;q=0.9',
+            'cache-control': 'no-cache',
+            'content-length': '0',
+            origin: 'firebase',
+            pragma: 'no-cache',
+            'sec-fetch-dest': 'empty',
+            'sec-fetch-mode': 'no-cors',
+            'sec-fetch-site': 'cross-site',
+            'user-agent': 'react-native-firebase',
+          },
+        });
+        if (global.RNFBDebug) {
+          console.debug(`[RNFB<--Fetch][📊] Response: ${response.status}`);
+        }
+      } catch (error) {
+        if (global.RNFBDebug) {
+          console.debug('[RNFB<--Fetch][🔴] Error sending Analytics event:', error);
+        }
+      }
+    }
+  }
+}
+
+export { AnalyticsApi };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react-native-firebase/analytics",
-  "version": "20.1.0",
+  "version": "20.2.0",
   "author": "Invertase <oss@invertase.io> (http://invertase.io)",
   "description": "React Native Firebase - The analytics module provides out of the box support with Google Analytics for Firebase. Integration with the Android & iOS allows for in-depth analytical insight reporting, such as device information, location, user actions and more.",
   "main": "lib/index.js",
@@ -22,10 +22,10 @@
     "analytics"
   ],
   "peerDependencies": {
-    "@react-native-firebase/app": "20.1.0"
+    "@react-native-firebase/app": "20.2.0"
   },
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "99819b9cef23ac46080cbffe50cc85083305d04c"
+  "gitHead": "82c50138d07e673213cd8dee5ce9a2f9b5656649"
 }