@ammarkhalidfarooq/dashboard-package 0.6.79 → 0.6.80

package/dist/index.cjs.js

@@ -6488,6 +6488,31 @@ var PaidDonorGeographyCard = function PaidDonorGeographyCard(_ref8) {
   });
 };
 
+var formatCategoryLabel$1 = function formatCategoryLabel(val) {
+  if (!val || typeof val !== "string") return val;
+  var ddMmYyyy = val.match(/^(\d{2})-(\d{2})-(\d{4})$/);
+  if (ddMmYyyy) {
+    var _ddMmYyyy = _slicedToArray(ddMmYyyy, 4),
+      day = _ddMmYyyy[1],
+      month = _ddMmYyyy[2],
+      year = _ddMmYyyy[3];
+    var _date = new Date(Number(year), Number(month) - 1, Number(day));
+    if (!Number.isNaN(_date.getTime())) {
+      return _date.toLocaleDateString("en-US", {
+        month: "short",
+        day: "numeric"
+      });
+    }
+  }
+  var date = new Date(val);
+  if (!Number.isNaN(date.getTime())) {
+    return date.toLocaleDateString("en-US", {
+      month: "short",
+      day: "numeric"
+    });
+  }
+  return val;
+};
 var RefundsChargebacksCard = function RefundsChargebacksCard(_ref) {
   var sx = _ref.sx,
     _ref$refundsChargebac = _ref.refundsChargebacksData,
@@ -6522,6 +6547,8 @@ var RefundsChargebacksCard = function RefundsChargebacksCard(_ref) {
   var dataMax = Math.max.apply(Math, [0].concat(_toConsumableArray(chargebackSeries), _toConsumableArray(refundSeries)));
   var hasChartData = dataMax > 0;
   var yAxisMax = hasChartData ? Math.ceil(Math.max(dataMax, 1) * 1.2) : 0.5;
+  var showXAxisLabels = categories.length <= 15;
+  var yAxisTickAmount = hasChartData ? 4 : 2;
   var chartOptions = {
     chart: {
       type: "area",
@@ -6556,6 +6583,7 @@ var RefundsChargebacksCard = function RefundsChargebacksCard(_ref) {
     },
     xaxis: {
       categories: categories,
+      tickAmount: 5,
       axisBorder: {
         show: false
       },
@@ -6563,8 +6591,10 @@ var RefundsChargebacksCard = function RefundsChargebacksCard(_ref) {
         show: false
       },
       labels: {
-        show: categories.length <= 15,
-        rotate: -45,
+        show: showXAxisLabels,
+        rotate: 0,
+        hideOverlappingLabels: true,
+        formatter: formatCategoryLabel$1,
         style: {
           colors: "rgba(0, 0, 0, 0.4)",
           fontSize: "10px"
@@ -6574,7 +6604,7 @@ var RefundsChargebacksCard = function RefundsChargebacksCard(_ref) {
     yaxis: {
       min: 0,
       max: yAxisMax,
-      tickAmount: 4,
+      tickAmount: yAxisTickAmount,
       labels: {
         formatter: function formatter(val) {
           return "".concat(parseFloat(val.toFixed(1)), "%");
@@ -6628,6 +6658,12 @@ var RefundsChargebacksCard = function RefundsChargebacksCard(_ref) {
     } : {},
     tooltip: {
       shared: true,
+      x: {
+        formatter: function formatter(_, _ref2) {
+          var dataPointIndex = _ref2.dataPointIndex;
+          return formatCategoryLabel$1(categories[dataPointIndex]);
+        }
+      },
       y: {
         formatter: function formatter(val) {
           return "".concat(parseFloat(val.toFixed(2)), "%");
@@ -6800,7 +6836,7 @@ var RefundsChargebacksCard = function RefundsChargebacksCard(_ref) {
       })
     }), /*#__PURE__*/jsxRuntime.jsx(material.Box, {
       sx: {
-        height: 140,
+        height: showXAxisLabels ? 160 : 140,
         width: "100%",
         flexShrink: 0
       },