EPMRPP-80554 || Add event to PRperLaunch and PRSummary (#3338)

* EPMRPP-80554 || Add event to PRperLaunch and PRSummary This events are send when user change ratio based option in PRperLaunch and PRSummary widgets. * EPMRPP-80554 || Code review fixes - 1
reportportal · Nov 22, 2022 · e847ef4 · e847ef4
1 parent aa8220d
commit e847ef4
Show file tree

Hide file tree

Showing 5 changed files with 108 additions and 4 deletions.
diff --git a/app/src/components/main/analytics/events/ga4Events/dashbordsPageEvents.js b/app/src/components/main/analytics/events/ga4Events/dashbordsPageEvents.js
@@ -0,0 +1,39 @@
+/*
+ * Copyright 2022 EPAM Systems
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { normalizeEventString } from '../../utils';
+
+const RATIO_BASED_ON = 'ratio_based_on';
+
+const modalNames = {
+  editWidgetModal: 'edit_modal',
+  widgetWizardModal: 'add_modal',
+};
+
+const getBasicEventConfig = (type) => ({
+  action: 'click',
+  category: 'dashboards',
+  type: normalizeEventString(type),
+});
+
+export const WIDGETS_EVENTS = {
+  CLICK_ON_RATIO_BASED_OPTION_IN_PASSING_RATE_CHARTS: (modalId) => (place, type) => ({
+    ...getBasicEventConfig(type),
+    place: normalizeEventString(place),
+    modal: modalNames[modalId],
+    element_name: RATIO_BASED_ON,
+  }),
+};
diff --git a/app/src/pages/inside/dashboardItemPage/dashboardItemPage.jsx b/app/src/pages/inside/dashboardItemPage/dashboardItemPage.jsx
@@ -60,6 +60,7 @@ import { DashboardPageHeader } from 'pages/inside/common/dashboardPageHeader';
 import GlobeIcon from 'common/img/globe-icon-inline.svg';
 import AddWidgetIcon from 'common/img/add-widget-inline.svg';
 import ExportIcon from 'common/img/export-inline.svg';
+import { WIDGETS_EVENTS } from 'analyticsEvents/dashbordsPageEvents';
 import { getUpdatedWidgetsList } from './modals/common/utils';
 import AddSharedWidgetIcon from './img/add-shared-inline.svg';
 import EditIcon from './img/edit-inline.svg';
@@ -279,9 +280,10 @@ export class DashboardItemPage extends Component {
     this.props.toggleFullScreenModeAction();
   };
   showWidgetWizard = () => {
+    const modalId = 'widgetWizardModal';
     this.props.tracking.trackEvent(DASHBOARD_PAGE_EVENTS.ADD_NEW_WIDGET_BTN);
     this.props.showModalAction({
-      id: 'widgetWizardModal',
+      id: modalId,
       data: {
         onConfirm: this.addWidget,
         eventsInfo: {
@@ -306,6 +308,9 @@ export class DashboardItemPage extends Component {
           clickOnZoomWidgetArea: DASHBOARD_PAGE_EVENTS.CLICK_ZOOM_ADD_WIDGET_AREA,
           selectCriteria: DASHBOARD_PAGE_EVENTS.SELECT_CRITERIA_ADD_NEW_WIDGET_MODAL,
           selectToggleButtons: DASHBOARD_PAGE_EVENTS.SELECT_TOGGLE_BUTTONS_ADD_NEW_WIDGET_MODAL,
+          ratioBasedOnChange: WIDGETS_EVENTS.CLICK_ON_RATIO_BASED_OPTION_IN_PASSING_RATE_CHARTS(
+            modalId,
+          ),
         },
       },
     });

diff --git a/...es/inside/dashboardItemPage/modals/common/widgetControls/passingRatePerLaunchControls.jsx b/...es/inside/dashboardItemPage/modals/common/widgetControls/passingRatePerLaunchControls.jsx
@@ -28,8 +28,10 @@ import {
   FORM_GROUP_CONTROL,
   passingRateOptionMessages,
 } from 'components/widgets/singleLevelWidgets/charts/common/passingRateChart/messages';
+import track from 'react-tracking';
 import { getWidgetModeOptions } from './utils/getWidgetModeOptions';
 import { TogglerControl, TagsControl, RadioGroupControl } from './controls';
+import { widgetTypesMessages } from '../messages';
 
 const DEFAULT_ITEMS_COUNT = '30';
 
@@ -53,6 +55,7 @@ const validators = {
     (!value || !value.length) && formatMessage(messages.LaunchNamesValidationError),
 };
 
+@track()
 @injectIntl
 @connect((state) => ({
   activeProject: activeProjectSelector(state),
@@ -63,6 +66,16 @@ export class PassingRatePerLaunchControls extends Component {
     widgetSettings: PropTypes.object.isRequired,
     activeProject: PropTypes.string.isRequired,
     initializeControlsForm: PropTypes.func.isRequired,
+    widgetType: PropTypes.string.isRequired,
+    eventsInfo: PropTypes.object,
+    tracking: PropTypes.shape({
+      trackEvent: PropTypes.func,
+      getTrackingData: PropTypes.func,
+    }).isRequired,
+  };
+
+  static defaultProps = {
+    eventsInfo: {},
   };
 
   constructor(props) {
@@ -82,6 +95,20 @@ export class PassingRatePerLaunchControls extends Component {
     });
   }
 
+  handleIncludeSkippedChange = (includeSkipped) => {
+    const {
+      eventsInfo: { ratioBasedOnChange },
+      tracking: { trackEvent },
+      widgetType,
+    } = this.props;
+
+    const eventType = includeSkipped
+      ? 'total_test_cases'
+      : passingRateOptionMessages[EXCLUDING_SKIPPED].defaultMessage;
+
+    trackEvent(ratioBasedOnChange(widgetTypesMessages[widgetType].defaultMessage, eventType));
+  };
+
   render() {
     const {
       intl: { formatMessage },
@@ -116,7 +143,10 @@ export class PassingRatePerLaunchControls extends Component {
             )}
           />
         </FieldProvider>
-        <FieldProvider name="contentParameters.widgetOptions.includeSkipped">
+        <FieldProvider
+          onChange={this.handleIncludeSkippedChange}
+          name="contentParameters.widgetOptions.includeSkipped"
+        >
           <RadioGroupControl
             options={options}
             fieldLabel={formatMessage(passingRateOptionMessages[FORM_GROUP_CONTROL])}

diff --git a/...ages/inside/dashboardItemPage/modals/common/widgetControls/passingRateSummaryControls.jsx b/...ages/inside/dashboardItemPage/modals/common/widgetControls/passingRateSummaryControls.jsx
@@ -27,9 +27,11 @@ import {
   FORM_GROUP_CONTROL,
   passingRateOptionMessages,
 } from 'components/widgets/singleLevelWidgets/charts/common/passingRateChart/messages';
+import track from 'react-tracking';
 import { getWidgetModeOptions } from './utils/getWidgetModeOptions';
 import { ITEMS_INPUT_WIDTH } from './constants';
 import { TogglerControl, FiltersControl, InputControl, RadioGroupControl } from './controls';
+import { widgetTypesMessages } from '../messages';
 
 const DEFAULT_ITEMS_COUNT = '50';
 
@@ -44,6 +46,7 @@ const messages = defineMessages({
   },
 });
 
+@track()
 @injectIntl
 export class PassingRateSummaryControls extends Component {
   static propTypes = {
@@ -52,7 +55,12 @@ export class PassingRateSummaryControls extends Component {
     initializeControlsForm: PropTypes.func.isRequired,
     formAppearance: PropTypes.object.isRequired,
     onFormAppearanceChange: PropTypes.func.isRequired,
+    widgetType: PropTypes.string.isRequired,
     eventsInfo: PropTypes.object,
+    tracking: PropTypes.shape({
+      trackEvent: PropTypes.func,
+      getTrackingData: PropTypes.func,
+    }).isRequired,
   };
 
   static defaultProps = {
@@ -79,6 +87,20 @@ export class PassingRateSummaryControls extends Component {
   formatFilterValue = (value) => value && value[0];
   parseFilterValue = (value) => value && [value];
 
+  handleIncludeSkippedChange = (includeSkipped) => {
+    const {
+      eventsInfo: { ratioBasedOnChange },
+      tracking: { trackEvent },
+      widgetType,
+    } = this.props;
+
+    const eventType = includeSkipped
+      ? 'total_test_cases'
+      : passingRateOptionMessages[EXCLUDING_SKIPPED].defaultMessage;
+
+    trackEvent(ratioBasedOnChange(widgetTypesMessages[widgetType].defaultMessage, eventType));
+  };
+
   render() {
     const {
       intl: { formatMessage },
@@ -127,7 +149,10 @@ export class PassingRateSummaryControls extends Component {
                 )}
               />
             </FieldProvider>
-            <FieldProvider name="contentParameters.widgetOptions.includeSkipped">
+            <FieldProvider
+              onChange={this.handleIncludeSkippedChange}
+              name="contentParameters.widgetOptions.includeSkipped"
+            >
               <RadioGroupControl
                 options={options}
                 fieldLabel={formatMessage(passingRateOptionMessages[FORM_GROUP_CONTROL])}

diff --git a/app/src/pages/inside/dashboardItemPage/widgetsGrid/widget/widget.jsx b/app/src/pages/inside/dashboardItemPage/widgetsGrid/widget/widget.jsx
@@ -35,6 +35,7 @@ import { COMMON_LOCALE_KEYS } from 'common/constants/localization';
 import { CHARTS, MULTI_LEVEL_WIDGETS_MAP, NoDataAvailable } from 'components/widgets';
 import { provideEcGA } from 'components/main/analytics';
 import { activeDashboardIdSelector } from 'controllers/pages';
+import { WIDGETS_EVENTS } from 'analyticsEvents/dashbordsPageEvents';
 import { isWidgetDataAvailable } from '../../modals/common/utils';
 import { WidgetHeader } from './widgetHeader';
 import styles from './widget.scss';
@@ -297,9 +298,10 @@ export class SimpleWidget extends Component {
   };
 
   showEditWidgetModal = () => {
+    const modalId = 'editWidgetModal';
     this.props.tracking.trackEvent(DASHBOARD_PAGE_EVENTS.EDIT_WIDGET);
     this.props.showModalAction({
-      id: 'editWidgetModal',
+      id: modalId,
       data: {
         widget: this.state.widget,
         onConfirm: (isForceUpdateNeeded) =>
@@ -325,6 +327,9 @@ export class SimpleWidget extends Component {
           clickOnZoomWidgetArea: DASHBOARD_PAGE_EVENTS.CLICK_ZOOM_EDIT_WIDGET_AREA,
           selectCriteria: DASHBOARD_PAGE_EVENTS.SELECT_CRITERIA_EDIT_WIDGET_MODAL,
           selectToggleButtons: DASHBOARD_PAGE_EVENTS.SELECT_TOGGLE_BUTTONS_EDIT_WIDGET_MODAL,
+          ratioBasedOnChange: WIDGETS_EVENTS.CLICK_ON_RATIO_BASED_OPTION_IN_PASSING_RATE_CHARTS(
+            modalId,
+          ),
         },
       },
     });