import { reactive, ref, watch } from 'vue'
import { col, formatDate } from '@/components/charts/util.js'

const today = new Date()
const end = new Date()
const start = new Date(today.valueOf() - 2592000000)

const store = {
  parameters: ref({
    county: '-- All --',
    start: formatDate(start),
    end: formatDate(end)
  }),
  data: ref(null)
}

async function refreshData() {
  store.data.value = await fetch(`/data/overall/cases/by-county/${store.parameters.value.county}.json`).then(res => res.json())

  // Annoyingly complicated way to reset the end date to the most recent report date.
  if (formatDate(end) === formatDate(new Date())) {
    const mostRecentReportDate = formatDate(new Date(col(store.data, store.data.value.rows.at(-1), 'report_date') + ' 23:59:59'))
    store.parameters.value.end = mostRecentReportDate
  }
}

watch(() => store.parameters.value.county, () => {
  refreshData()
})

if (globalThis.window) {
  refreshData()
}

export default store