@abbl/material-calendar
Version:
Calendar component build with React and Material-UI
39 lines • 2.11 kB
JavaScript
import { Button, Grid } from '@material-ui/core';
import { isSameDay } from 'date-fns';
import React, { useContext } from 'react';
import { DateChangeAction } from '../../../common/api/DateChangeAction';
import { ViewContext } from '../../../common/contexts/ViewContext';
import useLocale from '../../../common/hooks/locale/useLocale';
import NavigationBarControlArrows from './NavigationBarControlArrows';
import NavigationBarDateText from './NavigationBarDateText';
export default function NavigationBarControls() {
var viewContext = useContext(ViewContext);
var locale = useLocale();
/**
* Changes the currently focused date of the calendar based on provided DataChangeAction parameter.
* @param dateChangeAction
*/
function handleDateChange(dateChangeAction) {
if (dateChangeAction === DateChangeAction.TODAY) {
// Prevent from setting same day once again, which will trigger unnecessary re-render.
if (!isSameDay(Date.now(), viewContext.highlightDate)) {
viewContext.setHighlightDate(new Date());
}
return;
}
var view = viewContext.view;
if (view && view.onDateChange) {
viewContext.setHighlightDate(view.onDateChange(dateChangeAction, viewContext.highlightDate));
}
}
return (React.createElement(React.Fragment, null,
React.createElement(Grid, { item: true },
React.createElement(Grid, { container: true, alignItems: "center" },
React.createElement(Button, { variant: "outlined", color: "primary", onClick: function () {
handleDateChange(DateChangeAction.TODAY);
} }, locale.today),
React.createElement(NavigationBarControlArrows, { onChangeDate: handleDateChange }),
React.createElement(NavigationBarDateText, { highlightDate: viewContext.highlightDate, highlightDateDescription: viewContext.view.getHighlightDateDescription })))));
}
// NavigationBarControls.whyDidYouRender = true;
//# sourceMappingURL=NavigationBarControls.js.map