1 files changed, 15 insertions, 4 deletions

diff --git a/app/assets/javascripts/pages/users/activity_calendar.js b/app/assets/javascripts/pages/users/activity_calendar.js
index fb761725c43..13bba06d425 100644
--- a/app/assets/javascripts/pages/users/activity_calendar.js
+++ b/app/assets/javascripts/pages/users/activity_calendar.js
@@ -1,7 +1,7 @@
 import { select } from 'd3-selection';
 import $ from 'jquery';
 import { last } from 'lodash';
-import { createAlert } from '~/flash';
+import { createAlert } from '~/alert';
 import dateFormat from '~/lib/dateformat';
 import axios from '~/lib/utils/axios_utils';
 import { getDayName, getDayDifference } from '~/lib/utils/datetime_utility';
@@ -58,7 +58,7 @@ export const getLevelFromContributions = (count) => {
 };
 
 export default class ActivityCalendar {
-  constructor(
+  constructor({
     container,
     activitiesContainer,
     timestamps,
@@ -66,7 +66,8 @@ export default class ActivityCalendar {
     utcOffset = 0,
     firstDayOfWeek = firstDayOfWeekChoices.sunday,
     monthsAgo = 12,
-  ) {
+    onClickDay,
+  }) {
     this.calendarActivitiesPath = calendarActivitiesPath;
     this.clickDay = this.clickDay.bind(this);
     this.currentSelectedDate = '';
@@ -91,6 +92,7 @@ export default class ActivityCalendar {
     this.firstDayOfWeek = firstDayOfWeek;
     this.activitiesContainer = activitiesContainer;
     this.container = container;
+    this.onClickDay = onClickDay;
 
     // Loop through the timestamps to create a group of objects
     // The group of objects will be grouped based on the day of the week they are
@@ -152,7 +154,8 @@ export default class ActivityCalendar {
       .append('svg')
       .attr('width', width)
       .attr('height', 169)
-      .attr('class', 'contrib-calendar');
+      .attr('class', 'contrib-calendar')
+      .attr('data-testid', 'contrib-calendar');
   }
 
   dayYPos(day) {
@@ -181,6 +184,7 @@ export default class ActivityCalendar {
         });
         return `translate(${this.daySizeWithSpace * i + 1 + this.daySizeWithSpace}, 18)`;
       })
+      .attr('data-testid', 'user-contrib-cell-group')
       .selectAll('rect')
       .data((stamp) => stamp)
       .enter()
@@ -192,6 +196,7 @@ export default class ActivityCalendar {
       .attr('data-level', (stamp) => getLevelFromContributions(stamp.count))
       .attr('title', (stamp) => formatTooltipText(stamp))
       .attr('class', 'user-contrib-cell has-tooltip')
+      .attr('data-testid', 'user-contrib-cell')
       .attr('data-html', true)
       .attr('data-container', 'body')
       .on('click', this.clickDay);
@@ -281,6 +286,12 @@ export default class ActivityCalendar {
         this.currentSelectedDate.getDate(),
       ].join('-');
 
+      if (this.onClickDay) {
+        this.onClickDay(date);
+
+        return;
+      }
+
       $(this.activitiesContainer)
         .empty()
         .append(loadingIconForLegacyJS({ size: 'lg' }));