mixpanel / mixpanel-react-native

Official React Native Tracking Library for Mixpanel Analytics
https://mixpanel.com
Apache License 2.0
105 stars 44 forks source link

v3 is broken for React Native with custom storage #256

Open thoth-seshat opened 2 months ago

thoth-seshat commented 2 months ago

Adding another issue to highlight v3 being very broken as mentioned

here: https://github.com/mixpanel/mixpanel-react-native/issues/255 and here: https://github.com/mixpanel/mixpanel-react-native/issues/247

Running version 3.0.8 with MMVK

Here is my setup:

const storage = new MMKV({ id: "mixpanel" });

const MMKVStorageAdapter: MixpanelAsyncStorage = {
  getItem: async (key) => {
    return storage.getString(key) || null;
  },
  setItem: async (key, value) => {
    storage.set(key, value);
  },
  removeItem: async (key) => {
    storage.delete(key);
  },
};

const trackAutomaticEvents = true;
const useNative = true;
const mixpanel_api_key = process.env.EXPO_MIXPANEL_API_KEY ?? "";
const mixpanel = new Mixpanel(
  mixpanel_api_key,
  trackAutomaticEvents,
  useNative,
  MMKVStorageAdapter,
);

function useMixpanel() {
  useEffect(() => {
    if (mixpanel_api_key) {
      mixpanel.init();
    } else {
      Sentry.captureMessage("Mixpanel API key not found when starting the app");
    }
  }, [mixpanel_api_key]);
}

Also note that this will throw a TS error on the useNative field. Setting it to false doesn't throw an error but will still break the app.