diff --git a/frontend/pages/index.js b/frontend/pages/index.js
index ba3c0f76..9b73461d 100644
--- a/frontend/pages/index.js
+++ b/frontend/pages/index.js
@@ -937,6 +937,15 @@ const Homepage = () => {
variant="outline"
colorScheme="blue"
w="250px"
+ onClick={() => {
+ if (mixpanel.get_distinct_id()) {
+ mixpanel.track(`${MIXPANEL_EVENTS.BUTTON_CLICKED}`, {
+ full_url: router.nextRouter.asPath,
+ buttonName: `Check out our GitHub repository and join our community on
+ Discord > git clone moonstream`,
+ });
+ }
+ }}
leftIcon={}
>
git clone moonstream
@@ -949,6 +958,15 @@ const Homepage = () => {
colorScheme="blue"
leftIcon={}
w="250px"
+ onClick={() => {
+ if (mixpanel.get_distinct_id()) {
+ mixpanel.track(`${MIXPANEL_EVENTS.BUTTON_CLICKED}`, {
+ full_url: router.nextRouter.asPath,
+ buttonName: `Check out our GitHub repository and join our community on
+ Discord > Join our Discord`,
+ });
+ }
+ }}
>
Join our Discord
@@ -958,7 +976,16 @@ const Homepage = () => {
placeSelf="center"
w={["100%", "100%", "fit-content", null]}
maxW={["250px", null, "fit-content"]}
- onClick={() => toggleModal({ type: MODAL_TYPES.SIGNUP })}
+ onClick={() => {
+ if (mixpanel.get_distinct_id()) {
+ mixpanel.track(`${MIXPANEL_EVENTS.BUTTON_CLICKED}`, {
+ full_url: router.nextRouter.asPath,
+ buttonName: `Check out our GitHub repository and join our community on
+ Discord > sign up`,
+ });
+ }
+ toggleModal({ type: MODAL_TYPES.SIGNUP });
+ }}
size="lg"
variant="solid"
colorScheme="orange"
diff --git a/frontend/src/components/SplitWithImage.js b/frontend/src/components/SplitWithImage.js
index 2328a53d..64392044 100644
--- a/frontend/src/components/SplitWithImage.js
+++ b/frontend/src/components/SplitWithImage.js
@@ -17,6 +17,9 @@ import React, { useContext } from "react";
import UIContext from "../core/providers/UIProvider/context";
import { FaDiscord, FaGithubSquare } from "react-icons/fa";
import RouteButton from "../components/RouteButton";
+import mixpanel from "mixpanel-browser";
+import MIXPANEL_EVENTS from "../core/providers/AnalyticsProvider/constants";
+import { useRouter } from "../core/hooks";
const Feature = ({ text, icon, iconBg, bullets }) => {
return (
@@ -72,6 +75,8 @@ const SplitWithImage = ({
imgBoxShadow,
py,
}) => {
+ const router = useRouter();
+
var buttonSize = useBreakpointValue({
base: { single: "sm", double: "xs" },
sm: { single: "md", double: "sm" },
@@ -186,6 +191,14 @@ const SplitWithImage = ({
w={["100%", "100%", "fit-content", null]}
maxW={["250px", null, "fit-content"]}
href={socialButton.url}
+ onClick={() => {
+ if (mixpanel.get_distinct_id()) {
+ mixpanel.track(`${MIXPANEL_EVENTS.BUTTON_CLICKED}`, {
+ full_url: router.nextRouter.asPath,
+ buttonName: `splitWithImage > ${badge} > ${socialButton.title}`,
+ });
+ }
+ }}
mt={[0, 0, null, 16]}
size={socialButton ? buttonSize.double : buttonSize.single}
variant="outline"