53 lines
1.6 KiB
JavaScript
53 lines
1.6 KiB
JavaScript
import React from "react"
|
|
import PropTypes from "prop-types"
|
|
import Day from "./Day"
|
|
import { formatDate } from "utils"
|
|
import { eachDayOfInterval } from "date-fns"
|
|
import { pathEq } from "lodash/fp"
|
|
|
|
const findAbsence = (date, schedules) => schedules.find(pathEq("date", formatDate(date)))
|
|
|
|
const hoursAtDate = (date, activities) =>
|
|
activities
|
|
.filter(pathEq("date", formatDate(date)))
|
|
.reduce((acc, activity) => acc + activity.hours, 0)
|
|
|
|
const Calendar = ({ fromDate, toDate, selectedDate, activities, schedules, onChange }) => (
|
|
<div className="moco-bx-calendar">
|
|
{eachDayOfInterval({ start: fromDate, end: toDate }).map(date => (
|
|
<Day
|
|
key={date}
|
|
date={date}
|
|
hours={hoursAtDate(date, activities)}
|
|
absence={findAbsence(date, schedules)}
|
|
active={formatDate(date) === formatDate(selectedDate)}
|
|
onClick={onChange}
|
|
/>
|
|
))}
|
|
</div>
|
|
)
|
|
|
|
Calendar.propTypes = {
|
|
fromDate: PropTypes.instanceOf(Date).isRequired,
|
|
toDate: PropTypes.instanceOf(Date).isRequired,
|
|
selectedDate: PropTypes.instanceOf(Date).isRequired,
|
|
activities: PropTypes.arrayOf(
|
|
PropTypes.shape({
|
|
id: PropTypes.number.isRequired,
|
|
date: PropTypes.string.isRequired,
|
|
hours: PropTypes.number.isRequired,
|
|
timer_started_at: PropTypes.string,
|
|
}).isRequired,
|
|
),
|
|
schedules: PropTypes.arrayOf(
|
|
PropTypes.shape({
|
|
date: PropTypes.string,
|
|
assignment_code: PropTypes.string,
|
|
assignment_color: PropTypes.string,
|
|
}),
|
|
).isRequired,
|
|
onChange: PropTypes.func.isRequired,
|
|
}
|
|
|
|
export default Calendar
|