From 917f17b7e60608b1bc5f88ed9c2a7332ba1c23c6 Mon Sep 17 00:00:00 2001
From: James Morris <moreofmorris@users.noreply.github.com>
Date: Tue, 10 May 2022 16:40:28 +0100
Subject: [PATCH] Removed tick lines for All Time on totals chart and adjusted
 bar thickness depending on days selected for Paid Subscribers

refs: https://github.com/TryGhost/Team/issues/1531
---
 .../app/components/dashboard/v5/charts/anchor.js     | 12 +++++++++---
 .../components/dashboard/v5/charts/paid-breakdown.js |  9 +++++++--
 2 files changed, 16 insertions(+), 5 deletions(-)

diff --git a/ghost/admin/app/components/dashboard/v5/charts/anchor.js b/ghost/admin/app/components/dashboard/v5/charts/anchor.js
index ae829ca565..8aa73ef480 100644
--- a/ghost/admin/app/components/dashboard/v5/charts/anchor.js
+++ b/ghost/admin/app/components/dashboard/v5/charts/anchor.js
@@ -225,6 +225,7 @@ export default class Anchor extends Component {
     }
 
     get chartOptions() {
+        let isAllTime = (this.days === 'all');
         let barColor = this.feature.nightShift ? 'rgba(200, 204, 217, 0.25)' : 'rgba(200, 204, 217, 0.65)';
 
         return {
@@ -315,15 +316,20 @@ export default class Anchor extends Component {
                     },
                     ticks: {
                         display: false,
-                        beginAtZero: true,
+                        autoSkip: false,
                         callback: function (value, index, values) {
                             if (index === 0) {
                                 document.getElementById('gh-dashboard5-anchor-date-start').innerHTML = moment(value).format(DATE_FORMAT);
+                                return value;
                             }
-                            if (index === values.length - 1) {
+                            if (index === (values.length - 1)) {
                                 document.getElementById('gh-dashboard5-anchor-date-end').innerHTML = moment(value).format(DATE_FORMAT);
+                                return value;
                             }
-                            return value;
+                            if (!isAllTime) {
+                                return value;
+                            }
+                            return null;
                         }
                     }
                 }]
diff --git a/ghost/admin/app/components/dashboard/v5/charts/paid-breakdown.js b/ghost/admin/app/components/dashboard/v5/charts/paid-breakdown.js
index 97155fd0de..e751c1bba5 100644
--- a/ghost/admin/app/components/dashboard/v5/charts/paid-breakdown.js
+++ b/ghost/admin/app/components/dashboard/v5/charts/paid-breakdown.js
@@ -60,7 +60,13 @@ export default class PaidBreakdown extends Component {
         const labels = stats.map(stat => stat.date);
         const newData = stats.map(stat => stat.positiveDelta);
         const canceledData = stats.map(stat => -stat.negativeDelta);
-        const barThickness = 5;
+        let barThickness = 5;
+
+        if (newData.length > 30) {
+            barThickness = 2;
+        } else if (newData.length > 90) {   
+            barThickness = 1;
+        }
 
         return {
             labels: labels,
@@ -162,7 +168,6 @@ export default class PaidBreakdown extends Component {
                     },
                     ticks: {
                         display: false,
-                        maxTicksLimit: 5,
                         fontColor: '#7C8B9A',
                         padding: 8,
                         precision: 0