feat: implement GA and fix delete vault

CheesecakeLabs · Dec 27, 2023 · c7bb54c · c7bb54c
1 parent 79948aa
commit c7bb54c
Show file tree

Hide file tree

Showing 27 changed files with 166 additions and 26 deletions.
diff --git a/frontend/package-lock.json b/frontend/package-lock.json
diff --git a/frontend/package.json b/frontend/package.json
@@ -39,6 +39,7 @@
     "react-countdown": "^2.3.5",
     "react-dom": "~18.2.0",
     "react-feather": "^2.0.10",
+    "react-ga4": "^2.1.0",
     "react-hook-form": "~7.43.5",
     "react-intl": "^6.3.2",
     "react-joyride": "^2.5.5",

diff --git a/frontend/src/app/core/App.tsx b/frontend/src/app/core/App.tsx
@@ -6,6 +6,9 @@ import { CoreRouter } from 'app/core/routes'
 
 import ErrorBoundary from './error-boundary'
 import theme from 'config/theme'
+import ReactGA from "react-ga4";
+
+ReactGA.initialize("G-BG0BH1YW4P");
 
 const App = (): JSX.Element => (
   <ErrorBoundary displayMessage="Ooooppss... An unexpected error occured">

diff --git a/frontend/src/app/core/pages/asset-home/index.tsx b/frontend/src/app/core/pages/asset-home/index.tsx
@@ -14,6 +14,7 @@ import { useDashboards } from 'hooks/useDashboards'
 import { assetHomeHelper } from 'utils/constants/helpers'
 import { MessagesError } from 'utils/constants/messages-error'
 import { toBase64 } from 'utils/converter'
+import { GAService } from 'utils/ga'
 
 import { AssetActions } from 'components/enums/asset-actions'
 import { PathRoute } from 'components/enums/path-route'
@@ -41,6 +42,10 @@ export const AssetHome: React.FC = () => {
 
   const toast = useToast()
 
+  useEffect(() => {
+    GAService.GAPageView('Asset Home')
+  }, [])
+
   useEffect(() => {
     if (id) {
       getAssetById(id).then(asset => setAsset(asset))

diff --git a/frontend/src/app/core/pages/authorize-account/index.tsx b/frontend/src/app/core/pages/authorize-account/index.tsx
@@ -16,6 +16,7 @@ import { useVaults } from 'hooks/useVaults'
 import { havePermission } from 'utils'
 import { authorizeHelper } from 'utils/constants/helpers'
 import { MessagesError } from 'utils/constants/messages-error'
+import { GAService } from 'utils/ga'
 
 import { AssetActions } from 'components/enums/asset-actions'
 import { PathRoute } from 'components/enums/path-route'
@@ -46,6 +47,10 @@ export const AuthorizeAccount: React.FC = () => {
   const toast = useToast()
   const navigate = useNavigate()
 
+  useEffect(() => {
+    GAService.GAPageView('Authorize Account')
+  }, [])
+
   const onSubmit = async (
     data: FieldValues,
     setValue: UseFormSetValue<FieldValues>,

diff --git a/frontend/src/app/core/pages/burn-asset/index.tsx b/frontend/src/app/core/pages/burn-asset/index.tsx
@@ -16,6 +16,7 @@ import { havePermission } from 'utils'
 import { burnHelper } from 'utils/constants/helpers'
 import { MessagesError } from 'utils/constants/messages-error'
 import { toFixedCrypto } from 'utils/formatter'
+import { GAService } from 'utils/ga'
 
 import { AssetActions } from 'components/enums/asset-actions'
 import { PathRoute } from 'components/enums/path-route'
@@ -45,6 +46,10 @@ export const BurnAsset: React.FC = () => {
   const toast = useToast()
   const navigate = useNavigate()
 
+  useEffect(() => {
+    GAService.GAPageView('Burn Asset')
+  }, [])
+
   const onSubmit = async (
     data: FieldValues,
     setValue: UseFormSetValue<FieldValues>

diff --git a/frontend/src/app/core/pages/clawback-asset/index.tsx b/frontend/src/app/core/pages/clawback-asset/index.tsx
@@ -16,6 +16,7 @@ import { havePermission } from 'utils'
 import { clawbackHelper } from 'utils/constants/helpers'
 import { MessagesError } from 'utils/constants/messages-error'
 import { toFixedCrypto } from 'utils/formatter'
+import { GAService } from 'utils/ga'
 
 import { AssetActions } from 'components/enums/asset-actions'
 import { PathRoute } from 'components/enums/path-route'
@@ -39,6 +40,10 @@ export const ClawbackAsset: React.FC = () => {
   const toast = useToast()
   const navigate = useNavigate()
 
+  useEffect(() => {
+    GAService.GAPageView('Clawback Asset')
+  }, [])
+
   const onSubmit = async (
     data: FieldValues,
     setValue: UseFormSetValue<FieldValues>,

diff --git a/frontend/src/app/core/pages/contracts/index.tsx b/frontend/src/app/core/pages/contracts/index.tsx
@@ -3,6 +3,7 @@ import React, { useEffect, useState } from 'react'
 
 import { useAuth } from 'hooks/useAuth'
 import { useContracts } from 'hooks/useContracts'
+import { GAService } from 'utils/ga'
 
 import { PathRoute } from 'components/enums/path-route'
 import { Sidebar } from 'components/organisms/sidebar'
@@ -18,6 +19,10 @@ export const Contracts: React.FC = () => {
 
   const LIMIT = 10
 
+  useEffect(() => {
+    GAService.GAPageView('Contracts - COD')
+  }, [])
+
   useEffect(() => {
     getPagedContracts({
       page: currentPage,

diff --git a/frontend/src/app/core/pages/dashboards/index.tsx b/frontend/src/app/core/pages/dashboards/index.tsx
@@ -4,6 +4,7 @@ import React, { useEffect, useState } from 'react'
 import { useAssets } from 'hooks/useAssets'
 import { useDashboards } from 'hooks/useDashboards'
 import { useVaults } from 'hooks/useVaults'
+import { GAService } from 'utils/ga'
 
 import { PathRoute } from 'components/enums/path-route'
 import { TChartPeriod } from 'components/molecules/chart-period'
@@ -29,6 +30,10 @@ export const Dashboards: React.FC = () => {
   } = useDashboards()
   const { loadingAssets, getAssets, assets } = useAssets()
 
+  useEffect(() => {
+    GAService.GAPageView('Dashboards')
+  }, [])
+
   useEffect(() => {
     getVaults().then(vaults => setVaults(vaults))
   }, [getVaults])

diff --git a/frontend/src/app/core/pages/distribute-asset/index.tsx b/frontend/src/app/core/pages/distribute-asset/index.tsx
@@ -17,6 +17,7 @@ import { havePermission } from 'utils'
 import { distributeHelper } from 'utils/constants/helpers'
 import { MessagesError } from 'utils/constants/messages-error'
 import { toFixedCrypto } from 'utils/formatter'
+import { GAService } from 'utils/ga'
 
 import { AssetActions } from 'components/enums/asset-actions'
 import { PathRoute } from 'components/enums/path-route'
@@ -44,6 +45,10 @@ export const DistributeAsset: React.FC = () => {
   const toast = useToast()
   const navigate = useNavigate()
 
+  useEffect(() => {
+    GAService.GAPageView('Distribute Asset')
+  }, [])
+
   const onSubmit = async (
     data: FieldValues,
     setValue: UseFormSetValue<FieldValues>,

diff --git a/frontend/src/app/core/pages/freeze-account/index.tsx b/frontend/src/app/core/pages/freeze-account/index.tsx
@@ -16,6 +16,7 @@ import { useVaults } from 'hooks/useVaults'
 import { havePermission } from 'utils'
 import { freezeHelper } from 'utils/constants/helpers'
 import { MessagesError } from 'utils/constants/messages-error'
+import { GAService } from 'utils/ga'
 
 import { AssetActions } from 'components/enums/asset-actions'
 import { PathRoute } from 'components/enums/path-route'
@@ -44,6 +45,10 @@ export const FreezeAccount: React.FC = () => {
   const toast = useToast()
   const navigate = useNavigate()
 
+  useEffect(() => {
+    GAService.GAPageView('Freeze account')
+  }, [])
+
   const onSubmit = async (
     data: FieldValues,
     clearFlags: string[],

diff --git a/frontend/src/app/core/pages/home/index.tsx b/frontend/src/app/core/pages/home/index.tsx
@@ -3,6 +3,7 @@ import React, { useEffect } from 'react'
 
 import { useAssets } from 'hooks/useAssets'
 import { useAuth } from 'hooks/useAuth'
+import { GAService } from 'utils/ga'
 
 import { PathRoute } from 'components/enums/path-route'
 import { Sidebar } from 'components/organisms/sidebar'
@@ -13,6 +14,10 @@ export const Home: React.FC = () => {
   const { userPermissions, loadingUserPermissions, getUserPermissions } =
     useAuth()
 
+  useEffect(() => {
+    GAService.GAPageView('Home')
+  }, [])
+
   useEffect(() => {
     getAssets(true)
   }, [getAssets])

diff --git a/frontend/src/app/core/pages/mint-asset/index.tsx b/frontend/src/app/core/pages/mint-asset/index.tsx
@@ -16,6 +16,7 @@ import { havePermission } from 'utils'
 import { mintHelper } from 'utils/constants/helpers'
 import { MessagesError } from 'utils/constants/messages-error'
 import { toFixedCrypto } from 'utils/formatter'
+import { GAService } from 'utils/ga'
 
 import { AssetActions } from 'components/enums/asset-actions'
 import { PathRoute } from 'components/enums/path-route'
@@ -45,6 +46,10 @@ export const MintAsset: React.FC = () => {
   const toast = useToast()
   const navigate = useNavigate()
 
+  useEffect(() => {
+    GAService.GAPageView('Mint Asset')
+  }, [])
+
   const onSubmit = async (
     data: FieldValues,
     setValue: UseFormSetValue<FieldValues>

diff --git a/frontend/src/app/core/pages/profile/index.tsx b/frontend/src/app/core/pages/profile/index.tsx
@@ -5,6 +5,7 @@ import { useNavigate } from 'react-router-dom'
 import { useAuth } from 'hooks/useAuth'
 import { useVaults } from 'hooks/useVaults'
 import { formatVaultName } from 'utils/formatter'
+import { GAService } from 'utils/ga'
 
 import { PathRoute } from 'components/enums/path-route'
 import { Sidebar } from 'components/organisms/sidebar'
@@ -30,6 +31,10 @@ export const Profile: React.FC = () => {
     getUserPermissions()
   }, [getUserPermissions])
 
+  useEffect(() => {
+    GAService.GAPageView('Profile')
+  }, [])
+
   const handleSignOut = async (): Promise<void> => {
     const isSuccess = await signOut()
     if (isSuccess) {
@@ -42,6 +47,7 @@ export const Profile: React.FC = () => {
       navigate(`${PathRoute.VAULT_DETAIL}/${profile.vault_id}`)
       return
     }
+    GAService.GAEvent('create_wallet_click')
     const vault = {
       name: formatVaultName(profile?.name || ''),
       assets_id: [],

diff --git a/frontend/src/app/core/pages/publish-information/index.tsx b/frontend/src/app/core/pages/publish-information/index.tsx
@@ -7,6 +7,7 @@ import { useAssets } from 'hooks/useAssets'
 import { useAuth } from 'hooks/useAuth'
 import { havePermission } from 'utils'
 import { MessagesError } from 'utils/constants/messages-error'
+import { GAService } from 'utils/ga'
 
 import { AssetActions } from 'components/enums/asset-actions'
 import { PathRoute } from 'components/enums/path-route'
@@ -33,6 +34,10 @@ export const PublishInformation: React.FC = () => {
   const toast = useToast()
   const navigate = useNavigate()
 
+  useEffect(() => {
+    GAService.GAPageView('Publish Information Asset')
+  }, [])
+
   const onSubmit = async (
     data: FieldValues,
     isAssetAnchored: boolean,

diff --git a/frontend/src/app/core/pages/team-members/index.tsx b/frontend/src/app/core/pages/team-members/index.tsx
@@ -2,6 +2,7 @@ import { Flex, VStack, useMediaQuery } from '@chakra-ui/react'
 import React, { useEffect } from 'react'
 
 import { useAuth } from 'hooks/useAuth'
+import { GAService } from 'utils/ga'
 
 import { PathRoute } from 'components/enums/path-route'
 import { SettingsOptions } from 'components/enums/settings-options'
@@ -25,6 +26,10 @@ export const TeamMembers: React.FC = () => {
     loadingUserPermissions,
   } = useAuth()
 
+  useEffect(() => {
+    GAService.GAPageView('Administration')
+  }, [])
+
   const handleEditRole = async (
     params: Hooks.UseAuthTypes.IUserRole
   ): Promise<boolean> => {

diff --git a/frontend/src/app/core/pages/token-management/index.tsx b/frontend/src/app/core/pages/token-management/index.tsx
@@ -3,6 +3,7 @@ import React, { useEffect, useState } from 'react'
 
 import { useAssets } from 'hooks/useAssets'
 import { useAuth } from 'hooks/useAuth'
+import { GAService } from 'utils/ga'
 
 import { PathRoute } from 'components/enums/path-route'
 import { Sidebar } from 'components/organisms/sidebar'
@@ -16,6 +17,10 @@ export const TokenManagement: React.FC = () => {
   const { userPermissions, getUserPermissions } = useAuth()
   const [page, setPage] = useState(1)
 
+  useEffect(() => {
+    GAService.GAPageView('Token Management')
+  }, [])
+
   const LIMIT = 10
 
   useEffect(() => {

diff --git a/frontend/src/app/core/pages/vault-create/index.tsx b/frontend/src/app/core/pages/vault-create/index.tsx
@@ -5,6 +5,7 @@ import { useNavigate } from 'react-router-dom'
 import { useAssets } from 'hooks/useAssets'
 import { useVaults } from 'hooks/useVaults'
 import { MessagesError } from 'utils/constants/messages-error'
+import { GAService } from 'utils/ga'
 
 import { PathRoute } from 'components/enums/path-route'
 import { Sidebar } from 'components/organisms/sidebar'
@@ -23,6 +24,10 @@ export const VaultCreate: React.FC = () => {
   const toast = useToast()
   const navigate = useNavigate()
 
+  useEffect(() => {
+    GAService.GAPageView('Vault Create')
+  }, [])
+
   const onSubmit = async (
     name: string,
     vaultCategoryId: number,

diff --git a/frontend/src/app/core/pages/vault-detail/index.tsx b/frontend/src/app/core/pages/vault-detail/index.tsx
@@ -9,6 +9,7 @@ import { useHorizon } from 'hooks/useHorizon'
 import { useVaults } from 'hooks/useVaults'
 import { MessagesError } from 'utils/constants/messages-error'
 import { toFixedCrypto } from 'utils/formatter'
+import { GAService } from 'utils/ga'
 
 import { PathRoute } from 'components/enums/path-route'
 import { Sidebar } from 'components/organisms/sidebar'
@@ -54,6 +55,10 @@ export const VaultDetail: React.FC = () => {
   } = useVaults()
   const { loadingHorizon, getPaymentsData, getAssetAccounts } = useHorizon()
 
+  useEffect(() => {
+    GAService.GAPageView('Vault detail')
+  }, [])
+
   const [selectedAsset, setSelectedAsset] =
     useState<Hooks.UseAssetsTypes.IAssetDto>()
 

diff --git a/frontend/src/app/core/pages/vaults/index.tsx b/frontend/src/app/core/pages/vaults/index.tsx
@@ -3,6 +3,7 @@ import React, { useEffect, useState } from 'react'
 
 import { useAssets } from 'hooks/useAssets'
 import { useVaults } from 'hooks/useVaults'
+import { GAService } from 'utils/ga'
 
 import { PathRoute } from 'components/enums/path-route'
 import { Sidebar } from 'components/organisms/sidebar'
@@ -19,6 +20,10 @@ export const Vaults: React.FC = () => {
   const [currentPage, setCurrentPage] = useState(1)
   const LIMIT = 12
 
+  useEffect(() => {
+    GAService.GAPageView('Treasury')
+  }, [])
+
   useEffect(() => {
     getPagedVaults({
       page: currentPage,

diff --git a/frontend/src/app/core/routes/index.tsx b/frontend/src/app/core/routes/index.tsx
@@ -18,7 +18,7 @@ const CoreRouter = (): JSX.Element => {
   ]
 
   return (
-    <Router basename='/sandbox/v2'>
+    <Router basename="/sandbox/v2">
       <Routes>{routes.map(route => route)}</Routes>
     </Router>
   )