diff --git a/app/src/components/main/analytics/events/ga4Events/helpAndSupportEvents.js b/app/src/components/main/analytics/events/ga4Events/helpAndSupportEvents.js new file mode 100644 index 0000000000..5cb45733d5 --- /dev/null +++ b/app/src/components/main/analytics/events/ga4Events/helpAndSupportEvents.js @@ -0,0 +1,58 @@ +/* + * Copyright 2023 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 { getBasicClickEventParameters, getBasicChooseEventParameters } from '../common/ga4Utils'; + +const HELP_AND_SUPPORT = 'help_and_support'; + +export const HELP_AND_SUPPORT_EVENTS = { + CLICK_HELP_AND_SUPPORT_BUTTON: { + ...getBasicClickEventParameters(HELP_AND_SUPPORT), + place: 'sidebar', + element_name: 'help_and_support', + }, + + CLICK_REQUEST_SUPPORT_BUTTON: { + ...getBasicClickEventParameters(HELP_AND_SUPPORT), + modal: 'help_and_support', + element_name: 'request_support', + }, + + CLICK_ON_SUPPORT_LINK: (linkName) => ({ + ...getBasicClickEventParameters(HELP_AND_SUPPORT), + modal: 'help_and_support', + link_name: linkName, + }), + + CLICK_SEND_REQUEST_SUPPORT_BUTTON: { + ...getBasicClickEventParameters(HELP_AND_SUPPORT), + modal: 'request_support', + element_name: 'send', + }, + + CHOOSE_INSTRUCTION_BUTTON: (typeName) => ({ + ...getBasicChooseEventParameters(HELP_AND_SUPPORT), + modal: 'help_and_support', + element_name: 'instruction', + type: typeName, + }), + + CLICK_ASK_A_QUESTION_BUTTON: { + ...getBasicClickEventParameters(HELP_AND_SUPPORT), + modal: 'help_and_support', + element_name: 'ask_a_question', + }, +}; diff --git a/app/src/components/main/analytics/events/index.js b/app/src/components/main/analytics/events/index.js index 045b3305b0..4297540761 100644 --- a/app/src/components/main/analytics/events/index.js +++ b/app/src/components/main/analytics/events/index.js @@ -21,12 +21,7 @@ export { } from './filtersPageEvents'; export { LAUNCHES_PAGE_EVENTS, LAUNCHES_MODAL_EVENTS, LAUNCHES_PAGE } from './launchesPageEvents'; export { LOGIN_PAGE_EVENTS, LOGIN_PAGE } from './loginPageEvents'; -export { - SIDEBAR_EVENTS, - ADMIN_SIDEBAR_EVENTS, - FOOTER_EVENTS, - HELP_AND_SUPPORT_EVENTS, -} from './sidebarFooterEvents'; +export { SIDEBAR_EVENTS, ADMIN_SIDEBAR_EVENTS, FOOTER_EVENTS } from './sidebarFooterEvents'; export { MEMBERS_PAGE, MEMBERS_PAGE_EVENTS } from './membersPageEvents'; export { PLUGINS_PAGE_EVENTS, diff --git a/app/src/components/main/analytics/events/sidebarFooterEvents.js b/app/src/components/main/analytics/events/sidebarFooterEvents.js index e16202ba6b..a2b79185c2 100644 --- a/app/src/components/main/analytics/events/sidebarFooterEvents.js +++ b/app/src/components/main/analytics/events/sidebarFooterEvents.js @@ -158,22 +158,3 @@ export const FOOTER_EVENTS = { label: `${pageNumber}#${page}`, }), }; - -const HELP_AND_SUPPORT = 'Help and Support'; -export const HELP_AND_SUPPORT_EVENTS = { - clickOnSupportModalBtn: (linkName) => ({ - category: HELP_AND_SUPPORT, - action: 'Click on Button/Link on Modal Help and Support', - label: linkName || HELP_AND_SUPPORT, - }), - clickInstructionLink: (label) => ({ - category: HELP_AND_SUPPORT, - action: 'Click on Button Instruction on Modal Help and Support ', - label, - }), - clickOnRequestModalBtn: (btn) => ({ - category: HELP_AND_SUPPORT, - action: 'Click on Button on Modal Request Support', - label: btn, - }), -}; diff --git a/app/src/layouts/common/sidebar/supportBlock/modal/requestSupportModal.jsx b/app/src/layouts/common/sidebar/supportBlock/modal/requestSupportModal.jsx index 494855ff6d..537d973488 100644 --- a/app/src/layouts/common/sidebar/supportBlock/modal/requestSupportModal.jsx +++ b/app/src/layouts/common/sidebar/supportBlock/modal/requestSupportModal.jsx @@ -31,7 +31,7 @@ import { InputOutside } from 'components/inputs/inputOutside'; import LoginIcon from 'common/img/login-field-icon-inline.svg'; import { COMMON_LOCALE_KEYS } from 'common/constants/localization'; import { NOTIFICATION_TYPES, showNotification } from 'controllers/notification'; -import { HELP_AND_SUPPORT_EVENTS } from 'components/main/analytics/events'; +import { HELP_AND_SUPPORT_EVENTS } from 'analyticsEvents/helpAndSupportEvents'; import { messages } from '../messages'; import styles from './requestSupportModal.scss'; @@ -88,19 +88,9 @@ const RequestSupport = ({ handleSubmit, initialize, invalid }) => { }, disabled: invalid, attributes: { type: 'submit', form: REQUEST_FORM_ID }, - eventInfo: HELP_AND_SUPPORT_EVENTS.clickOnRequestModalBtn( - COMMON_LOCALE_KEYS.SEND.defaultMessage, - ), + eventInfo: HELP_AND_SUPPORT_EVENTS.CLICK_SEND_REQUEST_SUPPORT_BUTTON, }} - cancelButton={{ - text: formatMessage(COMMON_LOCALE_KEYS.CANCEL), - eventInfo: HELP_AND_SUPPORT_EVENTS.clickOnRequestModalBtn( - COMMON_LOCALE_KEYS.CANCEL.defaultMessage, - ), - }} - closeIconEventInfo={HELP_AND_SUPPORT_EVENTS.clickOnRequestModalBtn( - COMMON_LOCALE_KEYS.CLOSE.defaultMessage, - )} + cancelButton={{ text: formatMessage(COMMON_LOCALE_KEYS.CANCEL) }} > <> {Parser(formatMessage(messages.modalText))} diff --git a/app/src/layouts/common/sidebar/supportBlock/supportBlock.jsx b/app/src/layouts/common/sidebar/supportBlock/supportBlock.jsx index 3acef265cd..5b97a2c2d8 100644 --- a/app/src/layouts/common/sidebar/supportBlock/supportBlock.jsx +++ b/app/src/layouts/common/sidebar/supportBlock/supportBlock.jsx @@ -25,7 +25,7 @@ import { withTooltip } from 'components/main/tooltips/tooltip'; import { TextTooltip } from 'components/main/tooltips/textTooltip'; import { InputDropdown } from 'components/inputs/inputDropdown'; import { GhostButton } from 'components/buttons/ghostButton'; -import { HELP_AND_SUPPORT_EVENTS } from 'components/main/analytics/events'; +import { HELP_AND_SUPPORT_EVENTS } from 'analyticsEvents/helpAndSupportEvents'; import { showModalAction } from 'controllers/modal'; import { referenceDictionary } from 'common/utils'; import { messages } from './messages'; @@ -70,7 +70,7 @@ export const SupportBlock = ({ options }) => { const toggleModal = () => { setModalShown(!isModalShown); - !isModalShown && trackEvent(HELP_AND_SUPPORT_EVENTS.clickOnSupportModalBtn()); + !isModalShown && trackEvent(HELP_AND_SUPPORT_EVENTS.CLICK_HELP_AND_SUPPORT_BUTTON); }; const openModal = () => { @@ -80,20 +80,19 @@ export const SupportBlock = ({ options }) => { id: 'requestSupportModal', }), ); - trackEvent( - HELP_AND_SUPPORT_EVENTS.clickOnSupportModalBtn(messages.requestSupport.defaultMessage), - ); + trackEvent(HELP_AND_SUPPORT_EVENTS.CLICK_REQUEST_SUPPORT_BUTTON); }; const onClickLink = (nameLink) => { toggleModal(); - trackEvent(HELP_AND_SUPPORT_EVENTS.clickOnSupportModalBtn(nameLink)); + trackEvent(HELP_AND_SUPPORT_EVENTS.CLICK_ON_SUPPORT_LINK(nameLink)); }; const onClickUserChoiceBtn = () => { toggleModal(); const label = options.find(({ value }) => value === userChoice).label; - trackEvent(HELP_AND_SUPPORT_EVENTS.clickInstructionLink(label)); + !userChoice && trackEvent(HELP_AND_SUPPORT_EVENTS.CLICK_ASK_A_QUESTION_BUTTON); + userChoice && trackEvent(HELP_AND_SUPPORT_EVENTS.CHOOSE_INSTRUCTION_BUTTON(label)); }; return ( @@ -141,7 +140,7 @@ export const SupportBlock = ({ options }) => { target="_blank" rel="noreferrer noopener" className={cx('support-link')} - onClick={() => onClickLink('email')} + onClick={() => onClickLink('support_team')} key={EMAIL_SUPPORT} > {formatMessage(messages.ourSupportTeam)} @@ -153,7 +152,7 @@ export const SupportBlock = ({ options }) => { target="_blank" rel="noreferrer noopener" className={cx('support-link')} - onClick={() => onClickLink(messages.slackChannel.defaultMessage)} + onClick={() => onClickLink('slack')} key={referenceDictionary.rpSlack} > {formatMessage(messages.slackChannel)}