Merge branch '35136-barchart-not-display-label-at-0-hour' into 'master'

Fix bar chart does not display label at hour 0

Closes #35136

See merge request !13330

app/assets/javascripts/graphs/graphs_charts.js

 import Chart from 'vendor/Chart';
+import _ from 'underscore';
 
 document.addEventListener('DOMContentLoaded', () => {
   const projectChartData = JSON.parse(document.getElementById('projectChartData').innerHTML);
@@ -27,28 +28,25 @@ document.addEventListener('DOMContentLoaded', () => {
     return generateChart();
   };
 
-  const chartData = (keys, values) => {
-    const data = {
-      labels: keys,
-      datasets: [{
-        fillColor: 'rgba(220,220,220,0.5)',
-        strokeColor: 'rgba(220,220,220,1)',
-        barStrokeWidth: 1,
-        barValueSpacing: 1,
-        barDatasetSpacing: 1,
-        data: values,
-      }],
-    };
-    return data;
-  };
-
-  const hourData = chartData(projectChartData.hour.keys, projectChartData.hour.values);
+  const chartData = data => ({
+    labels: Object.keys(data),
+    datasets: [{
+      fillColor: 'rgba(220,220,220,0.5)',
+      strokeColor: 'rgba(220,220,220,1)',
+      barStrokeWidth: 1,
+      barValueSpacing: 1,
+      barDatasetSpacing: 1,
+      data: _.values(data),
+    }],
+  });
+
+  const hourData = chartData(projectChartData.hour);
   responsiveChart($('#hour-chart'), hourData);
 
-  const dayData = chartData(projectChartData.weekDays.keys, projectChartData.weekDays.values);
+  const dayData = chartData(projectChartData.weekDays);
   responsiveChart($('#weekday-chart'), dayData);
 
-  const monthData = chartData(projectChartData.month.keys, projectChartData.month.values);
+  const monthData = chartData(projectChartData.month);
   responsiveChart($('#month-chart'), monthData);
 
   const data = projectChartData.languages;

app/views/projects/graphs/charts.html.haml

@@ -78,8 +78,8 @@
 
 %script#projectChartData{ type: "application/json" }
   - projectChartData = {};
-  - projectChartData['hour'] = { 'keys' => @commits_per_time.keys, 'values' => @commits_per_time.values }
-  - projectChartData['weekDays'] = { 'keys' => @commits_per_week_days.keys, 'values' => @commits_per_week_days.values }
-  - projectChartData['month'] = { 'keys' => @commits_per_month.keys, 'values' => @commits_per_month.values }
+  - projectChartData['hour'] = @commits_per_time
+  - projectChartData['weekDays'] = @commits_per_week_days
+  - projectChartData['month'] = @commits_per_month
   - projectChartData['languages'] = @languages
   = projectChartData.to_json.html_safe

changelogs/unreleased/35136-barchart-not-display-label-at-0-hour.yml

+---
+title: Fix bar chart does not display label at 0 hour
+merge_request: 35136
+author: Jason Dai