EPMRPP-78479 || feat : create GA4 events for Project Settings - Notif…

…ications Tab
reportportal · Jul 28, 2022 · 08eeb33 · 08eeb33
1 parent aaf7316
commit 08eeb33
Show file tree

Hide file tree

Showing 8 changed files with 213 additions and 9 deletions.
diff --git a/app/src/components/main/analytics/events/ga4Events/projectSettingsPageEvents.js b/app/src/components/main/analytics/events/ga4Events/projectSettingsPageEvents.js
@@ -15,13 +15,101 @@
  */
 
 const PROJECT_SETTINGS = 'project_settings';
+const ANALYZER = 'analyzer';
+const NOTIFICATIONS = 'notifications';
+const BASIC_EVENT_PARAMETERS = {
+  action: 'click',
+  category: PROJECT_SETTINGS,
+  element_name: 'button_submit',
+};
+const BASIC_EVENT_PARAMETERS_NOTIFICATIONS = {
+  action: 'click',
+  category: PROJECT_SETTINGS,
+  place: NOTIFICATIONS,
+};
+
+const getStatus = (status) => (status ? 'active' : 'disabled');
+const getSwitcher = (switcher) => (switcher ? 'on' : 'off');
+
 export const PROJECT_SETTINGS_ANALYZER_EVENTS = {
   CLICK_SUBMIT_IN_INDEX_TAB: (number, status) => ({
-    action: 'click',
-    category: PROJECT_SETTINGS,
-    element_name: 'button_submit',
-    place: 'analyzer_index_settings',
+    ...BASIC_EVENT_PARAMETERS,
+    place: `${ANALYZER}_index_settings`,
+    number,
+    status: getStatus(status),
+  }),
+
+  CLICK_SUBMIT_IN_AUTO_ANALYZER_TAB: (number, status, type) => ({
+    ...BASIC_EVENT_PARAMETERS,
+    place: `${ANALYZER}_auto_analyzer`,
+    number,
+    status: getStatus(status),
+    type,
+  }),
+
+  CLICK_SUBMIT_IN_SIMILAR_ITEMS_TAB: (number) => ({
+    ...BASIC_EVENT_PARAMETERS,
+    place: `${ANALYZER}_similar_items`,
+    number,
+  }),
+
+  CLICK_SUBMIT_IN_UNIQUE_ERRORS_TAB: (status) => ({
+    ...BASIC_EVENT_PARAMETERS,
+    place: `${ANALYZER}_unique_errors`,
+    status: getStatus(status),
+  }),
+};
+
+export const PROJECT_SETTINGS_NOTIFICATIONS_EVENTS = {
+  CLICK_SAVE_BUTTON_IN_MODAL: (modalName, status, number, type, switcher) => ({
+    ...BASIC_EVENT_PARAMETERS_NOTIFICATIONS,
+    element_name: 'button_save',
+    modal: modalName,
+    status: getStatus(status),
     number,
-    status: status ? 'active' : 'disabled',
+    type,
+    switcher: getSwitcher(switcher),
+  }),
+
+  CLICK_CHECKBOX_AUTO_NOTIFICATIONS: (status) => ({
+    ...BASIC_EVENT_PARAMETERS_NOTIFICATIONS,
+    element_name: 'checkbox_auto_email_notifications',
+    status: getStatus(status),
+  }),
+
+  SWITCH_NOTIFICATION_RULE: (switcher) => ({
+    ...BASIC_EVENT_PARAMETERS_NOTIFICATIONS,
+    switcher: getSwitcher(switcher),
   }),
+
+  CLICK_LINK_DOCUMENTATION: {
+    ...BASIC_EVENT_PARAMETERS_NOTIFICATIONS,
+    link_name: 'documentation',
+  },
+
+  CLICK_CREATE_RULE_BUTTON: {
+    ...BASIC_EVENT_PARAMETERS_NOTIFICATIONS,
+    element_name: 'button_create_rule',
+  },
+
+  CLICK_TO_EXPAND_NOTIFICATIONS_DETAILS: {
+    ...BASIC_EVENT_PARAMETERS_NOTIFICATIONS,
+    element_name: 'notifications_name',
+    status: 'open',
+  },
+
+  CLICK_ICON_EDIT_NOTIFICATIONS: {
+    ...BASIC_EVENT_PARAMETERS_NOTIFICATIONS,
+    icon_name: 'icon_edit',
+  },
+
+  CLICK_ICON_DUPLICATE_NOTIFICATIONS: {
+    ...BASIC_EVENT_PARAMETERS_NOTIFICATIONS,
+    icon_name: 'icon_duplicate',
+  },
+
+  CLICK_ICON_DELETE_NOTIFICATIONS: {
+    ...BASIC_EVENT_PARAMETERS_NOTIFICATIONS,
+    icon_name: 'icon_delete',
+  },
 };
