Fixed: BarChart to have a stepSize multiplier of 1 instead of auto (#163)

* Fixes the BarChart to have a stepSize multiplier of 1 instead of auto

* Moves the size to props as per Discord

* Adds the same behavior to StackedBarChart's

frontend/src/Components/Chart/BarChart.js

@@ -23,6 +23,16 @@ class BarChart extends Component {
     this.myChart = new Chart(this.canvasRef.current, {
       type: 'bar',
       options: {
+        x: {
+          ticks: {
+            stepSize: this.props.stepSize
+          }
+        },
+        y: {
+          ticks: {
+            stepSize: this.props.stepSize
+          }
+        },
         indexAxis: this.props.horizontal ? 'y' : 'x',
         maintainAspectRatio: false,
         plugins: {
@@ -64,7 +74,8 @@ BarChart.propTypes = {
   horizontal: PropTypes.bool,
   legend: PropTypes.bool,
   title: PropTypes.string.isRequired,
-  kind: PropTypes.oneOf(kinds.all).isRequired
+  kind: PropTypes.oneOf(kinds.all).isRequired,
+  stepSize: PropTypes.number
 };
 
 BarChart.defaultProps = {
@@ -72,7 +83,8 @@ BarChart.defaultProps = {
   horizontal: false,
   legend: false,
   title: '',
-  kind: kinds.INFO
+  kind: kinds.INFO,
+  stepSize: 1
 };
 
 export default BarChart;

frontend/src/Components/Chart/StackedBarChart.js

@@ -16,10 +16,16 @@ class StackedBarChart extends Component {
         maintainAspectRatio: false,
         scales: {
           x: {
-            stacked: true
+            stacked: true,
+            ticks: {
+              stepSize: this.props.stepSize
+            }
           },
           y: {
-            stacked: true
+            stacked: true,
+            ticks: {
+              stepSize: this.props.stepSize
+            }
           }
         },
         plugins: {
@@ -63,11 +69,13 @@ class StackedBarChart extends Component {
 
 StackedBarChart.propTypes = {
   data: PropTypes.object.isRequired,
-  title: PropTypes.string.isRequired
+  title: PropTypes.string.isRequired,
+  stepSize: PropTypes.number
 };
 
 StackedBarChart.defaultProps = {
-  title: ''
+  title: '',
+  stepSize: 1
 };
 
 export default StackedBarChart;