Merge pull request #202 from sopt-makers/feat/#201_amplitude-event-tr…

…acking
sopt-makers · Sep 28, 2023 · 7073746 · 7073746
2 parents 6041a80 + 93daa18
commit 7073746
Show file tree

Hide file tree

Showing 5 changed files with 21 additions and 5 deletions.
diff --git a/src/views/MainPage/components/ActivityReview/ActivityReview.tsx b/src/views/MainPage/components/ActivityReview/ActivityReview.tsx
@@ -1,3 +1,4 @@
+import { track } from '@amplitude/analytics-browser';
 import Image from 'next/image';
 import Link from 'next/link';
 import { ReactComponent as ArrowLeft } from '@src/assets/icons/arrow_left_28x28.svg';
@@ -34,7 +35,11 @@ export function ActivityReview() {
           </div>
           <div className={styles.content} ref={scrollableRef}>
             {reviews.data.map((review) => (
-              <Link key={review.id} href={review.link}>
+              <Link
+                key={review.id}
+                href={review.link}
+                onClick={() => track('click_main_review_detail')}
+              >
                 <article className={styles.card} role="presentation">
                   <h4 className={styles.cardTitle}>{review.title}</h4>
                   <div className={styles.descWrapper}>
@@ -57,7 +62,7 @@ export function ActivityReview() {
             <ArrowRight stroke={isRightScrollable ? 'white' : 'lightGrey'} />
           </div>
         </div>
-        <Link href="/review">
+        <Link href="/review" onClick={() => track('click_main_review_more')}>
           <h4 className={styles.moreLink}>활동후기 더보기</h4>
         </Link>
       </div>

diff --git a/src/views/MainPage/components/DetailedInformation/DetailedInformation.tsx b/src/views/MainPage/components/DetailedInformation/DetailedInformation.tsx
@@ -1,3 +1,4 @@
+import { track } from '@amplitude/analytics-browser';
 import Image from 'next/image';
 import { useRouter } from 'next/router';
 import ArrowRight from '@src/assets/icons/arrow_right_grey.svg';
@@ -24,12 +25,15 @@ export function DetailedInformation() {
   const handleClickItem = (name: string) => {
     switch (name) {
       case '프로젝트':
+        track('click_main_project');
         router.push('/project');
         break;
       case 'FAQ':
+        track('click_main_faq');
         router.push('/FAQ');
         break;
       case 'Youtube':
+        track('click_main_youtube');
         window.open('https://www.youtube.com/c/SOPTMEDIA');
         break;
       default:

diff --git a/src/views/ProjectPage/components/project/ProjectCard.tsx b/src/views/ProjectPage/components/project/ProjectCard.tsx
@@ -1,3 +1,4 @@
+import { track } from '@amplitude/analytics-browser';
 import styled from '@emotion/styled';
 import Image from 'next/image';
 import Link from 'next/link';
@@ -15,7 +16,7 @@ import styles from './project-card.module.scss';
 
 export function ProjectCard({ project }: { project: ProjectType }) {
   return (
-    <Link href={`/project/${project.id}`}>
+    <Link href={`/project/${project.id}`} onClick={() => track('click_project_detail')}>
       <article className={`${styles.item} ${GTM_CLASS.projectCard}`}>
         {RepresentativeImageRender(project.name, project.logoImage, project?.thumbnailImage)}
         <div className={`${styles.content} ${GTM_CLASS.projectCard}`}>

diff --git a/src/views/ReviewPage/components/Content/index.tsx b/src/views/ReviewPage/components/Content/index.tsx
@@ -1,5 +1,5 @@
-import { useState } from 'react';
 import { ExtraPart, PartExtraType } from '@src/lib/types/universal';
+import { useState } from 'react';
 import Reviews from '../Reviews';
 import TabBar from '../TabBar';
 

diff --git a/src/views/ReviewPage/components/Reviews/index.tsx b/src/views/ReviewPage/components/Reviews/index.tsx
@@ -1,3 +1,4 @@
+import { track } from '@amplitude/analytics-browser';
 import { useMemo } from 'react';
 import { useIsMobile } from '@src/hooks/useDevice';
 import { ExtraPart } from '@src/lib/types/universal';
@@ -21,7 +22,12 @@ const Reviews = ({ selectedTab }: ReviewsProps) => {
     <>
       <S.Wrapper>
         {reviews.data.map((review, idx) => (
-          <S.Card key={`${review.id}-${idx}`} href={review.link} target="_blank">
+          <S.Card
+            key={`${review.id}-${idx}`}
+            href={review.link}
+            target="_blank"
+            onClick={() => track('click_review_detail')}
+          >
             <S.Section>
               <S.ThumbnailWrapper>
                 <S.Thumbnail