Merge pull request #772 from devtron-labs/chore/ga-event

feat: add common handler for GA events

Author: arunjaindev

package-lock.json

@@ -1,6 +1,6 @@
 {
     "name": "@devtron-labs/devtron-fe-common-lib",
-    "version": "1.15.0-pre-4",
+    "version": "1.15.0-pre-5",
     "description": "Supporting common component library",
     "type": "module",
     "main": "dist/index.js",

package.json

@@ -1,3 +1,6 @@
+import ReactGA from 'react-ga4'
+import { UaEventOptions } from 'react-ga4/types/ga4'
+
 import { get } from '@Common/API'
 import { ROUTES } from '@Common/Constants'
 
@@ -13,3 +16,11 @@ export const handleSendAnalyticsEventToServer = async (
         // Do nothing
     }
 }
+
+export const handleAnalyticsEvent = ({ category, action }: Pick<UaEventOptions, 'category' | 'action'>) => {
+    if (window._env_.GA_ENABLED && ReactGA?.event)
+        ReactGA.event({
+            category,
+            action,
+        })
+}

src/Shared/Analytics/analytics.ts

@@ -31,7 +31,7 @@ import {
     useInterval,
 } from '../../../Common'
 import { DEPLOYMENT_STAGE_TO_NODE_MAP, EMPTY_STATE_STATUS } from '../../constants'
-import { TabGroup, TabGroupProps } from '../TabGroup'
+import { TabGroup } from '../TabGroup'
 import Artifacts from './Artifacts'
 import DeploymentDetailSteps from './DeploymentDetailSteps'
 import { DeploymentHistoryConfigDiff } from './DeploymentHistoryConfigDiff'
@@ -318,11 +318,6 @@ const TriggerOutput = ({
             (!!triggerDetailsResult?.result?.artifactId || !!triggerDetails?.artifactId),
     )
 
-    const tabs: TabGroupProps['tabs'] = useMemo(
-        () => getTriggerOutputTabs(triggerDetails, deploymentAppType),
-        [triggerDetails, deploymentAppType],
-    )
-
     useEffect(() => {
         if (triggerDetailsLoading) {
             return
@@ -417,7 +412,7 @@ const TriggerOutput = ({
                         namespace={triggerDetails.namespace}
                     />
                     <div className="pl-50 pr-20 pt-8 dc__border-bottom dc__position-sticky dc__top-0 bg__primary dc__zi-3">
-                        <TabGroup tabs={tabs} />
+                        <TabGroup tabs={getTriggerOutputTabs(triggerDetails, deploymentAppType)} />
                     </div>
                 </>
             )}