@antscorp/antsomi-ui 1.3.5-beta.145 → 1.3.5-beta.147

package/es/components/molecules/TemplateSaveAs/TemplateSaveAs.js

@@ -152,7 +152,7 @@ export const TemplateSaveAs = props => {
                             } }))),
                     React.createElement(Flex, { className: "field-container", style: { marginTop: '-20px' } },
                         React.createElement(Text, { className: "field-title field-title--middle" }, descriptionLabel || 'Description'),
-                        React.createElement(Input, { placeholder: descriptionPlaceholder || 'Describe your media template', className: "field-input", value: defaultTemplateDesc, debounce: 100, maxLength: 400, onAfterChange: value => handleChangeValue({ description: value }) })),
+                        React.createElement(Input, { placeholder: descriptionPlaceholder || 'Describe your media template', className: "field-input", maxLength: 400, onBlur: e => handleChangeValue({ description: e.target.value }) })),
                     React.createElement(Flex, { className: "field-container" },
                         React.createElement(Text, { className: "field-title" },
                             imageReviewLabel || 'Thumbnail template',

package/es/components/molecules/TemplateSaveAs/components/ImageSlider/BigImage.js

@@ -1,11 +1,18 @@
-import React from 'react';
+import React, { useMemo } from 'react';
 import { Image } from 'antd';
 import { Button } from '@antscorp/antsomi-ui/es/components';
 import Icon from '@antscorp/icons';
 export const BigImage = React.memo(props => {
     const { url, isDefaultThumbnail, isHideDefaultButton, index, onClickDefaultButton } = props;
+    const currentTime = useMemo(() => new Date(), []);
+    const timeGenerated = Math.floor(currentTime.getTime() / 1000 - (currentTime.getTime() % 3)) * 1000;
+    const urlNoCache = url
+        ? url.includes('nocache')
+            ? url
+            : `${url}?nocache=${timeGenerated}`
+        : undefined;
     return (React.createElement("div", { className: "image-container--big" },
-        url ? (React.createElement(Image, { preview: false, width: "80%", height: "96%", src: url.includes('nocache') ? url : `${url}?nocache=${new Date().getTime()}` })) : null,
+        url ? (React.createElement(Image, { preview: false, width: "80%", height: "96%", src: urlNoCache })) : null,
         isHideDefaultButton ? null : (React.createElement(Button, { className: "set-default-button", onClick: () => onClickDefaultButton && onClickDefaultButton(index) },
             isDefaultThumbnail ? React.createElement(Icon, { type: "icon-ants-check", style: { fontSize: '12px' } }) : null,
             isDefaultThumbnail ? 'Default thumbnail' : 'Set as default'))));

package/es/components/molecules/TemplateSaveAs/components/ImageSlider/SmallImage.js

@@ -1,6 +1,16 @@
-import React from 'react';
+import React, { useMemo } from 'react';
 import { Image } from 'antd';
 export const SmallImage = React.memo(props => {
     const { url, isSelected, index, onClick } = props;
-    return (React.createElement("div", { className: `image-container--small ${isSelected ? 'image-container--selected' : ''}`, onClick: () => onClick && onClick(index) }, url ? (React.createElement(Image, { preview: false, width: "80%", height: "96%", src: url.includes('nocache') ? url : `${url}?nocache=${new Date().getTime()}` })) : null));
+    const currentTime = useMemo(() => new Date(), []);
+    const timeGenerated = Math.floor(currentTime.getTime() / 1000 - (currentTime.getTime() % 3)) * 1000;
+    const urlNoCache = url
+        ? url.includes('nocache')
+            ? url
+            : `${url}?nocache=${timeGenerated}`
+        : undefined;
+    return (React.createElement("div", { className: `image-container--small ${isSelected ? 'image-container--selected' : ''}`, onClick: () => onClick && onClick(index) }, url ? (React.createElement(Image, { preview: false, width: "80%", height: "96%", 
+        // src={imageUrl}
+        // src={url}
+        src: urlNoCache })) : null));
 });

package/es/components/template/TemplateListing/hooks/useTemplateListing.d.ts

@@ -8,6 +8,7 @@ interface TemplateListingOptions {
     serviceAuth: TServiceAuth;
     config: TTemplateListingConfig;
     checkedCategoriesDefault?: TCheckedCategories;
+    templateListingSelector?: string;
 }
 /**
  * Represents the state of a system with generic data types.

package/es/components/template/TemplateListing/hooks/useTemplateListing.js

@@ -35,7 +35,7 @@ import { getShuffleArray } from '@antscorp/antsomi-ui/es/utils';
  * @property {Function} onLoadMore - A function to load more template data when scrolling in the template listing.
  */
 export const useTemplateListing = (options) => {
-    const { serviceAuth, config, checkedCategoriesDefault } = options;
+    const { serviceAuth, config, checkedCategoriesDefault, templateListingSelector = '.template-listing', } = options;
     const { objectType, categoryCodes, publicLevel, getListType, channel, limitListPerPage = 10, } = config;
     const { message } = App.useApp();
     // Locales
@@ -211,6 +211,16 @@ export const useTemplateListing = (options) => {
                 }, {}) || {} })));
         }
     }, [checkedCategoriesDefault]);
+    /**
+     * When publicLevel or getListType change
+     * Scroll template listing to top
+     */
+    useDeepCompareEffect(() => {
+        const templateListingEl = document.querySelector(templateListingSelector);
+        if (templateListingEl) {
+            templateListingEl.scrollTop = 0;
+        }
+    }, [getListType, publicLevel, objectType]);
     // Handles
     const onChangeCheckedCategories = (checkedCategories) => {
         setState(prev => (Object.assign(Object.assign({}, prev), { checkedCategories })));

package/es/test.js

@@ -48,7 +48,7 @@ const SHARE_ACCESS_DEFAULT_VALUE = {
     publicRole: null,
 };
 const thumbnailPortrait = [
-    'https://images.unsplash.com/photo-1515734674582-29010bb37906?q=80&w=1887&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D',
+    'https://upload.wikimedia.org/wikipedia/commons/3/3d/LARGE_elevation.jpg',
     'https://images.unsplash.com/photo-1571423483570-eb27018d1ec0?q=80&w=1887&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D',
     'https://images.creativefabrica.com/products/previews/2023/11/03/jG9YjMvHg/2XfoTnjLlEvPMgjGeu0VIDk96mr-desktop.jpg',
 ];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@antscorp/antsomi-ui",
-  "version": "1.3.5-beta.145",
+  "version": "1.3.5-beta.147",
   "description": "An enterprise-class UI design language and React UI library.",
   "sideEffects": [
     "dist/*",