architwin 1.18.9 → 1.18.11

package/lib/atwinui/components/toolbar/i18n.js

@@ -290,7 +290,6 @@ i18n
                 "SuccessUpdatedFloorLevel": "Updated the partition's floor level",
                 "DuplicatePartitionName": "This partition name is already used in this room. Please choose a different name.",
                 "PleaseOnPolygonVisibility": "Action cannot be done, please turn on room visibility.",
-                "IoTType": "IoT Type"
             }
         },
         ja: {
@@ -575,8 +574,7 @@ i18n
                 "IotCategoryRequired": "IoTカテゴリは必須です",
                 "SuccessUpdatedFloorLevel": "区画のフロアオフセット値が更新されました",
                 "DuplicatePartitionName": "このパーティション名は既にこの部屋で使用されています。別の名前を選択してください。",
-                "PleaseOnPolygonVisibility": "操作を行う前に、部屋の表示をオンにしてください。",
-                "IoTType": "IoTタイプ"
+                "PleaseOnPolygonVisibility": "操作を行う前に、部屋の表示をオンにしてください。"
             }
         }
     },

package/lib/atwinui/components/toolbar/spacePartition/roomTreePane.js

@@ -213,11 +213,13 @@ export function displayPartitionItems(partitionItems, partitionId, object, paren
         // This is for the walls
         partitionItems.forEach((wall, index) => {
             log.info("__@ partition item: ", wall);
+            if (!wall || !wall.name || !(object === null || object === void 0 ? void 0 : object[index]))
+                return;
             if (!wall.options.is_deleted) {
                 if (!wall.hide) {
                     // Split wall name to localize
                     const match = wall.name.match(/wall-(\d+)$/);
-                    const wallNumber = parseInt(match[1]) + 1;
+                    const wallNumber = match ? parseInt(match[1]) + 1 : index + 1;
                     const isVisible = wall.options.is_visible;
                     const objName = object[index].name.includes('_') ? object[index].name : `${partitionId}_${object[index].name}`;
                     log.info("__@ objName: ", objName);

package/lib/atwinui/components/toolbar/tagFormPane.d.ts

@@ -1,4 +1,4 @@
-import { FORM_MODE, ITagCategory, ITag } from "../../../types";
+import { FORM_MODE, ITagCategory } from "../../../types";
 export declare let tagFormMode: FORM_MODE;
 export declare let selectedTag: any;
 export declare function renderTagFormPane(): HTMLDivElement;
@@ -13,8 +13,6 @@ export declare function getTagFormData(): {
 export declare function setTagCategoriesOption(): void;
 export declare function toggleDropdown(elementId: string): void;
 export declare function clearInnerHTML(elementId: string): void;
-export declare function hideTagsFromSpace(tags?: ITag[]): Promise<void>;
-export declare function renderTagsInSpace(tags: ITag[], _withIcon?: boolean, iframeId?: string): Promise<void>;
 export declare function renderCategoryDropdownOptions(elementId: string, items: Array<ITagCategory>, toggleId?: string): void;
 export declare function renderSubcategoryDropdownOptions(elementId: string, items: Array<ITagCategory>): void;
 export declare function clearTagFormDropdown(): void;

package/lib/atwinui/components/toolbar/tagFormPane.js

@@ -1,20 +1,8 @@
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-import { _atwin, _atwinConnections, _tagCategories, _tags, attachSandbox, disposeTags, getIoTDeviceTagIcons, getMpTags, renderTag, setTagIcon } from "../../../architwin";
-import { convertToCssRgb, stringContains, useHexToRgb } from "../../../utils";
+import { _tagCategories, _tags, getMpTags } from "../../../architwin";
+import { convertToCssRgb, stringContains } from "../../../utils";
 import { TAG_TYPE } from "../../../types";
 import { renderTags, setSelectedCategoryFilter, setSelectedSubcategoryFilter, filterTagList, getAllSubcategories, selectedCategoryFilterId, sortTags, selectedTagSortOption } from './tagListPane';
 import i18n from './i18n';
-import log from "loglevel";
-import ShortUniqueId from "short-unique-id";
-import * as _tag from './../../../tag';
 let mode = 'adding';
 let tagNameInput, tagDescriptionInput, tagEmbedInput, tagCategoryDropdown, tagSubcategoryDropdown;
 let selectedCategoryId = undefined;
@@ -273,228 +261,109 @@ export function clearInnerHTML(elementId) {
     targetElement.innerHTML = ``;
 }
 function selectOption(option, elementId, skipToggle = false) {
-    var _a;
-    return __awaiter(this, void 0, void 0, function* () {
-        console.log("selectOption()");
-        //const dropdownToggle = document.querySelector('.at_dropdown_toggle');
-        if (!elementId || elementId === '' || elementId == null) {
-            console.error("ElementId is empty or undefined");
-            return;
+    console.log("selectOption()");
+    //const dropdownToggle = document.querySelector('.at_dropdown_toggle');
+    if (!elementId || elementId === '' || elementId == null) {
+        console.error("ElementId is empty or undefined");
+        return;
+    }
+    const dropdownToggle = document.getElementById(elementId);
+    //dropdownToggle.textContent = option.textContent;
+    dropdownToggle.innerHTML = option.innerHTML;
+    //selectedText = option.textContent;
+    const isFilterDropdown = stringContains(elementId, 'filter');
+    const categoryUUID = option.getAttribute('category-uuid');
+    const categoryType = option.getAttribute('dropdown-type');
+    console.log("categoryUUID ", categoryUUID);
+    console.log("categoryType ", categoryType);
+    if (categoryUUID && categoryUUID !== null) {
+        if (categoryType == 'category' && isFilterDropdown == false) {
+            selectedCategoryId = categoryUUID;
         }
-        const dropdownToggle = document.getElementById(elementId);
-        //dropdownToggle.textContent = option.textContent;
-        dropdownToggle.innerHTML = option.innerHTML;
-        //selectedText = option.textContent;
-        const isFilterDropdown = stringContains(elementId, 'filter');
-        const categoryUUID = option.getAttribute('category-uuid');
-        const categoryType = option.getAttribute('dropdown-type');
-        console.log("categoryUUID ", categoryUUID);
-        console.log("categoryType ", categoryType);
-        if (categoryUUID && categoryUUID !== null) {
-            if (categoryType == 'category' && isFilterDropdown == false) {
-                selectedCategoryId = categoryUUID;
-            }
-            else if (categoryType == 'category' && isFilterDropdown) {
-                setSelectedCategoryFilter(categoryUUID);
-                setSelectedSubcategoryFilter(undefined); //reset selected subcategory
-                const tags = getMpTags();
-                const filteredTags = filterTagList(tags);
-                const sortedTags = sortTags(filteredTags, { by: 'label', order: 'asc' });
-                const removeTags = tags.filter(tag => !filteredTags.some(ft => ft.id === tag.id) && tag.tag_type === TAG_TYPE.MP);
-                // remove tags that is not part in the sorted Tags
-                yield hideTagsFromSpace(removeTags);
-                // show filtered tags only
-                yield renderTagsInSpace(sortedTags, true);
-                log.info("sortedTags", sortedTags);
-                renderTags(sortedTags);
-            }
-            else if (categoryType == 'subcategory' && isFilterDropdown == false) {
-                selectedSubCategoryId = categoryUUID;
-            }
-            else if (categoryType == 'subcategory' && isFilterDropdown) {
-                setSelectedSubcategoryFilter(categoryUUID);
-                const tags = getMpTags();
-                const filteredTags = filterTagList(tags);
-                const sortedTags = sortTags(filteredTags, { by: 'label', order: 'asc' });
-                const removeTags = tags.filter(tag => !filteredTags.some(ft => ft.id === tag.id) && tag.tag_type === TAG_TYPE.MP);
-                // remove tags that is not part in the sorted Tags
-                yield hideTagsFromSpace(removeTags);
-                // show filtered tags only
-                yield renderTagsInSpace(filteredTags, true);
-                renderTags(filteredTags);
-            }
-            //Populate subcategory dropdown
-            const targetCategory = _tagCategories.find(cat => cat.uuid === categoryUUID);
-            if (targetCategory && targetCategory.subcategories && targetCategory.subcategories.length > 0) {
-                console.log("Subcategories found", targetCategory.subcategories);
-                renderSubcategoryDropdownOptions(isFilterDropdown ? 'at-subcategory-filter-options' : 'at-subcategory-options', targetCategory.subcategories);
-            }
-            else {
-                if (categoryType == 'category') {
-                    const elementId = isFilterDropdown ? 'at-subcategory-filter-options' : 'at-subcategory-options';
-                    const subcatToggleId = isFilterDropdown ? 'at-subcategory-filter-dropdown-toggle' : 'at-subcategory-dropdown-toggle';
-                    const subcategoryToggle = document.getElementById(elementId);
-                    const subcatDropdownToggle = document.getElementById(subcatToggleId);
-                    subcategoryToggle.innerHTML = `
+        else if (categoryType == 'category' && isFilterDropdown) {
+            setSelectedCategoryFilter(categoryUUID);
+            setSelectedSubcategoryFilter(undefined); //reset selected subcategory
+            const tags = getMpTags();
+            const filteredTags = filterTagList(tags);
+            const sortedTags = sortTags(filteredTags, { by: 'label', order: 'asc' });
+            renderTags(sortedTags);
+        }
+        else if (categoryType == 'subcategory' && isFilterDropdown == false) {
+            selectedSubCategoryId = categoryUUID;
+        }
+        else if (categoryType == 'subcategory' && isFilterDropdown) {
+            setSelectedSubcategoryFilter(categoryUUID);
+            const tags = getMpTags();
+            const filteredTags = filterTagList(tags);
+            const sortedTags = sortTags(filteredTags, { by: 'label', order: 'asc' });
+            renderTags(filteredTags);
+        }
+        //Populate subcategory dropdown
+        const targetCategory = _tagCategories.find(cat => cat.uuid === categoryUUID);
+        if (targetCategory && targetCategory.subcategories && targetCategory.subcategories.length > 0) {
+            console.log("Subcategories found", targetCategory.subcategories);
+            renderSubcategoryDropdownOptions(isFilterDropdown ? 'at-subcategory-filter-options' : 'at-subcategory-options', targetCategory.subcategories);
+        }
+        else {
+            if (categoryType == 'category') {
+                const elementId = isFilterDropdown ? 'at-subcategory-filter-options' : 'at-subcategory-options';
+                const subcatToggleId = isFilterDropdown ? 'at-subcategory-filter-dropdown-toggle' : 'at-subcategory-dropdown-toggle';
+                const subcategoryToggle = document.getElementById(elementId);
+                const subcatDropdownToggle = document.getElementById(subcatToggleId);
+                subcategoryToggle.innerHTML = `
                     <span class="mdi mdi-circle-slice-1"></span> ${i18n.t('NoSelection')}
                     `;
-                    subcatDropdownToggle.innerHTML = `
+                subcatDropdownToggle.innerHTML = `
                 <span class="mdi mdi-circle-slice-1"></span> ${i18n.t('NoSelection')}
                 `;
-                }
             }
         }
-        else {
-            console.log("categoryUUID is undefined");
-            if (categoryType == 'category' && isFilterDropdown) {
-                console.log("Clearing subcategory filter");
-                const subcategoryToggle = document.getElementById('at-subcategory-filter-dropdown-toggle');
-                subcategoryToggle.textContent = `${i18n.t('NoSelection')}`;
-                subcategoryToggle.innerHTML = `
+    }
+    else {
+        console.log("categoryUUID is undefined");
+        if (categoryType == 'category' && isFilterDropdown) {
+            console.log("Clearing subcategory filter");
+            const subcategoryToggle = document.getElementById('at-subcategory-filter-dropdown-toggle');
+            subcategoryToggle.textContent = `${i18n.t('NoSelection')}`;
+            subcategoryToggle.innerHTML = `
             <span class="mdi mdi-circle-slice-1"></span> ${i18n.t('NoSelection')}
             `;
-                setSelectedCategoryFilter(undefined);
-            }
-            if (isFilterDropdown) {
-                setSelectedSubcategoryFilter(undefined); //reset selected subcategory
-            }
-            //Populate subcategory dropdown
-            const targetCategory = _tagCategories.find(cat => cat.uuid === selectedCategoryFilterId);
-            if (targetCategory && targetCategory.subcategories && targetCategory.subcategories.length > 0) {
-                console.log("Subcategories found", targetCategory.subcategories);
-                renderSubcategoryDropdownOptions(isFilterDropdown ? 'at-subcategory-filter-options' : 'at-subcategory-options', targetCategory.subcategories);
-            }
-            else {
-                const elementId = isFilterDropdown ? 'at-subcategory-filter-options' : 'at-subcategory-options';
-                clearInnerHTML(elementId);
-            }
-            let tags = getMpTags().filter(tag => !tag.tag_type || tag.tag_type !== TAG_TYPE.IOT);
-            const filteredTags = (_a = filterTagList(tags)) !== null && _a !== void 0 ? _a : [];
-            const sortedTags = sortTags(filteredTags.length ? filteredTags : tags, selectedTagSortOption);
-            const removeTags = tags.filter(tag => !filteredTags.some(ft => ft.id === tag.id) && tag.tag_type === TAG_TYPE.MP);
-            if (filteredTags.length > 0) {
-                // remove tags that is not part in the sorted Tags
-                yield hideTagsFromSpace(removeTags);
-            }
-            // show filtered tags only
-            yield renderTagsInSpace(sortedTags, true);
-            renderTags(sortedTags);
-        }
-        let toggleId = '';
-        if (elementId === 'at-category-dropdown-toggle') {
-            toggleId = 'at-category-options';
-        }
-        else if (elementId === 'at-subcategory-dropdown-toggle') {
-            toggleId = 'at-subcategory-options';
-        }
-        else if (elementId === 'at-category-filter-dropdown-toggle') {
-            toggleId = 'at-category-filter-options';
+            setSelectedCategoryFilter(undefined);
         }
-        else if (elementId === 'at-subcategory-filter-dropdown-toggle') {
-            toggleId = 'at-subcategory-filter-options';
+        if (isFilterDropdown) {
+            setSelectedSubcategoryFilter(undefined); //reset selected subcategory
         }
-        if (skipToggle == false) {
-            toggleDropdown(toggleId);
-        }
-    });
-}
-export function hideTagsFromSpace(tags = null) {
-    return __awaiter(this, void 0, void 0, function* () {
-        log.info('hideTagsFromSpace', tags);
-        if (tags != null) {
-            tags.map((tag) => __awaiter(this, void 0, void 0, function* () {
-                yield _tag.disposeTag({ tagId: tag.json_data.id, sdk: _atwin, tags: _tags });
-            }));
+        //Populate subcategory dropdown
+        const targetCategory = _tagCategories.find(cat => cat.uuid === selectedCategoryFilterId);
+        if (targetCategory && targetCategory.subcategories && targetCategory.subcategories.length > 0) {
+            console.log("Subcategories found", targetCategory.subcategories);
+            renderSubcategoryDropdownOptions(isFilterDropdown ? 'at-subcategory-filter-options' : 'at-subcategory-options', targetCategory.subcategories);
         }
         else {
-            disposeTags();
+            const elementId = isFilterDropdown ? 'at-subcategory-filter-options' : 'at-subcategory-options';
+            clearInnerHTML(elementId);
         }
-    });
-}
-// render tags to space
-export function renderTagsInSpace(tags, _withIcon = false, iframeId = undefined) {
-    var _a;
-    return __awaiter(this, void 0, void 0, function* () {
-        log.info('renderTagsInSpace', tags);
-        let renderedTagIds = [];
-        const sdk = iframeId ? _atwinConnections[iframeId] : _atwin;
-        for (let tag of tags) {
-            log.info('tag', tag);
-            const isDuplicate = renderedTagIds.includes(tag.json_data.id);
-            const rsid = new ShortUniqueId({ length: 10 });
-            if (isDuplicate) {
-                //assign a different unique id if the existing tag id is a duplicate
-                tag.json_data.id = rsid.rnd();
-            }
-            renderedTagIds.push(tag.json_data.id);
-            try {
-                const renderedTag = yield renderTag({ tag: tag.json_data }, false, iframeId);
-            }
-            catch (error) {
-                log.info("Tag is already rendered in space");
-                continue;
-            }
-            // check if tag needs tag icon display
-            if (_withIcon && tag.tag_icon_base64 !== '') {
-                // set tag icon
-                log.info("__@ showTags: ", tags);
-                yield setTagIcon({ tag: tag.json_data, iconName: tag.tag_icon_name, iconUrl: tag.tag_icon_base64, color: tag.json_data.color, iframeId });
-            }
-            if (tag.media_url && tag.media_url !== '') {
-                try {
-                    const attachments = [tag.media_url];
-                    yield _tag.attachTagMedia({ sdk, tag: tag.json_data, attachments });
-                }
-                catch (error) {
-                    log.warn(error);
-                }
-            }
-            if (tag.sandboxId) {
-                try {
-                    yield attachSandbox({ sandboxId: tag.sandboxId, tagIds: [tag.json_data.id] });
-                }
-                catch (error) {
-                    log.error("Attach sandbox error ", error);
-                }
-            }
-            if (tag.tag_type === TAG_TYPE.IOT) {
-                const icons = getIoTDeviceTagIcons();
-                let iconUrl = icons.normal;
-                let iconName = "normal.png";
-                let color = { r: 0.3, g: 0.5, b: 1.0 }; // default soft royal blue
-                for (const device of tag.iot_tag.linked_devices) {
-                    if (!device)
-                        continue;
-                    const { quality, status } = device;
-                    // If any device is offline, override color to gray and stop checking further
-                    if (status === "offline") {
-                        iconUrl = icons.normal;
-                        iconName = "normal.png";
-                        color = useHexToRgb("667c89"); // gray
-                        break;
-                    }
-                    // If any device is alert (highest priority), set red and stop
-                    if (quality === 2) {
-                        iconUrl = icons.alert;
-                        iconName = "alert.png";
-                        color = { r: 1, g: 0, b: 0 }; // red
-                        break;
-                    }
-                    // If any device is attention, set orange but keep checking in case of alert
-                    if (quality === 3) {
-                        iconUrl = icons.alert;
-                        iconName = "normal.png";
-                        color = useHexToRgb("ffae42"); // orange
-                        // continue loop to see if alert is present
-                    }
-                }
-                tag.tag_icon_url = iconUrl;
-                tag.tag_icon_name = iconName;
-                tag.json_data.color = color;
-                yield setTagIcon({ tag: tag.json_data, iconName: (_a = tag.tag_icon_base64) !== null && _a !== void 0 ? _a : '', iconUrl: tag.tag_icon_url, color: tag.json_data.color });
-            }
-        }
-    });
+        let tags = getMpTags().filter(tag => !tag.tag_type || tag.tag_type !== TAG_TYPE.IOT);
+        const filteredTags = filterTagList(tags);
+        const sortedTags = sortTags(filteredTags ? filteredTags : tags, selectedTagSortOption);
+        renderTags(sortedTags);
+    }
+    let toggleId = '';
+    if (elementId === 'at-category-dropdown-toggle') {
+        toggleId = 'at-category-options';
+    }
+    else if (elementId === 'at-subcategory-dropdown-toggle') {
+        toggleId = 'at-subcategory-options';
+    }
+    else if (elementId === 'at-category-filter-dropdown-toggle') {
+        toggleId = 'at-category-filter-options';
+    }
+    else if (elementId === 'at-subcategory-filter-dropdown-toggle') {
+        toggleId = 'at-subcategory-filter-options';
+    }
+    if (skipToggle == false) {
+        toggleDropdown(toggleId);
+    }
 }
 function createOptionElement(item, dropdownType) {
     console.log("createOptionElement");

package/lib/atwinui/components/toolbar/tagIotFormPane.js

@@ -51,7 +51,7 @@ export function renderTagIOTFormPane() {
           </div>
         </div>
 
-        <label for="">${i18n.t('IoTType')}</label>
+        <label for="">${i18n.t('Category')}</label>
         <div id="at-iot-category-dropdown" data-cy="at-iot-category-dropdown">
           <div id="at-iot-cat-filter-dropdown" class="at_dropdown at_flex at_flex_row at_space_between">    
             <div class="at_dropdown_toggle" id="at-iot-selected-cat" data-cy="at-iot-selected-cat">${i18n.t(selectedIoTCatOption)}</div>

package/lib/atwinui/components/toolbar/tagListPane.d.ts

@@ -32,6 +32,6 @@ export declare function initializeTagVisibility(): void;
 export declare function updateShowAllButton(): void;
 export declare function clearTagVisibilityStorage(): void;
 export declare function setIotCategoryFilterOptions(): void;
-export declare function filterIotTagByCategory(tags: ITag[]): Promise<void>;
+export declare function filterIotTagByCategory(tags: ITag[]): void;
 export declare function setSelectedIoTCategoryFilter(payload: ITagIOTCategory): void;
 export declare function renderIotCategoryDropdownFilterOptions(elementId: string, items: Array<ITagIOTCategory>): void;

package/lib/atwinui/components/toolbar/tagListPane.js

@@ -11,7 +11,7 @@ import { SPACE_EVENTS, sortTagOptions, TAG_TYPE } from "../../../types";
 import { batchAddEventListenerByClassName, toggleDisplayPane, batchAddEventListenerByDataAttribute } from "../../events";
 import { convertToCssRgb, getBundleVersion, stringContains } from "../../../utils";
 import { gotoTag, disposeTag, dispatchSpaceEvent, _tags, getUserAssignedCategories, _mpConfig, moveTag, getAtwinSdk, toggleVisibilityTag, _tagIotCategoryTypes } from "../../../architwin";
-import { hideTagsFromSpace, initFormData, renderTagsInSpace, toggleDropdown } from "./tagFormPane";
+import { initFormData, toggleDropdown } from "./tagFormPane";
 import { toggleModal, setModalAction } from "./modal";
 import { initIoTFormData, setIoTFormMode } from './tagIotFormPane';
 import { Notyf } from 'notyf';
@@ -121,7 +121,7 @@ export function renderTagListPane() {
             </div>
 
             <div class="at_field at_flex_column" id="at-custom-iot-category-filter-dropdown-container">
-                <label for="">${i18n.t('IoTType')}</label>
+                <label for="">${i18n.t('Category')}</label>
                 <div id="at-custom-iot-category-filter-dropdown" data-cy="at-custom-iot-category-filterdropdown">
                 <div id="at-custom-iot-cat-filter-dropdown" class="at_dropdown at_flex at_flex_row at_space_between">    
                     <div class="at_dropdown_toggle" id="at-custom-iot-selected-filter-category" data-cy="at-custom-iot-selected-filter-category">${i18n.t('NoSelection')}</div>
@@ -274,6 +274,11 @@ export function renderTags(tags, showOwnTagsOnly = false) {
                     console.log("TAG DELETE", tagId, _tags);
                     const targetTag = _tags.find(tag => tag.json_data.id.toString() == tagId);
                     yield disposeTag({ tagId: tagId });
+                    if (targetTag) {
+                        const tagType = targetTag.tag_type || TAG_TYPE.MP;
+                        delete tagVisibility[tagType][tagId];
+                        updateShowAllButton();
+                    }
                     const tagRow = document.getElementById(`at-tag-row-${tagId}`);
                     tagRow.remove();
                     const payload = { tag: targetTag };
@@ -488,7 +493,13 @@ export function addClickEventToTagRow(tag) {
             if (tag) {
                 const tagId = tag.getAttribute('tag-id');
                 if (tagId && tagId !== null) {
+                    const deletedTag = _tags.find(t => t.json_data.id.toString() === tagId);
                     yield disposeTag({ tagId: tagId });
+                    if (deletedTag) {
+                        const tagType = deletedTag.tag_type || TAG_TYPE.MP;
+                        delete tagVisibility[tagType][tagId];
+                        updateShowAllButton();
+                    }
                     const tagRow = document.getElementById(`at-tag-row-${tagId}`);
                     tagRow.remove();
                     notify.success(i18n.t('Successfully deleted tag'));
@@ -853,7 +864,7 @@ export function setIotCategoryFilterOptions() {
     log.info('setIotCategoryOptions()');
     if (_tagIotCategoryTypes) {
         renderIotCategoryDropdownFilterOptions('at-iot-category-filter-options', _tagIotCategoryTypes);
-        batchAddEventListenerByClassName('at_iot_cat_filter_option', (event) => __awaiter(this, void 0, void 0, function* () {
+        batchAddEventListenerByClassName('at_iot_cat_filter_option', (event) => {
             log.info("category filter clicked");
             //@ts-ignore
             const selectedCat = event.target;
@@ -863,7 +874,6 @@ export function setIotCategoryFilterOptions() {
                 // no selection selected
                 selectedIoTCategoryFilter = { uuid: '', name: 'NoSelection' };
                 setSelectedIoTCategoryFilter(selectedIoTCategoryFilter);
-                yield renderTagsInSpace(iotTags, true);
                 renderTags(iotTags);
             }
             const getCatName = _tagIotCategoryTypes.find(cat => cat.uuid === catUUID);
@@ -874,18 +884,13 @@ export function setIotCategoryFilterOptions() {
                 filterIotTagByCategory(iotTags);
             }
             toggleDropdown('at-iot-category-filter-options');
-        }));
+        });
     }
 }
 export function filterIotTagByCategory(tags) {
-    return __awaiter(this, void 0, void 0, function* () {
-        log.info("selectedIoTCategoryFilter", selectedIoTCategoryFilter, _tags);
-        const filteredTags = tags.filter(tag => tag.iot_tag.iot_category == selectedIoTCategoryFilter.name);
-        const removeTags = tags.filter(tag => !filteredTags.some(ft => ft.id === tag.id) && tag.tag_type === TAG_TYPE.IOT);
-        yield hideTagsFromSpace(removeTags);
-        yield renderTagsInSpace(filteredTags, true);
-        renderTags(filteredTags);
-    });
+    log.info("selectedIoTCategoryFilter", selectedIoTCategoryFilter, _tags);
+    const filteredTags = tags.filter(tag => tag.iot_tag.iot_category == selectedIoTCategoryFilter.name);
+    renderTags(filteredTags);
 }
 // displays selected Category in the dropdown
 export function setSelectedIoTCategoryFilter(payload) {