flagsFeature Flags enable dynamic feature control and A/B testing capabilities.
This property is lazy-loaded to avoid unnecessary initialization until first access.
-
Native Mode Only: Feature flags are currently only available when using native mode
-(iOS/Android). JavaScript mode (Expo/React Native Web) support is planned for a future release.
+
Feature flags work in both native mode (iOS/Android) and JavaScript mode (Expo/React Native Web).
+In JavaScript mode, use Flags#updateContext to update targeting context at runtime.
@@ -210,7 +210,7 @@
The base URL used for Mixpanel API requests.
- Use "https://api-eu.mixpanel.com" for EU data residency. See setServerURL()
+ Must match your project's data residency region:
+ US (default): "https://api.mixpanel.com",
+ EU: "https://api-eu.mixpanel.com",
+ India: "https://api-in.mixpanel.com". See setServerURL()
@@ -2339,7 +2342,8 @@
Properties
Context properties used for feature flag targeting.
- Can include user properties, device properties, or any custom properties for flag evaluation.
+ Use the `custom_properties` key to nest targeting properties
+ (e.g., `context: { custom_properties: { user_tier: 'premium' } }`).
Note: In native mode, context must be set during initialization and cannot be updated later.
Set the base URL used for Mixpanel API requests.
Useful if you need to proxy Mixpanel requests. Defaults to https://api.mixpanel.com.
-To route data to Mixpanel's EU servers, set to https://api-eu.mixpanel.com
+Must match your project's data residency region:
+US (default): https://api.mixpanel.com, EU: https://api-eu.mixpanel.com,
+India: https://api-in.mixpanel.com
Note: Starting from v3.2.0, @react-native-async-storage/async-storage is a peer dependency. This allows your project to use either v1.x or v2.x, avoiding conflicts with frameworks like Expo 52+.
+
+
Under your application's ios folder, run
pod install
Please note: You do not need to update your Podfile to add Mixpanel.
-
+
Since Xcode 12.5, there is a known swift compile issue, please refer to this workaround. However the compile issue has been resolved in Xcode 13.2.1+, there is no extra step required as long as you upgrade to Xcode 13.2.1+.
2. Initialize Mixpanel
@@ -135,29 +143,8 @@
Complete Code Example
export default SampleApp;
-
Feature Flags (Beta - 3.2.0-beta.1+)
-
Control features dynamically and run A/B tests with Mixpanel Feature Flags. Native mode only (iOS/Android) in beta.
Please see the documentation for how to integrate with Mixpanel feature flags.
Expo and React Native for Web support (3.0.2 and above)
Starting from version 3.0.2, we have introduced support for Expo, React Native for Web, and other platforms utilizing React Native that do not support iOS and Android directly.
To enable this feature,
@@ -218,13 +205,13 @@
import packageJson from "./package.json";
const {MixpanelReactNative} = NativeModules;
import MixpanelMain from "mixpanel-react-native/javascript/mixpanel-main"
+import { MixpanelLogger } from "mixpanel-react-native/javascript/mixpanel-logger"
const DevicePlatform = {
Unknown: "Unknown",
@@ -95,11 +96,10 @@
Source: index.js
* <p>Feature Flags enable dynamic feature control and A/B testing capabilities.
* This property is lazy-loaded to avoid unnecessary initialization until first access.
*
- * <p><b>Native Mode Only:</b> Feature flags are currently only available when using native mode
- * (iOS/Android). JavaScript mode (Expo/React Native Web) support is planned for a future release.
+ * <p>Feature flags work in both native mode (iOS/Android) and JavaScript mode (Expo/React Native Web).
+ * In JavaScript mode, use {@link Flags#updateContext} to update targeting context at runtime.
*
* @return {Flags} an instance of Flags that provides access to feature flag operations
- * @throws {Error} if accessed in JavaScript mode (when native modules are not available)
*
* @example
* // Check if flags are ready
@@ -114,18 +114,19 @@
Source: index.js
* @see Flags
*/
get flags() {
- // Short circuit for JavaScript mode - flags not ready for public use
- if (this.mixpanelImpl !== MixpanelReactNative) {
- throw new Error(
- "Feature flags are only available in native mode. " +
- "JavaScript mode support is coming in a future release."
- );
- }
-
if (!this._flags) {
+ // Check if feature flags are enabled and warn if not
+ if (!this.featureFlagsOptions || !this.featureFlagsOptions.enabled) {
+ MixpanelLogger.warn(
+ this.token,
+ "Accessing feature flags API but flags are not enabled. " +
+ "Call init() with featureFlagsOptions.enabled = true to enable feature flags. " +
+ "Flag methods will return fallback values."
+ );
+ }
// Lazy load the Flags instance with proper dependencies
const Flags = require("./javascript/mixpanel-flags").Flags;
- this._flags = new Flags(this.token, this.mixpanelImpl, this.storage);
+ this._flags = new Flags(this.token, this.mixpanelImpl);
}
return this._flags;
}
@@ -141,13 +142,17 @@
Source: index.js
* @param {object} [superProperties={}] A Map containing the key value pairs of the super properties to register.
* These properties will be sent with every event. Pass {} if no super properties needed.
* @param {string} [serverURL="https://api.mixpanel.com"] The base URL used for Mixpanel API requests.
- * Use "https://api-eu.mixpanel.com" for EU data residency. See setServerURL()
+ * Must match your project's data residency region:
+ * US (default): "https://api.mixpanel.com",
+ * EU: "https://api-eu.mixpanel.com",
+ * India: "https://api-in.mixpanel.com". See setServerURL()
* @param {boolean} [useGzipCompression=false] Whether to use gzip compression for network requests.
* Enabling this reduces bandwidth usage but adds slight CPU overhead.
* @param {object} [featureFlagsOptions={}] Feature flags configuration object with the following properties:
* @param {boolean} [featureFlagsOptions.enabled=false] Whether to enable feature flags functionality
* @param {object} [featureFlagsOptions.context={}] Context properties used for feature flag targeting.
- * Can include user properties, device properties, or any custom properties for flag evaluation.
+ * Use the `custom_properties` key to nest targeting properties
+ * (e.g., `context: { custom_properties: { user_tier: 'premium' } }`).
* Note: In native mode, context must be set during initialization and cannot be updated later.
* @returns {Promise<void>} A promise that resolves when initialization is complete
*
@@ -162,8 +167,10 @@
/**
* Set the base URL used for Mixpanel API requests.
* Useful if you need to proxy Mixpanel requests. Defaults to https://api.mixpanel.com.
- * To route data to Mixpanel's EU servers, set to https://api-eu.mixpanel.com
+ * Must match your project's data residency region:
+ * US (default): https://api.mixpanel.com, EU: https://api-eu.mixpanel.com,
+ * India: https://api-in.mixpanel.com
*
* @param {string} serverURL the base URL used for Mixpanel API requests
*
@@ -654,7 +663,13 @@
Source: index.js
Useful for clearing data when a user logs out.
*/
reset() {
- this.mixpanelImpl.reset(this.token);
+ this.mixpanelImpl.reset(this.token).then(() => {
+ if (this._flags) {
+ this._flags.reset().catch((error) => {
+ MixpanelLogger.log(this.token, "Flags reset failed:", error);
+ });
+ }
+ });
}
/**
@@ -1127,13 +1142,13 @@
