extracted some code related to tags from component to helper

public/js/components/Stv/Studentenverwaltung/List.js

@@ -3,9 +3,10 @@ import ListNew from "./List/New.js";
 import CoreTag from "../../Tag/Tag.js";
 import {
   buildTagHeaderFilterExpression,
-  buildTagOptionsFromRows,
   customTagFilter,
   setTagHeaderFilterValue,
+  syncSelectedTagOptionsWithHeaderFilters,
+  syncTagHeaderFilterOptions,
   tagHeaderFilter,
 } from "../../../tabulator/filters/extendedHeaderFilter.js";
 import {
@@ -438,8 +439,10 @@ export default {
               this.count = 0;
               this.allPrestudents = [];
             }
-            this.refreshTagHeaderFilterInitialOptions(
+            syncTagHeaderFilterOptions(
               Array.isArray(data) ? data : [],
+              this.tagFilterState.initialOptions,
+              this.tagFilterState.selectedOptions,
             );
           },
         },
@@ -447,7 +450,11 @@ export default {
           event: "dataFiltered",
           handler: (filters, rows) => {
             this.filteredcount = rows.length;
-            this.syncSelectedTagOptionsWithHeaderFilters(filters);
+            syncSelectedTagOptionsWithHeaderFilters(
+              filters,
+              this.tagFilterState.selectedOptions,
+              this.tagsEnabled,
+            );
           },
         },
         {
@@ -594,7 +601,6 @@ export default {
           this.$refs.table.tabulator,
           combinedFilterStatement,
         );
-        this.$emit("filterActive", selectedOptions.length > 0);
       },
       deep: true,
     },
@@ -866,38 +872,27 @@ export default {
     //methods tags
     addedTag(addedTag) {
       addTagInTable(addedTag, this.allRows, "prestudent_id");
-      this.refreshTagHeaderFilterInitialOptions();
+      syncTagHeaderFilterOptions(
+        this.$refs.table?.tabulator?.getData() || [],
+        this.tagFilterState.initialOptions,
+        this.tagFilterState.selectedOptions,
+      );
     },
     deletedTag(deletedTag) {
       deleteTagInTable(deletedTag, this.allRows);
-      this.refreshTagHeaderFilterInitialOptions();
+      syncTagHeaderFilterOptions(
+        this.$refs.table?.tabulator?.getData() || [],
+        this.tagFilterState.initialOptions,
+        this.tagFilterState.selectedOptions,
+      );
     },
     updatedTag(updatedTag) {
       updateTagInTable(updatedTag, this.allRows);
-      this.refreshTagHeaderFilterInitialOptions();
-    },
-    refreshTagHeaderFilterInitialOptions(rows) {
-      const data = rows || this.$refs.table?.tabulator?.getData() || [];
-
-      const options = buildTagOptionsFromRows(data);
-      this.tagFilterState.initialOptions.splice(
-        0,
-        this.tagFilterState.initialOptions.length,
-        ...options,
+      syncTagHeaderFilterOptions(
+        this.$refs.table?.tabulator?.getData() || [],
+        this.tagFilterState.initialOptions,
+        this.tagFilterState.selectedOptions,
       );
-
-      const availableValues = new Set(options.map((option) => option.value));
-      for (
-        let i = this.tagFilterState.selectedOptions.length - 1;
-        i >= 0;
-        i--
-      ) {
-        if (
-          !availableValues.has(this.tagFilterState.selectedOptions[i].value)
-        ) {
-          this.tagFilterState.selectedOptions.splice(i, 1);
-        }
-      }
     },
     getAllRows() {
       this.allRows = this.$refs.table.tabulator.getRows();
@@ -913,23 +908,6 @@ export default {
         this.tagFilterState.selectedOptions.length,
       );
     },
-    syncSelectedTagOptionsWithHeaderFilters(filters) {
-      if (!this.tagsEnabled || !this.tagFilterState.selectedOptions.length) {
-        return;
-      }
-
-      const hasActiveTagFilter = filters.some(
-        (filter) =>
-          filter.field === "tags" &&
-          filter.value !== "" &&
-          filter.value !== null &&
-          filter.value !== undefined,
-      );
-
-      if (!hasActiveTagFilter) {
-        this.clearSelectedTagHeaderFilters();
-      }
-    },
     handleHeaderFilter(filterActive) {
       this.headerFilterActive = filterActive;
     },

public/js/tabulator/filters/extendedHeaderFilter.js

@@ -82,6 +82,61 @@ export function buildTagOptionsFromRows(rows = []) {
   return tags;
 }
 
+export function syncTagHeaderFilterOptions(
+  rows = [],
+  initialOptions = [],
+  selectedOptions = [],
+) {
+  const options = buildTagOptionsFromRows(rows) || [];
+
+  if (Array.isArray(initialOptions)) {
+    initialOptions.splice(
+      0,
+      initialOptions.length,
+      ...options,
+    );
+  }
+
+  if (Array.isArray(selectedOptions)) {
+    const availableValues = new Set(options.map((option) => option.value));
+
+    for (let i = selectedOptions.length - 1; i >= 0; i--) {
+      if (!availableValues.has(selectedOptions[i].value)) {
+        selectedOptions.splice(i, 1);
+      }
+    }
+  }
+
+  return options;
+}
+
+export function syncSelectedTagOptionsWithHeaderFilters(
+  filters = [],
+  selectedOptions = [],
+  tagsEnabled = true,
+  field = "tags",
+) {
+  if (!tagsEnabled || !Array.isArray(selectedOptions) || !selectedOptions.length) {
+    return false;
+  }
+
+  const hasActiveTagFilter = filters.some(
+    (filter) =>
+      filter.field === field &&
+      filter.value !== "" &&
+      filter.value !== null &&
+      filter.value !== undefined,
+  );
+
+  if (hasActiveTagFilter) {
+    return false;
+  }
+
+  selectedOptions.splice(0, selectedOptions.length);
+
+  return true;
+}
+
 export function getRawTagValuesFromRows(rows = []) {
   let tags = [];