docs(Analytics): Adding examples for v23

docs/analytics/usage/index.md

@@ -55,22 +55,52 @@ Different event types require different parameters (some require no parameters,
 
 Below is an example showing how a custom event can be logged. Please be aware that primitive data types or arrays of primitive data types are logged in your Firebase Analytics console.
 
+For React Native Firebase <= v21
+
+```jsx
+import react, { useEffect } from "react";
+import { View, Button } from "react-native";
+import analytics from "@react-native-firebase/analytics";
+
+function App() {
+  return (
+    <View>
+      <Button
+        title="Add To Basket"
+        onPress={async () =>
+          await analytics().logEvent("basket", {
+            id: 3745092,
+            item: "mens grey t-shirt",
+            description: ["round neck", "long sleeved"],
+            size: "L",
+          })
+        }
+      />
+    </View>
+  );
+}
+```
+
+For React Native Firebase >= v22
+
 ```jsx
-import react, { useEffect } from 'react';
-import { View, Button } from 'react-native';
-import analytics from '@react-native-firebase/analytics';
+import react, { useEffect } from "react";
+import { View, Button } from "react-native";
+import { getAnalytics, logEvent } from "@react-native-firebase/analytics";
+
+const analytics = getAnalytics();
 
 function App() {
   return (
     <View>
       <Button
         title="Add To Basket"
         onPress={async () =>
-          await analytics().logEvent('basket', {
+          await logEvent(analytics, "basket", {
             id: 3745092,
-            item: 'mens grey t-shirt',
-            description: ['round neck', 'long sleeved'],
-            size: 'L',
+            item: "mens grey t-shirt",
+            description: ["round neck", "long sleeved"],
+            size: "L",
           })
         }
       />
@@ -88,10 +118,12 @@ articles in the Firebase Help Center.
 
 Below is a sample of how to use one of the predefined methods the Analytics module provides for you:
 
+For React Native Firebase <= v21
+
 ```jsx
-import react, { useEffect } from 'react';
-import { View, Button } from 'react-native';
-import analytics from '@react-native-firebase/analytics';
+import react, { useEffect } from "react";
+import { View, Button } from "react-native";
+import analytics from "@react-native-firebase/analytics";
 
 function App() {
   return (
@@ -102,8 +134,39 @@ function App() {
         // only accepts the two object properties which accept strings.
         onPress={async () =>
           await analytics().logSelectContent({
-            content_type: 'clothing',
-            item_id: 'abcd',
+            content_type: "clothing",
+            item_id: "abcd",
+          })
+        }
+      />
+    </View>
+  );
+}
+```
+
+For React Native Firebase >= v22
+
+```jsx
+import react, { useEffect } from "react";
+import { View, Button } from "react-native";
+import {
+  getAnalytics,
+  logSelectContent,
+} from "@react-native-firebase/analytics";
+
+const analytics = getAnalytics();
+
+function App() {
+  return (
+    <View>
+      <Button
+        title="Press me"
+        // Logs in the firebase analytics console as "select_content" event
+        // only accepts the two object properties which accept strings.
+        onPress={async () =>
+          await logSelectContent(analytics, {
+            content_type: "clothing",
+            item_id: "abcd",
           })
         }
       />
@@ -139,12 +202,26 @@ Below is an example showing how to retrieve the app instance id of the applicati
 if FirebaseAnalytics.ConsentType.ANALYTICS_STORAGE has been set to FirebaseAnalytics.ConsentStatus.DENIED and null on
 iOS if ConsentType.analyticsStorage has been set to ConsentStatus.denied.
 
+For React Native Firebase <= v21
+
 ```jsx
-import analytics from '@react-native-firebase/analytics';
+import analytics from "@react-native-firebase/analytics";
 // ...
 const appInstanceId = await analytics().getAppInstanceId();
 ```
 
+For React Native Firebase >= v22
+
+```jsx
+import {
+  getAnalytics,
+  getAppInstanceId,
+} from "@react-native-firebase/analytics";
+const analytics = getAnalytics();
+// ...
+const appInstanceId = await getAppInstanceId(analytics);
+```
+
 ### Web / Other platform instance id
 
 Ensure you have installed an Async Storage provider for Firebase to preserve the instance id. Failure to do so means the instance id will be reset every time the application terminates.
@@ -202,16 +279,32 @@ on the `firebase.json` file at the root of your project directory.
 
 To re-enable analytics (e.g. once you have the users consent), call the `setAnalyticsCollectionEnabled` method:
 
+For React Native Firebase <= v21
+
 ```js
-import { firebase } from '@react-native-firebase/analytics';
+import { firebase } from "@react-native-firebase/analytics";
 // ...
 await firebase.analytics().setAnalyticsCollectionEnabled(true);
 ```
 
+For React Native Firebase >= v22
+
+```js
+import {
+  getAnalytics,
+  setAnalyticsCollectionEnabled,
+} from "@react-native-firebase/analytics";
+const analytics = getAnalytics();
+// ...
+await setAnalyticsCollectionEnabled(analytics, true);
+```
+
 To update user's consent (e.g. once you have the users consent), call the `setConsent` method:
 
+For React Native Firebase <= v21
+
 ```js
-import { firebase } from '@react-native-firebase/analytics';
+import { firebase } from "@react-native-firebase/analytics";
 // ...
 await firebase.analytics().setConsent({
   analytics_storage: true,
@@ -221,6 +314,20 @@ await firebase.analytics().setConsent({
 });
 ```
 
+For React Native Firebase >= v22
+
+```js
+import { getAnalytics, setConsent } from "@react-native-firebase/analytics";
+const analytics = getAnalytics();
+// ...
+await setConsent(analytics, {
+  analytics_storage: true,
+  ad_storage: true,
+  ad_user_data: true,
+  ad_personalization: true,
+});
+```
+
 ## Disable screenview tracking
 
 Analytics automatically tracks some information about screens in your application, such as the class name of the UIViewController or Activity that is currently in focus.
@@ -263,14 +370,16 @@ This toggle must be set to the value you want before accessing the analytics ins
 
 For example, you might modify your index.js file like so:
 
+For React Native Firebase <= v21
+
 ```javascript
 /**
  * @format
  */
 
-import { AppRegistry } from 'react-native';
-import App from './App';
-import { name as appName } from './app.json';
+import { AppRegistry } from "react-native";
+import App from "./App";
+import { name as appName } from "./app.json";
 
 //    \/  Add these lines below
 // Enable debug mode for react-native-firebase:
@@ -279,3 +388,20 @@ if (__DEV__) globalThis.RNFBDebug = true;
 
 AppRegistry.registerComponent(appName, () => App);
 ```
+
+For React Native Firebase >= v22
+
+```javascript
+import { AppRegistry } from "react-native";
+import App from "./App";
+import { name as appName } from "./app.json";
+
+//    \/  Add these lines below
+import { setLogLevel } from "@react-native-firebase/app";
+
+// Enable debug mode for react-native-firebase v22:
+if (__DEV__) setLogLevel("debug"); // use 'debug' or 'verbose'
+//    /\  Add these lines above
+
+AppRegistry.registerComponent(appName, () => App);
+```