add google anaylytics events for search and change tabs

kadena-community · Aug 28, 2023 · 104093a · 104093a
1 parent a47606d
commit 104093a
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 7 deletions.
diff --git a/packages/apps/docs/src/components/Search/Search.tsx b/packages/apps/docs/src/components/Search/Search.tsx
@@ -12,7 +12,7 @@ interface IProps {
 }
 
 export const Search: FC<IProps> = ({ query, hasScroll, limitResults }) => {
-  const [, setTabName] = useState<string | undefined>();
+  const [tabName, setTabName] = useState<string | undefined>();
   const {
     metadata = [],
     outputStream,
@@ -27,13 +27,18 @@ export const Search: FC<IProps> = ({ query, hasScroll, limitResults }) => {
     .map(mapMatches);
 
   useEffect(() => {
-    if (query !== undefined && query.trim() !== '') {
+    if (
+      query !== undefined &&
+      query.trim() !== '' &&
+      tabName !== undefined &&
+      tabName.trim() !== ''
+    ) {
       // eslint-disable-next-line @typescript-eslint/no-floating-promises
       handleSubmit(query);
-      analyticsEvent(EVENT_NAMES['click:search'], { query });
+      analyticsEvent(EVENT_NAMES['click:search'], { query, tabName });
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [query, handleSubmit]);
+  }, [query, tabName]);
 
   const onTabSelect = (tabName: string): void => {
     setTabName(tabName);

diff --git a/packages/apps/docs/src/components/Search/components/SearchResults.tsx b/packages/apps/docs/src/components/Search/components/SearchResults.tsx
@@ -70,13 +70,16 @@ export const SearchResults: FC<IProps> = ({
   };
 
   useEffect(() => {
-    const value = localStorage.getItem(TABNAME);
     setIsMounted(true);
-    if (value === null) return;
+  }, [setIsMounted]);
 
+  useEffect(() => {
+    const value = localStorage.getItem(TABNAME);
+    if (value === null) return;
     setSelectedTabName(value);
     onTabSelect(value);
-  }, [setSelectedTabName, setIsMounted, onTabSelect]);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [isMounted]);
 
   if (!isMounted) return null;
   return (