Skip to content

Conversation

@jaredmixpanel
Copy link
Collaborator

@jaredmixpanel jaredmixpanel commented Dec 5, 2025

  • Added Feature Flags UI and API calls to MixpanelExpo sample
  • Implemented environment variable management with react-native-dotenv
  • Enhanced Mixpanel request handling with GET/POST support
  • Added cross-platform UUID generation fallback
  • Improved initialization promise handling
  • Configured Mixpanel initialization with AsyncStorage support

This is part 3 of 3 in a stack made with GitButler:

Upgrade AsyncStorage to latest version, add react-native-dotenv
for environment variable management, and update package-lock.json
with corresponding dependency changes.
Provide a cross-platform UUID v4 generator to avoid requiring the uuid module in environments where it may be unavailable (fixes "Could not generate traceparent (UUID unavailable): Requiring unknown module \"undefined\"" errors). The change adds generateUUID() which tries the uuid package, then the Web Crypto API (crypto.randomUUID), and finally a Math.random-based fallback, and uses it when creating device IDs in MixpanelPersistent.
Return the Promise from initializationCompletePromise so callers can await
initialization. Previously the function created a Promise.all but did not
return it, meaning callers couldn't know when identity, super properties
and time events had finished loading. This change fixes that by returning
Promise.all([...]) so the initialization flow can be awaited and errors
propagated.
Improve Mixpanel network request handling by:
- Adding support for GET and POST requests
- Implementing different error handling for GET/POST
- Refining retry logic based on request type
- Improving logging and error reporting
- Ensuring more robust network communication
Include headers and proper query separator in network requests

Allow custom headers and correct URL query concatenation in network layer to support authenticated flag requests and avoid malformed URLs. This adds an optional headers parameter to sendRequest, merges headers into POST requests and includes them for GET requests, and chooses '?' or '&' depending on existing query params. These changes enable sending Authorization (Basic) headers for the /flags endpoint (fixing CORS/401 issues) and ensure ip query is appended correctly.
Enable Feature Flags during Mixpanel initialization and add a new "Feature Flags" section with buttons that exercise the Flags API (loadFlags, check ready, sync/async getVariant, getVariantValue, isEnabled). This brings the MixpanelExpo sample in line with the MixpanelStarter app so QA can manually test Feature Flags behavior in the Expo sample app.
Enable JS feature flags via env and dotenv plugin

Allow enabling Mixpanel JavaScript-mode feature flags through an environment
variable to avoid the runtime error about flags only being available in
native mode. Add a .env file with MIXPANEL_ENABLE_JS_FLAGS and MIXPANEL_TOKEN
for local testing, and configure babel to load .env values via
react-native-dotenv so the env variables are available in JS.
Initialize Mixpanel asynchronously and load token from env

Initialize Mixpanel in a useEffect with the MIXPANEL_TOKEN from .env and show a loading state until initialization completes. This fixes the "Failed to load flags: Feature flags are not initialized" error by ensuring feature flags are enabled only after the SDK has been initialized. Also switch to a ref-based Mixpanel instance, enable logging, and add a simple ActivityIndicator UI while initializing.

Changes:
- Load MIXPANEL_TOKEN from .env and update .env sample.
- Initialize Mixpanel asynchronously in useEffect and enable feature flags.
- Store Mixpanel instance in useRef and gate UI on initialization with ActivityIndicator.
- Minor style updates for loading layout.
Pass AsyncStorage to Mixpanel for feature flags

Fix initialization error "Feature flags are not initialized" when clicking "Load Flags" by supplying AsyncStorage to the Mixpanel constructor. This enables JavaScript-mode feature flags support so flags are properly initialized and can be loaded.

Changes:
- Import AsyncStorage from @react-native-async-storage/async-storage.
- Pass AsyncStorage as the fourth argument to new Mixpanel(...) when creating the instance.
- Leave feature-flag enabling call (mp.init) intact; this change provides the storage dependency needed for it to work.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants