2023-05-20 12:00:15 +00:00
|
|
|
// types
|
2024-03-06 13:09:14 +00:00
|
|
|
import { weeks, months } from "../data";
|
2023-05-20 12:00:15 +00:00
|
|
|
import { ChartDataType } from "../types";
|
|
|
|
// data
|
|
|
|
// helpers
|
2023-11-08 15:01:46 +00:00
|
|
|
import { generateDate, getWeekNumberByDate, getNumberOfDaysInMonth, getDatesBetweenTwoDates } from "./helpers";
|
2023-05-20 12:00:15 +00:00
|
|
|
|
|
|
|
type GetAllDaysInMonthInMonthViewType = {
|
|
|
|
date: any;
|
|
|
|
day: any;
|
|
|
|
dayData: any;
|
|
|
|
weekNumber: number;
|
|
|
|
title: string;
|
|
|
|
active: boolean;
|
|
|
|
today: boolean;
|
|
|
|
};
|
|
|
|
const getAllDaysInMonthInMonthView = (month: number, year: number) => {
|
|
|
|
const day: GetAllDaysInMonthInMonthViewType[] = [];
|
|
|
|
const numberOfDaysInMonth = getNumberOfDaysInMonth(month, year);
|
|
|
|
const currentDate = new Date();
|
|
|
|
|
|
|
|
Array.from(Array(numberOfDaysInMonth).keys()).map((_day: number) => {
|
|
|
|
const date: Date = generateDate(_day + 1, month, year);
|
|
|
|
day.push({
|
|
|
|
date: date,
|
|
|
|
day: _day + 1,
|
|
|
|
dayData: weeks[date.getDay()],
|
|
|
|
weekNumber: getWeekNumberByDate(date),
|
|
|
|
title: `${weeks[date.getDay()].shortTitle} ${_day + 1}`,
|
|
|
|
active: false,
|
|
|
|
today:
|
2023-11-08 15:01:46 +00:00
|
|
|
currentDate.getFullYear() === year && currentDate.getMonth() === month && currentDate.getDate() === _day + 1
|
2023-05-20 12:00:15 +00:00
|
|
|
? true
|
|
|
|
: false,
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
return day;
|
|
|
|
};
|
|
|
|
|
|
|
|
const generateMonthDataByMonthAndYearInMonthView = (month: number, year: number) => {
|
|
|
|
const currentMonth: number = month;
|
|
|
|
const currentYear: number = year;
|
|
|
|
|
|
|
|
const monthPayload = {
|
|
|
|
year: currentYear,
|
|
|
|
month: currentMonth,
|
|
|
|
monthData: months[currentMonth],
|
|
|
|
children: getAllDaysInMonthInMonthView(currentMonth, currentYear),
|
|
|
|
title: `${months[currentMonth].title} ${currentYear}`,
|
|
|
|
};
|
|
|
|
|
|
|
|
return monthPayload;
|
|
|
|
};
|
|
|
|
|
|
|
|
export const generateWeekChart = (monthPayload: ChartDataType, side: null | "left" | "right") => {
|
|
|
|
let renderState = monthPayload;
|
|
|
|
const renderPayload: any = [];
|
|
|
|
|
|
|
|
const range: number = renderState.data.approxFilterRange || 6;
|
|
|
|
let filteredDates: Date[] = [];
|
|
|
|
let minusDate: Date = new Date();
|
|
|
|
let plusDate: Date = new Date();
|
|
|
|
|
|
|
|
if (side === null) {
|
|
|
|
const currentDate = renderState.data.currentDate;
|
|
|
|
|
2023-11-08 15:01:46 +00:00
|
|
|
minusDate = new Date(currentDate.getFullYear(), currentDate.getMonth() - range, currentDate.getDate());
|
|
|
|
plusDate = new Date(currentDate.getFullYear(), currentDate.getMonth() + range, currentDate.getDate());
|
2023-05-20 12:00:15 +00:00
|
|
|
|
|
|
|
if (minusDate && plusDate) filteredDates = getDatesBetweenTwoDates(minusDate, plusDate);
|
|
|
|
|
|
|
|
renderState = {
|
|
|
|
...renderState,
|
|
|
|
data: {
|
|
|
|
...renderState.data,
|
|
|
|
startDate: filteredDates[0],
|
|
|
|
endDate: filteredDates[filteredDates.length - 1],
|
|
|
|
},
|
|
|
|
};
|
|
|
|
} else if (side === "left") {
|
|
|
|
const currentDate = renderState.data.startDate;
|
|
|
|
|
2023-11-08 15:01:46 +00:00
|
|
|
minusDate = new Date(currentDate.getFullYear(), currentDate.getMonth() - range, currentDate.getDate());
|
|
|
|
plusDate = new Date(currentDate.getFullYear(), currentDate.getMonth() - 1, currentDate.getDate());
|
2023-05-20 12:00:15 +00:00
|
|
|
|
|
|
|
if (minusDate && plusDate) filteredDates = getDatesBetweenTwoDates(minusDate, plusDate);
|
|
|
|
|
|
|
|
renderState = {
|
|
|
|
...renderState,
|
|
|
|
data: { ...renderState.data, startDate: filteredDates[0] },
|
|
|
|
};
|
|
|
|
} else if (side === "right") {
|
|
|
|
const currentDate = renderState.data.endDate;
|
|
|
|
|
2023-11-08 15:01:46 +00:00
|
|
|
minusDate = new Date(currentDate.getFullYear(), currentDate.getMonth() + 1, currentDate.getDate());
|
|
|
|
plusDate = new Date(currentDate.getFullYear(), currentDate.getMonth() + range, currentDate.getDate());
|
2023-05-20 12:00:15 +00:00
|
|
|
|
|
|
|
if (minusDate && plusDate) filteredDates = getDatesBetweenTwoDates(minusDate, plusDate);
|
|
|
|
|
|
|
|
renderState = {
|
|
|
|
...renderState,
|
|
|
|
data: { ...renderState.data, endDate: filteredDates[filteredDates.length - 1] },
|
|
|
|
};
|
|
|
|
}
|
|
|
|
|
|
|
|
if (filteredDates && filteredDates.length > 0)
|
|
|
|
for (const currentDate in filteredDates) {
|
|
|
|
const date = filteredDates[parseInt(currentDate)];
|
|
|
|
const currentYear = date.getFullYear();
|
|
|
|
const currentMonth = date.getMonth();
|
|
|
|
renderPayload.push(generateMonthDataByMonthAndYearInMonthView(currentMonth, currentYear));
|
|
|
|
}
|
|
|
|
|
|
|
|
const scrollWidth =
|
|
|
|
renderPayload
|
|
|
|
.map((monthData: any) => monthData.children.length)
|
|
|
|
.reduce((partialSum: number, a: number) => partialSum + a, 0) * monthPayload.data.width;
|
|
|
|
|
|
|
|
return { state: renderState, payload: renderPayload, scrollWidth: scrollWidth };
|
|
|
|
};
|
|
|
|
|
|
|
|
export const getNumberOfDaysBetweenTwoDatesInWeek = (startDate: Date, endDate: Date) => {
|
|
|
|
let daysDifference: number = 0;
|
|
|
|
startDate.setHours(0, 0, 0, 0);
|
|
|
|
endDate.setHours(0, 0, 0, 0);
|
|
|
|
|
|
|
|
const timeDifference: number = startDate.getTime() - endDate.getTime();
|
|
|
|
daysDifference = Math.abs(Math.floor(timeDifference / (1000 * 60 * 60 * 24)));
|
|
|
|
|
|
|
|
return daysDifference;
|
|
|
|
};
|