@ammarkhalidfarooq/dashboard-package 0.6.19 → 0.6.20

package/dist/index.cjs.js

@@ -572,6 +572,8 @@ var RenderChartCard = function RenderChartCard(_ref) {
     setMetric = _ref.setMetric,
     _ref$md = _ref.md,
     md = _ref$md === void 0 ? 4 : _ref$md,
+    _ref$numberOfDays = _ref.numberOfDays,
+    numberOfDays = _ref$numberOfDays === void 0 ? 30 : _ref$numberOfDays,
     _ref$type = _ref.type,
     type = _ref$type === void 0 ? "area" : _ref$type,
     _ref$sx = _ref.sx,
@@ -580,6 +582,7 @@ var RenderChartCard = function RenderChartCard(_ref) {
     cardSx = _ref$cardSx === void 0 ? {} : _ref$cardSx,
     _ref$contentSx = _ref.contentSx,
     contentSx = _ref$contentSx === void 0 ? {} : _ref$contentSx;
+  var daysLabel = "".concat(numberOfDays, " day").concat(numberOfDays === 1 ? "" : "s");
   return /*#__PURE__*/jsxRuntime.jsx(material.Grid, {
     item: true,
     xs: 12,
@@ -631,7 +634,7 @@ var RenderChartCard = function RenderChartCard(_ref) {
                 display: "block",
                 mb: 1.5
               },
-              children: item.subtitle || "Last 30 days · daily aggregation"
+              children: item.subtitle || "Last ".concat(daysLabel, " \xB7 daily aggregation")
             }), /*#__PURE__*/jsxRuntime.jsxs(material.Box, {
               sx: {
                 display: "flex",
@@ -873,7 +876,9 @@ var Dashboard = function Dashboard(_ref) {
     _ref$exportTrigger = _ref.exportTrigger,
     exportTrigger = _ref$exportTrigger === void 0 ? 0 : _ref$exportTrigger,
     _ref$apiLoading = _ref.apiLoading,
-    apiLoading = _ref$apiLoading === void 0 ? false : _ref$apiLoading;
+    apiLoading = _ref$apiLoading === void 0 ? false : _ref$apiLoading,
+    _ref$numberOfDays = _ref.numberOfDays,
+    numberOfDays = _ref$numberOfDays === void 0 ? 1 : _ref$numberOfDays;
   return /*#__PURE__*/jsxRuntime.jsx(material.ThemeProvider, {
     theme: theme,
     children: /*#__PURE__*/jsxRuntime.jsx(React.Suspense, {
@@ -885,6 +890,7 @@ var Dashboard = function Dashboard(_ref) {
         children: /*#__PURE__*/jsxRuntime.jsx(material.CircularProgress, {})
       }),
       children: /*#__PURE__*/jsxRuntime.jsx(NewOverview$1, {
+        numberOfDays: numberOfDays,
         apiData: apiData,
         activeSection: overviewType,
         dateName: dateName,
@@ -1992,7 +1998,8 @@ var PageHeader = function PageHeader(_ref9) {
   var dateLabel = _ref9.dateLabel,
     generatedLabel = _ref9.generatedLabel,
     activeFilters = _ref9.activeFilters,
-    page = _ref9.page;
+    page = _ref9.page,
+    windowLabel = _ref9.windowLabel;
   return /*#__PURE__*/jsxRuntime.jsxs("div", {
     style: {
       padding: "22px ".concat(MX, "px 12px"),
@@ -2058,7 +2065,7 @@ var PageHeader = function PageHeader(_ref9) {
             color: THEME.muted,
             marginTop: 1
           },
-          children: ["30-day window \xB7 Generated ", generatedLabel]
+          children: [windowLabel, " \xB7 Generated ", generatedLabel]
         })]
       }), /*#__PURE__*/jsxRuntime.jsxs("div", {
         style: {
@@ -2123,8 +2130,12 @@ var ExportPdfLayout = /*#__PURE__*/React.forwardRef(function (_ref1, ref) {
   var _ref1$apiData = _ref1.apiData,
     apiData = _ref1$apiData === void 0 ? {} : _ref1$apiData,
     _ref1$dateName = _ref1.dateName,
-    dateName = _ref1$dateName === void 0 ? "Last Period" : _ref1$dateName;
+    dateName = _ref1$dateName === void 0 ? "Last Period" : _ref1$dateName,
+    _ref1$numberOfDays = _ref1.numberOfDays,
+    numberOfDays = _ref1$numberOfDays === void 0 ? 30 : _ref1$numberOfDays;
   var now = new Date();
+  var daysLabel = "".concat(numberOfDays, " day").concat(numberOfDays === 1 ? "" : "s");
+  var windowLabel = "".concat(numberOfDays, "-day window");
   var generatedLabel = now.toLocaleDateString("en-US", {
     month: "short",
     day: "numeric",
@@ -2285,7 +2296,8 @@ var ExportPdfLayout = /*#__PURE__*/React.forwardRef(function (_ref1, ref) {
   var headerProps = {
     dateLabel: dateLabel,
     generatedLabel: generatedLabel,
-    activeFilters: activeFilters
+    activeFilters: activeFilters,
+    windowLabel: windowLabel
   };
   return /*#__PURE__*/jsxRuntime.jsxs("div", {
     ref: ref,
@@ -2388,13 +2400,13 @@ var ExportPdfLayout = /*#__PURE__*/React.forwardRef(function (_ref1, ref) {
                   color: "#111827"
                 },
                 children: "Total revenue trend"
-              }), /*#__PURE__*/jsxRuntime.jsx("div", {
+              }), /*#__PURE__*/jsxRuntime.jsxs("div", {
                 style: {
                   fontSize: 9.5,
                   color: "#9CA3AF",
                   marginTop: 1
                 },
-                children: "Last 30 days \xB7 daily aggregation"
+                children: ["Last ", daysLabel, " \xB7 daily aggregation"]
               })]
             }), /*#__PURE__*/jsxRuntime.jsxs("div", {
               style: {
@@ -2714,7 +2726,7 @@ var ExportPdfLayout = /*#__PURE__*/React.forwardRef(function (_ref1, ref) {
             })
           }), /*#__PURE__*/jsxRuntime.jsxs(Panel, {
             title: "Refunds & chargebacks",
-            subtitle: "Trust health \xB7 30-day window",
+            subtitle: "Trust health \xB7 ".concat(numberOfDays, "-day window"),
             children: [/*#__PURE__*/jsxRuntime.jsxs("div", {
               style: {
                 display: "flex",
@@ -2783,7 +2795,7 @@ var ExportPdfLayout = /*#__PURE__*/React.forwardRef(function (_ref1, ref) {
             })]
           }), /*#__PURE__*/jsxRuntime.jsx(Panel, {
             title: "Traffic source",
-            subtitle: "Revenue by channel \xB7 30 days",
+            subtitle: "Revenue by channel \xB7 ".concat(daysLabel),
             children: /*#__PURE__*/jsxRuntime.jsx(MiniTable, {
               head: ["SOURCE", "REVENUE", "SHARE"],
               rows: [].concat(_toConsumableArray(trafficItems.map(function (t) {
@@ -2799,7 +2811,7 @@ var ExportPdfLayout = /*#__PURE__*/React.forwardRef(function (_ref1, ref) {
           },
           children: [/*#__PURE__*/jsxRuntime.jsxs(Panel, {
             title: "Order Bump",
-            subtitle: "Revenue trend \xB7 last 30 days",
+            subtitle: "Revenue trend \xB7 last ".concat(daysLabel),
             children: [/*#__PURE__*/jsxRuntime.jsx("div", {
               style: {
                 fontSize: 17,
@@ -2922,7 +2934,7 @@ var ExportPdfLayout = /*#__PURE__*/React.forwardRef(function (_ref1, ref) {
             })
           }), /*#__PURE__*/jsxRuntime.jsxs(Panel, {
             title: "Referrals",
-            subtitle: "Revenue trend \xB7 last 30 days",
+            subtitle: "Revenue trend \xB7 last ".concat(daysLabel),
             children: [/*#__PURE__*/jsxRuntime.jsx("div", {
               style: {
                 fontSize: 17,
@@ -3084,7 +3096,9 @@ var EmailSection$2 = /*#__PURE__*/React.lazy(function () {
   return Promise.resolve().then(function () { return EmailSection$1; });
 });
 var NewOverview = function NewOverview(_ref) {
-  var _ref$apiData = _ref.apiData,
+  var _ref$numberOfDays = _ref.numberOfDays,
+    numberOfDays = _ref$numberOfDays === void 0 ? 1 : _ref$numberOfDays,
+    _ref$apiData = _ref.apiData,
     apiData = _ref$apiData === void 0 ? {} : _ref$apiData,
     activeSectionProp = _ref.activeSection,
     _ref$dateName = _ref.dateName,
@@ -3361,6 +3375,7 @@ var NewOverview = function NewOverview(_ref) {
         tertiaryCharts: tertiaryCharts,
         quaternaryCharts: quaternaryCharts,
         dateName: dateName,
+        numberOfDays: numberOfDays,
         apiLoading: apiLoading
       }), activeSection === "Paid" && /*#__PURE__*/jsxRuntime.jsx(PaidSection$2, {
         apiData: apiData,
@@ -3370,14 +3385,16 @@ var NewOverview = function NewOverview(_ref) {
         children: /*#__PURE__*/jsxRuntime.jsx(OrganicSection$2, {
           apiData: apiData,
           dateName: dateName,
-          apiLoading: apiLoading
+          apiLoading: apiLoading,
+          numberOfDays: numberOfDays
         })
       }), activeSection === "Email" && /*#__PURE__*/jsxRuntime.jsx(material.Box, {
         sx: {},
         children: /*#__PURE__*/jsxRuntime.jsx(EmailSection$2, {
           apiData: apiData,
           dateName: dateName,
-          apiLoading: apiLoading
+          apiLoading: apiLoading,
+          numberOfDays: numberOfDays
         })
       })]
     }), showExportLayout && /*#__PURE__*/jsxRuntime.jsx("div", {
@@ -3394,7 +3411,8 @@ var NewOverview = function NewOverview(_ref) {
       children: /*#__PURE__*/jsxRuntime.jsx(ExportPdfLayout, {
         ref: exportLayoutRef,
         apiData: apiData,
-        dateName: dateName
+        dateName: dateName,
+        numberOfDays: numberOfDays
       })
     })]
   });
@@ -3895,13 +3913,16 @@ var DonorMixCard = function DonorMixCard(_ref) {
 var TrafficSourceCard = function TrafficSourceCard(_ref) {
   var _ref$title = _ref.title,
     title = _ref$title === void 0 ? "Traffic source" : _ref$title,
-    _ref$subtitle = _ref.subtitle,
-    subtitle = _ref$subtitle === void 0 ? "Revenue by channel · 30 days" : _ref$subtitle,
+    subtitle = _ref.subtitle,
     _ref$trafficSourceDat = _ref.trafficSourceData,
     trafficSourceData = _ref$trafficSourceDat === void 0 ? [] : _ref$trafficSourceDat,
     _ref$total = _ref.total,
     total = _ref$total === void 0 ? "$0" : _ref$total,
-    sx = _ref.sx;
+    sx = _ref.sx,
+    _ref$numberOfDays = _ref.numberOfDays,
+    numberOfDays = _ref$numberOfDays === void 0 ? 30 : _ref$numberOfDays;
+  var daysLabel = "".concat(numberOfDays, " day").concat(numberOfDays === 1 ? "" : "s");
+  var resolvedSubtitle = subtitle || "Revenue by channel \xB7 ".concat(daysLabel);
   var paidAdsColor = "rgb(99, 99, 230)";
   var organicColor = "#10B981";
   var emailColor = "#0EA5E9";
@@ -3947,7 +3968,7 @@ var TrafficSourceCard = function TrafficSourceCard(_ref) {
           mb: 0.5,
           textAlign: "left"
         },
-        children: subtitle
+        children: resolvedSubtitle
       })]
     }), /*#__PURE__*/jsxRuntime.jsxs(material.Box, {
       sx: {
@@ -5001,7 +5022,9 @@ var LandingPagesCard = function LandingPagesCard(_ref2) {
 var KeywordsCard = function KeywordsCard(_ref3) {
   var dataProp = _ref3.data,
     _ref3$available = _ref3.available,
-    available = _ref3$available === void 0 ? true : _ref3$available;
+    available = _ref3$available === void 0 ? true : _ref3$available,
+    _ref3$numberOfDays = _ref3.numberOfDays,
+    numberOfDays = _ref3$numberOfDays === void 0 ? 30 : _ref3$numberOfDays;
   var data = dataProp !== null && dataProp !== void 0 ? dataProp : [{
     keyword: "zakat calculator",
     clicks: "1,240",
@@ -5033,9 +5056,10 @@ var KeywordsCard = function KeywordsCard(_ref3) {
     trend: "Improving",
     trendType: "up"
   }];
+  var daysLabel = "".concat(numberOfDays, " day").concat(numberOfDays === 1 ? "" : "s");
   return /*#__PURE__*/jsxRuntime.jsx(CardWrapper, {
     title: "Top organic keywords",
-    subtitle: "Search terms ranked by clicks \xB7 last 30 days",
+    subtitle: "Search terms ranked by clicks \xB7 last ".concat(daysLabel),
     children: !available || data.length === 0 ? /*#__PURE__*/jsxRuntime.jsx(material.Typography, {
       sx: {
         fontSize: "13px",
@@ -5818,7 +5842,10 @@ var PaidDonorGeographyCard = function PaidDonorGeographyCard(_ref8) {
 var RefundsChargebacksCard = function RefundsChargebacksCard(_ref) {
   var sx = _ref.sx,
     _ref$refundsChargebac = _ref.refundsChargebacksData,
-    refundsChargebacksData = _ref$refundsChargebac === void 0 ? {} : _ref$refundsChargebac;
+    refundsChargebacksData = _ref$refundsChargebac === void 0 ? {} : _ref$refundsChargebac,
+    _ref$numberOfDays = _ref.numberOfDays,
+    numberOfDays = _ref$numberOfDays === void 0 ? 30 : _ref$numberOfDays;
+  var windowLabel = "".concat(numberOfDays, "-day window");
   var _refundsChargebacksDa = refundsChargebacksData.refundRate,
     refundRate = _refundsChargebacksDa === void 0 ? 0 : _refundsChargebacksDa,
     _refundsChargebacksDa2 = refundsChargebacksData.chargebackRate,
@@ -5993,13 +6020,13 @@ var RefundsChargebacksCard = function RefundsChargebacksCard(_ref) {
           textAlign: "left"
         },
         children: "Refunds & chargebacks"
-      }), /*#__PURE__*/jsxRuntime.jsx(material.Typography, {
+      }), /*#__PURE__*/jsxRuntime.jsxs(material.Typography, {
         sx: {
           fontSize: "13px",
           color: "rgba(0, 0, 0, 0.4)",
           textAlign: "left"
         },
-        children: "Trust health \xB7 30-day window"
+        children: ["Trust health \xB7 ", windowLabel]
       })]
     }), /*#__PURE__*/jsxRuntime.jsxs(material.Box, {
       sx: {
@@ -6180,6 +6207,9 @@ var OverallDetailsGrid = function OverallDetailsGrid(_ref) {
     _ref$refundsChargebac = _ref.refundsChargebacksData,
     refundsChargebacksData = _ref$refundsChargebac === void 0 ? [] : _ref$refundsChargebac;
     _ref.dateName;
+    var _ref$numberOfDays = _ref.numberOfDays,
+    numberOfDays = _ref$numberOfDays === void 0 ? 30 : _ref$numberOfDays;
+  var daysLabel = "".concat(numberOfDays, " day").concat(numberOfDays === 1 ? "" : "s");
   var _donorMix$newDonors = donorMix.newDonors,
     newDonors = _donorMix$newDonors === void 0 ? 0 : _donorMix$newDonors,
     _donorMix$returningDo = donorMix.returningDonors,
@@ -6294,17 +6324,19 @@ var OverallDetailsGrid = function OverallDetailsGrid(_ref) {
       donorGeographyData: donorGeographyData
     }), /*#__PURE__*/jsxRuntime.jsx(RefundsChargebacksCard, {
       sx: CARD_SX,
-      refundsChargebacksData: refundsChargebacksData
+      refundsChargebacksData: refundsChargebacksData,
+      numberOfDays: numberOfDays
     }), /*#__PURE__*/jsxRuntime.jsx(TrafficSourceCard, {
       sx: CARD_SX,
       trafficSourceData: (trafficSourceData === null || trafficSourceData === void 0 ? void 0 : trafficSourceData.data) || [],
-      total: "$".concat(formatNumber((trafficSourceData === null || trafficSourceData === void 0 ? void 0 : trafficSourceData.totalRevenue) || 0))
+      total: "$".concat(formatNumber((trafficSourceData === null || trafficSourceData === void 0 ? void 0 : trafficSourceData.totalRevenue) || 0)),
+      numberOfDays: numberOfDays
     })]
   });
   var bottomCards = /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
     children: [/*#__PURE__*/jsxRuntime.jsx(MetricSparklineCard, {
       title: "Order Bump",
-      subtitle: "Revenue trend \xB7 last 30 days",
+      subtitle: "Revenue trend \xB7 last ".concat(daysLabel),
       value: "$".concat(formatNumber((orderBumpData === null || orderBumpData === void 0 ? void 0 : orderBumpData.totalRevenue) || 0)),
       trend: "".concat((orderBumpData === null || orderBumpData === void 0 ? void 0 : orderBumpData.growthPercentage) >= 0 ? "▲" : "▼", " ").concat(Math.abs((orderBumpData === null || orderBumpData === void 0 ? void 0 : orderBumpData.growthPercentage) || 0).toFixed(1), "% vs previous period"),
       chartData: (orderBumpData === null || orderBumpData === void 0 || (_orderBumpData$chart = orderBumpData.chart) === null || _orderBumpData$chart === void 0 ? void 0 : _orderBumpData$chart.map(function (item) {
@@ -6346,7 +6378,7 @@ var OverallDetailsGrid = function OverallDetailsGrid(_ref) {
       sx: CARD_SX
     }), /*#__PURE__*/jsxRuntime.jsx(MetricSparklineCard, {
       title: "Referrals",
-      subtitle: "Revenue trend \xB7 last 30 days",
+      subtitle: "Revenue trend \xB7 last ".concat(daysLabel),
       value: "$".concat(formatNumber((referralData === null || referralData === void 0 ? void 0 : referralData.totalRevenue) || 0)),
       trend: "\u25B2 ".concat((referralData === null || referralData === void 0 ? void 0 : referralData.growthPercentage) || 0, "% vs previous period"),
       chartData: (referralData === null || referralData === void 0 || (_referralData$chartDa = referralData.chartData) === null || _referralData$chartDa === void 0 ? void 0 : _referralData$chartDa.map(function (item) {
@@ -16567,6 +16599,8 @@ var OverallSection = function OverallSection(_ref) {
     tertiaryCharts = _ref.tertiaryCharts,
     quaternaryCharts = _ref.quaternaryCharts,
     dateName = _ref.dateName,
+    _ref$numberOfDays = _ref.numberOfDays,
+    numberOfDays = _ref$numberOfDays === void 0 ? 30 : _ref$numberOfDays,
     _ref$apiLoading = _ref.apiLoading,
     apiLoading = _ref$apiLoading === void 0 ? false : _ref$apiLoading;
   var _useState = React.useState("Total Raised"),
@@ -17005,6 +17039,7 @@ var OverallSection = function OverallSection(_ref) {
         md: 12,
         isPremium: true,
         isPrimary: true,
+        numberOfDays: numberOfDays,
         metric: activeMetric.includes("Raised") || activeMetric.includes("donation") ? "Revenue" : "Donors"
       })
     }), /*#__PURE__*/jsxRuntime.jsx(OverallDetailsGrid, {
@@ -17038,7 +17073,8 @@ var OverallSection = function OverallSection(_ref) {
       downsellData: downsellData,
       referralData: referralData,
       refundsChargebacksData: refundsChargebacksData,
-      dateName: dateName
+      dateName: dateName,
+      numberOfDays: numberOfDays
     })]
   });
 };
@@ -17390,7 +17426,9 @@ var OrganicSection = function OrganicSection(_ref) {
     _ref$dateName = _ref.dateName,
     dateName = _ref$dateName === void 0 ? "Last Period" : _ref$dateName,
     _ref$apiLoading = _ref.apiLoading,
-    apiLoading = _ref$apiLoading === void 0 ? false : _ref$apiLoading;
+    apiLoading = _ref$apiLoading === void 0 ? false : _ref$apiLoading,
+    _ref$numberOfDays = _ref.numberOfDays,
+    numberOfDays = _ref$numberOfDays === void 0 ? 30 : _ref$numberOfDays;
   var _useState = React.useState("Organic Users"),
     _useState2 = _slicedToArray(_useState, 2),
     activeMetric = _useState2[0],
@@ -17677,7 +17715,8 @@ var OrganicSection = function OrganicSection(_ref) {
         md: 12,
         type: "area",
         isPrimary: true,
-        isPremium: true
+        isPremium: true,
+        numberOfDays: numberOfDays
       }), /*#__PURE__*/jsxRuntime.jsx(material.Grid, {
         item: true,
         xs: 12,
@@ -17738,7 +17777,8 @@ var OrganicSection = function OrganicSection(_ref) {
         },
         children: /*#__PURE__*/jsxRuntime.jsx(KeywordsCard, {
           data: keywordsData,
-          available: hasOrganicOverview ? (apiData === null || apiData === void 0 || (_apiData$topOrganicKe3 = apiData.topOrganicKeywords) === null || _apiData$topOrganicKe3 === void 0 ? void 0 : _apiData$topOrganicKe3.available) !== false : true
+          available: hasOrganicOverview ? (apiData === null || apiData === void 0 || (_apiData$topOrganicKe3 = apiData.topOrganicKeywords) === null || _apiData$topOrganicKe3 === void 0 ? void 0 : _apiData$topOrganicKe3.available) !== false : true,
+          numberOfDays: numberOfDays
         })
       }), /*#__PURE__*/jsxRuntime.jsx(material.Grid, {
         item: true,
@@ -18090,11 +18130,14 @@ var EmailSection = function EmailSection(_ref) {
     _ref$dateName = _ref.dateName,
     dateName = _ref$dateName === void 0 ? "Last Period" : _ref$dateName,
     _ref$apiLoading = _ref.apiLoading,
-    apiLoading = _ref$apiLoading === void 0 ? false : _ref$apiLoading;
+    apiLoading = _ref$apiLoading === void 0 ? false : _ref$apiLoading,
+    _ref$numberOfDays = _ref.numberOfDays,
+    numberOfDays = _ref$numberOfDays === void 0 ? 30 : _ref$numberOfDays;
   var _useState = React.useState("Total raised"),
     _useState2 = _slicedToArray(_useState, 2),
     activeMetric = _useState2[0],
     setActiveMetric = _useState2[1];
+  var daysLabel = "".concat(numberOfDays, " day").concat(numberOfDays === 1 ? "" : "s");
   var overview = (apiData === null || apiData === void 0 ? void 0 : apiData.overview) || {};
   var overviewGrowth = (overview === null || overview === void 0 ? void 0 : overview.growthPercentage) || {};
   var deliverability = (apiData === null || apiData === void 0 ? void 0 : apiData.deliverability) || {};
@@ -18365,7 +18408,7 @@ var EmailSection = function EmailSection(_ref) {
         },
         children: /*#__PURE__*/jsxRuntime.jsx(EmailTrendCard, {
           title: "Open rate trend",
-          subtitle: "Daily \xB7 30 days",
+          subtitle: "Daily \xB7 ".concat(daysLabel),
           value: hasEmailOverview ? "".concat(Number((_deliverability$openR2 = deliverability.openRate) !== null && _deliverability$openR2 !== void 0 ? _deliverability$openR2 : 0).toFixed(2), "%") : "42.3%",
           trend: hasEmailOverview ? formatTrendBadge(deliverabilityGrowth.openRate, true) : "2.1pp",
           trendData: hasEmailOverview ? apiData === null || apiData === void 0 ? void 0 : apiData.openRateTrend : undefined,
@@ -18392,7 +18435,7 @@ var EmailSection = function EmailSection(_ref) {
         },
         children: /*#__PURE__*/jsxRuntime.jsx(EmailTrendCard, {
           title: "Clicks trend",
-          subtitle: "Total + unique \xB7 30 days",
+          subtitle: "Total + unique \xB7 ".concat(daysLabel),
           value: hasEmailOverview ? formatNumber((_deliverability$total2 = deliverability.totalClicks) !== null && _deliverability$total2 !== void 0 ? _deliverability$total2 : 0) : "1,612",
           trend: hasEmailOverview ? formatTrendBadge(deliverabilityGrowth.totalClicks) : "14%",
           trendSeries: hasEmailOverview ? [{