Vue3 reactive ref inside another ref doesn't update

I'm wondering why reactive value inside ref() is not working as expected

I use pinia within nuxt3, but I think question is vue composition api related. order_price is ObjectRefImpl type

Looking to drop watch function or an advice how to compose differently. My current code looks like bad practise

import { storeToRefs } from 'pinia'
import { useLocationStore } from '~/store'

export default {
  setup() {
    const store = useLocationStore()
    const { order_price } = storeToRefs(store)

    const items = ref([
      {
        id: 1,
        title: 'Foo',
        body: `<p>Bar — ${order_price.value}</p>`, // not updated when order_price change
      },
    ])
    
    // workaround
    watch(
      () => order_price.value,
      (price) => {
        items.value[0].body = `<p>Bar — ${price} $</p>`
      }
    )

    return {
      store,
      items,
    }
  },
}