import React from 'react';
import { Calendar, dayjsLocalizer } from 'react-big-calendar';
import "react-big-calendar/lib/css/react-big-calendar.css";
import dayjs from 'dayjs';
import 'dayjs/locale/es';

dayjs.locale('es'); 

const Calendario = () => {
  const localizer = dayjsLocalizer(dayjs); // Configuración del localizador

  // Eventos iniciales (puedes dejarlos vacíos si no tienes eventos todavía)


  const events = [
    {
      title: `limpieza dental`,
      start: dayjs('2025-1-25T12:00:00').toDate(),
      end: dayjs('2025-1-25T13:02:00').toDate(),
    },
  ];

  return (
    <div>
      <Calendar
        localizer={localizer} // Correcto: localizer
        events={events} // Pasar eventos
        views={['month', 'week', 'day']}
        style={{ height: "800px", width: "1200px", margin: "auto" }}
      />
    </div>
  );
};

export default Calendario;
