Test Firebase analytics

App.tsx

@@ -1,6 +1,6 @@
 import NetInfo from '@react-native-community/netinfo'
 import client from '@root/api/client'
-import { Index } from '@root/Index'
+import Index from '@root/Index'
 import { persistor, store } from '@root/store'
 import { resetLocal } from '@root/utils/slices/instancesSlice'
 import ThemeManager from '@utils/styles/ThemeManager'

app.config.ts

@@ -13,7 +13,7 @@ export default (): ExpoConfig => ({
   developmentClient: { silentLaunch: true },
   scheme: 'mastodonct',
   ios: {
-    bundleIdentifier: 'com.xmflsct.mastodon',
+    bundleIdentifier: 'com.xmflsct.app.mastodon',
     infoPlist: {
       CFBundleAllowMixedLocalizations: true
     },
@@ -21,7 +21,8 @@ export default (): ExpoConfig => ({
       image: './assets/splash.png',
       resizeMode: 'contain',
       backgroundColor: '#ffffff'
-    }
+    },
+    googleServicesFile: './configs/GoogleService-Info.plist'
   },
   // locales: {
   //   zh: {
@@ -31,5 +32,18 @@ export default (): ExpoConfig => ({
   //     CFBundleDisplayName: 'My Toots'
   //   }
   // },
-  assetBundlePatterns: ['assets/*']
+  assetBundlePatterns: ['assets/*'],
+  web: {
+    config: {
+      firebase: {
+        apiKey: 'AIzaSyAnvo0jyD1WB0tv2FLenz-CSDS-RgaWWR4',
+        authDomain: 'xmflsct-mastodon-app.firebaseapp.com',
+        projectId: 'xmflsct-mastodon-app',
+        storageBucket: 'xmflsct-mastodon-app.appspot.com',
+        messagingSenderId: '661638997772',
+        appId: '1:661638997772:web:1e7aab28be7dc06d9f8b29',
+        measurementId: 'G-3J0FS8WV5J'
+      }
+    }
+  }
 })

configs/GoogleService-Info.plist

@@ -0,0 +1,34 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
+<plist version="1.0">
+<dict>
+	<key>CLIENT_ID</key>
+	<string>661638997772-sqa4raeghhrieqt9guljhcul9b51dvna.apps.googleusercontent.com</string>
+	<key>REVERSED_CLIENT_ID</key>
+	<string>com.googleusercontent.apps.661638997772-sqa4raeghhrieqt9guljhcul9b51dvna</string>
+	<key>API_KEY</key>
+	<string>AIzaSyAOS1Yq_uNVctG89LB6Dl1PVhb_FAQRbRg</string>
+	<key>GCM_SENDER_ID</key>
+	<string>661638997772</string>
+	<key>PLIST_VERSION</key>
+	<string>1</string>
+	<key>BUNDLE_ID</key>
+	<string>com.xmflsct.app.mastodon</string>
+	<key>PROJECT_ID</key>
+	<string>xmflsct-mastodon-app</string>
+	<key>STORAGE_BUCKET</key>
+	<string>xmflsct-mastodon-app.appspot.com</string>
+	<key>IS_ADS_ENABLED</key>
+	<false></false>
+	<key>IS_ANALYTICS_ENABLED</key>
+	<false></false>
+	<key>IS_APPINVITE_ENABLED</key>
+	<true></true>
+	<key>IS_GCM_ENABLED</key>
+	<true></true>
+	<key>IS_SIGNIN_ENABLED</key>
+	<true></true>
+	<key>GOOGLE_APP_ID</key>
+	<string>1:661638997772:ios:30b6bc26a1c84b5a9f8b29</string>
+</dict>
+</plist>

package.json

@@ -24,6 +24,8 @@
     "expo-av": "~8.7.0",
     "expo-blur": "~8.2.2",
     "expo-crypto": "~8.4.0",
+    "expo-firebase-analytics": "~2.6.0",
+    "expo-firebase-core": "~1.3.0",
     "expo-gl": "~9.2.0",
     "expo-image-picker": "~9.2.0",
     "expo-linear-gradient": "~8.4.0",

src/Index.tsx

@@ -5,6 +5,7 @@ import {
   NavigationContainerRef
 } from '@react-navigation/native'
 
+import * as Analytics from 'expo-firebase-analytics'
 import React, { useEffect, useRef, useState } from 'react'
 import { StatusBar } from 'react-native'
 import Toast from 'react-native-toast-message'
@@ -46,7 +47,7 @@ export interface Props {
   localCorrupt: boolean
 }
 
-export const Index: React.FC<Props> = ({ localCorrupt }) => {
+const Index: React.FC<Props> = ({ localCorrupt }) => {
   const dispatch = useDispatch()
   const localInstance = useSelector(getLocalUrl)
   const { i18n } = useTranslation()
@@ -98,14 +99,14 @@ export const Index: React.FC<Props> = ({ localCorrupt }) => {
             })
           }
         })
