index.js

import { selector, atom } from "recoil"
import { isAfter, isBefore } from "date-fns"

export const CASES = "cases"
export const DEATHS = "deaths"
export const RECOVERED = "recovered"

export const availableStats = [CASES, DEATHS, RECOVERED]

export const currentStatState = atom({
    key: "current-stat-state",
    default: availableStats[0],
})

export const DATE_RANGE = [new Date("10 Jan 2020"), new Date()]

const dateState = atom({
    key: "date-state",
    default: DATE_RANGE[1],
})

export const currentDateState = selector({
    key: "current-date-state",
    get: ({ get }) => {
        return get(dateState)
    },
    set: ({ set }, nextDate) => {
        let newDate = nextDate
        if (isAfter(newDate, DATE_RANGE[1])) newDate = DATE_RANGE[1]
        if (isBefore(newDate, DATE_RANGE[0])) newDate = DATE_RANGE[0]
        set(dateState, newDate)
    },
})