diff --git a/components/hero/hero.tsx b/components/hero/hero.tsx index 9ca6726..95cd26e 100644 --- a/components/hero/hero.tsx +++ b/components/hero/hero.tsx @@ -4,6 +4,7 @@ import { UNIVERSITY_GE } from "@/lib/constants"; import React, { ChangeEvent, FormEvent, useState } from "react"; import { FaChevronDown, FaSearch } from "react-icons/fa"; import { useRouter } from "next/navigation"; +import { analyticsEnum, logAnalytics } from "@/lib/analytics"; interface DropdownComponentProps { defaultValue: string; @@ -49,6 +50,16 @@ const Hero = () => { const handleSubmit = (e: FormEvent) => { e.preventDefault(); + + logAnalytics({ + category: analyticsEnum.search.title, + action: analyticsEnum.search.actions.SEARCH, + label: university, + value: UNIVERSITY_GE[university].findIndex((item) => { + return item.includes(ge); + }), + }); + router.push( `/search?uni=${encodeURIComponent( university, diff --git a/components/search/search.tsx b/components/search/search.tsx index c4e1c5d..f0089d4 100644 --- a/components/search/search.tsx +++ b/components/search/search.tsx @@ -12,6 +12,9 @@ import SearchBlurb from "./blurb"; import { filterData } from "./filterUtils"; import { UNIVERSITY_GE } from "@/lib/constants"; +import * as gtag from "@/lib/gtag"; +import { analyticsEnum, logAnalytics } from "@/lib/analytics"; + export interface CollegeObject { sendingInstitution: string; courseCode: string; @@ -169,6 +172,15 @@ const Search = () => { } }; + logAnalytics({ + category: analyticsEnum.search.title, + action: analyticsEnum.search.actions.SEARCH, + label: university, + value: UNIVERSITY_GE[university].findIndex((item) => { + return item.includes(ge); + }), + }); + fetchData(); }, [university, ge]); diff --git a/lib/analytics.ts b/lib/analytics.ts new file mode 100644 index 0000000..fcb4bc2 --- /dev/null +++ b/lib/analytics.ts @@ -0,0 +1,28 @@ +export const analyticsEnum = { + search: { + title: "Search Page", + actions: { + SEARCH: "Search Course", // Label is school, value is index of GE + }, + }, +}; + +interface AnalyticsProps { + category: string; + action: string; + label?: string; + value?: number; +} + +export function logAnalytics({ + category, + action, + label, + value, +}: AnalyticsProps) { + (window as any).gtag("event", action, { + event_category: category, + event_label: label, + value: value, + }); +} diff --git a/lib/gtag.ts b/lib/gtag.ts index bdbc79d..f6d014b 100644 --- a/lib/gtag.ts +++ b/lib/gtag.ts @@ -8,21 +8,3 @@ export const pageview = (url: string) => { page_path: url, }); }; - -export const event = ({ - action, - category, - label, - value, -}: { - action: string; - category: string; - label: string; - value: number; -}) => { - (window as any).gtag("event", action, { - event_category: category, - event_label: label, - value: value, - }); -};