@antscorp/antsomi-ui 1.3.5-beta.56 → 1.3.5-beta.58

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

@@ -39,6 +39,12 @@ export const TemplateSaveAs = props => {
     }, [searchValueDebounce, onSearch]);
     const [templateName, setTemplateName] = useState(defaultNewTemplateName || `Untitled Media Template#${dayjs().format('YYYY-MM-DD HH:mm:ss')}`);
     const [templateNameExist, setTemplateNameExist] = useState((defaultTemplateName === null || defaultTemplateName === void 0 ? void 0 : defaultTemplateName.id) ? defaultTemplateName : templateNames === null || templateNames === void 0 ? void 0 : templateNames[0]);
+    // NOTE: HOTFIX templateNameExist not update when value outside changed
+    useEffect(() => {
+        if (defaultTemplateName) {
+            setTemplateNameExist(defaultTemplateName);
+        }
+    }, [defaultTemplateName]);
     const handleChangeValue = (newValue) => {
         var _a, _b;
         if (onEvent) {
@@ -49,11 +55,7 @@ export const TemplateSaveAs = props => {
                 // TODO: return saveOption and templateName generate default value if not pass as value props
                 defaultThumbnail: newValue.defaultThumbnail || defaultThumbnail, saveOption: !(value === null || value === void 0 ? void 0 : value.saveOption) && !newValue.saveOption
                     ? saveOption
-                    : newValue.saveOption || (value === null || value === void 0 ? void 0 : value.saveOption), templateName: !defaultTemplateName && !newValue.templateName
-                    ? saveOption === saveNewValue
-                        ? { id: undefined, label: templateName }
-                        : templateNameExist
-                    : newValue.templateName || defaultTemplateName }), (_b = (_a = form === null || form === void 0 ? void 0 : form.getFieldsError()) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.errors);
+                    : newValue.saveOption || (value === null || value === void 0 ? void 0 : value.saveOption) }), (_b = (_a = form === null || form === void 0 ? void 0 : form.getFieldsError()) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.errors);
         }
     };
     const handleAddCategory = ({ parentKey, item, }) => {
@@ -82,12 +84,14 @@ export const TemplateSaveAs = props => {
         } },
         React.createElement(TemplateSaveAsStyled, { className: className || '', vertical: true },
             React.createElement(Flex, { className: "save-options-container" },
-                React.createElement(RadioGroup, { value: saveOption, onChange: e => handleChangeValue({
-                        saveOption: e.target.value,
-                        templateName: e.target.value === saveNewValue
-                            ? { id: undefined, label: templateName }
-                            : templateNameExist,
-                    }) },
+                React.createElement(RadioGroup, { value: saveOption, onChange: e => {
+                        handleChangeValue({
+                            saveOption: e.target.value,
+                            templateName: e.target.value === saveNewValue
+                                ? { id: templateNameExist.id, label: templateName }
+                                : templateNameExist,
+                        });
+                    } },
                     React.createElement(Radio, { value: saveNewValue }, saveNewText),
                     React.createElement(Radio, { value: saveExistValue }, saveExistText))),
             React.createElement(Flex, null,
@@ -109,8 +113,15 @@ export const TemplateSaveAs = props => {
                                         justifyContent: 'center',
                                         alignItems: 'center',
                                     } },
-                                    React.createElement(Spin, { size: "small" }))) : null)), value: templateNameExist === null || templateNameExist === void 0 ? void 0 : templateNameExist.id, options: (templateNames === null || templateNames === void 0 ? void 0 : templateNames.length) > 0
-                                ? templateNames.map(item => ({ value: item.id, label: item.label }))
+                                    React.createElement(Spin, { size: "small" }))) : null)), value: templateNameExist === null || templateNameExist === void 0 ? void 0 : templateNameExist.id, options: 
+                            // If template exist is not in templateNames list => add to begin of options array
+                            (templateNames === null || templateNames === void 0 ? void 0 : templateNames.length) > 0
+                                ? [
+                                    ...(templateNames.find(item => item.id === templateNameExist.id)
+                                        ? []
+                                        : [{ value: templateNameExist.id, label: templateNameExist.label }]),
+                                    ...templateNames.map(item => ({ value: item.id, label: item.label })),
+                                ]
                                 : [], onChange: value => {
                                 var _a, _b;
                                 handleChangeValue({
@@ -135,15 +146,8 @@ export const TemplateSaveAs = props => {
                         React.createElement(ImageSlider, { thumbnails: thumbnails, isLoading: isLoadingThumbnail, skeleton: skeleton, previewNavigation: previewNavigation, slidesPerView: slidesPerView, defaultThumbnail: defaultThumbnail, onSelectDefault: value => handleChangeValue({ defaultThumbnail: value }), hideThumbnailsList: hideThumbnailsList, hideDefaultButton: hideDefaultButton, imageHeight: imageHeight, imageWidth: imageWidth })), categories === null || categories === void 0 ? void 0 :
                     categories.map(parentCategory => {
                         var _a, _b;
-                        // const selectedChildren = categoriesValue
-                        //   .find(item => item.label === parentCategory.label)
-                        //   ?.children.map(item => item.label);
                         const selectedChildren = categoriesValue[parentCategory.key];
                         const remainChildren = parentCategory.children.filter(item => !(selectedChildren === null || selectedChildren === void 0 ? void 0 : selectedChildren.includes(item.key)));
-                        // const formatData = remainChildren.map((item, idx) => ({
-                        //   label: item.label,
-                        //   key: idx,
-                        // }));
                         // NOTE: filter to remove device and template categories
                         if ((omitCategories === null || omitCategories === void 0 ? void 0 : omitCategories.length) && omitCategories.includes(parentCategory.key.toString()))
                             return null;

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

@@ -95,7 +95,7 @@ export const useTemplateListing = (options) => {
             },
         },
     });
-    const { data: templateDetail, isLoading: isLoadingTemplateDetail } = useGetObjectTemplateDetail({
+    const { data: templateDetail, isLoading: isLoadingTemplateDetail = false } = useGetObjectTemplateDetail({
         args: {
             params: {
                 template_id: selectedTemplateId || '',
@@ -104,6 +104,9 @@ export const useTemplateListing = (options) => {
             },
             auth: serviceAuth,
         },
+        options: {
+            enabled: !!selectedTemplateId,
+        },
     });
     // Variables
     const isLoadingTemplateList = isFetching || isFetchingNextPage;
@@ -212,7 +215,7 @@ export const useTemplateListing = (options) => {
         previewTemplateCategories,
         isLoadingCategoryList,
         isLoadingTemplateList,
-        isLoadingTemplateDetail,
+        isLoadingTemplateDetail: isLoadingTemplateDetail && !!selectedTemplateId,
         // Functions
         refetchCategoryList,
         refetchTemplateList,

package/es/constants/queries.d.ts

@@ -14,4 +14,5 @@ export declare const QUERY_KEYS: {
     GET_TEMPLATE_CATEGORY_LIST: string;
     GET_OBJECT_TEMPLATE_LIST: string;
     GET_OBJECT_TEMPLATE_DETAIL: string;
+    GET_SAVE_AS_GALLERY_PERMISSION_EMAILS: string;
 };

package/es/constants/queries.js

@@ -22,4 +22,5 @@ export const QUERY_KEYS = {
     GET_TEMPLATE_CATEGORY_LIST: 'GET_TEMPLATE_CATEGORY_LIST',
     GET_OBJECT_TEMPLATE_LIST: 'GET_OBJECT_TEMPLATE_LIST',
     GET_OBJECT_TEMPLATE_DETAIL: 'GET_OBJECT_TEMPLATE_DETAIL',
+    GET_SAVE_AS_GALLERY_PERMISSION_EMAILS: 'GET_SAVE_AS_GALLERY_PERMISSION_EMAILS',
 };

package/es/queries/TemplateListing/index.d.ts

@@ -1,6 +1,6 @@
 import { UseInfiniteQueryOptions, UseMutationOptions, UseQueryOptions } from '@tanstack/react-query';
 import { TemplateCategory } from '@antscorp/antsomi-ui/es/models/TemplateCategory';
-import { TBulkUpdateObjectTemplateArgs, TGetCategoryListArgs, TGetObjectTemplateDetailArgs, TGetObjectTemplateListArgs, TUpdateObjectTemplateArgs, TValidateObjectTemplateNameArgs } from '@antscorp/antsomi-ui/es/services/TemplateListing';
+import { TBulkUpdateObjectTemplateArgs, TGetCategoryListArgs, TGetObjectTemplateDetailArgs, TGetObjectTemplateListArgs, TGetSaveAsGalleryPermissionArgs, TUpdateObjectTemplateArgs, TValidateObjectTemplateNameArgs } from '@antscorp/antsomi-ui/es/services/TemplateListing';
 import { ResponseCheckNameExist, ResponseListing } from '../../types';
 import { ObjectTemplate } from '../../models/ObjectTemplate';
 import { TCreateObjectTemplateArgs } from '../../services/TemplateListing';
@@ -8,6 +8,10 @@ export type TGetTemplateCategoryList = {
     args: TGetCategoryListArgs;
     options?: UseQueryOptions<any, any, TemplateCategory[], any[]>;
 };
+export type TGetSaveAsGalleryPermissionEmails = {
+    args: TGetSaveAsGalleryPermissionArgs;
+    options?: UseQueryOptions<any, any, string[], any[]>;
+};
 export type TGetObjectTEmplateList = {
     args: TGetObjectTemplateListArgs;
     options?: UseInfiniteQueryOptions<any, any, ResponseListing<ObjectTemplate>, (string | number)[]>;
@@ -35,6 +39,7 @@ export type TUsePersistTemplate = {
     }, unknown>;
 };
 export declare const useGetTemplateCategoryList: (params: TGetTemplateCategoryList) => import("@tanstack/react-query").UseQueryResult<TemplateCategory[], any>;
+export declare const useGetSaveAsGalleryPermissionEmails: (params: TGetSaveAsGalleryPermissionEmails) => import("@tanstack/react-query").UseQueryResult<string[], any>;
 export declare const useGetObjectTemplateList: (params: TGetObjectTEmplateList) => import("@tanstack/react-query").UseInfiniteQueryResult<ResponseListing<ObjectTemplate>, any>;
 export declare const useGetObjectTemplateDetail: (params: TGetObjectTemplateDetail) => import("@tanstack/react-query").UseQueryResult<ObjectTemplate, any>;
 export declare const useValidateTemplateName: (params: TUseValidateTemplateName) => import("@tanstack/react-query").UseMutationResult<ResponseCheckNameExist, any, TValidateObjectTemplateNameArgs, unknown>;

package/es/queries/TemplateListing/index.js

@@ -20,6 +20,10 @@ export const useGetTemplateCategoryList = (params) => {
     const { options, args } = params;
     return useQuery(Object.assign({ queryKey: [QUERY_KEYS.GET_TEMPLATE_CATEGORY_LIST, args.params], queryFn: () => category.getList(params.args), onSuccess() { } }, options));
 };
+export const useGetSaveAsGalleryPermissionEmails = (params) => {
+    const { options } = params;
+    return useQuery(Object.assign({ queryKey: [QUERY_KEYS.GET_SAVE_AS_GALLERY_PERMISSION_EMAILS], queryFn: () => objectTemplate.getSaveAsGalleryPermission(params.args), onSuccess() { } }, options));
+};
 export const useGetObjectTemplateList = (params) => {
     const { options, args } = params;
     return useInfiniteQuery(Object.assign({ queryKey: [QUERY_KEYS.GET_OBJECT_TEMPLATE_LIST, args.params], queryFn: ({ pageParam = 1 }) => __awaiter(void 0, void 0, void 0, function* () {

package/es/services/TemplateListing/index.d.ts

@@ -42,6 +42,9 @@ export type TCreateObjectTemplateArgs = {
     data: Partial<TObjectTemplate>;
     auth: TServiceAuth;
 };
+export type TGetSaveAsGalleryPermissionArgs = {
+    auth: TServiceAuth;
+};
 export type TValidateObjectTemplateNameArgs = {
     params: {
         template_name: string;
@@ -61,5 +64,6 @@ export declare const templateListingServices: {
         update: ({ data, auth }: TUpdateObjectTemplateArgs) => Promise<ObjectTemplate>;
         bulkUpdate: ({ params, auth }: TBulkUpdateObjectTemplateArgs) => Promise<any>;
         validateName: ({ params, auth, }: TValidateObjectTemplateNameArgs) => Promise<ResponseCheckNameExist>;
+        getSaveAsGalleryPermission: ({ auth, }: TGetSaveAsGalleryPermissionArgs) => Promise<string[]>;
     };
 };

package/es/services/TemplateListing/index.js

@@ -145,5 +145,17 @@ export const templateListingServices = {
                 return Promise.reject(error);
             }
         }),
+        getSaveAsGalleryPermission: ({ auth, }) => __awaiter(void 0, void 0, void 0, function* () {
+            try {
+                const response = yield axios({
+                    method: 'GET',
+                    url: `${auth.url}/${OBJECT_TEMPLATE_ROUTE}/save-as-gallery-permission-emails`,
+                });
+                return get(response, 'data.data', []);
+            }
+            catch (error) {
+                return Promise.reject(error);
+            }
+        }),
     },
 };

package/package.json

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