TypeError: (0 , _analytics.analytics) is not a function) google analytics react native

Question

In react native app , I am using firebase google analytics.

The problem is in tracking screens, I follow this link , however I am having this error .

TypeError: (0 , _analytics.analytics) is not a function).

And the Screenshoot.

My appcontainer file (drawer.js) :

import { createDrawerNavigator } from 'react-navigation-drawer';
import { createAppContainer } from 'react-navigation';
import Feed  from '../components/Home';
import {FeedStack}  from './stack';
import React, { Component } from 'react';
import  {analytics }from '@react-native-firebase/analytics';

const MyDrawerNavigator = createDrawerNavigator(
 {
   Feed: FeedStack
 },
);

function getActiveRouteName(navigationState) {
     if (!navigationState) {
       return null;
     }
     const route = navigationState.routes[navigationState.index];

     if (route.routes) {
       return getActiveRouteName(route);
     }
     return route.routeName;
 }

const AppContainer =createAppContainer(MyDrawerNavigator);
export default () => {
    return <AppContainer
        onNavigationStateChange={(prevState, currentState, action) => {
            const currentRouteName = getActiveRouteName(currentState);
            const previousRouteName = getActiveRouteName(prevState);

            if (previousRouteName !== currentRouteName) {
      analytics().setCurrentScreen(currentRouteName, currentRouteName);
            }
          }}
    />
}

My app.js :

import Feed from './src/components/Home';
import HomePage from './src/components/homeEpaper';
import Navigator from './src/navigator/drawer';

import React, { Component } from 'react';


export default function App() {

    return (

      <Navigator />
    )

}

I tried also import analytics from '@react-native-firebase/analytics'; and i got this error. screenshot

Answer 1

if you're using setCurrentScreen method, then you need to use the following

package.jsom

"@react-native-firebase/analytics": "^10.4.0",
"@react-native-firebase/app": "^10.4.0",

Incorrect

import analytics from '@react-native-firebase/analytics';
.
.
.
analytics().setCurrentScreen('SignUpScreen');`

Correct

import analytics from '@react-native-firebase/analytics';
.
.
.
// Google Firebase Analytics
analytics().logScreenView({
    screen_name: 'SignUpScreen',
    screen_class: 'SignUpScreen'
});

Answer 2

I think that you didn't follow the docs 100% to the point :)

In your code you do:

import  {analytics }from '@react-native-firebase/analytics';

However if you look at this file: https://github.com/invertase/react-native-firebase/blob/master/packages/analytics/lib/index.js you'll see that there is no named export analytics. What you do when you type import {analytics} is importing a named export: https://developer.mozilla.org/en-US/docs/web/javascript/reference/statements/export

Since there is no named export analytics in that file the value for analytics is undefined and you get the error you describe.

I should type (as written in the linked example):

import analytics from '@react-native-firebase/analytics';

Answer 3

In new update setCurrentScreen is no longer present. Use other functions to log.