EPMRPP-78479 || code review fixes - 1

reportportal · Aug 3, 2022 · 51b14e5 · 51b14e5
1 parent 8f66610
commit 51b14e5
Show file tree

Hide file tree

Showing 7 changed files with 53 additions and 106 deletions.
diff --git a/app/src/components/main/analytics/events/ga4Events/projectSettingsPageEvents.js b/app/src/components/main/analytics/events/ga4Events/projectSettingsPageEvents.js
@@ -75,7 +75,7 @@ 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,
+    modal: normalizeEventType(modalName),
     status: getStatus(status),
     number,
     type: normalizeEventType(type),

diff --git a/...pages/inside/projectSettingsPageContainer/content/elements/ruleList/ruleItem/ruleItem.jsx b/...pages/inside/projectSettingsPageContainer/content/elements/ruleList/ruleItem/ruleItem.jsx
@@ -23,24 +23,17 @@ import styles from './ruleItem.scss';
 
 const cx = classNames.bind(styles);
 
-export const RuleItem = ({
-  item,
-  actions,
-  onToggle,
-  disabled,
-  content,
-  onClick: analyticsTrigger,
-}) => {
+export const RuleItem = ({ item, actions, onToggle, disabled, content, onClick }) => {
   const [shown, setShown] = useState(false);
   const { enabled, name } = item;
   const onToggleActive = (val) => {
     onToggle(val, item);
   };
 
-  const onClick = () => {
+  const onClickHandler = () => {
     setShown(!shown);
-    if (!shown && analyticsTrigger) {
-      analyticsTrigger();
+    if (!shown && onClick) {
+      onClick();
     }
   };
 
@@ -54,7 +47,7 @@ export const RuleItem = ({
         />
       </span>
       <div className={cx('panel-wrapper')}>
-        <div className={cx('panel')} onClick={onClick}>
+        <div className={cx('panel')} onClick={onClickHandler}>
           <span className={cx('name')} title={name}>
             {name}
           </span>

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,14 +22,7 @@ import styles from './ruleList.scss';
 
 const cx = classNames.bind(styles);
 
-export const RuleList = ({
-  data,
-  actions,
-  onToggle,
-  disabled,
-  ruleItemContent,
-  analyticsTrigger,
-}) => {
+export const RuleList = ({ data, actions, onToggle, disabled, ruleItemContent, onClick }) => {
   const Content = ruleItemContent;
   return (
     <div className={cx('container')}>
@@ -41,7 +34,7 @@ export const RuleList = ({
           onToggle={onToggle}
           disabled={disabled}
           content={ruleItemContent && <Content item={item} />}
-          onClick={analyticsTrigger}
+          onClick={onClick}
         />
       ))}
     </div>
@@ -53,12 +46,12 @@ RuleList.propTypes = {
   onToggle: PropTypes.func,
   disabled: PropTypes.bool,
   ruleItemContent: PropTypes.oneOfType([PropTypes.func, PropTypes.node]),
-  analyticsTrigger: PropTypes.oneOfType([PropTypes.func, PropTypes.instanceOf(null)]),
+  onClick: PropTypes.oneOfType([PropTypes.func, PropTypes.instanceOf(null)]),
 };
 RuleList.defaultProps = {
   actions: [],
   onToggle: () => {},
   disabled: true,
   ruleItemContent: null,
-  analyticsTrigger: null,
+  onClick: null,
 };
diff --git a/app/src/pages/inside/projectSettingsPageContainer/content/emptyStatePage/emptyStatePage.jsx b/app/src/pages/inside/projectSettingsPageContainer/content/emptyStatePage/emptyStatePage.jsx
@@ -33,7 +33,7 @@ export const EmptyStatePage = ({
   documentationLink,
   title,
   disableButton,
-  analyticsTrigger,
+  onClick,
 }) => {
   const { formatMessage } = useIntl();
   return (
@@ -47,12 +47,7 @@ export const EmptyStatePage = ({
         </Button>
       )}
       {documentationLink && (
-        <a
-          href={documentationLink}
-          onClick={analyticsTrigger}
-          target="_blank"
-          className={cx('link')}
-        >
+        <a href={documentationLink} onClick={onClick} target="_blank" className={cx('link')}>
           <span>{formatMessage(COMMON_LOCALE_KEYS.documentation)}</span>
           <div className={cx('icon')}>{Parser(ExternalLinkIcon)}</div>
         </a>
@@ -68,7 +63,7 @@ EmptyStatePage.propTypes = {
   buttonName: PropTypes.string,
   documentationLink: PropTypes.string,
   disableButton: PropTypes.bool,
-  analyticsTrigger: PropTypes.oneOfType([PropTypes.func, PropTypes.instanceOf(null)]),
+  onClick: PropTypes.oneOfType([PropTypes.func, PropTypes.instanceOf(null)]),
 };
 
 EmptyStatePage.defaultProps = {
@@ -78,5 +73,5 @@ EmptyStatePage.defaultProps = {
   buttonName: '',
   documentationLink: '',
   disableButton: false,
-  analyticsTrigger: null,
+  onClick: null,
 };
diff --git a/...tainer/content/notifications/modals/addEditNotificationModal/addEditNotificationModal.jsx b/...tainer/content/notifications/modals/addEditNotificationModal/addEditNotificationModal.jsx
@@ -30,16 +30,17 @@ import { FieldErrorHint } from 'components/fields/fieldErrorHint';
 import { Toggle } from 'componentLibrary/toggle';
 import { URLS } from 'common/urls';
 import { AsyncMultipleAutocomplete } from 'components/inputs/autocompletes/asyncMultipleAutocomplete';
-import { SETTINGS_PAGE_EVENTS } from 'components/main/analytics/events';
 import { Dropdown } from 'componentLibrary/dropdown';
 import { hideModalAction } from 'controllers/modal';
 import { FieldText } from 'componentLibrary/fieldText';
 import { Checkbox } from 'componentLibrary/checkbox';
 import { projectIdSelector } from 'controllers/pages';
 import { AttributeListContainer } from 'components/containers/attributeListContainer';
+import { PROJECT_SETTINGS_NOTIFICATIONS_EVENTS } from 'analyticsEvents/projectSettingsPageEvents';
 import { FieldElement } from '../../../elements';
 import {
   ATTRIBUTES_FIELD_KEY,
+  ENABLED_FIELD_KEY,
   INFORM_OWNER_FIELD_KEY,
   LAUNCH_CASES,
   LAUNCH_NAMES_FIELD_KEY,
@@ -205,7 +206,9 @@ const AddEditNotificationModal = ({
   const activeProject = useSelector(projectIdSelector);
   const [isEditorShown, setShowEditor] = React.useState(data.notification.attributes.length > 0);
   const selector = formValueSelector(form);
-  const attributesValue = useSelector((state) => selector(state, ATTRIBUTES_FIELD_KEY));
+  const { attributes: attributesValue, enabled: switcher } = useSelector((state) =>
+    selector(state, ATTRIBUTES_FIELD_KEY, ENABLED_FIELD_KEY),
+  );
 
   useEffect(() => {
     initialize(data.notification);
@@ -238,9 +241,35 @@ const AddEditNotificationModal = ({
     },
   ];
 
+  const {
+    actionType,
+    notification: {
+      sendCase,
+      attributes: { length },
+      informOwner,
+    },
+  } = data;
+
   const okButton = {
     text: formatMessage(COMMON_LOCALE_KEYS.SAVE),
-    onClick: () => handleSubmit(onSave(!isEditorShown))(),
+    onClick: () => {
+      const modalName = `${messages.title.defaultMessage.replace(
+        /\{.*\}/i,
+        messages[actionType].defaultMessage,
+      )}`;
+
+      handleSubmit(onSave(!isEditorShown))();
+
+      trackEvent(
+        PROJECT_SETTINGS_NOTIFICATIONS_EVENTS.CLICK_SAVE_BUTTON_IN_MODAL(
+          modalName,
+          informOwner,
+          length,
+          messages[sendCase].defaultMessage,
+          switcher,
+        ),
+      );
+    },
   };
   const cancelButton = {
     text: formatMessage(COMMON_LOCALE_KEYS.CANCEL),
@@ -279,11 +308,7 @@ const AddEditNotificationModal = ({
     >
       {formatMessage(messages.description)}
       <div className={cx('content')}>
-        <FieldProvider
-          name={RULE_NAME_FIELD_KEY}
-          type="text"
-          onChange={() => trackEvent(SETTINGS_PAGE_EVENTS.EDIT_RECIPIENTS_INPUT_NOTIFICATIONS)}
-        >
+        <FieldProvider name={RULE_NAME_FIELD_KEY} type="text">
           <FieldErrorHint provideHint={false}>
             <FieldText
               label={formatMessage(messages.nameLabel)}
@@ -296,7 +321,6 @@ const AddEditNotificationModal = ({
           name={RECIPIENTS_FIELD_KEY}
           className={cx('autocomplete')}
           type="text"
-          onChange={() => trackEvent(SETTINGS_PAGE_EVENTS.EDIT_RECIPIENTS_INPUT_NOTIFICATIONS)}
           label={formatMessage(messages.recipientsLabel)}
         >
           <FieldErrorHint provideHint={false}>
@@ -311,12 +335,7 @@ const AddEditNotificationModal = ({
             />
           </FieldErrorHint>
         </FieldElement>
-        <FieldElement
-          name={INFORM_OWNER_FIELD_KEY}
-          type="text"
-          className={cx('checkbox')}
-          onChange={() => trackEvent(SETTINGS_PAGE_EVENTS.CHECKBOX_LAUNCH_OWNER_NOTIFICATIONS)}
-        >
+        <FieldElement name={INFORM_OWNER_FIELD_KEY} type="text" className={cx('checkbox')}>
           <Checkbox>{formatMessage(messages.launchOwnerLabel)}</Checkbox>
         </FieldElement>
         <FieldElement
@@ -330,7 +349,6 @@ const AddEditNotificationModal = ({
         <FieldElement
           label={formatMessage(messages.launchNamesLabel)}
           name={LAUNCH_NAMES_FIELD_KEY}
-          onChange={() => trackEvent(SETTINGS_PAGE_EVENTS.LAUNCH_NAME_INPUT_NOTIFICATIONS)}
           className={cx('launches')}
         >
           <FieldErrorHint hintType="top">
@@ -352,11 +370,7 @@ const AddEditNotificationModal = ({
           {formatMessage(messages.attributes)}
         </Checkbox>
         <span className={cx('description')}>{attributesCaption}</span>
-        <FieldElement
-          name={ATTRIBUTES_FIELD_KEY}
-          onChange={() => trackEvent(SETTINGS_PAGE_EVENTS.TAGS_INPUT_NOTIFICATIONS)}
-          disabled={!isEditorShown}
-        >
+        <FieldElement name={ATTRIBUTES_FIELD_KEY} disabled={!isEditorShown}>
           <AttributeListContainer
             keyURLCreator={URLS.launchAttributeKeysSearch}
             valueURLCreator={URLS.launchAttributeValuesSearch}

diff --git a/.../content/notifications/modals/deleteNotificationCaseModal/deleteNotificationCaseModal.jsx b/.../content/notifications/modals/deleteNotificationCaseModal/deleteNotificationCaseModal.jsx
@@ -35,7 +35,7 @@ const messages = defineMessages({
   },
 });
 
-const DeleteNotificationCaseModal = ({ data: { onSave, eventsInfo } }) => {
+const DeleteNotificationCaseModal = ({ data: { onSave } }) => {
   const { formatMessage } = useIntl();
   const dispatch = useDispatch();
 
@@ -48,13 +48,10 @@ const DeleteNotificationCaseModal = ({ data: { onSave, eventsInfo } }) => {
         onClick: () => {
           onSave();
         },
-        eventInfo: eventsInfo.deleteBtn,
       }}
       cancelButton={{
         text: formatMessage(COMMON_LOCALE_KEYS.CANCEL),
-        eventInfo: eventsInfo.cancelBtn,
       }}
-      closeIconEventInfo={eventsInfo.closeIcon}
       onClose={() => dispatch(hideModalAction())}
     >
       <div>{Parser(formatMessage(messages.message))}</div>