Two more fixes when clicking the target and when adding a new witness

src/components/annotations/variants/VariantsView.vue

@@ -13,6 +13,8 @@
 
 allocateWitnessColorInVariantItem()
 
+const emit = defineEmits(['init'])
+
 const annotations = computed<Annotation[]>(() => annotationStore.annotations);
 const activeContentUrl = computed<string>(() => contentsStore.activeContentUrl);
 const filteredAnnotations = computed<Annotation[]>(() => annotationStore.filteredAnnotations);
@@ -38,7 +40,14 @@
 
 const unsubscribe = TextEventBus.on('click', ({ target }) => {
 
-  const ids = getAnnotationIdsFromTarget(target)
+  let ids = getAnnotationIdsFromTarget(target)
+  // ids are all the annotation ids of the target, which can be in different tabs. 
+  // we need to filter only the variant ides before proceeding with adding active annotation or removing active annotation
+
+  const variantAnnotations = getVariantAnnotations(annotationStore.annotations, 'Variant')
+  const variantAnnotationIds = variantAnnotations.map((annotation) => annotation.id)
+
+  ids = ids.filter((id) => variantAnnotationIds.includes(id))
 
   const annotations = filteredAnnotations.value.filter((filtered) => ids.find(id => filtered.id === id))
   if (!annotationStore.isSingleSelectMode) {
@@ -48,14 +57,11 @@
   } else {
     // if we are in single select mode, we still have variant annotations, but there are not shown
     // if we click at a part of text whose related annotations are not in the variant annotations, then we do not proceed further
-    const variantAnnotations = getVariantAnnotations(annotationStore.annotations, 'Variant')
-    if (!variantAnnotations.find((annotation) => annotation.id === ids[0])) {
-      return
-    }
+    if (ids.length < 1) return
   }
 
   const targetIsSelected = parseInt(target.getAttribute('data-annotation-level'), 10) > 0
-
+  
   if (annotationStore.isSingleSelectMode) {
     if (targetIsSelected) {
       annotationStore.removeFilteredAnnotations(ids)
@@ -69,6 +75,7 @@
       annotationStore.deactivateAnnotationsByIds(ids)
     }
     else {
+      console.log('activate annotations')
       annotationStore.activateAnnotationsByIds(ids)
     }
   }
@@ -77,11 +84,13 @@
 onBeforeUnmount(() => unsubscribe())
 
 function getVariantAnnotations(annotations, type) {
-  let variantAnnotations = []
-    annotations.forEach((annotation) => {
-      if(annotation.body['x-content-type'] === type) variantAnnotations.push(annotation)
+  let list = []
+  if (!annotations || annotations.length === 0) return []
+
+  annotations.forEach((annotation) => {
+      if (annotation.body['x-content-type'] === type) list.push(annotation)
     })
-  return variantAnnotations
+  return list
 }
 
 function allocateWitnessColorInVariantItem() {

src/components/panels/Panel.vue

@@ -344,6 +344,7 @@ export default {
         label,
         props: { ...connector.options },
         actions,
+        events: viewEvents
       }];
     }
 

src/utils/annotations.js

@@ -243,15 +243,22 @@ export function removeIcon(annotation) {
 export function addWitness(target, witness, color) {
   // we create a witnesses wrapper on the same child level as the target due to styling reasons (i.e the witnesses chips should not be underlined and get the highlight color of the target)
   // therefore we need target index in order to find the witnesses wrapper element
+
   let parentEl = target.parentElement
   const targetIndex = [].slice.call(parentEl.children).indexOf(target)
   if (targetIndex < 0) return;
 
   const witnessEl = createWitnessEl(witness, color)
-  const isWrapper = parentEl.children[targetIndex-1].classList.contains("witnesses")
+  let isWrapper = false
+  if (parentEl.children.length === 1) {
+    // target is the only child element
+    isWrapper = false
+  } else {
+    isWrapper = parentEl.children[targetIndex-1].classList.contains("witnesses")
+  }
 
   if (isWrapper) {
-    let wrapper = parentEl.children[targetIndex-1]
+    const wrapper = parentEl.children[targetIndex-1]
     wrapper.appendChild(witnessEl)
   } else {
       // witnesses wrapper which holds the witnesses 'chips' is not yet created -> we add the first witness