make PropertyValueList dynamically add and remove values

src/View/ChatPages/boardKanbanPage.tsx

@@ -2,7 +2,7 @@ import * as React from "bloatless-react";
 
 import BoardViewModel from "../../ViewModel/Pages/boardViewModel";
 import { FilteredList } from "../Components/filteredList";
-import { PropertyValueList } from "../Components/propertyList";
+import { PropertyValueList } from "../Components/propertyValueList";
 import { TaskCategoryBulkChangeViewModel } from "../../ViewModel/Utility/taskPropertyBulkChangeViewModel";
 import TaskViewModel from "../../ViewModel/Pages/taskViewModel";
 import { TaskViewModelToEntry } from "../Components/taskEntry";

src/View/ChatPages/boardStatusGridPage.tsx

@@ -7,7 +7,7 @@ import {
 
 import BoardViewModel from "../../ViewModel/Pages/boardViewModel";
 import { FilteredList } from "../Components/filteredList";
-import { PropertyValueList } from "../Components/propertyList";
+import { PropertyValueList } from "../Components/propertyValueList";
 import TaskViewModel from "../../ViewModel/Pages/taskViewModel";
 import { TaskViewModelToEntry } from "../Components/taskEntry";
 import { allowDrop } from "../utility";

src/View/Components/propertyValueList.tsx

@@ -14,13 +14,21 @@ export function PropertyValueList<T>(
   const propertyValues: React.ListState<string> = new React.ListState();
 
   function collectValues() {
-    propertyValues.clear();
     const values: string[] = collectObjectValuesForKey(
       propertyKey,
       stringEntryObjectConverter,
       [...objects.value.values()]
     );
-    propertyValues.add(...values);
+    for (const existingValue of values) {
+      if (propertyValues.value.has(existingValue)) continue;
+      propertyValues.add(existingValue);
+    }
+
+    for (const displayedValue of propertyValues.value.values()) {
+      if (values.includes(displayedValue) == false) {
+        propertyValues.remove(displayedValue);
+      }
+    }
   }
 
   objects.subscribe(() => {