plausible add position

blockworks-foundation · Aug 7, 2024 · 646d148 · 646d148
1 parent 4d44f11
commit 646d148
Show file tree

Hide file tree

Showing 3 changed files with 42 additions and 5 deletions.
diff --git a/components/DepositForm.tsx b/components/DepositForm.tsx
@@ -33,6 +33,7 @@ import Decimal from 'decimal.js'
 import useIpAddress from 'hooks/useIpAddress'
 import { walletBalanceForToken } from './StakeForm'
 import { ClientContextKeys } from 'utils/constants'
+import { usePlausible } from 'next-plausible'
 
 const set = mangoStore.getState().set
 
@@ -63,6 +64,7 @@ function DespositForm({ token: selectedToken, clientContext }: StakeFormProps) {
   const submitting = mangoStore((s) => s.submittingBoost)
   const [refreshingWalletTokens, setRefreshingWalletTokens] = useState(false)
   const { maxSolDeposit } = useSolBalance()
+  const plausible = usePlausible()
   const { usedTokens, totalTokens } = useMangoAccountAccounts()
   const { jlpGroup } = useMangoGroup()
   const groupLoaded = mangoStore((s) => s.groupLoaded)
@@ -113,6 +115,7 @@ function DespositForm({ token: selectedToken, clientContext }: StakeFormProps) {
 
     if (!group || !depositBank || !publicKey) return
 
+    plausible('PositionEntryStart')
     set((state) => {
       state.submittingBoost = true
     })
@@ -139,6 +142,14 @@ function DespositForm({ token: selectedToken, clientContext }: StakeFormProps) {
       })
       setInputAmount('')
       setSizePercentage('')
+      plausible('PositionEntrySuccess', {
+        props: {
+          description: `${publicKey.toString()} ${inputAmount} ${
+            depositBank.name
+          }`,
+          wallet: publicKey.toString(),
+        },
+      })
       await sleep(500)
       if (!mangoAccount) {
         await actions.fetchMangoAccounts(publicKey)
@@ -150,6 +161,12 @@ function DespositForm({ token: selectedToken, clientContext }: StakeFormProps) {
       set((state) => {
         state.submittingBoost = false
       })
+      plausible('PositionEntryError', {
+        props: {
+          error: `${e}`,
+          wallet: publicKey.toString(),
+        },
+      })
       if (!isMangoError(e)) return
       notify({
         title: 'Transaction failed',

diff --git a/components/StakeForm.tsx b/components/StakeForm.tsx
@@ -59,6 +59,7 @@ import useQuoteRoutes from 'hooks/useQuoteRoutes'
 import { YIELD_BUTTON_CLASSES } from './Stake'
 import { useTheme } from 'next-themes'
 import usePositions from 'hooks/usePositions'
+import { usePlausible } from 'next-plausible'
 
 export const MIN_SOL_BALANCE_FOR_ACCOUNT = 0.045
 
@@ -110,6 +111,7 @@ export const walletBalanceForToken = (
 function StakeForm({ token: selectedToken, clientContext }: StakeFormProps) {
   const { theme } = useTheme()
   const { positions } = usePositions()
+  const plausible = usePlausible()
   const { t } = useTranslation(['common', 'account'])
   const [depositToken, setDepositToken] = useState(selectedToken)
   const [inputAmount, setInputAmount] = useState('')
@@ -315,6 +317,7 @@ function StakeForm({ token: selectedToken, clientContext }: StakeFormProps) {
     set((state) => {
       state.submittingBoost = true
     })
+    plausible('PositionEntryStart')
     try {
       // const newAccountfNum = getNextAccountNumber(mangoAccounts)
       let stakeAmount = parseFloat(inputAmount)
@@ -363,6 +366,14 @@ function StakeForm({ token: selectedToken, clientContext }: StakeFormProps) {
       })
       setInputAmount('')
       setSizePercentage('')
+      plausible('PositionEntrySuccess', {
+        props: {
+          description: `${publicKey.toString()} ${inputAmount} ${
+            stakeBank.name
+          } ${leverage}x`,
+          wallet: publicKey.toString(),
+        },
+      })
       await sleep(500)
       if (!mangoAccount) {
         await actions.fetchMangoAccounts(publicKey)
@@ -374,6 +385,12 @@ function StakeForm({ token: selectedToken, clientContext }: StakeFormProps) {
       set((state) => {
         state.submittingBoost = false
       })
+      plausible('PositionEntryError', {
+        props: {
+          error: `${e}`,
+          wallet: publicKey.toString(),
+        },
+      })
       if (!isMangoError(e)) return
       notify({
         title: 'Transaction failed',

diff --git a/pages/_app.tsx b/pages/_app.tsx
@@ -2,7 +2,7 @@ import '../styles/globals.css'
 import 'react-range-slider-input/dist/style.css'
 
 import type { AppProps } from 'next/app'
-import { useCallback, useEffect, useMemo, useState } from 'react'
+import { ReactNode, useCallback, useEffect, useMemo, useState } from 'react'
 import {
   Adapter,
   WalletAdapterNetwork,
@@ -132,9 +132,10 @@ function MyApp({ Component, pageProps }: AppProps) {
           >
             <MangoProvider />
             <ThemeProvider defaultTheme="Light" storageKey={THEME_KEY}>
-              <Telemetry />
               <Layout>
-                <Component {...pageProps} />
+                <Telemetry>
+                  <Component {...pageProps} />
+                </Telemetry>
               </Layout>
               <TransactionNotification />
             </ThemeProvider>
@@ -152,7 +153,7 @@ type TelemetryProps = {
   walletConnected: string
 }
 
-const Telemetry = () => {
+const Telemetry = ({ children }: { children: ReactNode }) => {
   const { wallet } = useWallet()
   const [telemetryProps, setTelemetryProps] = useState<
     TelemetryProps | undefined
@@ -183,6 +184,8 @@ const Telemetry = () => {
       scriptProps={{ id: 'plausible' }}
       pageviewProps={telemetryProps}
       trackOutboundLinks={true}
-    />
+    >
+      {children}
+    </PlausibleProvider>
   )
 }