fix: update the button clicked

components/SignIn.tsx

@@ -1,20 +1,35 @@
 import { useUser } from "@supabase/auth-helpers-react";
 import { AnimatePresence, motion } from "framer-motion";
+import { useEffect } from "react";
+import { useAnalytics } from "~/components/context/analytics";
 import { useSignInModal } from "~/components/sign-in-modal";
 import UserDropdown from "~/components/user-dropdown";
 import { FADE_IN_ANIMATION_SETTINGS } from "~/utils/constants";
 
 export default function SignIn() {
   const user = useUser();
+  const { analytics } = useAnalytics();
   const { SignInModal, setShowSignInModal } = useSignInModal();
+
+  if (user) {
+    analytics.identify(user.id, {
+      email: user.email,
+    });
+  }
+
+  function handleSignIn() {
+    setShowSignInModal(true);
+    analytics.track("SignInButton Clicked");
+  }
+
   /*useEffect(() => {
-    async function loadData() {
-      const { data } = await supabaseClient.from('test').select('*')
-      setData(data)
-    }
-    // Only run query once user is logged in.
-    if (user) loadData()
-  }, [user])*/
+      async function loadData() {
+        const { data } = await supabaseClient.from('test').select('*')
+        setData(data)
+      }
+      // Only run query once user is logged in.
+      if (user) loadData()
+    }, [user])*/
   return (
     <div>
       <SignInModal />
@@ -25,7 +40,7 @@ export default function SignIn() {
         ) : (
           <motion.button
             className="rounded-full border border-black bg-black p-1.5 px-1 text-sm text-white transition-all hover:bg-white hover:text-black md:px-4"
-            onClick={() => setShowSignInModal(true)}
+            onClick={handleSignIn}
             {...FADE_IN_ANIMATION_SETTINGS}
           >
             登录

components/sign-in-modal.tsx

@@ -1,18 +1,11 @@
 import { useSupabaseClient } from "@supabase/auth-helpers-react";
 import { Auth } from "@supabase/auth-ui-react";
 import { ThemeSupa } from "@supabase/auth-ui-shared";
-import React, {
-  Dispatch,
-  SetStateAction,
-  useCallback,
-  useMemo,
-  useState,
-} from "react";
-import Modal from "~/components/shared/modal";
 import Image from "next/image";
-import { BASE_DOMAIN, LOGIN_LIMIT_COUNT } from "~/utils/constants";
 import Link from "next/link";
-import { isDev } from "~/utils/env";
+import React, { Dispatch, SetStateAction, useCallback, useMemo, useState } from "react";
+import Modal from "~/components/shared/modal";
+import { BASE_DOMAIN, LOGIN_LIMIT_COUNT } from "~/utils/constants";
 
 const SignInModal = ({
   showSignInModal,

pages/[...slug].tsx

@@ -102,6 +102,7 @@ export const Home: NextPage = () => {
     console.log("========e========", e.target.value);
     e.preventDefault();
     await generateSummary();
+    analytics.track("GenerateButton Clicked");
   };
 
   const summaryArray = summary.split("- ");
@@ -140,7 +141,10 @@ export const Home: NextPage = () => {
     console.log("================", checked);
     setShouldShowTimestamp(checked);
     analytics
-      .track(`click handleShowTimestamp: ${checked}`)
+      .track(`ShowTimestamp Clicked`, {
+        bvId: currentBvId,
+        shouldShowTimestamp: checked,
+      })
       .then((res) => console.log("tracked!", res))
       .catch(console.error);
     // throw new Error("Sentry Frontend Error");