@licklist/design 0.44.530 → 0.44.533

package/dist/events/event-card/EventCard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EventCard.d.ts","sourceRoot":"","sources":["../../../src/events/event-card/EventCard.tsx"],"names":[],"mappings":";AAMA,OAAO,EAAE,iBAAiB,EAAE,MAAM,oDAAoD,CAAC;AACvF,OAAO,EAAE,cAAc,EAAE,MAAM,kEAAkE,CAAC;AAElG,OAAO,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAK5C,MAAM,WAAW,cAAe,SAAQ,iBAAiB;IACvD,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,EAAE,MAAM,CAAC;IACpB,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,KAAK,CAAC,EAAE,IAAI,EAAE,CAAC;IACf,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,cAAc,CAAC,EAAE,cAAc,GAAG,IAAI,CAAC;IACvC,WAAW,EAAE,MAAM,IAAI,CAAC;IACxB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,wBAAgB,SAAS,CAAC,EACxB,IAAI,EACJ,WAAW,EACX,IAAI,EACJ,QAAQ,EACR,KAAK,EACL,SAAS,EACT,MAAM,EACN,MAAM,EACN,QAAQ,EACR,aAAoB,EACpB,WAAW,EACX,cAAc,EACd,OAAO,EACP,aAAa,GACd,EAAE,cAAc,eAiIhB"}
+{"version":3,"file":"EventCard.d.ts","sourceRoot":"","sources":["../../../src/events/event-card/EventCard.tsx"],"names":[],"mappings":";AAMA,OAAO,EAAE,iBAAiB,EAAE,MAAM,oDAAoD,CAAC;AACvF,OAAO,EAAE,cAAc,EAAE,MAAM,kEAAkE,CAAC;AAElG,OAAO,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAS5C,MAAM,WAAW,cAAe,SAAQ,iBAAiB;IACvD,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,EAAE,MAAM,CAAC;IACpB,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,KAAK,CAAC,EAAE,IAAI,EAAE,CAAC;IACf,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,cAAc,CAAC,EAAE,cAAc,GAAG,IAAI,CAAC;IACvC,WAAW,EAAE,MAAM,IAAI,CAAC;IACxB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,wBAAgB,SAAS,CAAC,EACxB,IAAI,EACJ,WAAW,EACX,IAAI,EACJ,QAAQ,EACR,KAAK,EACL,SAAS,EACT,MAAM,EACN,MAAM,EACN,QAAQ,EACR,aAAoB,EACpB,WAAW,EACX,cAAc,EACd,OAAO,EACP,aAAa,GACd,EAAE,cAAc,eAiIhB"}

package/dist/events/event-card/EventCard.js

