I am trying to create a web app that uses Vue3, Apollo, and the Quasar framework. I have schema structure that looks like this:

gql:

workout {
  id
  exercises {
    id
    name
    sets {
      id
      weight
      reps
...

I retrieve this in setup() with useQuery and loop through the exercises and sets to get input groups for each set. (using latest verision of https://github.com/quasarframework/app-extension-apollo)

<q-input
  v-model="set.reps"
  type="number"
  hint="reps"
/>

And I can see the value of reps in the input! Great! But when I go to change the input I get this error:

Uncaught TypeError: Cannot assign to read only property 'reps' of object '#<Object>'

I've read this immutability is by design to prevent buggy behavior. Is what I'm trying to do possible? Do I need to restructure the query? I would like to have a user interact with the data and be able to mutate it. Any tips for getting to this behavior?