reactotronContext.jsx

import { transform, isEqual, isObject } from "lodash";
import Reactotron from "reactotron-react-native";

export const stateChanges = (object: any, base: any): Object => {
  return transform(object, (result, value, key) => {
    if (!isEqual(value, base[key])) {
      // @ts-ignore
      result[key] =
        isObject(value) && isObject(base[key])
          ? stateChanges(value, base[key])
          : value;
    }
  });
};

export const consoleStateChanges = (prevState: any, newState: any) => {
  const current = stateChanges(newState, prevState);
  const prev = stateChanges(prevState, newState);
  const keysUpdated = Object.keys(current);
  Reactotron.display({
    name: "Context State Change",
    value: { current, prev },
    preview: keysUpdated.join(", ")
  });
};

// Usage
componentDidUpdate(prevProps: Props, prevState: State) {
  if (__DEV__) {
    consoleStateChanges(prevState, this.state);
  }
}