@licklist/design 0.44.529 → 0.44.532
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/iframe/order-process/components/utils/useCategoryVerification.js +1 -1
- package/dist/sales/source-of-sales/SourceOfSalesChart.d.ts.map +1 -1
- package/dist/sales/source-of-sales/SourceOfSalesChart.js +1 -1
- package/package.json +1 -1
- package/src/iframe/order-process/components/utils/useCategoryVerification.ts +6 -6
- package/src/sales/source-of-sales/SourceOfSalesChart.tsx +31 -28
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@licklist/core/dist/Config"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@licklist/core/dist/Config"),n=require("react-i18next"),r=require("react-intl");exports.useCategoryVerification=function(){var t=n.useTranslation("Validation").t,i=r.useIntl().formatNumber;return function(n,r,u){var a,o=Object.values(n).filter((function(e){return(null==e?void 0:e.quantity)>0})),c=r.reduce((function(e,n){return e+n.products.filter((function(e){return o.map((function(e){return e.id})).includes(null==e?void 0:e.id)})).reduce((function(e,n){var r,t=(null===(r=o.find((function(e){return e.id===n.id})))||void 0===r?void 0:r.quantity)||1;return e+n.minSpend*t}),0)}),0),d=o.reduce((function(e,n){return e+n.price*n.quantity}),0);if(r.forEach((function(e){var n=e.minSubItems,r=e.maxSubItems,i=e.id,u=e.name;if(n||r){var c=o.filter((function(e){return(null==e?void 0:e.productsCategoryId)===i})).length;if(n&&c<n){var d=t("Validation:fieldMinNumber",{min:n,attribute:"number of products in the ".concat(u," category")});a={id:i,message:d}}else if(r&&c>r){d=t("Validation:fieldMaxNumber",{max:r,attribute:"number of products in the ".concat(u," category")});a={id:i,message:d}}}})),d<c&&!a&&u){var l=t("Design:minimumSpendSumValidation",{minSpend:i(c,{style:"currency",currency:e.Currency.GBP})});a={message:l}}return a}};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SourceOfSalesChart.d.ts","sourceRoot":"","sources":["../../../src/sales/source-of-sales/SourceOfSalesChart.tsx"],"names":[],"mappings":";AAMA,MAAM,WAAW,YAAY;IAC3B,MAAM,EAAE,MAAM,CAAC;IACf,IAAI,EAAE,MAAM,CAAC;IACb,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,MAAM,WAAW,kBAAkB;IACjC,IAAI,EAAE,YAAY,EAAE,CAAC;CACtB;AAcD,iBAAS,kBAAkB,CAAC,EAAE,IAAI,EAAE,EAAE,kBAAkB,
|
|
1
|
+
{"version":3,"file":"SourceOfSalesChart.d.ts","sourceRoot":"","sources":["../../../src/sales/source-of-sales/SourceOfSalesChart.tsx"],"names":[],"mappings":";AAMA,MAAM,WAAW,YAAY;IAC3B,MAAM,EAAE,MAAM,CAAC;IACf,IAAI,EAAE,MAAM,CAAC;IACb,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,MAAM,WAAW,kBAAkB;IACjC,IAAI,EAAE,YAAY,EAAE,CAAC;CACtB;AAcD,iBAAS,kBAAkB,CAAC,EAAE,IAAI,EAAE,EAAE,kBAAkB,eA4FvD;AAED,OAAO,EAAE,kBAAkB,EAAE,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,a=require("tslib"),t=require("react"),r=(e=t)&&"object"==typeof e&&"default"in e?e.default:e,n=require("react-i18next"),c=require("react-intl"),l=require("recharts"),o="affiliates";exports.SourceOfSalesChart=function(e){var i=e.data,s=t.useMemo((function(){return a.__spreadArray(a.__spreadArray([],a.__read(i),!1),[{source:2,name:o}],!1)}),[i]),u=n.useTranslation("Design").t,d=c.useIntl().formatNumber,m=a.__read(t.useState(44),2),p=m[0],f=m[1];return t.useEffect((function(){s.length>0&&f(44-22*s.length)}),[s]),r.createElement("div",{className:"source-of-sales"},r.createElement("div",{className:"source-of-sales__header"},u("sourceOfSales")),r.createElement("div",{className:"source-of-sales__pie-chart"}
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,a=require("tslib"),t=require("react"),r=(e=t)&&"object"==typeof e&&"default"in e?e.default:e,n=require("react-i18next"),c=require("react-intl"),l=require("recharts"),o="affiliates";exports.SourceOfSalesChart=function(e){var i=e.data,s=t.useMemo((function(){return a.__spreadArray(a.__spreadArray([],a.__read(i),!1),[{source:2,name:o}],!1)}),[i.length]),u=n.useTranslation("Design").t,d=c.useIntl().formatNumber,m=a.__read(t.useState(44),2),p=m[0],f=m[1];return t.useEffect((function(){s.length>0&&f(44-22*s.length)}),[s]),r.createElement("div",{className:"source-of-sales"},r.createElement("div",{className:"source-of-sales__header"},u("sourceOfSales")),r.createElement("div",{className:"source-of-sales__pie-chart"},!!i.length&&r.createElement(l.ResponsiveContainer,{debounce:100,width:"100%",height:"100%"},r.createElement(l.PieChart,null,r.createElement(l.Legend,{iconType:"circle",wrapperStyle:{left:170,top:20},layout:"vertical",verticalAlign:"top",content:function(e){var a=e.payload;return r.createElement(r.Fragment,null,a.map((function(e,a){var t,n,c,l=(null===(t=e.payload)||void 0===t?void 0:t.name)===o?"":" - ".concat(d(null===(n=e.payload)||void 0===n?void 0:n.percent,{style:"percent"})),i="iframe"===e.payload.name?"website":e.payload.name;return r.createElement("div",{className:"legend",key:"item-".concat(e.payload.source)},r.createElement("div",{className:"bullet-point colors-".concat((null===(c=e.payload)||void 0===c?void 0:c.name)===o?"pink":a%4)}),"".concat(u("".concat(i)),"\n ").concat(l))})))}}),r.createElement(l.Pie,{data:s,cx:80,cy:p,innerRadius:40,outerRadius:48,dataKey:"percentage"},i.map((function(e,a){var t=e.source;return r.createElement(l.Cell,{className:"colors-".concat(a%4),key:"cell-".concat(t)})})))))))};
|
package/package.json
CHANGED
|
@@ -27,12 +27,12 @@ export const useCategoryVerification = () => {
|
|
|
27
27
|
const selectedProducts = products.filter((product) =>
|
|
28
28
|
productArray.map((el) => el.id).includes(product?.id)
|
|
29
29
|
);
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
30
|
+
const productMinSpendsSum = selectedProducts.reduce((sum, product) => {
|
|
31
|
+
const quantity =
|
|
32
|
+
productArray.find((selected) => selected.id === product.id)
|
|
33
|
+
?.quantity || 1;
|
|
34
|
+
return sum + product.minSpend * quantity;
|
|
35
|
+
}, 0);
|
|
36
36
|
|
|
37
37
|
return acc + productMinSpendsSum;
|
|
38
38
|
}, 0);
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import React, {
|
|
1
|
+
import React, { useState, useMemo, useEffect } from "react";
|
|
2
2
|
import { useTranslation } from "react-i18next";
|
|
3
3
|
import { useIntl } from "react-intl";
|
|
4
4
|
|
|
@@ -35,7 +35,8 @@ function SourceOfSalesChart({ data }: SourceOfSalesProps) {
|
|
|
35
35
|
name: AFFILIATES,
|
|
36
36
|
},
|
|
37
37
|
],
|
|
38
|
-
|
|
38
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
39
|
+
[data.length]
|
|
39
40
|
);
|
|
40
41
|
const { t } = useTranslation("Design");
|
|
41
42
|
const { formatNumber } = useIntl();
|
|
@@ -86,32 +87,34 @@ function SourceOfSalesChart({ data }: SourceOfSalesProps) {
|
|
|
86
87
|
<div className="source-of-sales">
|
|
87
88
|
<div className="source-of-sales__header">{t("sourceOfSales")}</div>
|
|
88
89
|
<div className="source-of-sales__pie-chart">
|
|
89
|
-
|
|
90
|
-
<
|
|
91
|
-
<
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
90
|
+
{!!data.length && (
|
|
91
|
+
<ResponsiveContainer debounce={100} width="100%" height="100%">
|
|
92
|
+
<PieChart>
|
|
93
|
+
<Legend
|
|
94
|
+
iconType="circle"
|
|
95
|
+
wrapperStyle={{ left: 170, top: 20 }}
|
|
96
|
+
layout="vertical"
|
|
97
|
+
verticalAlign="top"
|
|
98
|
+
content={legendRenderer}
|
|
99
|
+
/>
|
|
100
|
+
<Pie
|
|
101
|
+
data={extendedData}
|
|
102
|
+
cx={80}
|
|
103
|
+
cy={defaultCYPosition}
|
|
104
|
+
innerRadius={40}
|
|
105
|
+
outerRadius={48}
|
|
106
|
+
dataKey="percentage"
|
|
107
|
+
>
|
|
108
|
+
{data.map(({ source }: PieChartData, index) => (
|
|
109
|
+
<Cell
|
|
110
|
+
className={`colors-${index % 4}`}
|
|
111
|
+
key={`cell-${source}`}
|
|
112
|
+
/>
|
|
113
|
+
))}
|
|
114
|
+
</Pie>
|
|
115
|
+
</PieChart>
|
|
116
|
+
</ResponsiveContainer>
|
|
117
|
+
)}
|
|
115
118
|
</div>
|
|
116
119
|
</div>
|
|
117
120
|
);
|