diff --git a/...side/projectSettingsPageContainer/content/analyzerContainer/autoAnalysis/autoAnalysis.jsx b/...side/projectSettingsPageContainer/content/analyzerContainer/autoAnalysis/autoAnalysis.jsx
@@ -25,6 +25,8 @@ import { FieldErrorHint } from 'components/fields/fieldErrorHint';
 import { bindMessageToValidator, validate } from 'common/utils/validation';
 import { Dropdown } from 'componentLibrary/dropdown';
 import { Checkbox } from 'componentLibrary/checkbox';
+import { useTracking } from 'react-tracking';
+import { PROJECT_SETTINGS_ANALYZER_EVENTS } from 'analyticsEvents/projectSettingsPageEvents';
 import { Layout } from '../../layout';
 import { FieldElement, LabeledPreloader } from '../../elements';
 import { messages } from './messages';
@@ -41,6 +43,7 @@ const AutoAnalysis = ({
 }) => {
   const { formatMessage } = useIntl();
   const [isPending, setPending] = useState(false);
+  const { trackEvent } = useTracking();
 
   const dropdownOptions = [
     { value: 'ALL', label: formatMessage(messages.allLaunchesCaption) },
@@ -59,6 +62,14 @@ const AutoAnalysis = ({
     setPending(true);
     await onFormSubmit(data);
     setPending(false);
+
+    trackEvent(
+      PROJECT_SETTINGS_ANALYZER_EVENTS.CLICK_SUBMIT_IN_AUTO_ANALYZER_TAB(
+        data[MIN_SHOULD_MATCH],
+        data[ANALYZER_ENABLED],
+        data[ANALYZER_MODE] === 'ALL' ? 'All' : messages.sameNameLaunchesCaption.defaultMessage,
+      ),
+    );
   };
 
   const isFieldDisabled = !hasPermission || isPending;

diff --git a/...side/projectSettingsPageContainer/content/analyzerContainer/similarItems/similarItems.jsx b/...side/projectSettingsPageContainer/content/analyzerContainer/similarItems/similarItems.jsx
@@ -23,6 +23,8 @@ import { Button } from 'componentLibrary/button';
 import { FieldNumber } from 'componentLibrary/fieldNumber';
 import { FieldErrorHint } from 'components/fields/fieldErrorHint';
 import { bindMessageToValidator, validate } from 'common/utils/validation';
+import { useTracking } from 'react-tracking';
+import { PROJECT_SETTINGS_ANALYZER_EVENTS } from 'analyticsEvents/projectSettingsPageEvents';
 import { Layout } from '../../layout';
 import { LabeledPreloader, FieldElement } from '../../elements';
 import { messages } from './messages';
@@ -37,6 +39,7 @@ const SimilarItems = ({
 }) => {
   const { formatMessage } = useIntl();
   const [isPending, setPending] = useState(false);
+  const { trackEvent } = useTracking();
 
   useEffect(() => {
     initialize({
@@ -48,6 +51,12 @@ const SimilarItems = ({
     setPending(true);
     await onFormSubmit(data);
     setPending(false);
+
+    trackEvent(
+      PROJECT_SETTINGS_ANALYZER_EVENTS.CLICK_SUBMIT_IN_SIMILAR_ITEMS_TAB(
+        data[SEARCH_LOGS_MIN_SHOULD_MATCH],
+      ),
+    );
   };
 
   const isFieldDisabled = !hasPermission || isPending;

diff --git a/...side/projectSettingsPageContainer/content/analyzerContainer/uniqueErrors/uniqueErrors.jsx b/...side/projectSettingsPageContainer/content/analyzerContainer/uniqueErrors/uniqueErrors.jsx
@@ -22,6 +22,8 @@ import { COMMON_LOCALE_KEYS } from 'common/constants/localization';
 import { Button } from 'componentLibrary/button';
 import { Dropdown } from 'componentLibrary/dropdown';
 import { Checkbox } from 'componentLibrary/checkbox';
+import { useTracking } from 'react-tracking';
+import { PROJECT_SETTINGS_ANALYZER_EVENTS } from 'analyticsEvents/projectSettingsPageEvents';
 import { FieldElement, LabeledPreloader } from '../../elements';
 import { messages } from './messages';
 import { UNIQUE_ERROR_ENABLED, UNIQUE_ERROR_REMOVE_NUMBERS } from '../constants';
@@ -39,6 +41,7 @@ const UniqueErrors = ({
 }) => {
   const { formatMessage } = useIntl();
   const [isPending, setPending] = useState(false);
+  const { trackEvent } = useTracking();
 
   const dropdownOptions = [
     { label: formatMessage(messages.uniqueErrAnalyzeModalIncludeNumbers), value: 'false' },
@@ -64,6 +67,12 @@ const UniqueErrors = ({
     setPending(true);
     await onFormSubmit(preparedData);
     setPending(false);
+
+    trackEvent(
+      PROJECT_SETTINGS_ANALYZER_EVENTS.CLICK_SUBMIT_IN_UNIQUE_ERRORS_TAB(
+        data[formatFieldName(UNIQUE_ERROR_ENABLED)],
+      ),
+    );
   };
 
   const isFieldDisabled = !hasPermission || isPending;

diff --git a/...pages/inside/projectSettingsPageContainer/content/elements/ruleList/ruleItem/ruleItem.jsx b/...pages/inside/projectSettingsPageContainer/content/elements/ruleList/ruleItem/ruleItem.jsx
@@ -23,13 +23,27 @@ import styles from './ruleItem.scss';
 
 const cx = classNames.bind(styles);
 
-export const RuleItem = ({ item, actions, onToggle, disabled, content }) => {
+export const RuleItem = ({
+  item,
+  actions,
+  onToggle,
+  disabled,
+  content,
+  onClick: analyticsTrigger,
+}) => {
   const [shown, setShown] = useState(false);
   const { enabled, name } = item;
   const onToggleActive = (val) => {
     onToggle(val, item);
   };
 
+  const onClick = () => {
+    setShown(!shown);
+    if (!shown && analyticsTrigger) {
+      analyticsTrigger();
+    }
+  };
+
   return (
     <div className={cx('container')}>
       <span className={cx('toggle')}>
@@ -40,7 +54,7 @@ export const RuleItem = ({ item, actions, onToggle, disabled, content }) => {
         />
       </span>
       <div className={cx('panel-wrapper')}>
-        <div className={cx('panel')} onClick={() => setShown(!shown)}>
+        <div className={cx('panel')} onClick={onClick}>
           <span className={cx('name')} title={name}>
             {name}
           </span>
@@ -72,10 +86,12 @@ RuleItem.propTypes = {
   onToggle: PropTypes.func,
   disabled: PropTypes.bool,
   content: PropTypes.node,
+  onClick: PropTypes.oneOfType([PropTypes.func, PropTypes.instanceOf(null)]),
 };
 RuleItem.defaultProps = {
   actions: [],
   onToggle: () => {},
   disabled: false,
   content: null,
+  onClick: null,
 };
diff --git a/app/src/pages/inside/projectSettingsPageContainer/content/elements/ruleList/ruleList.jsx b/app/src/pages/inside/projectSettingsPageContainer/content/elements/ruleList/ruleList.jsx
@@ -22,7 +22,14 @@ import styles from './ruleList.scss';
 
 const cx = classNames.bind(styles);
 
-export const RuleList = ({ data, actions, onToggle, disabled, ruleItemContent }) => {
+export const RuleList = ({
+  data,
+  actions,
+  onToggle,
+  disabled,
+  ruleItemContent,
+  analyticsTrigger,
+}) => {
   const Content = ruleItemContent;
   return (
     <div className={cx('container')}>
@@ -34,6 +41,7 @@ export const RuleList = ({ data, actions, onToggle, disabled, ruleItemContent })
           onToggle={onToggle}
           disabled={disabled}
           content={ruleItemContent && <Content item={item} />}
+          onClick={analyticsTrigger}
         />
       ))}
     </div>
@@ -45,10 +53,12 @@ RuleList.propTypes = {
   onToggle: PropTypes.func,
   disabled: PropTypes.bool,
   ruleItemContent: PropTypes.oneOfType([PropTypes.func, PropTypes.node]),
+  analyticsTrigger: PropTypes.oneOfType([PropTypes.func, PropTypes.instanceOf(null)]),
 };
 RuleList.defaultProps = {
   actions: [],
   onToggle: () => {},
   disabled: true,
   ruleItemContent: null,
+  analyticsTrigger: null,
 };
diff --git a/app/src/pages/inside/projectSettingsPageContainer/content/emptyStatePage/emptyStatePage.jsx b/app/src/pages/inside/projectSettingsPageContainer/content/emptyStatePage/emptyStatePage.jsx
@@ -33,6 +33,7 @@ export const EmptyStatePage = ({
   documentationLink,
   title,
   disableButton,
+  analyticsTrigger,
 }) => {
   const { formatMessage } = useIntl();
   return (
@@ -46,7 +47,12 @@ export const EmptyStatePage = ({
         </Button>
       )}
       {documentationLink && (
-        <a href={documentationLink} target="_blank" className={cx('link')}>
+        <a
+          href={documentationLink}
+          onClick={analyticsTrigger}
+          target="_blank"
+          className={cx('link')}
+        >
           <span>{formatMessage(COMMON_LOCALE_KEYS.documentation)}</span>
           <div className={cx('icon')}>{Parser(ExternalLinkIcon)}</div>
         </a>
@@ -62,6 +68,7 @@ EmptyStatePage.propTypes = {
   buttonName: PropTypes.string,
   documentationLink: PropTypes.string,
   disableButton: PropTypes.bool,
+  analyticsTrigger: PropTypes.oneOfType([PropTypes.func, PropTypes.instanceOf(null)]),
 };
 
 EmptyStatePage.defaultProps = {
@@ -71,4 +78,5 @@ EmptyStatePage.defaultProps = {
   buttonName: '',
   documentationLink: '',
   disableButton: false,
+  analyticsTrigger: null,
 };