message: tracking screen name
diff: @@ -42,8 +42,20 @@ interface AppState {
  rootStore?: RootStore
  }
  +
  +/**
  + * This is the root component of our app.
  + */
  +export const App = () => {
  + const [rootStore, setRootStore] = useState(null)
  +
  + const routeNameRef = useRef();
  + const navigationRef = useRef();
  +
  // Gets the current screen from navigation state
  const getActiveRouteName = state => {
  + // console.tron.log({state})
  +
  const route = state.routes[state.index];
  if (route.state) {
  @@ -54,12 +66,6 @@ const getActiveRouteName = state => {
  return route.name;
  };
  -/**
  - * This is the root component of our app.
  - */
  -export const App = () => {
  - const [rootStore, setRootStore] = useState(null)
  -
  useEffect(() => {
  // FIXME there might be a better way to manage this notification
  Notifications.events().registerNotificationReceivedBackground((notification, completion) => {
  @@ -87,6 +93,21 @@ export const App = () => {
  fn()
  }, [])
  + React.useEffect(() => {
  + if (rootStore != null || navigationRef.current == undefined) {
  + return
  + }
  +
  + console.tron.log({navigationRef})
  +
  + // this is only accessible after this has been assigned, which is when we have
  + const state = navigationRef.current.getRootState();
  +
  + // Save the initial route name
  + routeNameRef.current = getActiveRouteName(state);
  + }, [rootStore]);
  +
  +
  /**
  * Are we allowed to exit the app? This is called when the back button
  * is pressed on android.
  @@ -111,13 +132,22 @@ export const App = () => {
  const { navigationStore, ...otherStores } = rootStore
  - // otherwise, we're ready to render the app
  - // wire stores defined in root-store.ts file
  -
  return (
  <Provider rootStore={rootStore} navigationStore={navigationStore} {...otherStores}>
  <BackButtonHandler canExit={canExit}>
  - <NavigationContainer>
  + <NavigationContainer
  + ref={navigationRef}
  + onStateChange={state => {
  + const previousRouteName = routeNameRef.current;
  + const currentRouteName = getActiveRouteName(state);
  +
  + if (previousRouteName !== currentRouteName) {
  + analytics().setCurrentScreen(currentRouteName, currentRouteName);
  + }
  +
  + // Save the current route name for later comparision
  + routeNameRef.current = currentRouteName;
  + }}>
  {/* <StatefulNavigator> */}
  <RootStack />
  {/* <StatefulNavigator /> */}
  