From 7f22e1c34f0154d5a6bf446246ae8ab5ead21098 Mon Sep 17 00:00:00 2001
From: Pavel Meyer <meyerpavel1207@gmail.com>
Date: Wed, 10 Jul 2024 17:47:41 +0300
Subject: [PATCH] CW-performance-monitoring Added firebase performance
 monitoring

---
 src/pages/OldCommon/hooks/useCommonMembers.ts         |  6 ++++++
 .../hooks/useCases/useDiscussionMessagesById.ts       | 11 ++++++++++-
 src/shared/utils/firebase.tsx                         |  4 +++-
 3 files changed, 19 insertions(+), 2 deletions(-)

diff --git a/src/pages/OldCommon/hooks/useCommonMembers.ts b/src/pages/OldCommon/hooks/useCommonMembers.ts
index 34aa60f0e..3f16ad080 100644
--- a/src/pages/OldCommon/hooks/useCommonMembers.ts
+++ b/src/pages/OldCommon/hooks/useCommonMembers.ts
@@ -1,5 +1,6 @@
 import { useCallback, useRef, useState } from "react";
 import { useDispatch, useSelector } from "react-redux";
+import { trace } from "firebase/performance";
 import { CommonService, Logger, UserService } from "@/services";
 import { store } from "@/shared/appConfig";
 import { LoadingState } from "@/shared/interfaces";
@@ -10,6 +11,7 @@ import {
   selectUserStates,
 } from "@/store/states";
 import { useDeepCompareEffect } from "react-use";
+import { perf } from "@/shared/utils/firebase";
 
 interface Options {
   commonId?: string;
@@ -111,6 +113,9 @@ export const useCommonMembers = ({ commonId }: Options): Return => {
 
     (async () => {
       try {
+        const useCommonMembersTrace = trace(perf, 'useCommonMembers');
+        useCommonMembersTrace.start();
+
         const cachedUserStates = selectUserStates()(store.getState());
         const hasUsersFromCache = commonMembers.some(
           ({ userId }) => cachedUserStates[userId]?.data,
@@ -183,6 +188,7 @@ export const useCommonMembers = ({ commonId }: Options): Return => {
           };
         });
         dispatch(cacheActions.updateUserStates(fetchedUsers));
+        useCommonMembersTrace.stop();
       } catch (err) {
         Logger.error(err);
         setState((prevState) => ({
diff --git a/src/shared/hooks/useCases/useDiscussionMessagesById.ts b/src/shared/hooks/useCases/useDiscussionMessagesById.ts
index a2921fb4a..ca0348c33 100644
--- a/src/shared/hooks/useCases/useDiscussionMessagesById.ts
+++ b/src/shared/hooks/useCases/useDiscussionMessagesById.ts
@@ -1,6 +1,7 @@
 import { useState, useCallback } from "react";
 import { useDispatch, useSelector } from "react-redux";
 import { useDeepCompareEffect, useUpdateEffect } from "react-use";
+import { trace } from "firebase/performance";
 import {
   DiscussionMessageService,
   MESSAGES_NUMBER_IN_BATCH,
@@ -20,7 +21,7 @@ import {
   User,
 } from "@/shared/models";
 import { InternalLinkData } from "@/shared/utils";
-import firebase from "@/shared/utils/firebase";
+import firebase, { perf } from "@/shared/utils/firebase";
 import {
   cacheActions,
   selectDiscussionMessagesStateByDiscussionId,
@@ -153,6 +154,9 @@ export const useDiscussionMessagesById = ({
 
   const fetchRepliedMessages = useCallback(
     async (messageId: string, endDate: Date): Promise<void> => {
+      const fetchRepliedMessagesTrace = trace(perf, 'fetchRepliedMessagesTrace');
+      fetchRepliedMessagesTrace.start();
+
       if (state.data?.find((item) => item.id === messageId)) {
         return Promise.resolve();
       }
@@ -206,6 +210,7 @@ export const useDiscussionMessagesById = ({
           updatedDiscussionMessages: discussionsWithText,
         }),
       );
+      fetchRepliedMessagesTrace.stop();
     },
     [
       state.data,
@@ -239,6 +244,9 @@ export const useDiscussionMessagesById = ({
     }
 
     try {
+      const fetchDiscussionMessagesTrace = trace(perf, 'fetchDiscussionMessages');
+      fetchDiscussionMessagesTrace.start();
+
       DiscussionMessageService.subscribeToDiscussionMessagesByDiscussionId(
         discussionId,
         lastVisible && lastVisible[discussionId],
@@ -308,6 +316,7 @@ export const useDiscussionMessagesById = ({
           setIsBatchLoading(false);
         },
       );
+      fetchDiscussionMessagesTrace.stop();
     } catch(err) {
       setIsBatchLoading(false);
     }
diff --git a/src/shared/utils/firebase.tsx b/src/shared/utils/firebase.tsx
index b652bbd95..5ab2f677a 100644
--- a/src/shared/utils/firebase.tsx
+++ b/src/shared/utils/firebase.tsx
@@ -3,6 +3,7 @@ import "firebase/compat/auth";
 import "firebase/compat/firestore";
 import "firebase/compat/performance";
 import "firebase/compat/storage";
+import { getPerformance } from "firebase/performance";
 import { local } from "@/config";
 import { Environment, REACT_APP_ENV } from "@/shared/constants";
 import config from "../../config";
@@ -11,7 +12,7 @@ interface FirebaseError extends Error {
   code: string;
 }
 
-firebase.initializeApp(config.firebase);
+const app = firebase.initializeApp(config.firebase);
 
 if (REACT_APP_ENV === Environment.Local) {
   firebase.auth().useEmulator(local.firebase.authDomain);
@@ -33,6 +34,7 @@ if (REACT_APP_ENV === Environment.Local) {
     });
 }
 
+export const perf = getPerformance(app);
 // firebase.firestore.setLogLevel("debug");
 
 export const isFirebaseError = (error: any): error is FirebaseError =>