import { ref } from 'vue'
import api from '../axios.js'

export function useSavedStations() {
    const savedStations = ref([])
    const loading = ref(false)

    async function fetch() {
        loading.value = true
        try {
            const response = await api.get('/user/saved-stations')
            savedStations.value = response.data.data
        } finally {
            loading.value = false
        }
    }

    async function save(stationId) {
        await api.post('/user/saved-stations', { station_id: stationId })
        await fetch()
    }

    async function remove(stationId) {
        await api.delete(`/user/saved-stations/${stationId}`)
        savedStations.value = savedStations.value.filter(s => s.station_id !== stationId)
    }

    function isSaved(stationId) {
        return savedStations.value.some(s => s.station_id === stationId)
    }

    return { savedStations, loading, fetch, save, remove, isSaved }
}