@antscorp/antsomi-ui 1.3.5-beta.376 → 1.3.5-beta.377

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

@@ -1,8 +1,10 @@
 /// <reference types="react" />
-import { TServiceAuth } from '@antscorp/antsomi-ui/es/types';
+import { ResponseListing, TServiceAuth } from '@antscorp/antsomi-ui/es/types';
 import { TCategoryItem, TCheckedCategories, TSelectTemplateAction, TTemplateItem } from '../types';
 import { TTemplateListingConfig } from '@antscorp/antsomi-ui/es/types/templateListing';
 import { TThumbnailCardId } from '../../../molecules/ThumbnailCard';
+import { InfiniteData } from '@tanstack/react-query';
+import { ObjectTemplate } from '@antscorp/antsomi-ui/es/models/ObjectTemplate';
 import { TemplateCategory } from '@antscorp/antsomi-ui/es/models/TemplateCategory';
 interface TemplateListingOptions {
     serviceAuth: TServiceAuth;
@@ -60,7 +62,7 @@ export declare const useTemplateListing: <T = undefined>(options: TemplateListin
     templateItems: (TTemplateItem | undefined)[];
     openCategoryKeys: string[];
     similarTemplates: (TTemplateItem | undefined)[];
-    templateDetail: import("@antscorp/antsomi-ui/es/models/ObjectTemplate").ObjectTemplate | undefined;
+    templateDetail: ObjectTemplate | undefined;
     checkedCategories: TCheckedCategories;
     selectTemplateAction: string | T | undefined;
     previewTemplateCategories: TCategoryItem[];
@@ -68,8 +70,8 @@ export declare const useTemplateListing: <T = undefined>(options: TemplateListin
     isLoadingCategoryList: boolean;
     isLoadingTemplateList: boolean;
     isLoadingTemplateDetail: boolean;
-    refetchCategoryList: <TPageData>(options?: (import("@tanstack/query-core").RefetchOptions & import("@tanstack/query-core").RefetchQueryFilters<TPageData>) | undefined) => Promise<import("@tanstack/query-core").QueryObserverResult<TemplateCategory[], any>>;
-    refetchTemplateList: <TPageData_1>(options?: (import("@tanstack/query-core").RefetchOptions & import("@tanstack/query-core").RefetchQueryFilters<TPageData_1>) | undefined) => Promise<import("@tanstack/query-core").QueryObserverResult<import("@tanstack/query-core").InfiniteData<import("@antscorp/antsomi-ui/es/types").ResponseListing<import("@antscorp/antsomi-ui/es/models/ObjectTemplate").ObjectTemplate>>, any>>;
+    refetchCategoryList: <TPageData>(options?: (import("@tanstack/react-query").RefetchOptions & import("@tanstack/react-query").RefetchQueryFilters<TPageData>) | undefined) => Promise<import("@tanstack/react-query").QueryObserverResult<TemplateCategory[], any>>;
+    refetchTemplateList: <TPageData_1>(options?: (import("@tanstack/react-query").RefetchOptions & import("@tanstack/react-query").RefetchQueryFilters<TPageData_1>) | undefined) => Promise<import("@tanstack/react-query").QueryObserverResult<InfiniteData<ResponseListing<ObjectTemplate>>, any>>;
     onChangeCheckedCategories: (checkedCategories: TCheckedCategories) => void;
     onChangeOpenCategoryKeys: (openKeys: string[]) => void;
     onRemoveObjectTemplate: (id: TThumbnailCardId) => void;

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

@@ -3,12 +3,14 @@ import { useCallback, useMemo, useState } from 'react';
 import { App } from 'antd';
 import { isEmpty } from 'lodash';
 import { useGetTemplateCategoryList, useGetObjectTemplateList, useBulkUpdateTemplate, } from '@antscorp/antsomi-ui/es/queries/TemplateListing';
+import { useQueryClient } from '@tanstack/react-query';
+import { removeObjectTemplate } from '../utils';
 // Locales
 import i18nInstance from '@antscorp/antsomi-ui/es/locales/i18n';
 // Hooks
 import { useDeepCompareEffect, useDeepCompareMemo } from '@antscorp/antsomi-ui/es/hooks';
 // Constants
-import { CATEGORY_SPLIT_KEY, TEMPLATE_STATUS } from '@antscorp/antsomi-ui/es/constants';
+import { CATEGORY_SPLIT_KEY, QUERY_KEYS, TEMPLATE_STATUS } from '@antscorp/antsomi-ui/es/constants';
 import { translations } from '@antscorp/antsomi-ui/es/locales/translations';
 import { getShuffleArray, random } from '@antscorp/antsomi-ui/es/utils';
 /**
@@ -96,10 +98,22 @@ export const useTemplateListing = (options) => {
             auth: serviceAuth,
             params: getTemplateListParams,
         },
+        // options: {
+        //   enabled: false,
+        // },
     });
+    // useDeepCompareEffect(() => {
+    //   refetchTemplateList();
+    // }, [getTemplateListParams]);
+    const queryClient = useQueryClient();
     const { mutateAsync: bulkUpdateTemplate } = useBulkUpdateTemplate({
         options: {
-            onSuccess: () => {
+            onSuccess: (data, variables) => {
+                const currentTemplateListCache = queryClient.getQueryData([QUERY_KEYS.GET_OBJECT_TEMPLATE_LIST, getTemplateListParams]);
+                if (currentTemplateListCache) {
+                    const newTemplateList = removeObjectTemplate(currentTemplateListCache, variables.params.template_ids);
+                    queryClient.setQueryData([QUERY_KEYS.GET_OBJECT_TEMPLATE_LIST, getTemplateListParams], newTemplateList);
+                }
                 message.success(t(translations.templateListing.removeSuccess));
             },
             onError: () => {

package/es/components/template/TemplateListing/utils.d.ts

@@ -0,0 +1,11 @@
+import { ObjectTemplate } from '@antscorp/antsomi-ui/es/models/ObjectTemplate';
+import { ResponseListing } from '@antscorp/antsomi-ui/es/types';
+import { InfiniteData } from '@tanstack/react-query';
+/**
+ * Removes template from the provided template list based on a list of IDs and updates the itemsPerPage meta value.
+ *
+ * @param {InfiniteData<ResponseListing<ObjectTemplate>>} templateList - The original template list containing pages of template.
+ * @param {number[]} templateIds - The list of entity IDs to be removed.
+ * @returns {InfiniteData<ResponseListing<ObjectTemplate>>} - The new template list with specified templates removed and meta.itemsPerPage updated.
+ */
+export declare const removeObjectTemplate: (templateList: InfiniteData<ResponseListing<ObjectTemplate>>, templateIds: number[]) => InfiniteData<ResponseListing<ObjectTemplate>>;

package/es/components/template/TemplateListing/utils.js

@@ -0,0 +1,18 @@
+import { cloneDeep } from 'lodash';
+/**
+ * Removes template from the provided template list based on a list of IDs and updates the itemsPerPage meta value.
+ *
+ * @param {InfiniteData<ResponseListing<ObjectTemplate>>} templateList - The original template list containing pages of template.
+ * @param {number[]} templateIds - The list of entity IDs to be removed.
+ * @returns {InfiniteData<ResponseListing<ObjectTemplate>>} - The new template list with specified templates removed and meta.itemsPerPage updated.
+ */
+export const removeObjectTemplate = (templateList, templateIds) => {
+    const newObject = cloneDeep(templateList);
+    newObject.pages = newObject.pages.map((page) => {
+        page.entities = page.entities.filter((entity) => !templateIds.includes(entity.id));
+        const finalCount = page.entities.length;
+        page.meta.itemsPerPage = finalCount;
+        return page;
+    });
+    return newObject;
+};

package/package.json

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