@@ -1 +1 @@
-"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=require("tslib"),a=require("react"),n=e(a),r=require("@licklist/core/dist/Config"),l=require("react-i18next"),c=require("react-bootstrap"),i=require("../../static/Icon.js"),s=e(require("clsx")),m=require("react-intl"),o=require("../../tiptap-editor/TipTapEditor.js"),u=require("./utils.js"),d=require("../../assets/dashboard/chartBar.svg.js");exports.EventCard=function(e){var v=e.name,E=e.description,p=e.date,y=e.imageUrl,f=e.sales,b=e.onPreview,N=e.onEdit,k=e.onCopy,C=e.onRemove,x=e.hasPermission,g=void 0===x||x,q=e.onStatistic,w=e.eventStatistic,h=e.titleId,j=e.descriptionId,T=l.useTranslation("Design").t,I=m.useIntl(),B=I.formatNumber,P=I.formatDate,_=u.getStatisticInfo(w,p),D=_.totalViews,M=t.__rest(_,["totalViews"]),S=a.useMemo((function(){return u.formatContent(E,300)}),[E]);return n.createElement(c.Card,{className:"d-flex flex-column event-card h-100"},n.createElement("div",{className:s("event-card-image-container",!y&&"no-image")},y&&n.createElement(c.Card.Img,{variant:"top",src:y}),n.createElement(c.Badge,{className:"event-card-date",as:"time",dateTime:p,variant:"primary"},P(new Date(p),{weekday:"short",day:"numeric",month:"short",year:"numeric",hour:"numeric",minute:"numeric"}))),n.createElement(c.Card.Body,null,n.createElement(c.Card.Title,{id:h},v),n.createElement("div",{className:"flex-grow-1"},n.createElement(o.TipTapEditor,{viewMode:!0,disabled:!0,className:s("event-description",!y&&"no-image"),content:S,id:j}),n.createElement("div",{className:"mt-2 ml-2"},Object.keys(M).map((function(e){return n.createElement("div",{className:"event-card-sale",key:e},n.createElement("span",{className:"event-card-sale-name"},T(e),":"," ","totalAmount"===e?B(M[e],{style:"currency",currency:r.Currency.GBP}):M[e]))}))),f&&f.map((function(e){return n.createElement("div",{className:"event-card-sale",key:e.id},n.createElement("div",{className:"event-card-sale-text"},n.createElement("span",{className:"event-card-sale-name"},e.name)," ",n.createElement("span",{className:"event-card-sale-quantity"},[e.current,e.max].map((function(e){return B(e)})).join(" / "))),n.createElement(c.ProgressBar,{now:e.current,max:e.max}))})))),n.createElement(c.Card.Footer,null,n.createElement("div",{className:"d-flex w-100 justify-content-between"},n.createElement("div",{className:"d-flex"},n.createElement("button",{type:"button",className:"event-card-link-button ml-3 mr-4",onClick:q},n.createElement(d.ReactComponent,null)),n.createElement("div",{className:"event-card-views"},n.createElement(i.default,{type:"eye"}),n.createElement("span",null,B(D)))),n.createElement("div",null,n.createElement("button",{type:"button",className:"event-card-link-button",onClick:b},n.createElement(i.default,{type:"external-link-alt"})),g&&n.createElement(n.Fragment,null,n.createElement("button",{type:"button",className:"event-card-link-button",onClick:N},n.createElement(i.default,{type:"edit"})),n.createElement("button",{type:"button",className:"event-card-link-button",onClick:k},n.createElement(i.default,{type:"copy"})),n.createElement("button",{type:"button",className:"event-card-link-button",onClick:C},n.createElement(i.default,{type:"trash-alt"})))))))};
+"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=require("tslib"),a=require("react"),n=e(a),r=require("@licklist/core/dist/Config"),l=require("react-i18next"),c=require("react-bootstrap"),i=require("../../static/Icon.js"),s=e(require("clsx")),m=require("react-intl"),o=require("../../tiptap-editor/TipTapEditor.js"),u=require("./utils.js"),d=require("../../assets/dashboard/chartBar.svg.js");exports.EventCard=function(e){var E=e.name,v=e.description,p=e.date,y=e.imageUrl,f=e.sales,b=e.onPreview,N=e.onEdit,C=e.onCopy,k=e.onRemove,x=e.hasPermission,g=void 0===x||x,q=e.onStatistic,w=e.eventStatistic,h=e.titleId,j=e.descriptionId,I=l.useTranslation("Design").t,T=m.useIntl(),P=T.formatNumber,_=T.formatDate,B=u.getStatisticInfo(w,p),S=B.totalViews,D=t.__rest(B,["totalViews"]),M=a.useMemo((function(){return u.formatContent(v,u.EVENT_DESCRIPTION_SIZE)}),[v]);return n.createElement(c.Card,{className:"d-flex flex-column event-card h-100"},n.createElement("div",{className:s("event-card-image-container",!y&&"no-image")},y&&n.createElement(c.Card.Img,{variant:"top",src:y}),n.createElement(c.Badge,{className:"event-card-date",as:"time",dateTime:p,variant:"primary"},_(new Date(p),{weekday:"short",day:"numeric",month:"short",year:"numeric",hour:"numeric",minute:"numeric"}))),n.createElement(c.Card.Body,null,n.createElement(c.Card.Title,{id:h},E),n.createElement("div",{className:"flex-grow-1"},n.createElement(o.TipTapEditor,{viewMode:!0,disabled:!0,className:s("event-description",!y&&"no-image"),content:M,id:j}),n.createElement("div",{className:"mt-2 ml-2"},Object.keys(D).map((function(e){return n.createElement("div",{className:"event-card-sale",key:e},n.createElement("span",{className:"event-card-sale-name"},I(e),":"," ","totalAmount"===e?P(D[e],{style:"currency",currency:r.Currency.GBP}):D[e]))}))),f&&f.map((function(e){return n.createElement("div",{className:"event-card-sale",key:e.id},n.createElement("div",{className:"event-card-sale-text"},n.createElement("span",{className:"event-card-sale-name"},e.name)," ",n.createElement("span",{className:"event-card-sale-quantity"},[e.current,e.max].map((function(e){return P(e)})).join(" / "))),n.createElement(c.ProgressBar,{now:e.current,max:e.max}))})))),n.createElement(c.Card.Footer,null,n.createElement("div",{className:"d-flex w-100 justify-content-between"},n.createElement("div",{className:"d-flex"},n.createElement("button",{type:"button",className:"event-card-link-button ml-3 mr-4",onClick:q},n.createElement(d.ReactComponent,null)),n.createElement("div",{className:"event-card-views"},n.createElement(i.default,{type:"eye"}),n.createElement("span",null,P(S)))),n.createElement("div",null,n.createElement("button",{type:"button",className:"event-card-link-button",onClick:b},n.createElement(i.default,{type:"external-link-alt"})),g&&n.createElement(n.Fragment,null,n.createElement("button",{type:"button",className:"event-card-link-button",onClick:N},n.createElement(i.default,{type:"edit"})),n.createElement("button",{type:"button",className:"event-card-link-button",onClick:C},n.createElement(i.default,{type:"copy"})),n.createElement("button",{type:"button",className:"event-card-link-button",onClick:k},n.createElement(i.default,{type:"trash-alt"})))))))};

