@capillarytech/creatives-library 9.0.36-alpha.0 → 9.0.36-alpha.1

package/v2Containers/SmsTrai/Create/tests/__snapshots__/index.test.js.snap

@@ -112,8 +112,8 @@ exports[`Creatives SmsTraiCreate test/> done button should be disabled if blank
         "app.v2containers.SmsTrai.Edit.traiEditTitle": "Message",
         "app.v2containers.SmsTrai.Edit.unicodeLabel": "Allow unicode characters",
         "app.v2containers.SmsTrai.Edit.unsupportedTagsValidationError": "Unsupported tags: {unsupportedTags}. Please remove them from this message.",
-        "creatives.components.AccessForbidden.forbiddenDesc": "This page access has not been provided to you.",
-        "creatives.components.AccessForbidden.forbiddenHeader": "Access Forbidden",
+        "creatives.components.AccessForbidden.forbiddenDesc": "Please contact your organisation administrator to request access.",
+        "creatives.components.AccessForbidden.forbiddenHeader": "You don't have permission to view this page.",
         "creatives.components.BreadCrumbs.header": "This is the BreadCrumbs component !",
         "creatives.components.CapTagList.Cancel": "Cancel",
         "creatives.components.CapTagList.Ok": "Ok",
@@ -3273,8 +3273,8 @@ exports[`Creatives SmsTraiCreate test/> invalid file drop 1`] = `
         "app.v2containers.SmsTrai.Edit.traiEditTitle": "Message",
         "app.v2containers.SmsTrai.Edit.unicodeLabel": "Allow unicode characters",
         "app.v2containers.SmsTrai.Edit.unsupportedTagsValidationError": "Unsupported tags: {unsupportedTags}. Please remove them from this message.",
-        "creatives.components.AccessForbidden.forbiddenDesc": "This page access has not been provided to you.",
-        "creatives.components.AccessForbidden.forbiddenHeader": "Access Forbidden",
+        "creatives.components.AccessForbidden.forbiddenDesc": "Please contact your organisation administrator to request access.",
+        "creatives.components.AccessForbidden.forbiddenHeader": "You don't have permission to view this page.",
         "creatives.components.BreadCrumbs.header": "This is the BreadCrumbs component !",
         "creatives.components.CapTagList.Cancel": "Cancel",
         "creatives.components.CapTagList.Ok": "Ok",
@@ -6417,8 +6417,8 @@ exports[`Creatives SmsTraiCreate test/> renders UI 1`] = `
         "app.v2containers.SmsTrai.Edit.traiEditTitle": "Message",
         "app.v2containers.SmsTrai.Edit.unicodeLabel": "Allow unicode characters",
         "app.v2containers.SmsTrai.Edit.unsupportedTagsValidationError": "Unsupported tags: {unsupportedTags}. Please remove them from this message.",
-        "creatives.components.AccessForbidden.forbiddenDesc": "This page access has not been provided to you.",
-        "creatives.components.AccessForbidden.forbiddenHeader": "Access Forbidden",
+        "creatives.components.AccessForbidden.forbiddenDesc": "Please contact your organisation administrator to request access.",
+        "creatives.components.AccessForbidden.forbiddenHeader": "You don't have permission to view this page.",
         "creatives.components.BreadCrumbs.header": "This is the BreadCrumbs component !",
         "creatives.components.CapTagList.Cancel": "Cancel",
         "creatives.components.CapTagList.Ok": "Ok",
@@ -9578,8 +9578,8 @@ exports[`Creatives SmsTraiCreate test/> valid file drop 1`] = `
         "app.v2containers.SmsTrai.Edit.traiEditTitle": "Message",
         "app.v2containers.SmsTrai.Edit.unicodeLabel": "Allow unicode characters",
         "app.v2containers.SmsTrai.Edit.unsupportedTagsValidationError": "Unsupported tags: {unsupportedTags}. Please remove them from this message.",
-        "creatives.components.AccessForbidden.forbiddenDesc": "This page access has not been provided to you.",
-        "creatives.components.AccessForbidden.forbiddenHeader": "Access Forbidden",
+        "creatives.components.AccessForbidden.forbiddenDesc": "Please contact your organisation administrator to request access.",
+        "creatives.components.AccessForbidden.forbiddenHeader": "You don't have permission to view this page.",
         "creatives.components.BreadCrumbs.header": "This is the BreadCrumbs component !",
         "creatives.components.CapTagList.Cancel": "Cancel",
         "creatives.components.CapTagList.Ok": "Ok",

package/v2Containers/SmsTrai/Edit/tests/__snapshots__/index.test.js.snap

@@ -87,8 +87,8 @@ exports[`Creatives SmsTraiEdit test/> should render 1`] = `
         "app.v2containers.SmsTrai.Edit.traiEditTitle": "Message",
         "app.v2containers.SmsTrai.Edit.unicodeLabel": "Allow unicode characters",
         "app.v2containers.SmsTrai.Edit.unsupportedTagsValidationError": "Unsupported tags: {unsupportedTags}. Please remove them from this message.",
-        "creatives.components.AccessForbidden.forbiddenDesc": "This page access has not been provided to you.",
-        "creatives.components.AccessForbidden.forbiddenHeader": "Access Forbidden",
+        "creatives.components.AccessForbidden.forbiddenDesc": "Please contact your organisation administrator to request access.",
+        "creatives.components.AccessForbidden.forbiddenHeader": "You don't have permission to view this page.",
         "creatives.components.BreadCrumbs.header": "This is the BreadCrumbs component !",
         "creatives.components.CapTagList.Cancel": "Cancel",
         "creatives.components.CapTagList.Ok": "Ok",
@@ -7411,8 +7411,8 @@ FREE GIFTS-
                                 "app.v2containers.SmsTrai.Edit.traiEditTitle": "Message",
                                 "app.v2containers.SmsTrai.Edit.unicodeLabel": "Allow unicode characters",
                                 "app.v2containers.SmsTrai.Edit.unsupportedTagsValidationError": "Unsupported tags: {unsupportedTags}. Please remove them from this message.",
-                                "creatives.components.AccessForbidden.forbiddenDesc": "This page access has not been provided to you.",
-                                "creatives.components.AccessForbidden.forbiddenHeader": "Access Forbidden",
+                                "creatives.components.AccessForbidden.forbiddenDesc": "Please contact your organisation administrator to request access.",
+                                "creatives.components.AccessForbidden.forbiddenHeader": "You don't have permission to view this page.",
                                 "creatives.components.BreadCrumbs.header": "This is the BreadCrumbs component !",
                                 "creatives.components.CapTagList.Cancel": "Cancel",
                                 "creatives.components.CapTagList.Ok": "Ok",
@@ -9749,8 +9749,8 @@ FREE GIFTS-
                                   "app.v2containers.SmsTrai.Edit.traiEditTitle": "Message",
                                   "app.v2containers.SmsTrai.Edit.unicodeLabel": "Allow unicode characters",
                                   "app.v2containers.SmsTrai.Edit.unsupportedTagsValidationError": "Unsupported tags: {unsupportedTags}. Please remove them from this message.",
-                                  "creatives.components.AccessForbidden.forbiddenDesc": "This page access has not been provided to you.",
-                                  "creatives.components.AccessForbidden.forbiddenHeader": "Access Forbidden",
+                                  "creatives.components.AccessForbidden.forbiddenDesc": "Please contact your organisation administrator to request access.",
+                                  "creatives.components.AccessForbidden.forbiddenHeader": "You don't have permission to view this page.",
                                   "creatives.components.BreadCrumbs.header": "This is the BreadCrumbs component !",
                                   "creatives.components.CapTagList.Cancel": "Cancel",
                                   "creatives.components.CapTagList.Ok": "Ok",
@@ -12238,8 +12238,8 @@ exports[`Creatives SmsTraiEdit test/> should render 2`] = `
         "app.v2containers.SmsTrai.Edit.traiEditTitle": "Message",
         "app.v2containers.SmsTrai.Edit.unicodeLabel": "Allow unicode characters",
         "app.v2containers.SmsTrai.Edit.unsupportedTagsValidationError": "Unsupported tags: {unsupportedTags}. Please remove them from this message.",
-        "creatives.components.AccessForbidden.forbiddenDesc": "This page access has not been provided to you.",
-        "creatives.components.AccessForbidden.forbiddenHeader": "Access Forbidden",
+        "creatives.components.AccessForbidden.forbiddenDesc": "Please contact your organisation administrator to request access.",
+        "creatives.components.AccessForbidden.forbiddenHeader": "You don't have permission to view this page.",
         "creatives.components.BreadCrumbs.header": "This is the BreadCrumbs component !",
         "creatives.components.CapTagList.Cancel": "Cancel",
         "creatives.components.CapTagList.Ok": "Ok",
@@ -20936,8 +20936,8 @@ FREE GIFTS-
                                 "app.v2containers.SmsTrai.Edit.traiEditTitle": "Message",
                                 "app.v2containers.SmsTrai.Edit.unicodeLabel": "Allow unicode characters",
                                 "app.v2containers.SmsTrai.Edit.unsupportedTagsValidationError": "Unsupported tags: {unsupportedTags}. Please remove them from this message.",
-                                "creatives.components.AccessForbidden.forbiddenDesc": "This page access has not been provided to you.",
-                                "creatives.components.AccessForbidden.forbiddenHeader": "Access Forbidden",
+                                "creatives.components.AccessForbidden.forbiddenDesc": "Please contact your organisation administrator to request access.",
+                                "creatives.components.AccessForbidden.forbiddenHeader": "You don't have permission to view this page.",
                                 "creatives.components.BreadCrumbs.header": "This is the BreadCrumbs component !",
                                 "creatives.components.CapTagList.Cancel": "Cancel",
                                 "creatives.components.CapTagList.Ok": "Ok",
@@ -23274,8 +23274,8 @@ FREE GIFTS-
                                   "app.v2containers.SmsTrai.Edit.traiEditTitle": "Message",
                                   "app.v2containers.SmsTrai.Edit.unicodeLabel": "Allow unicode characters",
                                   "app.v2containers.SmsTrai.Edit.unsupportedTagsValidationError": "Unsupported tags: {unsupportedTags}. Please remove them from this message.",
-                                  "creatives.components.AccessForbidden.forbiddenDesc": "This page access has not been provided to you.",
-                                  "creatives.components.AccessForbidden.forbiddenHeader": "Access Forbidden",
+                                  "creatives.components.AccessForbidden.forbiddenDesc": "Please contact your organisation administrator to request access.",
+                                  "creatives.components.AccessForbidden.forbiddenHeader": "You don't have permission to view this page.",
                                   "creatives.components.BreadCrumbs.header": "This is the BreadCrumbs component !",
                                   "creatives.components.CapTagList.Cancel": "Cancel",
                                   "creatives.components.CapTagList.Ok": "Ok",
@@ -25763,8 +25763,8 @@ exports[`Creatives SmsTraiEdit test/> should save 1`] = `
         "app.v2containers.SmsTrai.Edit.traiEditTitle": "Message",
         "app.v2containers.SmsTrai.Edit.unicodeLabel": "Allow unicode characters",
         "app.v2containers.SmsTrai.Edit.unsupportedTagsValidationError": "Unsupported tags: {unsupportedTags}. Please remove them from this message.",
-        "creatives.components.AccessForbidden.forbiddenDesc": "This page access has not been provided to you.",
-        "creatives.components.AccessForbidden.forbiddenHeader": "Access Forbidden",
+        "creatives.components.AccessForbidden.forbiddenDesc": "Please contact your organisation administrator to request access.",
+        "creatives.components.AccessForbidden.forbiddenHeader": "You don't have permission to view this page.",
         "creatives.components.BreadCrumbs.header": "This is the BreadCrumbs component !",
         "creatives.components.CapTagList.Cancel": "Cancel",
         "creatives.components.CapTagList.Ok": "Ok",
@@ -33087,8 +33087,8 @@ FREE GIFTS-
                                 "app.v2containers.SmsTrai.Edit.traiEditTitle": "Message",
                                 "app.v2containers.SmsTrai.Edit.unicodeLabel": "Allow unicode characters",
                                 "app.v2containers.SmsTrai.Edit.unsupportedTagsValidationError": "Unsupported tags: {unsupportedTags}. Please remove them from this message.",
-                                "creatives.components.AccessForbidden.forbiddenDesc": "This page access has not been provided to you.",
-                                "creatives.components.AccessForbidden.forbiddenHeader": "Access Forbidden",
+                                "creatives.components.AccessForbidden.forbiddenDesc": "Please contact your organisation administrator to request access.",
+                                "creatives.components.AccessForbidden.forbiddenHeader": "You don't have permission to view this page.",
                                 "creatives.components.BreadCrumbs.header": "This is the BreadCrumbs component !",
                                 "creatives.components.CapTagList.Cancel": "Cancel",
                                 "creatives.components.CapTagList.Ok": "Ok",
@@ -35425,8 +35425,8 @@ FREE GIFTS-
                                   "app.v2containers.SmsTrai.Edit.traiEditTitle": "Message",
                                   "app.v2containers.SmsTrai.Edit.unicodeLabel": "Allow unicode characters",
                                   "app.v2containers.SmsTrai.Edit.unsupportedTagsValidationError": "Unsupported tags: {unsupportedTags}. Please remove them from this message.",
-                                  "creatives.components.AccessForbidden.forbiddenDesc": "This page access has not been provided to you.",
-                                  "creatives.components.AccessForbidden.forbiddenHeader": "Access Forbidden",
+                                  "creatives.components.AccessForbidden.forbiddenDesc": "Please contact your organisation administrator to request access.",
+                                  "creatives.components.AccessForbidden.forbiddenHeader": "You don't have permission to view this page.",
                                   "creatives.components.BreadCrumbs.header": "This is the BreadCrumbs component !",
                                   "creatives.components.CapTagList.Cancel": "Cancel",
                                   "creatives.components.CapTagList.Ok": "Ok",

package/v2Containers/Templates/ChannelTypeIllustration.js

@@ -2,8 +2,9 @@ import React, { useMemo } from 'react';
 import PropTypes from 'prop-types';
 import zaloillustration from '@capillarytech/cap-ui-library/assets/images/featureUiNotEnabledIllustration.svg';
 import inAppIllustration from '@capillarytech/cap-ui-library/assets/images/featureUiNotEnabledIllustration.svg';
-import { FormattedMessage } from 'react-intl';
+import { FormattedMessage, injectIntl, intlShape } from 'react-intl';
 import { CapIllustration } from "@capillarytech/cap-ui-library";
+import globalMessages from '../Cap/messages';
 import emailIllustration from '../Assets/images/emailIllustration.svg';
 import smsIllustration from '../Assets/images/smsIllustration.svg';
 import pushIllustration from '../Assets/images/pushIllustration.svg';
@@ -80,11 +81,13 @@ const CHANNEL_CONFIG = {
 
 function ChannelTypeIllustration(props) {
   const {
+    intl,
     isFullMode,
     createTemplate,
     currentChannel,
     hostName,
     isArchivedMode,
+    canCreate = true,
   } = props;
 
   const templateText = useMemo(() => {
@@ -183,6 +186,11 @@ function ChannelTypeIllustration(props) {
     if (config.hasButton) {
       result.buttonLabel = <FormattedMessage {...config.buttonMessage} values={{ template: templateText }} />;
       result.onClick = createTemplate;
+      // RBAC: gray out + disable the create button for users without create permission.
+      if (!canCreate) {
+        result.disabled = true;
+        result.buttonTooltip = intl.formatMessage(globalMessages.noPermissionAction);
+      }
     }
 
     if (config.descriptionMessage) {
@@ -208,10 +216,13 @@ function ChannelTypeIllustration(props) {
   );
 }
 ChannelTypeIllustration.propTypes = {
+  intl: intlShape.isRequired,
   isFullMode: PropTypes.bool,
   createTemplate: PropTypes.func.isRequired,
   currentChannel: PropTypes.string,
   hostName: PropTypes.string,
   isArchivedMode: PropTypes.bool,
+  canCreate: PropTypes.bool,
 };
-export default ChannelTypeIllustration;
+export { ChannelTypeIllustration };
+export default injectIntl(ChannelTypeIllustration);

package/v2Containers/Templates/_templates.scss

@@ -162,7 +162,9 @@
           }
           .viber-carousel-static-content {
             width: 100%;
-            overflow: hidden;
+            overflow: visible;
+            display: flex;
+            flex-direction: column;
             .viber-carousel-static-message-box {
               width: 100%;
               height: auto;
@@ -188,14 +190,15 @@
             .viber-carousel-static-cards {
               display: flex;
               gap: $CAP_SPACE_08;
-              overflow: hidden;
+              overflow: visible;
             }
             .viber-carousel-static-card {
               flex: 1;
               min-width: 0;
+              width: 100%;
               background: $CAP_WHITE;
               border-radius: $CAP_SPACE_04;
-              overflow: hidden;
+              overflow: visible;
               display: flex;
               flex-direction: column;
             }
@@ -205,6 +208,7 @@
               margin-bottom: $CAP_SPACE_04;
               border-radius: $CAP_SPACE_04;
               display: block;
+              flex-shrink: 0;
             }
             .viber-carousel-static-image-placeholder {
               width: 100%;
@@ -226,12 +230,14 @@
               line-clamp: 2;
               -webkit-box-orient: vertical;
               display: -webkit-box;
+              flex-shrink: 0;
             }
             .viber-carousel-static-buttons {
               display: flex;
               flex-direction: column;
               gap: $CAP_SPACE_04;
-              margin-top: auto;
+              flex-shrink: 0;
+              width: 100%;
             }
             .viber-carousel-static-button {
               display: block;
@@ -262,24 +268,38 @@
         &.viber-carousel-static {
           height: auto;
           min-height: 21.125rem;
+          overflow: visible;
 
           .ant-card-body {
+            height: auto;
+            overflow: visible;
             padding-bottom: $CAP_SPACE_12;
-          }
 
-          .truncate-text-viber {
+            .ant-card-meta,
+            .ant-card-meta-detail,
             .ant-card-meta-description {
-              display: block;
+              height: auto;
+              max-height: none;
               overflow: visible;
-              -webkit-line-clamp: unset;
-              line-clamp: unset;
             }
-          }
 
-          .viber-carousel-static-content,
-          .viber-carousel-static-cards,
-          .viber-carousel-static-card {
-            overflow: visible;
+            .truncate-text-viber {
+              .ant-card-meta-description {
+                display: block;
+                overflow: visible;
+                max-height: none;
+                -webkit-box-orient: unset;
+                -webkit-line-clamp: unset;
+                line-clamp: unset;
+              }
+            }
+
+            .viber-carousel-static-content,
+            .viber-carousel-static-cards,
+            .viber-carousel-static-card {
+              overflow: visible;
+              height: auto;
+            }
           }
         }
     
@@ -1336,6 +1356,67 @@
   max-height: 11rem;
   margin-bottom: $CAP_SPACE_04;
 }
+
+/* Listing carousel preview: always grow with content so title + buttons stay visible for any image */
+.cap-custom-card.ant-card.VIBER.viber-carousel-static {
+  height: auto;
+  min-height: 21.125rem;
+  overflow: visible;
+
+  > .ant-card-body {
+    height: auto;
+    max-height: none;
+    overflow: visible;
+    padding-bottom: $CAP_SPACE_12;
+  }
+
+  .ant-card-meta,
+  .ant-card-meta-detail,
+  .ant-card-meta-description,
+  .truncate-text-viber,
+  .truncate-text-viber .ant-card-meta-description {
+    height: auto;
+    max-height: none;
+    overflow: visible;
+    display: block;
+    -webkit-line-clamp: unset;
+    line-clamp: unset;
+    -webkit-box-orient: unset;
+  }
+
+  .viber-carousel-static-content,
+  .viber-carousel-static-card,
+  .viber-carousel-static-buttons {
+    display: flex;
+    flex-direction: column;
+    width: 100%;
+  }
+
+  .viber-carousel-static-content,
+  .viber-carousel-static-cards,
+  .viber-carousel-static-card {
+    overflow: visible;
+    height: auto;
+  }
+
+  .viber-carousel-static-cards {
+    width: 100%;
+  }
+
+  .viber-carousel-static-image {
+    width: 100%;
+    max-height: 11rem;
+    display: block;
+    flex-shrink: 0;
+  }
+
+  .viber-carousel-static-text,
+  .viber-carousel-static-buttons {
+    width: 100%;
+    flex-shrink: 0;
+    visibility: visible;
+  }
+}
 .whatsapp-doc {
   width: 100%;
   max-height: 123px;
@@ -1587,3 +1668,9 @@
     min-width: 0;
   }
 }
+
+// RBAC: dim + block a control the user lacks permission for (used with CapTooltip).
+.rbac-disabled {
+  opacity: 0.4;
+  cursor: not-allowed;
+}