How to filter by vue js/ vuex products?

Question

Vue.js

Products Component:

<div class="create__item" v-for="item in getDocuments" :data-id="item._id">
                <div class="create__name">{{ item.title }}</div>
                <div class="create__price">{{ item.currentPrice }} рублей</div>
              </div>

const currentDocuments = ref([])

const getDocuments = computed(() => {
        currentDocuments.value = store.getters['document/getDocuments'].slice(startIndexForArray.value, endIndexForArray.value)
        const num = store.getters['document/getDocuments'].length / 4
        if (num === 0) return maxStep.value = num
        if (num % 1 === 0) {
          maxStep.value = num + 1
        } else {
          maxStep.value = Math.ceil(num)
        }
        return currentDocuments.value
    })

Store:

getters: {
    getDocuments(state) {
      return state.documents
    }
  },
  mutations: {
    setDocuments(state, documents) {
      if (Array.isArray(documents)) {
        return state.documents = documents
      } else {
        return state.documents.push(documents)
      }
    },
  },

How to correctly implement a filter by category?
There is a component that creates products. And when filtering is enabled, it does not render the newly created product in this category. For example: I opened the "free" category, I just added a product to this category in the component below, but it does not appear in the category. In a regular list, it is drawn immediately.
There was an idea to pass props:

My filter option:

const getFilterDocuments = computed(() => {
      filterDocuments.value = store.getters['document/getDocuments'].filter(doc => doc.category === filter.value)
      currentDocuments.value = filterDocuments.value.slice(startIndexForArray.value, endIndexForArray.value)
      const num = filterDocuments.value.length / 4
      if (num === 0) return maxStep.value = num
      if (num % 1 === 0) {
        maxStep.value = num + 1
      } else {
        maxStep.value = Math.ceil(num)
      }
      // if (props.item.category === filter.value) currentDocuments.value.push(props.item)
      return currentDocuments.value
    })