@capillarytech/creatives-library 7.12.43 → 7.12.45

package/v2Containers/Line/Container/ImageCarousel/tests/utils.test.js

@@ -0,0 +1,13 @@
+import { calculateAspectRatio } from '../utils';
+
+describe('calculateAspectRatio -- Test', () => {
+  it('Should return aspect ratio 1:1', () =>
+    expect(calculateAspectRatio(400, 400)).toEqual('1:1'));
+  it('Should return aspect ratio 1:2', () =>
+    expect(calculateAspectRatio(400, 800)).toEqual('1:2'));
+});
+
+describe('calculateGCD -- Test', () => {
+  it('Should return gcd', () =>
+    expect(calculateAspectRatio(400, 400)).toEqual('1:1'));
+});

package/v2Containers/Line/Container/ImageCarousel/utils.js

@@ -0,0 +1,12 @@
+export const calculateGCD = (width, height) => {
+  while (height !== 0) {
+    const reminder = width % height;
+    width = height;
+    height = reminder;
+  }
+  return Math.abs(width);
+};
+export const calculateAspectRatio = (width, height) => {
+  const absValue = calculateGCD(width, height);
+  return `${width / absValue}:${height / absValue}`;
+};

package/v2Containers/Line/Container/Wrapper/index.js

@@ -6,7 +6,7 @@ import CapIcon from '@capillarytech/cap-ui-library/CapIcon';
 import CapModal from '@capillarytech/cap-ui-library/CapModal';
 import style, { CapModalStyles } from './style';
 import withStyles from '../../../../hoc/withStyles';
-import { TEXT, IMAGE, IMAGE_MAP, STICKER, MAX_LINE_WRAPPER_LIMIT, MAX_LINE_WRAPPER_LIMIT_FULL_MODE  } from '../constants';
+import { TEXT, TEMPLATE } from '../constants';
 import { getTabPanes } from './utils';
 import messages from './messages';
 import { CAP_SPACE_16, CAP_SPACE_08 } from '@capillarytech/cap-ui-library/styled/variables';
@@ -30,7 +30,7 @@ export const LineWrapper = ({
     const [isConfirmModalVisible, togglePopup] = useState(false);
 
     useEffect(() => {
-        updateActiveKey(selectedType);
+        updateActiveKey(selectedType === 'template' ? TEMPLATE : selectedType);
     }, [selectedType]);
 
     const onTabChange = (type) => {

package/v2Containers/Line/Container/Wrapper/messages.js

@@ -43,8 +43,8 @@ export default defineMessages({
     id: `${scope}.imagemapLabel`,
     defaultMessage: 'Rich message',
   },
-  "templateLabel": {
-    id: `${scope}.templateLabel`,
+  "flexLabel": {
+    id: `${scope}.flexLabel`,
     defaultMessage: 'Card message',
   },
   "videoLabel": {