chore: move analytics hook to util for api usage

apps/marginfi-v2-ui/src/components/common/Staking/StakingCard/StakingCard.tsx

@@ -33,7 +33,7 @@ import {
   VersionedTransaction,
 } from "@solana/web3.js";
 import { useConnection } from "~/hooks/useConnection";
-import { useAnalytics } from "~/hooks/useAnalytics";
+import { capture } from "~/utils/analytics";
 import { SwapMode, useJupiter } from "@jup-ag/react-hook";
 import JSBI from "jsbi";
 import { StakeData, usePrevious } from "~/utils";
@@ -73,7 +73,6 @@ export const StakingCard: FC = () => {
   const router = useRouter();
   const { connection } = useConnection();
   const { connected, wallet, walletAddress } = useWalletContext();
-  const { capture } = useAnalytics();
 
   const [setIsWalletAuthDialogOpen] = useUiStore((state) => [state.setIsWalletAuthDialogOpen]);
   const [

apps/marginfi-v2-ui/src/components/common/Wallet/Wallet.tsx

@@ -10,7 +10,7 @@ import { useMrgnlendStore, useUiStore } from "~/store";
 import { useConnection } from "~/hooks/useConnection";
 import { useWalletContext } from "~/hooks/useWalletContext";
 import { useIsMobile } from "~/hooks/useIsMobile";
-import { useAnalytics } from "~/hooks/useAnalytics";
+import { setPersonProperties } from "~/utils/analytics";
 
 import { MrgnTooltip } from "~/components/common/MrgnTooltip";
 import {
@@ -33,7 +33,6 @@ export const Wallet = () => {
   const { connection } = useConnection();
   const { wallet, connected, logout, pfp, requestPrivateKey, web3AuthPk, web3AuthConncected } = useWalletContext();
   const isMobile = useIsMobile();
-  const { setPersonProperties } = useAnalytics();
 
   const [isWalletAddressCopied, setIsWalletAddressCopied] = React.useState(false);
   const [isFundingAddressCopied, setIsFundingAddressCopied] = React.useState(false);

apps/marginfi-v2-ui/src/pages/_app.tsx

@@ -18,7 +18,7 @@ import { useLstStore } from "./stake";
 import { Desktop, Mobile } from "~/mediaQueries";
 import { WalletProvider as MrgnWalletProvider } from "~/hooks/useWalletContext";
 import { ConnectionProvider } from "~/hooks/useConnection";
-import { useAnalytics } from "~/hooks/useAnalytics";
+import { init as initAnalytics } from "~/utils/analytics";
 
 import { MobileNavbar } from "~/components/mobile/MobileNavbar";
 import { Tutorial } from "~/components/common/Tutorial";
@@ -55,8 +55,6 @@ const MyApp = ({ Component, pageProps }: AppProps) => {
     state.isRefreshingStore,
   ]);
 
-  const { init: initAnalytics } = useAnalytics();
-
   // enable matomo heartbeat
   React.useEffect(() => {
     if (process.env.NEXT_PUBLIC_MARGINFI_ENVIRONMENT === "alpha") {

apps/marginfi-v2-ui/src/pages/api/user/login.ts

@@ -16,7 +16,7 @@ import {
   STATUS_OK,
   firebaseApi,
 } from "@mrgnlabs/marginfi-v2-ui-state";
-import { useAnalytics } from "~/hooks/useAnalytics";
+import { capture, identify } from "~/utils/analytics";
 
 initFirebaseIfNeeded();
 
@@ -26,7 +26,6 @@ export interface LoginRequest {
 
 export default async function handler(req: NextApiRequest<LoginRequest>, res: any) {
   const { walletAddress } = req.body;
-  const { capture, identify } = useAnalytics();
 
   /* signing logic
   let signer;

apps/marginfi-v2-ui/src/pages/api/user/signup.ts

@@ -15,7 +15,7 @@ import {
   STATUS_OK,
   firebaseApi,
 } from "@mrgnlabs/marginfi-v2-ui-state";
-import { useAnalytics } from "~/hooks/useAnalytics";
+import { capture, identify } from "~/utils/analytics";
 
 initFirebaseIfNeeded();
 
@@ -27,8 +27,6 @@ export interface SignupRequest {
 export default async function handler(req: NextApiRequest<SignupRequest>, res: any) {
   const { walletAddress, payload } = req.body;
 
-  const { capture, identify } = useAnalytics();
-
   Sentry.setContext("signup_args", {
     walletAddress,
   });

apps/marginfi-v2-ui/src/utils/analytics.ts

@@ -0,0 +1,24 @@
+import posthog from "posthog-js";
+
+const _checkEnv = () =>
+  !process.env.NEXT_PUBLIC_POSTHOG_API_KEY || process.env.NEXT_PUBLIC_MARGINFI_ENVIRONMENT !== "production";
+
+export const init = () => {
+  if (_checkEnv()) return;
+  posthog.init(process.env.NEXT_PUBLIC_POSTHOG_API_KEY!, { api_host: "https://app.posthog.com" });
+};
+
+export const capture = (event: string, properties?: Record<string, any>) => {
+  if (_checkEnv()) return;
+  posthog.capture(event, properties);
+};
+
+export const identify = (userId: string, properties?: Record<string, any>) => {
+  if (_checkEnv()) return;
+  posthog.identify(userId, properties);
+};
+
+export const setPersonProperties = (properties: Record<string, any>) => {
+  if (_checkEnv()) return;
+  posthog.setPersonProperties(properties);
+};

apps/marginfi-v2-ui/src/utils/mrgnActions.ts

@@ -5,7 +5,7 @@ import { Connection, PublicKey, Transaction } from "@solana/web3.js";
 import { Wallet, processTransaction } from "@mrgnlabs/mrgn-common";
 import { WalletContextState } from "@solana/wallet-adapter-react";
 import { WalletContextStateOverride } from "~/hooks/useWalletContext";
-import { useAnalytics } from "~/hooks/useAnalytics";
+import { capture } from "~/utils/analytics";
 import { MultiStepToastHandle, showErrorToast } from "./toastUtils";
 
 export type MarginfiActionParams = {
@@ -79,8 +79,6 @@ async function createAccountAndDeposit({
     return;
   }
 
-  const { capture } = useAnalytics();
-
   const multiStepToast = new MultiStepToastHandle("Initial deposit", [
     { label: "Creating account" },
     { label: `Depositing ${amount} ${bank.meta.tokenSymbol}` },
@@ -126,8 +124,6 @@ export async function deposit({
   bank: ExtendedBankInfo;
   amount: number;
 }) {
-  const { capture } = useAnalytics();
-
   const multiStepToast = new MultiStepToastHandle("Deposit", [
     { label: `Depositing ${amount} ${bank.meta.tokenSymbol}` },
   ]);
@@ -159,8 +155,6 @@ export async function borrow({
   bank: ExtendedBankInfo;
   amount: number;
 }) {
-  const { capture } = useAnalytics();
-
   const multiStepToast = new MultiStepToastHandle("Borrow", [
     { label: `Borrowing ${amount} ${bank.meta.tokenSymbol}` },
   ]);
@@ -192,8 +186,6 @@ export async function withdraw({
   bank: ExtendedBankInfo;
   amount: number;
 }) {
-  const { capture } = useAnalytics();
-
   const multiStepToast = new MultiStepToastHandle("Withdrawal", [
     { label: `Withdrawing ${amount} ${bank.meta.tokenSymbol}` },
   ]);
@@ -225,8 +217,6 @@ export async function repay({
   bank: ExtendedBankInfo;
   amount: number;
 }) {
-  const { capture } = useAnalytics();
-
   const multiStepToast = new MultiStepToastHandle("Repayment", [
     { label: `Repaying ${amount} ${bank.meta.tokenSymbol}` },
   ]);
@@ -255,7 +245,6 @@ export async function collectRewardsBatch(
   marginfiAccount: MarginfiAccountWrapper,
   bankAddresses: PublicKey[]
 ) {
-  const { capture } = useAnalytics();
   const multiStepToast = new MultiStepToastHandle("Collect rewards", [{ label: "Collecting rewards" }]);
   multiStepToast.start();
 
@@ -300,8 +289,6 @@ export const closeBalance = async ({
     return;
   }
 
-  const { capture } = useAnalytics();
-
   const multiStepToast = new MultiStepToastHandle("Closing balance", [
     { label: `Closing ${bank.position.isLending ? "lending" : "borrow"} balance for ${bank.meta.tokenSymbol}` },
   ]);