package/dist/events/event-card/utils.d.ts

@@ -1,5 +1,6 @@
 import { EventStatistic } from "@licklist/core/dist/DataMapper/Provider/EventStatisticDataMapper";
 export declare function formatContent(content: any, maxSymbols: any): any;
+export declare const EVENT_DESCRIPTION_SIZE = 340;
 export declare const getStatisticInfo: (eventStatistic: EventStatistic | null, date: string) => {
     totalViews: number;
     totalSold: number;

package/dist/events/event-card/utils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/events/event-card/utils.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,cAAc,EAAE,MAAM,kEAAkE,CAAC;AAGlG,wBAAgB,aAAa,CAAC,OAAO,KAAA,EAAE,UAAU,KAAA,OAIhD;AAED,eAAO,MAAM,gBAAgB,mBACX,cAAc,GAAG,IAAI,QAC/B,MAAM;;;;CA6Bb,CAAC"}
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/events/event-card/utils.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,cAAc,EAAE,MAAM,kEAAkE,CAAC;AAGlG,wBAAgB,aAAa,CAAC,OAAO,KAAA,EAAE,UAAU,KAAA,OAIhD;AAED,eAAO,MAAM,sBAAsB,MAAM,CAAC;AAE1C,eAAO,MAAM,gBAAgB,mBACX,cAAc,GAAG,IAAI,QAC/B,MAAM;;;;CA6Bb,CAAC"}

package/dist/events/event-card/utils.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("@licklist/core/dist/Config"),o=require("luxon");exports.formatContent=function(t,o){return t?t.length>o?"".concat(t.slice(0,o),"..."):t:""},exports.getStatisticInfo=function(r,e){var i,a,l,n,u=0,c=0;if(!r)return{totalViews:0,totalSold:0,totalAmount:0};var d=o.DateTime.fromISO(e).toUTC().toFormat(t.DATE_FORMAT);n=(null===(i=r.views[d])||void 0===i?void 0:i.pageViews)||0;var s=o.DateTime.fromISO(e).toUTC().toFormat(t.DATE_TIME_FULL_FORMAT);return null===(l=null===(a=null==r?void 0:r.productCategorySummary)||void 0===a?void 0:a[s])||void 0===l||l.forEach((function(t){var o=t.totalPerCategory,r=t.productsSummary,e=void 0===r?[]:r;c+=o||0,null==e||e.forEach((function(t){var o=t.productsSold;u+=o}))})),{totalViews:n,totalSold:u,totalAmount:c}};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("@licklist/core/dist/Config"),o=require("luxon");exports.EVENT_DESCRIPTION_SIZE=340,exports.formatContent=function(t,o){return t?t.length>o?"".concat(t.slice(0,o),"..."):t:""},exports.getStatisticInfo=function(r,e){var i,a,l,n,u=0,c=0;if(!r)return{totalViews:0,totalSold:0,totalAmount:0};var s=o.DateTime.fromISO(e).toUTC().toFormat(t.DATE_FORMAT);n=(null===(i=r.views[s])||void 0===i?void 0:i.pageViews)||0;var d=o.DateTime.fromISO(e).toUTC().toFormat(t.DATE_TIME_FULL_FORMAT);return null===(l=null===(a=null==r?void 0:r.productCategorySummary)||void 0===a?void 0:a[d])||void 0===l||l.forEach((function(t){var o=t.totalPerCategory,r=t.productsSummary,e=void 0===r?[]:r;c+=o||0,null==e||e.forEach((function(t){var o=t.productsSold;u+=o}))})),{totalViews:n,totalSold:u,totalAmount:c}};

package/dist/sales/source-of-sales/SourceOfSalesChart.d.ts.map

@@ -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,eAyFvD;AAED,OAAO,EAAE,kBAAkB,EAAE,CAAC"}
+{"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"}

package/dist/sales/source-of-sales/SourceOfSalesChart.js

@@ -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"},r.createElement(l.ResponsiveContainer,{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)})})))))))};
+"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/dist/styles/events/EventCard.scss

@@ -34,7 +34,7 @@ $event-card-views-gutter: sp(3) !default;
   transition: ease-in 0.25s;
   border-radius: $event-card-border-radius;
 
-  > * + * {
+  >*+* {
     margin-top: $event-card-contents-gutter;
   }
 
@@ -43,9 +43,16 @@ $event-card-views-gutter: sp(3) !default;
 
     .event-description {
       min-height: 8rem;
+      max-height: 21rem;
+      overflow: hidden;
+
+      &:last-child {
+        text-overflow: ellipsis;
+      }
 
       &.no-image {
         min-height: 13.75rem;
+        max-height: 22rem;
       }
     }
   }
@@ -75,7 +82,7 @@ $event-card-views-gutter: sp(3) !default;
   }
 
   &:hover {
-    box-shadow: 0px 0px 1rem 0px rgb(0 0 0 / 20%);  
+    box-shadow: 0px 0px 1rem 0px rgb(0 0 0 / 20%);
   }
 }
 
