I am trying to create some composables in a vue project to minimize code. This composable is intended to update/edit properties associated with specific documents within a collection. I have it working 80%, but the last 20% is:

1. How do I dynamically indicate the property I want to update using a passed variable? Right now, I can get the code to work ONLY if I manually insert the properties.
2. How do I dynamically list out what properties are affected? For example, in one case I may want to update only 2 properties, but in another case I may want to update 3 different properties?

updateDocs.js Composable:

import { ref } from "vue";

//firebase imports
import { db } from "../firebase/config";
import { doc, setDoc } from "firebase/firestore";

const updateWorks = () => {
  const error = ref(null);

  const updateWork = async (collection, targetID, property, updatedValue) => {
    try {
      console.log(collection, targetID, property, updatedValue);
      const docRef = doc(db, collection, targetID);
      console.log(docRef);

      await setDoc(
        docRef,
        {
          PROPERTY: updatedValue, <-even though I'm passing a property, it does not get picked up with the variable (question 1)
        },
        { merge: true }
      );
    } catch (err) {
      error.value = err.message;
    }
  };

  return { updateDoc, error };
};

export default updateDocs;

editDocForm.vue component

<script>

//import composables
import updateDocs from "../../composables/updateDocs";

export default {
  name: "EditDocForm",
  

  setup() {
    const { updateDoc } = updateDocs();
    
    const handleDocUpdate = async (doc) => {
       
        updateWork("collectionName", targetID, 
 propertyToUpdate, newPropertyValue);