Code for bulk delete tags #770

src/app/components/tag-tray/tag-tray.component.html

@@ -70,5 +70,7 @@
                                                            : appState.sortTagsByFrequency
                                                            : manualTagsService.pipeToggleHack"
     (tagClicked)="handleTagWordClicked.emit($event)"
+    (removeTagEmit)="removeThisTag($event)"
+    [tagsOnToggleBatch]="batchTaggingMode"
   ></app-view-tags-component>
 </div>

src/app/components/tag-tray/tag-tray.component.ts

@@ -6,6 +6,7 @@ import type { AppStateInterface } from '../../common/app-state';
 import type { TagEmit } from '../../../../interfaces/shared-interfaces';
 import { modalAnimation } from '../../common/animations';
 import type { SettingsButtonsType } from '../../common/settings-buttons';
+import { ImageElementService } from './../../services/image-element.service';
 
 @Component({
   selector: 'app-tag-tray',
@@ -33,8 +34,31 @@ export class TagTrayComponent {
   manualTagFilterString = '';
   manualTagShowFrequency = true;
 
+  selectedTagList = [];
+  removeThisTag(tag: string) {
+    //get the list of all the videos that contain the selected tag for removal in batch
+    this.selectedTagList = this.imageElementService.imageElements
+      .map((ele, idx) => {
+        if (ele.tags?.includes(tag)) {
+          return idx;
+        }
+      })
+      .filter((item) => item != undefined);
+
+    this.manualTagsService.removeTagBatch(tag);
+
+    this.selectedTagList.forEach((item) => {
+      this.imageElementService.HandleEmission({
+        index: item,
+        tag: tag,
+        type: "remove",
+      });
+    });
+  }
+
   constructor(
     public manualTagsService: ManualTagsService,
+    public imageElementService: ImageElementService
   ) { }
 
 }

src/app/components/tags-manual/manual-tags.service.ts

@@ -36,6 +36,13 @@ export class ManualTagsService {
     this.forceTagSortPipeUpdate();
   }
 
+  removeTagBatch(tag: string) {
+    const count = this.tagsMap.get(tag);
+    this.tagsMap.set(tag, 0);
+    this.tagsList.splice(this.tagsList.indexOf(tag), 1);
+    this.forceTagSortPipeUpdate();
+  }
+
   /**
    * Removes all the existing tags in {@code tagList} and {@code tagsMap}
    */

src/app/components/tags-manual/view-tags.component.ts

@@ -15,6 +15,7 @@ import type { Tag, TagEmit } from '../../../../interfaces/shared-interfaces';
 export class ViewTagsComponent {
 
   _tags: Tag[];
+  toogleBatchModeValue: boolean = false;
 
   @Input()
   set tags(tags: Tag[] | string[]) {
@@ -25,6 +26,15 @@ export class ViewTagsComponent {
     }
   }
 
+  //set the removable property of the selected tag based on the batchmode is enabled or disabled
+  @Input()
+  set tagsOnToggleBatch(toggleBatchMode: boolean) {
+    this.toogleBatchModeValue = toggleBatchMode;
+    this._tags.forEach((item) => {
+      item.removable = toggleBatchMode;
+    });
+  }
+
   @Input() darkMode: boolean;
   @Input() displayFrequency: boolean;
   @Input() draggable: boolean;
@@ -62,7 +72,7 @@ export class ViewTagsComponent {
       hackList.push({
         name: tag,
         colour: undefined,
-        removable: false,
+        removable: this.toogleBatchModeValue,
       });
     });