-        .catch(() => {})
+        .catch(() => null)
   }, [])
 
   // On launch check if there is any unread noficiations
   const queryNotification = useInfiniteQuery(
-    ['Notifications', {}] as QueryKey.Timeline,
+    ['Notifications', {}],
     timelineFetch,
-    { enabled: localInstance ? true : false, cacheTime: 1000 * 30 }
+    { enabled: localInstance ? true : false }
   )
   const prevNotification = useSelector(getLocalNotification)
   useEffect(() => {
@@ -151,6 +152,9 @@ export const Index: React.FC<Props> = ({ localCorrupt }) => {
         ref={navigationRef}
         theme={themes[mode]}
         key={i18n.language}
+        onStateChange={state => {
+          Analytics.setCurrentScreen(state?.routes[state.index].name)
+        }}
       >
         <Tab.Navigator
           initialRouteName={localInstance ? 'Screen-Local' : 'Screen-Public'}
@@ -243,3 +247,5 @@ export const Index: React.FC<Props> = ({ localCorrupt }) => {
     </>
   )
 }
+
+export default React.memo(Index, () => true)

src/components/Timelines/Timeline.tsx

@@ -11,6 +11,8 @@ import TimelineEmpty from '@components/Timelines/Timeline/Empty'
 import TimelineEnd from '@components/Timelines/Timeline/Shared/End'
 import { useScrollToTop } from '@react-navigation/native'
 import { FlatList } from 'react-native-gesture-handler'
+import { useDispatch } from 'react-redux'
+import { updateNotification } from '@root/utils/slices/instancesSlice'
 
 export type TimelineData =
   | InfiniteData<{
@@ -83,6 +85,19 @@ const Timeline: React.FC<Props> = ({
     ? data.pages.flatMap(d => [d?.pinnedLength])
     : []
 
+  // Clear unread notification badge
+  const dispatch = useDispatch()
+  useEffect(() => {
+    if (page === 'Notifications' && flattenData.length) {
+      dispatch(
+        updateNotification({
+          unread: false,
+          latestTime: flattenData[0].created_at
+        })
+      )
+    }
+  }, [flattenData])
+
   const flRef = useRef<FlatList<any>>(null)
   useEffect(() => {
     if (toot && isSuccess) {

src/screens/Notifications.tsx

@@ -1,12 +1,11 @@
-import React, { useEffect } from 'react'
+import React from 'react'
 import { createNativeStackNavigator } from 'react-native-screens/native-stack'
 
 import Timeline from '@components/Timelines/Timeline'
 import sharedScreens from '@screens/Shared/sharedScreens'
-import { useDispatch, useSelector } from 'react-redux'
+import { useSelector } from 'react-redux'
 import { RootState } from '@root/store'
 import { useTranslation } from 'react-i18next'
-import { updateNotification } from '@root/utils/slices/instancesSlice'
 
 const Stack = createNativeStackNavigator()
 
@@ -16,12 +15,6 @@ const ScreenNotifications: React.FC = () => {
     (state: RootState) => state.instances.local.url
   )
 
-  // Clear notification unread, but keep the time
-  const dispatch = useDispatch()
-  useEffect(() => {
-    dispatch(updateNotification({ unread: false }))
-  }, [])
-
   return (
     <Stack.Navigator
       screenOptions={{

yarn.lock

@@ -4091,6 +4091,23 @@ expo-file-system@~9.3.0:
   dependencies:
     uuid "^3.4.0"
 
+expo-firebase-analytics@~2.6.0:
+  version "2.6.0"
+  resolved "https://registry.yarnpkg.com/expo-firebase-analytics/-/expo-firebase-analytics-2.6.0.tgz#6c549ed2dceecb22d7d7160034a00896963d38a3"
+  integrity sha512-ciLHxYKfS0Oih184ckVJyYj95fWvK+xfDXG9yOkpzow/NIf9snp8ziXSMyJTwFg93bNr3uqvKxk985LSvEPe9Q==
+  dependencies:
+    expo-firebase-core "~1.2.0"
+
+expo-firebase-core@~1.2.0:
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/expo-firebase-core/-/expo-firebase-core-1.2.0.tgz#1f41d777cb04e19f495d27491b1596bdeb233f95"
+  integrity sha512-ojqiJLlH5BXQsrElPOtYsO0tHR2333mRDxV625Y0NQyjFBF17NQxlmCCkyh2uGO94LgcZTfB13SMiNHOe9RcZQ==
+
+expo-firebase-core@~1.3.0:
+  version "1.3.0"
+  resolved "https://registry.yarnpkg.com/expo-firebase-core/-/expo-firebase-core-1.3.0.tgz#83da7f6454b710d55c0ddc3dfb3d9dd8506086ed"
+  integrity sha512-aSJymsdPU1qkq5f6hU+B+K+xOMMCKjnXnHWQ/2gdPcNvuoQdwMn6RYseIZ43/IXjL6LEnHY7VlANMtYEH2Wx5Q==
+
 expo-font@~8.4.0:
   version "8.4.0"
   resolved "https://registry.yarnpkg.com/expo-font/-/expo-font-8.4.0.tgz#7cb4cc9d852dd8d0977ce425146b94221b40c1d5"