@wix/patterns 1.424.0 → 1.426.0

package/src/state/TagsModalState.ts

@@ -1,5 +1,5 @@
 import { RefObject } from 'react';
-import { action, makeObservable, observable } from 'mobx';
+import { action, computed, makeObservable, observable } from 'mobx';
 import {
   ConditionalModalState,
   TAG_MAX_LENGTH,
@@ -21,6 +21,10 @@ export interface TagsModalStateParams {
 
 const actionOrigin = 'Manage Tags Modal';
 
+// Render window for the tags list — the full list (up to 1000 tags) is in
+// memory, but rendering it all at once makes the modal sluggish
+const SHOWN_ITEMS_WINDOW_SIZE = 100;
+
 export class TagsModalState {
   readonly tagsManagementState;
   readonly tagsSearchState;
@@ -42,6 +46,7 @@ export class TagsModalState {
     deep: false,
   });
   ref: RefObject<HTMLDivElement> | null = null;
+  shownItemsLimit: number = SHOWN_ITEMS_WINDOW_SIZE;
 
   constructor({
     tagsManagementState,
@@ -68,6 +73,9 @@ export class TagsModalState {
       editedTagId: observable,
       editedTagErrorMessage: observable,
       isShowingNewTagListItem: observable,
+      shownItemsLimit: observable,
+      shownItems: computed,
+      showMoreItems: action.bound,
       init: action,
       openManageTagsModal: action,
       closeManageTagsModal: action,
@@ -124,6 +132,7 @@ export class TagsModalState {
   }) {
     this.origin = origin;
     this.tagSubOrigin = tagSubOrigin;
+    this.shownItemsLimit = SHOWN_ITEMS_WINDOW_SIZE;
     this.manageTagsModalState.modal.open();
     this._reportBiModalOpened();
     this.tagsManagementState.overrideShowToast = true;
@@ -161,16 +170,23 @@ export class TagsModalState {
   handleSearchChange(newSearchValue: string) {
     this.editedTagId = null;
     this.isShowingNewTagListItem = false;
+    this.shownItemsLimit = SHOWN_ITEMS_WINDOW_SIZE;
     this._reportSearchChangedBi(newSearchValue);
     this.tagsSearchState.setSearchValue(newSearchValue);
   }
 
   handleSearchClear() {
     this._reportSearchEventsBi('clear');
+    this.shownItemsLimit = SHOWN_ITEMS_WINDOW_SIZE;
     this.tagsSearchState.setSearchValue('');
   }
 
+  showMoreItems() {
+    this.shownItemsLimit += SHOWN_ITEMS_WINDOW_SIZE;
+  }
+
   handleCreateCtaClick() {
+    this._showAllItems();
     this.tagsSearchState.setSearchValue('');
     this.editedTagId = null;
     this.isShowingNewTagListItem = true;
@@ -210,6 +226,7 @@ export class TagsModalState {
       return;
     }
 
+    this._showAllItems();
     const newName = this.searchValue.slice(0, TAG_MAX_LENGTH);
     this._reportSearchEventsBi('add');
     this._createTag({
@@ -221,6 +238,7 @@ export class TagsModalState {
   }
 
   async createTagFromList(newName: string) {
+    this._showAllItems();
     const { status, statusMessage } = this._isValidName(newName);
     if (status === 'error') {
       this.editedTagErrorMessage = statusMessage;
@@ -346,11 +364,13 @@ export class TagsModalState {
   }
 
   get shownItems() {
-    return [...this.tagsSearchState.items].sort(
-      (tag1, tag2) =>
-        new Date(tag1.createdDate!).valueOf() -
-        new Date(tag2.createdDate!).valueOf(),
-    );
+    return [...this.tagsSearchState.items]
+      .sort(
+        (tag1, tag2) =>
+          new Date(tag1.createdDate!).valueOf() -
+          new Date(tag2.createdDate!).valueOf(),
+      )
+      .slice(0, this.shownItemsLimit);
   }
 
   get isOpen() {
@@ -366,6 +386,12 @@ export class TagsModalState {
   private createTagFromListTimeout?: number;
   private updateTagTimeout?: number;
 
+  // A created tag sorts to the end of the list — the render window must cover
+  // the full list so the deferred scroll-to-bottom actually reveals it
+  private _showAllItems() {
+    this.shownItemsLimit = Number.MAX_SAFE_INTEGER;
+  }
+
   private async _createTag({
     name,
     isFromSearch = false,

package/src/styles.global.css

@@ -1,3 +1,3 @@
-.CardContainer2267849251__root.CardContainer2267849251--mobile{border-radius:0}.CmsFieldForm1100768566__fullBleedDivider{margin-top:var(--wds-space-300, 18px);margin-inline:calc(-1*var(--wds-custom-modal-content-padding-horizontal, 24px))}.CmsFieldModal2245593888__modal{--wds-custom-modal-content-padding-vertical:0}.ValidationAndDefaultsSection2664226512__accordionWrapper{margin-inline:calc(-1*var(--wds-custom-modal-content-padding-horizontal, 24px))}.CharactersLimitInput3216958284__field{flex:1;min-width:0}.Collapse1046907253__root{transition-property:height;transition-timing-function:cubic-bezier(.4,0,.2,1)}.Collapse1046907253__exit{height:0}.CollectionPage3736372083__root [data-hook=page-header-wrapper]{--wds-space-300:18px}.CollectionPage3736372083__root.CollectionPage3736372083--mobile{--wds-page-header-padding-horizontal:0;--wds-page-header-padding-horizontal-small:0;--wds-color-fill-surface-sunken:#ffffff}.CollectionPage3736372083__root.CollectionPage3736372083--panel{overflow:hidden;position:relative}.CollectionSectionHeader3174480100__summaryIcon{display:flex;color:var(--wds-color-text-standard-secondary)}.CollectionTable836319324__root td{vertical-align:middle}.CollectionTable836319324__root.CollectionTable836319324--mobile td:first-child{padding-left:18px}.CollectionTable836319324__root.CollectionTable836319324--mobile td:last-child{padding-right:18px}.CollectionTableWSRTable4227633625__root.CollectionTableWSRTable4227633625--resizable table{min-width:100%}.CollectionTableWSRTable4227633625__root.CollectionTableWSRTable4227633625--resizable [data-hook=table-resize-handle]{right:-4px!important;z-index:1}.CollectionToolbar3931104184__left{min-width:0}.CollectionToolbar3931104184__left.CollectionToolbar3931104184--expandable{flex:auto}.CollectionToolbar3931104184__left.CollectionToolbar3931104184--title>*{width:100%}.CollectionToolbar3931104184__root.CollectionToolbar3931104184---responsiveMode-5-title .CollectionToolbar3931104184__left{flex:1 100;min-width:50px}.CollectionToolbar3931104184__root.CollectionToolbar3931104184---responsiveMode-4-tabs .CollectionToolbar3931104184__left,.CollectionToolbar3931104184__root.CollectionToolbar3931104184---responsiveMode-4-tabs .CollectionToolbar3931104184__left.CollectionToolbar3931104184--expandable{flex:1 100 auto;min-width:140px}.CollectionToolbar3931104184__root.CollectionToolbar3931104184---responsiveMode-4-tabs .CollectionToolbar3931104184__left>*{flex-shrink:1;min-width:0}.CollectionToolbar3931104184__root .CollectionToolbar3931104184__right{justify-content:flex-end!important;flex-grow:1;flex-shrink:1;flex-basis:auto}.CollectionToolbar3931104184__root.CollectionToolbar3931104184--views .CollectionToolbar3931104184__right{min-width:0;flex-grow:1;flex-shrink:0;flex-basis:0}.CollectionToolbar3931104184__root.CollectionToolbar3931104184---responsiveMode-4-tabs .CollectionToolbar3931104184__right,.CollectionToolbar3931104184__root.CollectionToolbar3931104184---responsiveMode-5-title .CollectionToolbar3931104184__right{flex:0 1 auto;min-width:0}.CollectionToolbar3931104184__root .CollectionToolbar3931104184__right.CollectionToolbar3931104184__fullWidth{margin-inline-start:0!important}.CollectionToolbar3931104184__root.CollectionToolbar3931104184--mobile{padding-right:18px;padding-left:18px}.SearchOrCustomFilter96467332__search{min-width:140px;max-width:240px;flex:1 0}.SearchOrCustomFilter96467332__searchMobile{justify-content:flex-end;position:absolute;right:18px}.SearchOrCustomFilter96467332__searchMobile:not(.SearchOrCustomFilter96467332--expandable){left:18px}.SearchOrCustomFilter96467332__searchMobile.SearchOrCustomFilter96467332--expandable.SearchOrCustomFilter96467332--expanded{left:18px}.AutoCompleteReadonly754203246__root.AutoCompleteReadonly754203246--disableEditing{cursor:pointer}.AutoCompleteReadonly754203246__root.AutoCompleteReadonly754203246--disableEditing input{cursor:pointer}.ViewsDropdown1047115637__root{width:200px}.DragHandle3949393576__root{display:flex;align-items:center}.DragHandle3949393576__root:not(.DragHandle3949393576--disabled){cursor:grab;color:#a8caff}.DragHandle3949393576__root.DragHandle3949393576--disabled{color:#acafc4}.DragHandle3949393576__root:focus-visible:not(.DragHandle3949393576--disabled){outline:0;box-shadow:0 0 0 3px #a6d0ff}.DragHandle3949393576__root.DragHandle3949393576--disabled{pointer-events:none}.DragHandle3949393576__root.DragHandle3949393576--dragging:not(.DragHandle3949393576--disabled){cursor:grabbing}td:has(>.EditableCell2214069969__root){position:relative;overflow:visible;min-height:24px}.EditableCell2214069969__root{display:flex;align-items:center;padding:0;position:absolute;top:0;left:0;right:0;bottom:0;overflow:hidden;box-sizing:border-box;outline:0;cursor:default;user-select:none;background:var(--wsr-color-D80);border:1px solid var(--wsr-color-B40)}.EditableCell2214069969__root.EditableCell2214069969--selected{background:rgba(56,153,236,.08)}.EditableCell2214069969__root.EditableCell2214069969--focused:not(.EditableCell2214069969--selected){box-shadow:inset 0 0 0 2px var(--wsr-color-B10);z-index:2}.EditableCell2214069969__root.EditableCell2214069969--editing{background:var(--wsr-color-D80);box-shadow:inset 0 0 0 2px var(--wsr-color-B10);z-index:3;user-select:auto;overflow:visible}.EditableCell2214069969__root.EditableCell2214069969--editing:not(.EditableCell2214069969--showEditWhenFocused){bottom:auto;min-height:100%}.EditableCell2214069969__root.EditableCell2214069969--focused.EditableCell2214069969--growable{background-color:var(--wsr-color-D80);background-image:linear-gradient(rgba(56,153,236,.08),rgba(56,153,236,.08));bottom:auto;min-height:100%;z-index:3}.EditableCell2214069969__root:has([data-inner-focused]){overflow:visible;z-index:3;box-shadow:inset 0 0 0 2px var(--wsr-color-B10)}.EditableCell2214069969__root.EditableCell2214069969--selectionTop:not(.EditableCell2214069969--editing){border-top:2px solid var(--wsr-color-B10)}.EditableCell2214069969__root.EditableCell2214069969--selectionBottom:not(.EditableCell2214069969--editing){border-bottom:2px solid var(--wsr-color-B10)}.EditableCell2214069969__root.EditableCell2214069969--selectionLeft:not(.EditableCell2214069969--editing){border-left:2px solid var(--wsr-color-B10)}.EditableCell2214069969__root.EditableCell2214069969--selectionRight:not(.EditableCell2214069969--editing){border-right:2px solid var(--wsr-color-B10)}.EditableCell2214069969__root.EditableCell2214069969--selectionTop.EditableCell2214069969--editing.EditableCell2214069969--typeToEdit{border-top:2px solid var(--wsr-color-B10)}.EditableCell2214069969__root.EditableCell2214069969--selectionBottom.EditableCell2214069969--editing.EditableCell2214069969--typeToEdit{border-bottom:2px solid var(--wsr-color-B10)}.EditableCell2214069969__root.EditableCell2214069969--selectionLeft.EditableCell2214069969--editing.EditableCell2214069969--typeToEdit{border-left:2px solid var(--wsr-color-B10)}.EditableCell2214069969__root.EditableCell2214069969--selectionRight.EditableCell2214069969--editing.EditableCell2214069969--typeToEdit{border-right:2px solid var(--wsr-color-B10)}.EditableCell2214069969__root.EditableCell2214069969--invalid:not(.EditableCell2214069969--editing){background:rgba(229,0,77,.06)}.EditableCell2214069969__root.EditableCell2214069969--copiedTop:not(.EditableCell2214069969--selectionTop){border-top:2px dashed var(--wsr-color-B10)}.EditableCell2214069969__root.EditableCell2214069969--copiedBottom:not(.EditableCell2214069969--selectionBottom){border-bottom:2px dashed var(--wsr-color-B10)}.EditableCell2214069969__root.EditableCell2214069969--copiedLeft:not(.EditableCell2214069969--selectionLeft){border-left:2px dashed var(--wsr-color-B10)}.EditableCell2214069969__root.EditableCell2214069969--copiedRight:not(.EditableCell2214069969--selectionRight){border-right:2px dashed var(--wsr-color-B10)}.EditableCell2214069969__validationIndicator{flex-shrink:0;margin-left:12px;margin-right:6px;color:var(--wsr-color-Y10)}.HeaderActionsPopover3567882799__root{opacity:0;transition:opacity .15s}th:hover .HeaderActionsPopover3567882799__root,.HeaderActionsPopover3567882799__root[data-menu-open=true],.HeaderActionsPopover3567882799__root:focus-within{opacity:1}.CellViewLayout705842804__root{width:100%;height:100%;padding:9px 12px;box-sizing:border-box;display:flex;align-items:center;overflow:clip}.CellViewLayout705842804__root>*{flex:1;min-width:0}.Edit249083917__addressInput{width:100%;height:100%;display:flex;align-items:center;box-sizing:border-box;padding-left:6px;padding-right:6px;min-width:0;overflow:hidden}.Edit249083917__addressInput>div,.Edit249083917__addressInput>div>div,.Edit249083917__addressInput>div>div>div{width:100%;min-width:0}.Edit2043724849__jsonInput{width:100%;margin-left:-1px}.Edit48829551__booleanEdit{display:flex;align-items:center;margin-left:12px}.View823517074__booleanView{display:flex;align-items:center;margin-left:9px;pointer-events:none}.Edit550744202__root{width:100%;height:100%;display:flex;align-items:center}.Edit240690608__dateInput{width:100%;margin-left:-1px}.Edit2529607865__half{min-width:0;position:relative;display:flex;align-items:center;box-sizing:border-box}.Edit2529607865__dateHalf{flex:60 1 0}.Edit2529607865__timeHalf{flex:40 1 0}.Edit2529607865__divider{width:1px;height:16px;background:var(--wds-color-border-standard, #dfe5eb);flex-shrink:0}.Edit2529607865__passiveText{padding:9px 12px;font-size:14px;line-height:18px;font-family:inherit;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:pointer;width:100%}.Edit2529607865__placeholderText{color:var(--wds-color-text-placeholder, #868aa5)}.View2613364452__leaf{min-width:0;padding:9px 12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px;line-height:18px;font-family:inherit;box-sizing:border-box}.View2613364452__datePart{flex:60 1 0}.View2613364452__timePart{flex:40 1 0}.View2613364452__placeholder{color:var(--wds-color-text-placeholder, #868aa5)}.View2613364452__divider{width:1px;height:16px;background:var(--wds-color-border-standard, #dfe5eb);flex-shrink:0}.Edit272976519__emailInput{width:100%;margin-left:-1px}.Edit2518949657__numberInput{width:100%;margin-right:2px}.Edit2518949657__numberInput input{text-align:right;direction:ltr}.View3249344471__textView{width:100%;text-align:right}.Edit2809740217__jsonInput{width:100%;margin-left:-1px}.Edit4152557657__selectInput{width:100%}.Edit2474595361__editWrapper{width:100%}.Edit2474595361__inputArea{background-color:transparent;width:100%}.Edit2474595361__inputArea input{padding:9px 12px 8px!important;outline:0!important;border:0!important;box-sizing:border-box!important}.Edit2474595361__inputArea>div{border:0!important;border-radius:0!important;box-shadow:none!important;background-color:transparent!important;outline:0!important}.Edit2474595361__inputArea textarea{padding:9px 12px 8px!important;outline:0!important;border:0!important;box-sizing:border-box!important}.Edit2474595361__inputArea:not(.Edit2474595361--isFocused) textarea{resize:none;overflow:hidden}.Edit2474595361__inputArea:not(.Edit2474595361--isFocused) textarea::-webkit-scrollbar{display:none}.Edit3071470623__wrapper{position:relative;width:100%;height:100%;display:flex;align-items:center;--wds-input-value-font-size-small:var(--wds-font-size-body-small);--wds-input-value-font-line-height-small:var(
+.CardContainer3635158469__root.CardContainer3635158469--mobile{border-radius:0}.CmsFieldForm2825341027__fullBleedDivider{margin-top:var(--wds-space-300, 18px);margin-inline:calc(-1*var(--wds-custom-modal-content-padding-horizontal, 24px))}.CmsFieldModal1691223120__modal{--wds-custom-modal-content-padding-vertical:0}.ValidationAndDefaultsSection2116056137__accordionWrapper{margin-inline:calc(-1*var(--wds-custom-modal-content-padding-horizontal, 24px))}.CharactersLimitInput3782966396__field{flex:1;min-width:0}.Collapse1347790111__root{transition-property:height;transition-timing-function:cubic-bezier(.4,0,.2,1)}.Collapse1347790111__exit{height:0}.CollectionPage1525812740__root [data-hook=page-header-wrapper]{--wds-space-300:18px}.CollectionPage1525812740__root.CollectionPage1525812740--mobile{--wds-page-header-padding-horizontal:0;--wds-page-header-padding-horizontal-small:0;--wds-color-fill-surface-sunken:#ffffff}.CollectionPage1525812740__root.CollectionPage1525812740--panel{overflow:hidden;position:relative}.CollectionSectionHeader594798270__summaryIcon{display:flex;color:var(--wds-color-text-standard-secondary)}.CollectionTable709785733__root td{vertical-align:middle}.CollectionTable709785733__root.CollectionTable709785733--mobile td:first-child{padding-left:18px}.CollectionTable709785733__root.CollectionTable709785733--mobile td:last-child{padding-right:18px}.CollectionTableWSRTable2891095080__root.CollectionTableWSRTable2891095080--resizable table{min-width:100%}.CollectionTableWSRTable2891095080__root.CollectionTableWSRTable2891095080--resizable [data-hook=table-resize-handle]{right:-4px!important;z-index:1}.CollectionToolbar3005073471__left{min-width:0}.CollectionToolbar3005073471__left.CollectionToolbar3005073471--expandable{flex:auto}.CollectionToolbar3005073471__left.CollectionToolbar3005073471--title>*{width:100%}.CollectionToolbar3005073471__root.CollectionToolbar3005073471---responsiveMode-5-title .CollectionToolbar3005073471__left{flex:1 100;min-width:50px}.CollectionToolbar3005073471__root.CollectionToolbar3005073471---responsiveMode-4-tabs .CollectionToolbar3005073471__left,.CollectionToolbar3005073471__root.CollectionToolbar3005073471---responsiveMode-4-tabs .CollectionToolbar3005073471__left.CollectionToolbar3005073471--expandable{flex:1 100 auto;min-width:140px}.CollectionToolbar3005073471__root.CollectionToolbar3005073471---responsiveMode-4-tabs .CollectionToolbar3005073471__left>*{flex-shrink:1;min-width:0}.CollectionToolbar3005073471__root .CollectionToolbar3005073471__right{justify-content:flex-end!important;flex-grow:1;flex-shrink:1;flex-basis:auto}.CollectionToolbar3005073471__root.CollectionToolbar3005073471--views .CollectionToolbar3005073471__right{min-width:0;flex-grow:1;flex-shrink:0;flex-basis:0}.CollectionToolbar3005073471__root.CollectionToolbar3005073471---responsiveMode-4-tabs .CollectionToolbar3005073471__right,.CollectionToolbar3005073471__root.CollectionToolbar3005073471---responsiveMode-5-title .CollectionToolbar3005073471__right{flex:0 1 auto;min-width:0}.CollectionToolbar3005073471__root .CollectionToolbar3005073471__right.CollectionToolbar3005073471__fullWidth{margin-inline-start:0!important}.CollectionToolbar3005073471__root.CollectionToolbar3005073471--mobile{padding-right:18px;padding-left:18px}.SearchOrCustomFilter387023842__search{min-width:140px;max-width:240px;flex:1 0}.SearchOrCustomFilter387023842__searchMobile{justify-content:flex-end;position:absolute;right:18px}.SearchOrCustomFilter387023842__searchMobile:not(.SearchOrCustomFilter387023842--expandable){left:18px}.SearchOrCustomFilter387023842__searchMobile.SearchOrCustomFilter387023842--expandable.SearchOrCustomFilter387023842--expanded{left:18px}.AutoCompleteReadonly4265321389__root.AutoCompleteReadonly4265321389--disableEditing{cursor:pointer}.AutoCompleteReadonly4265321389__root.AutoCompleteReadonly4265321389--disableEditing input{cursor:pointer}.ViewsDropdown3062685421__root{width:200px}.DragHandle544144832__root{display:flex;align-items:center}.DragHandle544144832__root:not(.DragHandle544144832--disabled){cursor:grab;color:#a8caff}.DragHandle544144832__root.DragHandle544144832--disabled{color:#acafc4}.DragHandle544144832__root:focus-visible:not(.DragHandle544144832--disabled){outline:0;box-shadow:0 0 0 3px #a6d0ff}.DragHandle544144832__root.DragHandle544144832--disabled{pointer-events:none}.DragHandle544144832__root.DragHandle544144832--dragging:not(.DragHandle544144832--disabled){cursor:grabbing}td:has(>.EditableCell1068855411__root){position:relative;overflow:visible;min-height:24px}.EditableCell1068855411__root{display:flex;align-items:center;padding:0;position:absolute;top:0;left:0;right:0;bottom:0;overflow:hidden;box-sizing:border-box;outline:0;cursor:default;user-select:none;background:var(--wsr-color-D80);border:1px solid var(--wsr-color-B40)}.EditableCell1068855411__root.EditableCell1068855411--selected{background:rgba(56,153,236,.08)}.EditableCell1068855411__root.EditableCell1068855411--focused:not(.EditableCell1068855411--selected){box-shadow:inset 0 0 0 2px var(--wsr-color-B10);z-index:2}.EditableCell1068855411__root.EditableCell1068855411--editing{background:var(--wsr-color-D80);box-shadow:inset 0 0 0 2px var(--wsr-color-B10);z-index:3;user-select:auto;overflow:visible}.EditableCell1068855411__root.EditableCell1068855411--editing:not(.EditableCell1068855411--showEditWhenFocused){bottom:auto;min-height:100%}.EditableCell1068855411__root.EditableCell1068855411--focused.EditableCell1068855411--growable{background-color:var(--wsr-color-D80);background-image:linear-gradient(rgba(56,153,236,.08),rgba(56,153,236,.08));bottom:auto;min-height:100%;z-index:3}.EditableCell1068855411__root:has([data-inner-focused]){overflow:visible;z-index:3;box-shadow:inset 0 0 0 2px var(--wsr-color-B10)}.EditableCell1068855411__root.EditableCell1068855411--selectionTop:not(.EditableCell1068855411--editing){border-top:2px solid var(--wsr-color-B10)}.EditableCell1068855411__root.EditableCell1068855411--selectionBottom:not(.EditableCell1068855411--editing){border-bottom:2px solid var(--wsr-color-B10)}.EditableCell1068855411__root.EditableCell1068855411--selectionLeft:not(.EditableCell1068855411--editing){border-left:2px solid var(--wsr-color-B10)}.EditableCell1068855411__root.EditableCell1068855411--selectionRight:not(.EditableCell1068855411--editing){border-right:2px solid var(--wsr-color-B10)}.EditableCell1068855411__root.EditableCell1068855411--selectionTop.EditableCell1068855411--editing.EditableCell1068855411--typeToEdit{border-top:2px solid var(--wsr-color-B10)}.EditableCell1068855411__root.EditableCell1068855411--selectionBottom.EditableCell1068855411--editing.EditableCell1068855411--typeToEdit{border-bottom:2px solid var(--wsr-color-B10)}.EditableCell1068855411__root.EditableCell1068855411--selectionLeft.EditableCell1068855411--editing.EditableCell1068855411--typeToEdit{border-left:2px solid var(--wsr-color-B10)}.EditableCell1068855411__root.EditableCell1068855411--selectionRight.EditableCell1068855411--editing.EditableCell1068855411--typeToEdit{border-right:2px solid var(--wsr-color-B10)}.EditableCell1068855411__root.EditableCell1068855411--invalid:not(.EditableCell1068855411--editing){background:rgba(229,0,77,.06)}.EditableCell1068855411__root.EditableCell1068855411--copiedTop:not(.EditableCell1068855411--selectionTop){border-top:2px dashed var(--wsr-color-B10)}.EditableCell1068855411__root.EditableCell1068855411--copiedBottom:not(.EditableCell1068855411--selectionBottom){border-bottom:2px dashed var(--wsr-color-B10)}.EditableCell1068855411__root.EditableCell1068855411--copiedLeft:not(.EditableCell1068855411--selectionLeft){border-left:2px dashed var(--wsr-color-B10)}.EditableCell1068855411__root.EditableCell1068855411--copiedRight:not(.EditableCell1068855411--selectionRight){border-right:2px dashed var(--wsr-color-B10)}.EditableCell1068855411__validationIndicator{flex-shrink:0;margin-left:12px;margin-right:6px;color:var(--wsr-color-Y10)}.HeaderActionsPopover324484243__root{opacity:0;transition:opacity .15s}th:hover .HeaderActionsPopover324484243__root,.HeaderActionsPopover324484243__root[data-menu-open=true],.HeaderActionsPopover324484243__root:focus-within{opacity:1}.CellViewLayout2301348981__root{width:100%;height:100%;padding:9px 12px;box-sizing:border-box;display:flex;align-items:center;overflow:clip}.CellViewLayout2301348981__root>*{flex:1;min-width:0}.Edit4124009216__addressInput{width:100%;height:100%;display:flex;align-items:center;box-sizing:border-box;padding-left:6px;padding-right:6px;min-width:0;overflow:hidden}.Edit4124009216__addressInput>div,.Edit4124009216__addressInput>div>div,.Edit4124009216__addressInput>div>div>div{width:100%;min-width:0}.Edit3230172202__jsonInput{width:100%;margin-left:-1px}.Edit52948805__booleanEdit{display:flex;align-items:center;margin-left:12px}.View1963129251__booleanView{display:flex;align-items:center;margin-left:9px;pointer-events:none}.Edit2414762136__root{width:100%;height:100%;display:flex;align-items:center}.Edit3456829687__dateInput{width:100%;margin-left:-1px}.Edit3776791925__half{min-width:0;position:relative;display:flex;align-items:center;box-sizing:border-box}.Edit3776791925__dateHalf{flex:60 1 0}.Edit3776791925__timeHalf{flex:40 1 0}.Edit3776791925__divider{width:1px;height:16px;background:var(--wds-color-border-standard, #dfe5eb);flex-shrink:0}.Edit3776791925__passiveText{padding:9px 12px;font-size:14px;line-height:18px;font-family:inherit;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:pointer;width:100%}.Edit3776791925__placeholderText{color:var(--wds-color-text-placeholder, #868aa5)}.View1311297208__leaf{min-width:0;padding:9px 12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px;line-height:18px;font-family:inherit;box-sizing:border-box}.View1311297208__datePart{flex:60 1 0}.View1311297208__timePart{flex:40 1 0}.View1311297208__placeholder{color:var(--wds-color-text-placeholder, #868aa5)}.View1311297208__divider{width:1px;height:16px;background:var(--wds-color-border-standard, #dfe5eb);flex-shrink:0}.Edit3351727800__emailInput{width:100%;margin-left:-1px}.Edit3523266331__numberInput{width:100%;margin-right:2px}.Edit3523266331__numberInput input{text-align:right;direction:ltr}.View1528347748__textView{width:100%;text-align:right}.Edit4247137127__jsonInput{width:100%;margin-left:-1px}.Edit1999116661__selectInput{width:100%}.Edit721104620__editWrapper{width:100%}.Edit721104620__inputArea{background-color:transparent;width:100%}.Edit721104620__inputArea input{padding:9px 12px 8px!important;outline:0!important;border:0!important;box-sizing:border-box!important}.Edit721104620__inputArea>div{border:0!important;border-radius:0!important;box-shadow:none!important;background-color:transparent!important;outline:0!important}.Edit721104620__inputArea textarea{padding:9px 12px 8px!important;outline:0!important;border:0!important;box-sizing:border-box!important}.Edit721104620__inputArea:not(.Edit721104620--isFocused) textarea{resize:none;overflow:hidden}.Edit721104620__inputArea:not(.Edit721104620--isFocused) textarea::-webkit-scrollbar{display:none}.Edit2938778900__wrapper{position:relative;width:100%;height:100%;display:flex;align-items:center;--wds-input-value-font-size-small:var(--wds-font-size-body-small);--wds-input-value-font-line-height-small:var(
     --wds-font-line-height-body-small
-  )}.Edit3071470623__overlay{position:absolute;inset:2px;pointer-events:none;background:var(--wds-color-background-elevation-base, #fff)}.Edit1008679439__urlInput{width:100%;margin-left:-1px}.View1517719082__textView{width:100%;padding:9px 12px;display:flex;align-items:center;justify-content:space-between}.View1517719082__urlText{flex:1;min-width:0}.View1517719082__suffix{flex-shrink:0;margin-left:10px}.View1517719082__textView.View1517719082--suffixOnHover:not(:hover) .View1517719082__suffix{display:none}.EntityPagePlain2323464219__root.EntityPagePlain2323464219--mobile{--wds-page-header-padding-horizontal:0}.Fade4216896310__root{transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);opacity:1}.Fade4216896310__root.Fade4216896310--exit{opacity:0}.Heading589754590__root{visibility:visible}.Heading589754590__root.Heading589754590--appearanceH2{font-size:28px!important;line-height:36px!important}.ImportStepUpload3261603244__fileUpload{width:100%}.InputOverflow3482023363__root.InputOverflow3482023363--selected:not(.InputOverflow3482023363--focused) input::placeholder{color:#000624}@keyframes LoadingRow1058322109__gradientSwoosh{0%{background-position:50% 50%;background-size:150% 125%}15%{background-position:75% 40%;background-size:130% 115%}30%{background-position:50% 50%;background-size:120% 135%}60%{background-position:30% 50%;background-size:120% 135%}80%{background-position:10% 30%;background-size:130% 155%}to{background-position:40% 45%;background-size:125% 135%}}.LoadingRow1058322109__root{background-image:linear-gradient(60deg,rgba(255,255,255,.15)0,rgba(255,255,255,.15) 50%,rgba(95,242,174,.15) 100%),linear-gradient(284.81deg,#fff 67.18%,#91bbff 158.87%),linear-gradient(29deg,rgba(145,187,255,.6)0,#fff 40%,rgba(95,242,174,.6) 100%);height:100%;background-size:150% 125%;background-repeat:no-repeat;animation:LoadingRow1058322109__gradientSwoosh 2s ease-out infinite alternate}.MaxHeightText2653311633__root{opacity:1}.MaxHeightText2653311633__root.MaxHeightText2653311633--height24{line-height:24px}.MaxLines3965339801__root{overflow:hidden}.MaxLines3965339801__root.MaxLines3965339801--clamp{-webkit-box-orient:vertical;display:-webkit-box}.MultiBulkActionToolbar809824376__root{min-width:0}.MultiBulkActionToolbar809824376__leftGroupWrapper{padding-right:12px;min-width:0;flex-wrap:nowrap;align-items:center}.MultiBulkActionToolbar809824376__selectedCountItem{min-width:0;flex-shrink:1;white-space:nowrap;overflow:hidden}.MultiBulkActionToolbar809824376__selectedCountText{display:block;width:100%}.NestedTablePlaceholderStatesRow2852976720__root td{padding:0!important;width:100%}.NestedTableRow1405815016__firstLevel td{padding-top:18px!important;padding-bottom:18px!important}.NestedTableRow1405815016__root:hover{background-color:#e7f0ff!important}.NestedTableRow1405815016__root.NestedTableRow1405815016--expandable{cursor:pointer}.NestedTableRow1405815016__placeholder td{padding:0!important;width:100%}.NestedTableRow1405815016__root:hover td:first-of-type::before,.NestedTableRow1405815016__parentHovered td:first-of-type::before{content:"";position:absolute;top:0;bottom:0;left:0;width:2px;background-color:#5999ff}.MultipleDragOverlayEffect2212391973__root{position:absolute;transform:translate(6px,6px);background-color:#fff;box-shadow:0 2px 4px 0 rgba(0,6,36,.12),0 0 6px 0 rgba(0,6,36,.12)}.NestedTableDragAndDropRow3354128442__root.NestedTableDragAndDropRow3354128442--draggingInto td{background-color:#e7f0ff!important}.PickerContent3960672221__root{display:flex}.PickerContentAdditionalStep2779327767__titles{display:flex;justify-content:center;flex:1 1 auto;overflow:hidden;flex-direction:column}.PickerContentAdditionalStep2779327767__suffix{display:flex;align-items:center;flex:0 0 auto;overflow:hidden}.PickerTableListItem1110147120__root{box-sizing:border-box}.ScrollableContent1540889949__root.ScrollableContent1540889949--overflowY{overflow-y:auto}.ScrollableContent1540889949__root.ScrollableContent1540889949--overflowX{overflow-x:auto}.ScrollableContent1540889949__root.ScrollableContent1540889949--smooth{scroll-behavior:smooth}.SetupWidget808034205__row{display:flex;flex-direction:column;padding:var(--wds-space-100, 6px);border-radius:var(--wds-border-radius-200, 4px);border:1px solid var(--wds-color-border-dark-secondary, var(--wsr-color-D60, #DFE5EB));background-color:var(--wds-color-fill-standard-tertiary, var(--wsr-color-D80, #FFFFFF));overflow:clip}.SetupWidget808034205__row.SetupWidget808034205--clickable{cursor:pointer}.SetupWidget808034205__row.SetupWidget808034205--hoverable:hover{background-color:var(--wds-color-fill-standard-tertiary-hover, var(--wsr-color-B60, #F4F7FF));border-color:var(--wds-color-border-standard-secondary, var(--wsr-color-B40, #D6E6FE))}.SetupWidget808034205__row.SetupWidget808034205--focused{background-color:var(--wds-color-fill-standard-tertiary-hover, var(--wsr-color-B60, #F4F7FF));border-color:var(--wds-color-border-standard-primary, var(--wsr-color-B30, #A8CAFF))}.SetupWidget808034205__completedCta{opacity:0;transition:opacity .25s ease-in-out}.SetupWidget808034205__row:hover .SetupWidget808034205__completedCta,.SetupWidget808034205__row:focus-within .SetupWidget808034205__completedCta{opacity:1}.SetupWidget808034205__card{display:block;width:100%;border:0;border-radius:var(--wds-border-radius-400, 8px);background-color:var(--wds-color-fill-standard-tertiary, var(--wsr-color-D80, #FFFFFF));box-shadow:0 0 6px 0 rgba(0,6,36,.1),0 2px 4px 0 rgba(0,6,36,.05);overflow:clip;box-sizing:border-box;text-align:start;font:inherit;color:inherit;padding:0;margin:0}.SetupWidget808034205__card.SetupWidget808034205--primary{background-color:var(--wds-color-fill-standard-tertiary-hover, var(--wsr-color-B60, #F4F7FF))}.SetupWidget808034205__card.SetupWidget808034205--clickable{cursor:pointer}.SetupWidget808034205__stepIcon{display:flex;align-items:center;flex-shrink:0;height:24px}.SetupWidget808034205__chevron{display:flex;flex-shrink:0;color:var(--wds-color-text-standard-primary, var(--wsr-color-D10, #000624))}.SetupWidget808034205__chevronDisabled{display:flex;flex-shrink:0;color:var(--wds-color-text-disabled, var(--wsr-color-D10-30, rgba(0, 6, 36, 0.30)))}.SetupWidget808034205__inProgressLabel{--wds-color-text-standard-primary:var(--wds-color-text-urgent, var(--wsr-color-O10, #FE620F));text-transform:uppercase}.SkeletonCard3144351190__headerLoading{display:block!important}.SlidingModal538401435__root{transition:transform .4s ease 0s;position:fixed;z-index:1}.SlidingModal538401435__root.SlidingModal538401435--overlay{transition:transform 0s ease 0s}.SlidingModal538401435__root.SlidingModal538401435---appendTo-6-parent{position:absolute}.SlidingModal538401435__root:not(.SlidingModal538401435--exited){box-shadow:0 3px 24px 0 rgba(22,45,61,.18),0 8px 8px 0 rgba(22,45,61,.12)}.TabsFilter128028699__root .TabsFilter128028699__title{color:var(--wds-tabs-label-fill, var(--wds-color-text-standard-primary, var(--wsr-color-D10, #000624)))}.TabsFilter128028699__root.TabsFilter128028699--selected .TabsFilter128028699__title,.TabsFilter128028699__root:hover .TabsFilter128028699__title{color:var(--wds-tabs-label-fill-active, var(--wsr-color-B10, #116DFF))}.ManageTagsModal1465315821__root{display:flex}.ToolbarItem3928858564__root{min-width:0}.ToolbarItemBox296014064__root{min-width:0}.ToolbarItemBox296014064__root.ToolbarItemBox296014064--removeStartPadding{margin-left:-24px}.ToolbarItemBox296014064__root.ToolbarItemBox296014064--expandable{flex:1 0}.common1841882770__column{display:flex;flex-direction:column}.common1841882770__fullHeight{height:100%;min-height:0}.CollectionPageHeader3086631792__root:not(.CollectionPageHeader3086631792--mobile){gap:12px}.CollectionPageHeader3086631792__root.CollectionPageHeader3086631792--mobile{flex-direction:column;padding-right:18px;padding-left:18px}.CollectionPageHeader3086631792__root.CollectionPageHeader3086631792--mobile>*{margin-left:0;margin-top:6px!important;height:auto}.FormPageHeader4186465849__root.FormPageHeader4186465849--mobile{flex-direction:column;padding-right:18px;padding-left:18px}.FormPageHeader4186465849__root.FormPageHeader4186465849--mobile>*{margin-left:0;margin-top:6px!important;height:auto}
+  )}.Edit2938778900__overlay{position:absolute;inset:2px;pointer-events:none;background:var(--wds-color-background-elevation-base, #fff)}.Edit1175127184__urlInput{width:100%;margin-left:-1px}.View892294405__textView{width:100%;padding:9px 12px;display:flex;align-items:center;justify-content:space-between}.View892294405__urlText{flex:1;min-width:0}.View892294405__suffix{flex-shrink:0;margin-left:10px}.View892294405__textView.View892294405--suffixOnHover:not(:hover) .View892294405__suffix{display:none}.EntityPagePlain3321852994__root.EntityPagePlain3321852994--mobile{--wds-page-header-padding-horizontal:0}.Fade3886590051__root{transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);opacity:1}.Fade3886590051__root.Fade3886590051--exit{opacity:0}.Heading182854576__root{visibility:visible}.Heading182854576__root.Heading182854576--appearanceH2{font-size:28px!important;line-height:36px!important}.ImportStepUpload589431647__fileUpload{width:100%}.InputOverflow4130537648__root.InputOverflow4130537648--selected:not(.InputOverflow4130537648--focused) input::placeholder{color:#000624}@keyframes LoadingRow1562995583__gradientSwoosh{0%{background-position:50% 50%;background-size:150% 125%}15%{background-position:75% 40%;background-size:130% 115%}30%{background-position:50% 50%;background-size:120% 135%}60%{background-position:30% 50%;background-size:120% 135%}80%{background-position:10% 30%;background-size:130% 155%}to{background-position:40% 45%;background-size:125% 135%}}.LoadingRow1562995583__root{background-image:linear-gradient(60deg,rgba(255,255,255,.15)0,rgba(255,255,255,.15) 50%,rgba(95,242,174,.15) 100%),linear-gradient(284.81deg,#fff 67.18%,#91bbff 158.87%),linear-gradient(29deg,rgba(145,187,255,.6)0,#fff 40%,rgba(95,242,174,.6) 100%);height:100%;background-size:150% 125%;background-repeat:no-repeat;animation:LoadingRow1562995583__gradientSwoosh 2s ease-out infinite alternate}.MaxHeightText2883923983__root{opacity:1}.MaxHeightText2883923983__root.MaxHeightText2883923983--height24{line-height:24px}.MaxLines788404285__root{overflow:hidden}.MaxLines788404285__root.MaxLines788404285--clamp{-webkit-box-orient:vertical;display:-webkit-box}.MultiBulkActionToolbar1130007844__root{min-width:0}.MultiBulkActionToolbar1130007844__leftGroupWrapper{padding-right:12px;min-width:0;flex-wrap:nowrap;align-items:center}.MultiBulkActionToolbar1130007844__selectedCountItem{min-width:0;flex-shrink:1;white-space:nowrap;overflow:hidden}.MultiBulkActionToolbar1130007844__selectedCountText{display:block;width:100%}.NestedTablePlaceholderStatesRow48677316__root td{padding:0!important;width:100%}.NestedTableRow2811038440__firstLevel td{padding-top:18px!important;padding-bottom:18px!important}.NestedTableRow2811038440__root:hover{background-color:#e7f0ff!important}.NestedTableRow2811038440__root.NestedTableRow2811038440--expandable{cursor:pointer}.NestedTableRow2811038440__placeholder td{padding:0!important;width:100%}.NestedTableRow2811038440__root:hover td:first-of-type::before,.NestedTableRow2811038440__parentHovered td:first-of-type::before{content:"";position:absolute;top:0;bottom:0;left:0;width:2px;background-color:#5999ff}.MultipleDragOverlayEffect630179294__root{position:absolute;transform:translate(6px,6px);background-color:#fff;box-shadow:0 2px 4px 0 rgba(0,6,36,.12),0 0 6px 0 rgba(0,6,36,.12)}.NestedTableDragAndDropRow2920376209__root.NestedTableDragAndDropRow2920376209--draggingInto td{background-color:#e7f0ff!important}.PickerContent2131101169__root{display:flex}.PickerContentAdditionalStep1447441395__titles{display:flex;justify-content:center;flex:1 1 auto;overflow:hidden;flex-direction:column}.PickerContentAdditionalStep1447441395__suffix{display:flex;align-items:center;flex:0 0 auto;overflow:hidden}.PickerTableListItem1799991993__root{box-sizing:border-box}.ScrollableContent350807700__root.ScrollableContent350807700--overflowY{overflow-y:auto}.ScrollableContent350807700__root.ScrollableContent350807700--overflowX{overflow-x:auto}.ScrollableContent350807700__root.ScrollableContent350807700--smooth{scroll-behavior:smooth}.SetupWidget1455868437__row{display:flex;flex-direction:column;padding:var(--wds-space-100, 6px);border-radius:var(--wds-border-radius-200, 4px);border:1px solid var(--wds-color-border-dark-secondary, var(--wsr-color-D60, #DFE5EB));background-color:var(--wds-color-fill-standard-tertiary, var(--wsr-color-D80, #FFFFFF));overflow:clip}.SetupWidget1455868437__row.SetupWidget1455868437--clickable{cursor:pointer}.SetupWidget1455868437__row.SetupWidget1455868437--hoverable:hover{background-color:var(--wds-color-fill-standard-tertiary-hover, var(--wsr-color-B60, #F4F7FF));border-color:var(--wds-color-border-standard-secondary, var(--wsr-color-B40, #D6E6FE))}.SetupWidget1455868437__row.SetupWidget1455868437--focused{background-color:var(--wds-color-fill-standard-tertiary-hover, var(--wsr-color-B60, #F4F7FF));border-color:var(--wds-color-border-standard-primary, var(--wsr-color-B30, #A8CAFF))}.SetupWidget1455868437__completedCta{opacity:0;transition:opacity .25s ease-in-out}.SetupWidget1455868437__row:hover .SetupWidget1455868437__completedCta,.SetupWidget1455868437__row:focus-within .SetupWidget1455868437__completedCta{opacity:1}.SetupWidget1455868437__card{display:block;width:100%;border:0;border-radius:var(--wds-border-radius-400, 8px);background-color:var(--wds-color-fill-standard-tertiary, var(--wsr-color-D80, #FFFFFF));box-shadow:0 0 6px 0 rgba(0,6,36,.1),0 2px 4px 0 rgba(0,6,36,.05);overflow:clip;box-sizing:border-box;text-align:start;font:inherit;color:inherit;padding:0;margin:0}.SetupWidget1455868437__card.SetupWidget1455868437--primary{background-color:var(--wds-color-fill-standard-tertiary-hover, var(--wsr-color-B60, #F4F7FF))}.SetupWidget1455868437__card.SetupWidget1455868437--clickable{cursor:pointer}.SetupWidget1455868437__stepIcon{display:flex;align-items:center;flex-shrink:0;height:24px}.SetupWidget1455868437__chevron{display:flex;flex-shrink:0;color:var(--wds-color-text-standard-primary, var(--wsr-color-D10, #000624))}.SetupWidget1455868437__chevronDisabled{display:flex;flex-shrink:0;color:var(--wds-color-text-disabled, var(--wsr-color-D10-30, rgba(0, 6, 36, 0.30)))}.SetupWidget1455868437__inProgressLabel{--wds-color-text-standard-primary:var(--wds-color-text-urgent, var(--wsr-color-O10, #FE620F));text-transform:uppercase}.SkeletonCard2287561488__headerLoading{display:block!important}.SlidingModal2066405265__root{transition:transform .4s ease 0s;position:fixed;z-index:1}.SlidingModal2066405265__root.SlidingModal2066405265--overlay{transition:transform 0s ease 0s}.SlidingModal2066405265__root.SlidingModal2066405265---appendTo-6-parent{position:absolute}.SlidingModal2066405265__root:not(.SlidingModal2066405265--exited){box-shadow:0 3px 24px 0 rgba(22,45,61,.18),0 8px 8px 0 rgba(22,45,61,.12)}.TabsFilter1693177651__root .TabsFilter1693177651__title{color:var(--wds-tabs-label-fill, var(--wds-color-text-standard-primary, var(--wsr-color-D10, #000624)))}.TabsFilter1693177651__root.TabsFilter1693177651--selected .TabsFilter1693177651__title,.TabsFilter1693177651__root:hover .TabsFilter1693177651__title{color:var(--wds-tabs-label-fill-active, var(--wsr-color-B10, #116DFF))}.ManageTagsModal1377424349__root{display:flex}.ToolbarItem1774963001__root{min-width:0}.ToolbarItemBox3581991017__root{min-width:0}.ToolbarItemBox3581991017__root.ToolbarItemBox3581991017--removeStartPadding{margin-left:-24px}.ToolbarItemBox3581991017__root.ToolbarItemBox3581991017--expandable{flex:1 0}.common1406259648__column{display:flex;flex-direction:column}.common1406259648__fullHeight{height:100%;min-height:0}.CollectionPageHeader313153770__root:not(.CollectionPageHeader313153770--mobile){gap:12px}.CollectionPageHeader313153770__root.CollectionPageHeader313153770--mobile{flex-direction:column;padding-right:18px;padding-left:18px}.CollectionPageHeader313153770__root.CollectionPageHeader313153770--mobile>*{margin-left:0;margin-top:6px!important;height:auto}.FormPageHeader4160367408__root.FormPageHeader4160367408--mobile{flex-direction:column;padding-right:18px;padding-left:18px}.FormPageHeader4160367408__root.FormPageHeader4160367408--mobile>*{margin-left:0;margin-top:6px!important;height:auto}

package/src/test-utils/TagsMocks.ts

@@ -2,6 +2,7 @@ import { Chance } from 'chance';
 import { whenRequest } from '@wix/fe-essentials/http-client/testkit/client';
 import {
   listTags,
+  listTagsForAccount,
   queryTags,
   queryTagsForAccount,
   createTag,
@@ -83,10 +84,21 @@ export const withQueryTagsForAccount = (tags?: TagType[]) =>
     .reply(200, buildQueryTagsReply(tags))
     .persist();
 
-export const withListTags = (tags?: TagType[]) => withQueryTags(tags);
+// Bundles the queryTags mock too — tag assignment (fetchTagsByIds) and
+// TagsFilter still read through queryTags
+export const withListTags = (tags?: TagType[]) => [
+  whenRequest(listTags)
+    .reply(200, async () => ({ tags: tags || TAGS }))
+    .persist(),
+  withQueryTags(tags),
+];
 
-export const withListTagsForAccount = (tags?: TagType[]) =>
-  withQueryTagsForAccount(tags);
+export const withListTagsForAccount = (tags?: TagType[]) => [
+  whenRequest(listTagsForAccount)
+    .reply(200, async () => ({ tags: tags || TAGS }))
+    .persist(),
+  withQueryTagsForAccount(tags),
+];
 
 const createTagResponseMock = (tag: TagType) => ({
   __applicationErrorsType: {},
@@ -159,7 +171,18 @@ export const getListTagsErrorMock = ({
 }: {
   code?: string;
   status?: number;
-} = {}) => getQueryTagsErrorMock({ code, status });
+} = {}) => [
+  whenRequest(listTags)
+    .reply(200, async () => {
+      return new Promise((_resolve, reject) => {
+        window.setTimeout(() => {
+          reject(createHttpErrorMock({ code, status }));
+        }, 500);
+      });
+    })
+    .persist(),
+  getQueryTagsErrorMock({ code, status }),
+];
 
 export const getListTagsForAccountErrorMock = ({
   code = 'ERR_NETWORK',
@@ -167,7 +190,16 @@ export const getListTagsForAccountErrorMock = ({
 }: {
   code?: string;
   status?: number;
-} = {}) =>
+} = {}) => [
+  whenRequest(listTagsForAccount)
+    .reply(200, async () => {
+      return new Promise((_resolve, reject) => {
+        setTimeout(() => {
+          reject(createHttpErrorMock({ code, status }));
+        }, 500);
+      });
+    })
+    .persist(),
   whenRequest(queryTagsForAccount)
     .reply(200, async () => {
       return new Promise((_resolve, reject) => {
@@ -176,7 +208,8 @@ export const getListTagsForAccountErrorMock = ({
         }, 500);
       });
     })
-    .persist();
+    .persist(),
+];
 
 export const getCreateTagErrorMock = ({
   code = 'ERR_NETWORK',

package/src/version.ts

@@ -1 +1 @@
-export const version = 'patterns@1.424.0';
+export const version = 'patterns@1.426.0';