fix reactivity

import { library } from "@fortawesome/fontawesome-svg-core";

import { faCheckSquare, faSquare } from "@fortawesome/free-regular-svg-icons";

import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";

import { toValue } from "@vueuse/core";

import { computed, type ComputedRef, onMounted, type PropType, ref, watch } from "vue";

import Multiselect from "vue-multiselect";

}>();

const filter = ref("");

const filteredOptions = filterByLabelAndTag();

const filteredOptions = useFilterObjectArray(() => props.options, filter, ["label", ["value", "tags"]]);

/**

 * When there are more options than this, push selected options to the end

watch(

    () => props.options,

    () => {

        filteredOptions.value = toValue(filterByLabelAndTag());

        setInitialValue();

    }

);

    setInitialValue();

});

function filterByLabelAndTag() {

    return useFilterObjectArray(() => props.options, filter, ["label", ["value", "tags"]]);

}

function isValueWithTags(item: SelectValue): item is ValueWithTags {

    return item !== null && typeof item === "object" && (item as ValueWithTags).tags !== undefined;

}

import { toValue } from "@vueuse/core";

import { Ref, ref } from "vue";

import { computed, Ref } from "vue";

import type { useFilterObjectArray as UseFilterObjectArray } from "@/composables/filter";

export const useFilterObjectArray: typeof UseFilterObjectArray = (array): Ref<any[]> => {

    console.debug("USING MOCKED useFilterObjectArray");

    return ref(toValue(array));

    return computed(() => toValue(array));

};