From e7a41b23914612c76bff53569e51dfcd32890524 Mon Sep 17 00:00:00 2001 From: SaadYousaf Date: Thu, 15 Dec 2022 14:07:58 +0500 Subject: [PATCH] fix: cleanup events and add filter content event to learners tab filters --- src/discussions/learners/data/slices.js | 11 ----------- .../LearnerPostFilterBar.jsx | 14 ++++++++++++++ .../learners/learner/LearnerFilterBar.jsx | 7 +++++++ src/discussions/posts/PostsView.test.jsx | 1 - src/discussions/posts/data/slices.js | 18 ------------------ .../posts/post-filter-bar/PostFilterBar.jsx | 13 +++++++++++++ 6 files changed, 34 insertions(+), 30 deletions(-) diff --git a/src/discussions/learners/data/slices.js b/src/discussions/learners/data/slices.js index e3674e1f..7f35b463 100644 --- a/src/discussions/learners/data/slices.js +++ b/src/discussions/learners/data/slices.js @@ -1,8 +1,6 @@ /* eslint-disable no-param-reassign,import/prefer-default-export */ import { createSlice } from '@reduxjs/toolkit'; -import { sendTrackEvent } from '@edx/frontend-platform/analytics'; - import { LearnersOrdering, PostsStatusFilter, @@ -11,14 +9,6 @@ import { ThreadType, } from '../../../data/constants'; -function trackUserSortEvent(payload) { - sendTrackEvent( - 'edx.forum.sort.user', - { - sort: payload, - }, - ); -} const learnersSlice = createSlice({ name: 'learner', initialState: { @@ -61,7 +51,6 @@ const learnersSlice = createSlice({ setSortedBy: (state, { payload }) => { state.pages = []; state.sortedBy = payload; - trackUserSortEvent(payload); }, setUsernameSearch: (state, { payload }) => { state.usernameSearch = payload; diff --git a/src/discussions/learners/learner-post-filter-bar/LearnerPostFilterBar.jsx b/src/discussions/learners/learner-post-filter-bar/LearnerPostFilterBar.jsx index 2ce73530..0fe38e71 100644 --- a/src/discussions/learners/learner-post-filter-bar/LearnerPostFilterBar.jsx +++ b/src/discussions/learners/learner-post-filter-bar/LearnerPostFilterBar.jsx @@ -4,6 +4,8 @@ import { isEmpty } from 'lodash'; import { useDispatch, useSelector } from 'react-redux'; import { useParams } from 'react-router-dom'; +import { sendTrackEvent } from '@edx/frontend-platform/analytics'; + import FilterBar from '../../../components/FilterBar'; import { selectCourseCohorts } from '../../cohorts/data/selectors'; import { fetchCourseCohorts } from '../../cohorts/data/thunks'; @@ -39,12 +41,20 @@ function LearnerPostFilterBar() { const handleFilterChange = (event) => { const { name, value } = event.currentTarget; + const filterContentEventProperties = { + statusFilter: postFilter.status, + threadTypeFilter: postFilter.postType, + sortFilter: postFilter.orderBy, + cohortFilter: postFilter.cohort, + triggeredBy: name, + }; if (name === 'postType') { if (postFilter.postType !== value) { dispatch(setPostFilter({ ...postFilter, postType: value, })); + filterContentEventProperties.threadTypeFilter = value; } } else if (name === 'status') { if (postFilter.status !== value) { @@ -52,6 +62,7 @@ function LearnerPostFilterBar() { ...postFilter, status: value, })); + filterContentEventProperties.statusFilter = value; } } else if (name === 'orderBy') { if (postFilter.orderBy !== value) { @@ -59,6 +70,7 @@ function LearnerPostFilterBar() { ...postFilter, orderBy: value, })); + filterContentEventProperties.sortFilter = value; } } else if (name === 'cohort') { if (postFilter.cohort !== value) { @@ -66,8 +78,10 @@ function LearnerPostFilterBar() { ...postFilter, cohort: value, })); + filterContentEventProperties.cohortFilter = value; } } + sendTrackEvent('edx.forum.filter.content', filterContentEventProperties); }; useEffect(() => { diff --git a/src/discussions/learners/learner/LearnerFilterBar.jsx b/src/discussions/learners/learner/LearnerFilterBar.jsx index bd673663..610c1504 100644 --- a/src/discussions/learners/learner/LearnerFilterBar.jsx +++ b/src/discussions/learners/learner/LearnerFilterBar.jsx @@ -4,6 +4,7 @@ import PropTypes from 'prop-types'; import classNames from 'classnames'; import { useDispatch, useSelector } from 'react-redux'; +import { sendTrackEvent } from '@edx/frontend-platform/analytics'; import { injectIntl, intlShape } from '@edx/frontend-platform/i18n'; import { Collapsible, Form, Icon } from '@edx/paragon'; import { Check, Tune } from '@edx/paragon/icons'; @@ -58,6 +59,12 @@ function LearnerFilterBar({ if (name === 'sort') { dispatch(setSortedBy(value)); + sendTrackEvent( + 'edx.forum.sort.user', + { + sort: value, + }, + ); } }; diff --git a/src/discussions/posts/PostsView.test.jsx b/src/discussions/posts/PostsView.test.jsx index 4d60e567..e2f8b6a6 100644 --- a/src/discussions/posts/PostsView.test.jsx +++ b/src/discussions/posts/PostsView.test.jsx @@ -112,7 +112,6 @@ describe('PostsView', () => { config: { hasModerationPrivileges: true }, ...data, }; - // console.log(storeData); store = initializeStore(storeData); store.dispatch(fetchConfigSuccess({})); } diff --git a/src/discussions/posts/data/slices.js b/src/discussions/posts/data/slices.js index c9666e2f..c5c6bce5 100644 --- a/src/discussions/posts/data/slices.js +++ b/src/discussions/posts/data/slices.js @@ -1,8 +1,6 @@ /* eslint-disable no-param-reassign,import/prefer-default-export */ import { createSlice } from '@reduxjs/toolkit'; -import { sendTrackEvent } from '@edx/frontend-platform/analytics'; - import { PostsStatusFilter, RequestStatus, ThreadOrdering, ThreadType, } from '../../../data/constants'; @@ -23,19 +21,6 @@ const mergeThreadsInTopics = (dataFromState, dataFromPayload) => { }, {}); }; -function trackFilterContentEvent(filters, sort, eventTrigger) { - sendTrackEvent( - 'edx.forum.filter.content', - { - statusFilter: filters.status, - threadTypeFilter: filters.postType, - sort, - cohortFilter: filters.cohortFilter, - triggeredBy: eventTrigger, - }, - ); -} - const threadsSlice = createSlice({ name: 'thread', initialState: { @@ -203,17 +188,14 @@ const threadsSlice = createSlice({ }, setStatusFilter: (state, { payload }) => { state.filters.status = payload; - trackFilterContentEvent(state.filters, state.sortedBy, 'Status Filter'); state.pages = []; }, setPostsTypeFilter: (state, { payload }) => { state.filters.postType = payload; - trackFilterContentEvent(state.filters, state.sortedBy, 'Type Filter'); state.pages = []; }, setCohortFilter: (state, { payload }) => { state.filters.cohort = payload; - trackFilterContentEvent(state.filters, state.sortedBy, 'Cohort Filter'); state.pages = []; }, setSearchQuery: (state, { payload }) => { diff --git a/src/discussions/posts/post-filter-bar/PostFilterBar.jsx b/src/discussions/posts/post-filter-bar/PostFilterBar.jsx index 1cc61d92..6cde6134 100644 --- a/src/discussions/posts/post-filter-bar/PostFilterBar.jsx +++ b/src/discussions/posts/post-filter-bar/PostFilterBar.jsx @@ -8,6 +8,7 @@ import { capitalize, isEmpty, toString } from 'lodash'; import { useDispatch, useSelector } from 'react-redux'; import { useParams } from 'react-router-dom'; +import { sendTrackEvent } from '@edx/frontend-platform/analytics'; import { injectIntl, intlShape } from '@edx/frontend-platform/i18n'; import { Collapsible, Form, Icon, Spinner, @@ -84,6 +85,13 @@ function PostFilterBar({ name, value, } = event.currentTarget; + const filterContentEventProperties = { + statusFilter: currentStatus, + threadTypeFilter: currentType, + sortFilter: currentSorting, + cohortFilter: cohorts, + triggeredBy: name, + }; if (name === 'type') { dispatch(setPostsTypeFilter(value)); if ( @@ -92,6 +100,7 @@ function PostFilterBar({ // You can't filter discussions by unanswered dispatch(setStatusFilter(PostsStatusFilter.ALL)); } + filterContentEventProperties.threadTypeFilter = value; } if (name === 'status') { dispatch(setStatusFilter(value)); @@ -103,13 +112,17 @@ function PostFilterBar({ // You can't filter questions by not responded so switch type to discussion dispatch(setPostsTypeFilter(ThreadType.DISCUSSION)); } + filterContentEventProperties.statusFilter = value; } if (name === 'sort') { dispatch(setSortedBy(value)); + filterContentEventProperties.sortFilter = value; } if (name === 'cohort') { dispatch(setCohortFilter(value)); + filterContentEventProperties.cohortFilter = value; } + sendTrackEvent('edx.forum.filter.content', filterContentEventProperties); }; useEffect(() => {