feat: VAN-987 - Added analytics event on recommendation course click

This commit is contained in:
Shafqat Farhan
2022-06-28 23:00:46 +05:00
committed by Zainab Amir
parent ef9361ccfe
commit 7a05329594

View File

@@ -2,6 +2,18 @@
import React from 'react';
class RecommendationsPanel extends React.Component {
constructor(props) {
super(props);
this.onCourseSelect = this.onCourseSelect.bind(this);
}
onCourseSelect(courseKey) {
window.analytics.track('edx.bi.user.recommended.course.click', {
course_key: courseKey,
is_personalized_recommendation: false, // TODO: Use state here with default false and update its value from API response.
});
};
render() {
return (
<div className="p-4 panel-background">
@@ -15,7 +27,9 @@ class RecommendationsPanel extends React.Component {
/>
</div>
<div className="course-title pl-3">
<a href="#" className="course-link">The Chemistry of Life</a>
<a href="#" className="course-link" onClick={() => this.onCourseSelect('add-course-key-1')}>
The Chemistry of Life
</a>
</div>
</div>
<div className="course-card box-shadow-down-1 bg-white mb-3">
@@ -27,7 +41,9 @@ class RecommendationsPanel extends React.Component {
/>
</div>
<div className="course-title pl-3">
<a href="#" className="course-link">Drug Discovery & Medicinal Chemistry</a>
<a href="#" className="course-link" onClick={() => this.onCourseSelect('add-course-key-2')}>
Drug Discovery & Medicinal Chemistry
</a>
</div>
</div>
<div className="course-card box-shadow-down-1 bg-white mb-3">
@@ -39,7 +55,9 @@ class RecommendationsPanel extends React.Component {
/>
</div>
<div className="course-title pl-3">
<a href="#" className="course-link">From Fossil Resources to Biomass: A Chemistry Perspective</a>
<a href="#" className="course-link" onClick={() => this.onCourseSelect('add-course-key-3')}>
From Fossil Resources to Biomass: A Chemistry Perspective
</a>
</div>
</div>
<div className="course-card box-shadow-down-1 bg-white mb-3">
@@ -51,7 +69,9 @@ class RecommendationsPanel extends React.Component {
/>
</div>
<div className="course-title pl-3">
<a href="#" className="course-link">Digital Biomaterials</a>
<a href="#" className="course-link" onClick={() => this.onCourseSelect('add-course-key-4')}>
Digital Biomaterials
</a>
</div>
</div>
<div className="course-card box-shadow-down-1 bg-white mb-3">
@@ -63,17 +83,16 @@ class RecommendationsPanel extends React.Component {
/>
</div>
<div className="course-title pl-3">
<a href="#" className="course-link">Basic Steps in Magnetic Resonance</a>
<a href="#" className="course-link" onClick={() => this.onCourseSelect('add-course-key-5')}>
Basic Steps in Magnetic Resonance
</a>
</div>
</div>
{this.props.exploreCoursesUrl ? (
<div className="d-flex justify-content-center">
<a
href={this.props.exploreCoursesUrl}
className="panel-explore-courses justify-content-center align-items-center"
>
<a href={this.props.exploreCoursesUrl} className="panel-explore-courses justify-content-center align-items-center">
{gettext('Explore courses')}
<span className="icon fa fa-search search-icon" aria-hidden="true" />
<span className="icon fa fa-search search-icon" aria-hidden="true"/>
</a>
</div>
) : null}