@ammarkhalidfarooq/dashboard-package 0.4.92 → 0.4.93

package/dist/index.cjs.js

@@ -3045,14 +3045,14 @@ var TrafficSourceCard = function TrafficSourceCard(_ref) {
     _ref$trafficSourceDat = _ref.trafficSourceData,
     trafficSourceData = _ref$trafficSourceDat === void 0 ? [] : _ref$trafficSourceDat,
     _ref$total = _ref.total,
-    total = _ref$total === void 0 ? "$240.9K" : _ref$total,
+    total = _ref$total === void 0 ? "$0" : _ref$total,
     sx = _ref.sx;
   var paidAdsColor = "rgb(99, 99, 230)";
   var organicColor = "#10B981";
   var emailColor = "#0EA5E9";
   var directColor = "#94A3B8";
-  var getSourceColor = function getSourceColor(label) {
-    switch (label) {
+  var getSourceColor = function getSourceColor(source) {
+    switch (source) {
       case "Paid Ads":
         return paidAdsColor;
       case "Organic":
@@ -3072,12 +3072,10 @@ var TrafficSourceCard = function TrafficSourceCard(_ref) {
       border: "1px solid #f0f0f0",
       boxShadow: "0 4px 24px rgba(0,0,0,0.06)",
       bgcolor: "#fff",
-      // height: "100%",
       display: "flex",
       flexDirection: "column"
     }, sx),
     children: [/*#__PURE__*/jsxRuntime.jsxs(material.Box, {
-      sx: {},
       children: [/*#__PURE__*/jsxRuntime.jsx(material.Typography, {
         sx: {
           fontWeight: 700,
@@ -3108,8 +3106,7 @@ var TrafficSourceCard = function TrafficSourceCard(_ref) {
           fontSize: "12px",
           fontWeight: 700,
           color: "rgba(0, 0, 0, 0.3)",
-          letterSpacing: "0.05em",
-          textAlign: "left"
+          letterSpacing: "0.05em"
         },
         children: "SOURCE"
       }), /*#__PURE__*/jsxRuntime.jsx(material.Typography, {
@@ -3117,8 +3114,7 @@ var TrafficSourceCard = function TrafficSourceCard(_ref) {
           fontSize: "12px",
           fontWeight: 700,
           color: "rgba(0, 0, 0, 0.3)",
-          letterSpacing: "0.05em",
-          textAlign: "left"
+          letterSpacing: "0.05em"
         },
         children: "REVENUE"
       }), /*#__PURE__*/jsxRuntime.jsx(material.Typography, {
@@ -3132,38 +3128,42 @@ var TrafficSourceCard = function TrafficSourceCard(_ref) {
         children: "SHARE"
       })]
     }), /*#__PURE__*/jsxRuntime.jsx(material.Box, {
-      children: trafficSourceData.map(function (item, index) {
-        var _item$share;
+      children: trafficSourceData === null || trafficSourceData === void 0 ? void 0 : trafficSourceData.map(function (item, index) {
+        var shareValue = Number(item.share || 0);
         return /*#__PURE__*/jsxRuntime.jsxs(material.Box, {
           sx: {
             display: "grid",
             gridTemplateColumns: "2.5fr 1.5fr 2fr",
             gap: 2,
-            py: 0.5,
+            py: 0.75,
             alignItems: "center"
-            // borderBottom:
-            //   index === trafficSourceData.length - 1 ? "none" : "1px solid #f5f5f5",
           },
           children: [/*#__PURE__*/jsxRuntime.jsxs(material.Box, {
             sx: {
               display: "flex",
               alignItems: "center",
-              gap: 1
+              gap: 1,
+              minWidth: 0
             },
             children: [/*#__PURE__*/jsxRuntime.jsx(material.Box, {
               sx: {
                 width: 10,
                 height: 10,
-                bgcolor: getSourceColor(item.label),
-                borderRadius: "2px"
+                bgcolor: getSourceColor(item.source),
+                borderRadius: "2px",
+                flexShrink: 0
               }
             }), /*#__PURE__*/jsxRuntime.jsx(material.Typography, {
               sx: {
                 fontSize: "14px",
                 fontWeight: 600,
-                color: "rgba(0, 0, 0, 0.7)"
+                color: "rgba(0, 0, 0, 0.7)",
+                overflow: "hidden",
+                textOverflow: "ellipsis",
+                whiteSpace: "nowrap"
               },
-              children: item.label
+              title: item.source,
+              children: item.source
             })]
           }), /*#__PURE__*/jsxRuntime.jsxs(material.Typography, {
             sx: {
@@ -3186,35 +3186,33 @@ var TrafficSourceCard = function TrafficSourceCard(_ref) {
               },
               children: /*#__PURE__*/jsxRuntime.jsx(material.LinearProgress, {
                 variant: "determinate",
-                value: item.share,
+                value: Math.max(shareValue, 0),
                 sx: {
                   height: 6,
                   borderRadius: 3,
                   bgcolor: "#F3F4F6",
                   "& .MuiLinearProgress-bar": {
                     borderRadius: 3,
-                    bgcolor: getSourceColor(item.label)
+                    bgcolor: getSourceColor(item.source)
                   }
                 }
               })
-            }), /*#__PURE__*/jsxRuntime.jsxs(material.Typography, {
+            }), /*#__PURE__*/jsxRuntime.jsx(material.Typography, {
               sx: {
                 fontSize: "14px",
                 fontWeight: 700,
                 color: "#000",
-                minWidth: "30px",
+                minWidth: "40px",
                 textAlign: "right"
               },
-              children: [(_item$share = item.share) === null || _item$share === void 0 ? void 0 : _item$share.toFixed(0), "%"]
+              children: shareValue < 1 && shareValue > 0 ? "".concat(shareValue.toFixed(2), "%") : "".concat(shareValue.toFixed(0), "%")
             })]
           })]
-        }, index);
+        }, "".concat(item.source, "-").concat(index));
       })
     }), /*#__PURE__*/jsxRuntime.jsxs(material.Box, {
       sx: {
-        mt: 0,
         pt: 2,
-        // borderTop: "1px solid #f0f0f0",
         display: "flex",
         justifyContent: "space-between",
         alignItems: "center"
@@ -5287,7 +5285,7 @@ var OverallSection = function OverallSection(_ref) {
     setActiveMetric = _useState2[1];
   var donationTypeData = (apiData === null || apiData === void 0 ? void 0 : apiData.recurringBarChartData) || [];
   var donorGeographyData = (apiData === null || apiData === void 0 ? void 0 : apiData.donorGeography) || [];
-  var trafficSourceData = (apiData === null || apiData === void 0 ? void 0 : apiData.trafficSource1) || [];
+  var trafficSourceData = (apiData === null || apiData === void 0 ? void 0 : apiData.trafficSourceData) || [];
   var orderBumpData = (apiData === null || apiData === void 0 ? void 0 : apiData.orderBumpData1) || [];
   var upsellData = (apiData === null || apiData === void 0 ? void 0 : apiData.upsellData1) || [];
   var downsellData = (apiData === null || apiData === void 0 ? void 0 : apiData.downsellData1) || [];
@@ -5874,7 +5872,8 @@ var OverallSection = function OverallSection(_ref) {
         sx: {
           maxHeight: 280
         },
-        trafficSourceData: trafficSourceData
+        trafficSourceData: trafficSourceData,
+        total: "$".concat(formatNumber((trafficSourceData === null || trafficSourceData === void 0 ? void 0 : trafficSourceData.totalRevenue) || 0))
       }), /*#__PURE__*/jsxRuntime.jsx(MetricSparklineCard, {
         title: "Order Bump",
         subtitle: "Revenue trend \xB7 last 30 days",