import { defineStore } from 'pinia'
import { ref } from 'vue'
import * as api from '@/api/index.js'

export const useSynapseReactionsStore = defineStore('synapseReactions', () => {
  const settings = ref(null)
  const versions = ref([])
  const loading = ref(false)
  const saving = ref(false)

  async function fetchSettings() {
    loading.value = true
    try {
      settings.value = await api.getSynapseReactions()
    } finally {
      loading.value = false
    }
  }

  async function fetchVersions(limit = 20) {
    const data = await api.getSynapseReactionVersions(limit)
    versions.value = data.items || []
  }

  /** Save a partial patch — merged over the current settings (the API PUT
   * requires full payload). The store keeps the server's authoritative copy. */
  async function save(patch) {
    saving.value = true
    try {
      settings.value = await api.updateSynapseReactions({
        ...(settings.value || {}),
        ...patch,
      })
    } finally {
      saving.value = false
    }
  }

  return {
    settings,
    versions,
    loading,
    saving,
    fetchSettings,
    fetchVersions,
    save,
  }
})