Merge pull request #196 from DevKor-github/upgrade/ga

upgrade: ADD GA Events
DevKor-github · Sep 9, 2024 · f4cadc3 · f4cadc3
2 parents 9018049 + 7cab2bc
commit f4cadc3
Show file tree

Hide file tree

Showing 5 changed files with 10 additions and 1 deletion.
diff --git a/components/CopyInviteCode/CopyInviteCode.tsx b/components/CopyInviteCode/CopyInviteCode.tsx
@@ -4,6 +4,7 @@ import ActionButton from '../ActionButton';
 import { Icon } from '@/libs/design-system/icons';
 import { useProfileStore } from '@/libs/store/Providers/ProfileStoreProvider';
 import { useToast } from '@/components/Toast';
+import { sendGAEvent } from '@next/third-parties/google';
 
 export function CopyInviteCode() {
   const [copiedText, copy] = useCopyToClipboard();
@@ -17,6 +18,7 @@ export function CopyInviteCode() {
 
   const handleCopy = usePreservedCallback(() => {
     if (inviteCode) {
+      sendGAEvent('event', 'invite_friend', { inviteCode });
       copy(generateInviteCode(inviteCode))
         .then((isCopied) => {
           if (isCopied) {

diff --git a/components/DailyAttendanceQuiz/DailyAttendanceQuiz.tsx b/components/DailyAttendanceQuiz/DailyAttendanceQuiz.tsx
@@ -7,6 +7,7 @@ import { usePostAttendance } from '@/libs/apis/attendance';
 import { useLoginModal } from '@/components/LoginModal/useLoginModal';
 import { useToast } from '@/components/Toast';
 import { useTicketStore } from '@/libs/store/Providers/TicketStoreProvider';
+import { sendGAEvent } from '@next/third-parties/google';
 
 interface DailyAttendanceQuizProps {
   question: string;
@@ -52,6 +53,7 @@ export function DailyAttendanceQuiz({
   }, [data, refetchAttendance, openToast, addTickets]);
 
   const handleAnswer = (answer: boolean) => {
+    sendGAEvent('event', 'attendance', { answer, date: new Date().toISOString() });
     postAttendance(
       { answer: answer },
       {

diff --git a/components/MainTopBar/MainTopBar.tsx b/components/MainTopBar/MainTopBar.tsx
@@ -11,6 +11,7 @@ import { Flex } from '@/libs/design-system/flex';
 import { TicketInfo } from './TicketInfo';
 import { KakaoLogin } from '../KakaoLogin';
 import { useAuthStore } from '@/libs/store/Providers/AuthStoreProvider';
+import { sendGAEvent } from '@next/third-parties/google';
 
 export function MainTopBar() {
   const pathname = usePathname();
@@ -39,7 +40,7 @@ export function MainTopBar() {
       animate={navControls}
       transition={{ duration: 1.2, ease: easeInOut }}
     >
-      <Link href={'/'}>
+      <Link href={'/'} onClick={() => sendGAEvent('event', 'click_home_logo')}>
         <Icon.TokyLogo />
       </Link>
       <Flex $gap={12} $align="center">

diff --git a/components/SideBar/SideBar.tsx b/components/SideBar/SideBar.tsx
@@ -3,6 +3,7 @@ import SideBarBody from './SideBarBody';
 import { useOverlay } from '@/libs/design-system/overlay';
 import { OutsideClick } from '../OutsideClick/OutsideClick';
 import styled from 'styled-components';
+import { sendGAEvent } from '@next/third-parties/google';
 
 export function SideBar() {
   const overlay = useOverlay();
@@ -27,6 +28,7 @@ export function SideBar() {
 
   async function openBar() {
     await openSideBar();
+    sendGAEvent('event', 'open_sidebar');
   }
 
   return (

diff --git a/components/SideBar/SideBarBody.tsx b/components/SideBar/SideBarBody.tsx
@@ -13,6 +13,7 @@ import { useAuthStore } from '@/libs/store/Providers/AuthStoreProvider';
 import { useTicketStore } from '@/libs/store/Providers/TicketStoreProvider';
 import { onClickKakaoLogin } from '@/libs/utils/kakaoLogin';
 import { usePostLogout } from '@/libs/apis/auth';
+import { sendGAEvent } from '@next/third-parties/google';
 
 function SideBarBody({ isBarOpen = true }) {
   const nowPage = usePathname();
@@ -24,6 +25,7 @@ function SideBarBody({ isBarOpen = true }) {
   const router = useRouter();
 
   function openTokyInstagram() {
+    sendGAEvent('event', 'contact');
     window.open('https://instagram.com/official.toky?igshid=NjIwNzIyMDk2Mg==');
   }