@@ -168,4 +175,4 @@ $event-card-views-gutter: sp(3) !default;
     color: #504f4f;
     width: 1.7rem;
   }
-}
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@licklist/design",
-  "version": "0.44.530",
+  "version": "0.44.533",
   "repository": {
     "type": "git",
     "url": "git+ssh://git@bitbucket.org/artelogicsoft/licklist_design.git"

package/src/events/event-card/EventCard.tsx

@@ -9,7 +9,11 @@ import { EventStatistic } from "@licklist/core/dist/DataMapper/Provider/EventSta
 import Icon from "../../static/Icon";
 import { Sale } from "../../types/bookings";
 import { TipTapEditor } from "../../tiptap-editor/TipTapEditor";
-import { formatContent, getStatisticInfo } from "./utils";
+import {
+  EVENT_DESCRIPTION_SIZE,
+  formatContent,
+  getStatisticInfo,
+} from "./utils";
 import { ReactComponent as ChartBarIcon } from "../../assets/dashboard/chartBar.svg";
 
 export interface EventCardProps extends HasPermissionProp {
@@ -48,7 +52,7 @@ export function EventCard({
   const { formatNumber, formatDate } = useIntl();
   const { totalViews, ...statistics } = getStatisticInfo(eventStatistic, date);
   const memoedContent = useMemo(
-    () => formatContent(description, 300),
+    () => formatContent(description, EVENT_DESCRIPTION_SIZE),
     [description]
   );
 

package/src/events/event-card/utils.ts

@@ -8,6 +8,8 @@ export function formatContent(content, maxSymbols) {
   return content;
 }
 
+export const EVENT_DESCRIPTION_SIZE = 340;
+
 export const getStatisticInfo = (
   eventStatistic: EventStatistic | null,
   date: string

package/src/sales/source-of-sales/SourceOfSalesChart.tsx

@@ -1,4 +1,4 @@
-import React, { useEffect, useState, useMemo } from "react";
+import React, { useState, useMemo, useEffect } from "react";
 import { useTranslation } from "react-i18next";
 import { useIntl } from "react-intl";
 
@@ -35,7 +35,8 @@ function SourceOfSalesChart({ data }: SourceOfSalesProps) {
         name: AFFILIATES,
       },
     ],
-    [data]
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [data.length]
   );
   const { t } = useTranslation("Design");
   const { formatNumber } = useIntl();
@@ -86,32 +87,34 @@ function SourceOfSalesChart({ data }: SourceOfSalesProps) {
     <div className="source-of-sales">
       <div className="source-of-sales__header">{t("sourceOfSales")}</div>
       <div className="source-of-sales__pie-chart">
-        <ResponsiveContainer width="100%" height="100%">
-          <PieChart>
-            <Legend
-              iconType="circle"
-              wrapperStyle={{ left: 170, top: 20 }}
-              layout="vertical"
-              verticalAlign="top"
-              content={legendRenderer}
-            />
-            <Pie
-              data={extendedData}
-              cx={80}
-              cy={defaultCYPosition}
-              innerRadius={40}
-              outerRadius={48}
-              dataKey="percentage"
-            >
-              {data.map(({ source }: PieChartData, index) => (
-                <Cell
-                  className={`colors-${index % 4}`}
-                  key={`cell-${source}`}
-                />
-              ))}
-            </Pie>
-          </PieChart>
-        </ResponsiveContainer>
+        {!!data.length && (
+          <ResponsiveContainer debounce={100} width="100%" height="100%">
+            <PieChart>
+              <Legend
+                iconType="circle"
+                wrapperStyle={{ left: 170, top: 20 }}
+                layout="vertical"
+                verticalAlign="top"
+                content={legendRenderer}
+              />
+              <Pie
+                data={extendedData}
+                cx={80}
+                cy={defaultCYPosition}
+                innerRadius={40}
+                outerRadius={48}
+                dataKey="percentage"
+              >
+                {data.map(({ source }: PieChartData, index) => (
+                  <Cell
+                    className={`colors-${index % 4}`}
+                    key={`cell-${source}`}
+                  />
+                ))}
+              </Pie>
+            </PieChart>
+          </ResponsiveContainer>
+        )}
       </div>
     </div>
   );

package/src/styles/events/EventCard.scss

@@ -34,7 +34,7 @@ $event-card-views-gutter: sp(3) !default;
   transition: ease-in 0.25s;
   border-radius: $event-card-border-radius;
 
-  > * + * {
+  >*+* {
     margin-top: $event-card-contents-gutter;
   }
 
@@ -43,9 +43,16 @@ $event-card-views-gutter: sp(3) !default;
 
     .event-description {
       min-height: 8rem;
+      max-height: 21rem;
+      overflow: hidden;
+
+      &:last-child {
+        text-overflow: ellipsis;
+      }
 
       &.no-image {
         min-height: 13.75rem;
+        max-height: 22rem;
       }
     }
   }
@@ -75,7 +82,7 @@ $event-card-views-gutter: sp(3) !default;
   }
 
   &:hover {
-    box-shadow: 0px 0px 1rem 0px rgb(0 0 0 / 20%);  
+    box-shadow: 0px 0px 1rem 0px rgb(0 0 0 / 20%);
   }
 }
 
@@ -168,4 +175,4 @@ $event-card-views-gutter: sp(3) !default;
     color: #504f4f;
     width: 1.7rem;
   }
-}
+}