[resumes][chore] add GA for resumes review page

apps/portal/src/components/resumes/browse/ResumeListItem.tsx

@@ -10,6 +10,8 @@ import {
 } from '@heroicons/react/20/solid';
 import { ChatBubbleLeftIcon, StarIcon } from '@heroicons/react/24/outline';
 
+import { useGoogleAnalytics } from '~/components/global/GoogleAnalytics';
+
 import type {
   ExperienceFilter,
   LocationFilter,
@@ -30,8 +32,17 @@ type Props = Readonly<{
 }>;
 
 export default function ResumeListItem({ href, resumeInfo }: Props) {
+  const { event: gaEvent } = useGoogleAnalytics();
   return (
-    <Link href={href}>
+    <Link
+      href={href}
+      onClick={() =>
+        gaEvent({
+          action: 'resumes.listitem_click',
+          category: 'engagement',
+          label: 'Select Resume',
+        })
+      }>
       <div className="grid grid-cols-8">
         <div className="col-span-7 grid gap-4 border-b border-slate-200 p-4 hover:bg-slate-100 sm:grid-cols-7">
           <div className="sm:col-span-4">

apps/portal/src/pages/resumes/index.tsx

@@ -20,6 +20,7 @@ import {
   TextInput,
 } from '@tih/ui';
 
+import { useGoogleAnalytics } from '~/components/global/GoogleAnalytics';
 import ResumeFilterPill from '~/components/resumes/browse/ResumeFilterPill';
 import ResumeListItems from '~/components/resumes/browse/ResumeListItems';
 import ResumeSignInButton from '~/components/resumes/shared/ResumeSignInButton';
@@ -135,6 +136,7 @@ export default function ResumeHomePage() {
     role: false,
   });
   const [mobileFiltersOpen, setMobileFiltersOpen] = useState(false);
+  const { event: gaEvent } = useGoogleAnalytics();
 
   const skip = (currentPage - 1) * PAGE_LIMIT;
   const isSearchOptionsInit = useMemo(() => {
@@ -279,6 +281,11 @@ export default function ResumeHomePage() {
         ),
       });
     }
+    gaEvent({
+      action: 'resumes.filter_checkbox_click',
+      category: 'engagement',
+      label: 'Select Filter',
+    });
   };
 
   const onClearFilterClick = (filterSection: FilterId) => {
@@ -296,11 +303,21 @@ export default function ResumeHomePage() {
     setShortcutSelected(shortcutName);
     setSortOrder(shortcutSortOrder);
     setUserFilters(shortcutFilters);
+    gaEvent({
+      action: 'resumes.shortcut_button_click',
+      category: 'engagement',
+      label: `Select Shortcut: ${shortcutName}`,
+    });
   };
 
   const onTabChange = (tab: string) => {
     setTabsValue(tab);
     setCurrentPage(1);
+    gaEvent({
+      action: 'resumes.tab_click',
+      category: 'engagement',
+      label: `Select Tab: ${tab}`,
+    });
   };
 
   const getTabQueryData = () => {
@@ -631,6 +648,13 @@ export default function ResumeHomePage() {
                     type="text"
                     value={searchValue}
                     onChange={setSearchValue}
+                    onFocus={() =>
+                      gaEvent({
+                        action: 'resumes.search_input_focus',
+                        category: 'engagement',
+                        label: 'Click Search',
+                      })
+                    }
                   />
                 </div>
                 <DropdownMenu