'use client'

import RangeDatePicker from '@/components/datepicker/RangeDatePicker'
import SingleDatePicker from '@/components/datepicker/SingleDatePicker'
import { useState } from 'react'

export default function DatepickerPage() {
  const [startDate, setStartDate] = useState(new Date())
  const singleDatePickerProps = {
    startDate,
    setStartDate,
  }

  const [dateRange, setDateRange] = useState([null, null])
  const [startRangeDate, endRangeDate] = dateRange
  const rangeDatePickerProps = {
    startRangeDate,
    endRangeDate,
    setDateRange,
  }

  return (
    <>
      <div style={{ padding: '20px' }}>
        <SingleDatePicker {...singleDatePickerProps} />
      </div>
      <div style={{ padding: '20px' }}>
        <RangeDatePicker {...rangeDatePickerProps} />
      </div>
    </>
  )
}