@steroidsjs/core 3.0.14 → 3.0.16

package/ui/content/CalendarSystem/hooks/useCalendarSystem.js

@@ -0,0 +1,96 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+exports.__esModule = true;
+exports.useCalendarSystem = void 0;
+var react_1 = __importStar(require("react"));
+var useDisplayDate_1 = __importDefault(require("./useDisplayDate"));
+var useDayGrid_1 = require("./useDayGrid");
+var useCalendarType_1 = require("./useCalendarType");
+var CalendarType_1 = __importDefault(require("../enums/CalendarType"));
+var useMonthGrid_1 = __importDefault(require("./useMonthGrid"));
+var useWeekGrid_1 = __importDefault(require("./useWeekGrid"));
+var useCalendarControls_1 = __importDefault(require("./useCalendarControls"));
+var useCalendarSystemModals_1 = __importDefault(require("./useCalendarSystemModals"));
+var useCalendarSystemEventGroupModals_1 = require("./useCalendarSystemEventGroupModals");
+var useEventsFromDate_1 = require("./useEventsFromDate");
+var DisplayDateFormatType_1 = __importDefault(require("../enums/DisplayDateFormatType"));
+var utils_1 = require("../utils/utils");
+var useCalendarSystem = function (props) {
+    var _a = react_1["default"].useState(props.eventBlock.eventGroups || []), innerEventGroups = _a[0], setInnerEventGroups = _a[1];
+    var _b = react_1["default"].useState([]), selectedEventGroupsIds = _b[0], setSelectedEventGroupsIds = _b[1];
+    var _c = (0, react_1.useState)(props.users), users = _c[0], setUsers = _c[1];
+    //Главная дата, от которой происходят все вычисления
+    var _d = react_1["default"].useState((0, utils_1.getFormattedDay)()), generalCurrentDay = _d[0], setGeneralCurrentDay = _d[1];
+    var isGeneralCurrentDayNeedsUpdate = (0, react_1.useRef)(true);
+    var updateGeneralCurrentDay = (0, react_1.useCallback)(function (newDate) {
+        if (!isGeneralCurrentDayNeedsUpdate.current) {
+            isGeneralCurrentDayNeedsUpdate.current = true;
+            return;
+        }
+        setGeneralCurrentDay((0, utils_1.getFormattedDay)(newDate));
+    }, [isGeneralCurrentDayNeedsUpdate]);
+    var onCalendarChangedMonth = react_1["default"].useCallback(function (newDate) {
+        updateGeneralCurrentDay(newDate);
+    }, [updateGeneralCurrentDay]);
+    var _e = (0, useDisplayDate_1["default"])(generalCurrentDay), dateToDisplay = _e.dateToDisplay, changeDisplayFormat = _e.changeDisplayFormat;
+    var _f = (0, useMonthGrid_1["default"])(generalCurrentDay), monthGridWeekDays = _f.monthGridWeekDays, monthGridCalendarDays = _f.monthGridCalendarDays;
+    var _g = (0, useWeekGrid_1["default"])(generalCurrentDay), weekGridTwentyFourHoursArray = _g.weekGridTwentyFourHoursArray, weekGridCurrentWeekDays = _g.weekGridCurrentWeekDays;
+    var _h = (0, useDayGrid_1.useDayGrid)(generalCurrentDay), dayGridTwentyFourHoursArray = _h.dayGridTwentyFourHoursArray, dayGridCurrentDay = _h.dayGridCurrentDay;
+    var _j = (0, useCalendarType_1.useCalendarType)(function (newType) {
+        if (newType === CalendarType_1["default"].DAY) {
+            changeDisplayFormat(DisplayDateFormatType_1["default"].DAY);
+            return;
+        }
+        changeDisplayFormat(DisplayDateFormatType_1["default"].DEFAULT);
+    }), calendarType = _j.calendarType, handleCalendarTypeChange = _j.handleCalendarTypeChange;
+    var onClickControl = (0, useCalendarControls_1["default"])(calendarType, generalCurrentDay, setGeneralCurrentDay, isGeneralCurrentDayNeedsUpdate).onClickControl;
+    var _k = (0, useCalendarSystemModals_1["default"])(props.calendarModalProps, innerEventGroups, setInnerEventGroups, users, setUsers), openCreateModal = _k.openCreateModal, openEditModal = _k.openEditModal;
+    var openCreateEventGroupModal = (0, useCalendarSystemEventGroupModals_1.useCalendarSystemEventGroupModals)(innerEventGroups, setInnerEventGroups, props.eventGroupModalProps).openCreateEventGroupModal;
+    var getEventsFromDate = (0, useEventsFromDate_1.useEventsFromDate)(innerEventGroups, selectedEventGroupsIds).getEventsFromDate;
+    return {
+        monthGridWeekDays: monthGridWeekDays,
+        monthGridCalendarDays: monthGridCalendarDays,
+        weekGridTwentyFourHoursArray: weekGridTwentyFourHoursArray,
+        weekGridCurrentWeekDays: weekGridCurrentWeekDays,
+        dayGridTwentyFourHoursArray: dayGridTwentyFourHoursArray,
+        dayGridCurrentDay: dayGridCurrentDay,
+        dateToDisplay: dateToDisplay,
+        innerEventGroups: innerEventGroups,
+        calendarType: calendarType,
+        users: users,
+        setSelectedEventGroupsIds: setSelectedEventGroupsIds,
+        handleCalendarTypeChange: handleCalendarTypeChange,
+        getEventsFromDate: getEventsFromDate,
+        onCalendarChangedMonth: onCalendarChangedMonth,
+        openCreateEventGroupModal: openCreateEventGroupModal,
+        openEditModal: openEditModal,
+        openCreateModal: openCreateModal,
+        onClickControl: onClickControl
+    };
+};
+exports.useCalendarSystem = useCalendarSystem;

package/ui/content/CalendarSystem/hooks/useCalendarSystemModals.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { IModalProps } from '../../../modal/Modal/Modal';
-import { ICalendarSystemModalViewProps, IDay, IEvent, IEventGroup } from '../CalendarSystem';
-declare const useCalendarSystemModals: (calendarModalProps: IModalProps, innerEventGroups: IEventGroup[], setInnerEventGroups: React.Dispatch<React.SetStateAction<IEventGroup[]>>) => {
+import { ICalendarSystemModalViewProps, ICalendarUser, IDay, IEvent, IEventGroup } from '../CalendarSystem';
+declare const useCalendarSystemModals: (calendarModalProps: IModalProps, innerEventGroups: IEventGroup[], setInnerEventGroups: React.Dispatch<React.SetStateAction<IEventGroup[]>>, users: ICalendarUser[], setUsers: React.Dispatch<React.SetStateAction<ICalendarUser[]>>) => {
     openCreateModal: (eventInitialDay?: IDay) => void;
     openEditModal: (event: IEvent) => void;
     getEventFromGroup: (event: IEvent) => IEventGroup;

package/ui/content/CalendarSystem/hooks/useCalendarSystemModals.js

@@ -27,17 +27,18 @@ var react_1 = __importDefault(require("react"));
 var react_redux_1 = require("react-redux");
 var isEqual_1 = __importDefault(require("lodash-es/isEqual"));
 var maxBy_1 = __importDefault(require("lodash-es/maxBy"));
+var cloneDeep_1 = __importDefault(require("lodash-es/cloneDeep"));
 var modal_1 = require("../../../../actions/modal");
 var useComponents_1 = __importDefault(require("../../../../hooks/useComponents"));
 var utils_1 = require("../utils/utils");
-var DEFAULT_ID = 0;
-var useCalendarSystemModals = function (calendarModalProps, innerEventGroups, setInnerEventGroups) {
+var DEFAULT_ID = 1;
+var useCalendarSystemModals = function (calendarModalProps, innerEventGroups, setInnerEventGroups, users, setUsers) {
     var dispatch = (0, react_redux_1.useDispatch)();
     var components = (0, useComponents_1["default"])();
     var calendarModalView = (calendarModalProps === null || calendarModalProps === void 0 ? void 0 : calendarModalProps.component) || components.ui.getView('content.CalendarSystemModalView');
     var onModalFormSubmit = react_1["default"].useCallback(function (fields, eventInitialValues) {
         var _a;
-        var eventGroupId = fields.eventGroupId, date = fields.date, title = fields.title, description = fields.description;
+        var id = fields.id, eventGroupId = fields.eventGroupId, startDate = fields.startDate, title = fields.title, description = fields.description, endDate = fields.endDate, usersIds = fields.usersIds;
         var currentEventGroups = __spreadArray([], innerEventGroups, true);
         if (eventInitialValues) {
             // Удаляем событие из предыдущей группы
@@ -51,8 +52,9 @@ var useCalendarSystemModals = function (calendarModalProps, innerEventGroups, se
         var changeableEventGroupIndex = currentEventGroups.findIndex(function (group) { return group.id === eventGroupId; });
         var changeableEventGroup = __assign({}, currentEventGroups[changeableEventGroupIndex]);
         var updatedEvent = {
-            id: (((_a = (0, maxBy_1["default"])(changeableEventGroup.events, function (event) { return event.id; })) === null || _a === void 0 ? void 0 : _a.id) || DEFAULT_ID) + 1,
-            date: new Date(date),
+            id: id || (((_a = (0, maxBy_1["default"])(changeableEventGroup.events, function (event) { return event.id; })) === null || _a === void 0 ? void 0 : _a.id) || DEFAULT_ID) + 1,
+            startDate: new Date(startDate),
+            endDate: new Date(endDate),
             title: title,
             description: description
         };
@@ -62,22 +64,39 @@ var useCalendarSystemModals = function (calendarModalProps, innerEventGroups, se
             changeableEventGroup
         ], false), currentEventGroups.slice(changeableEventGroupIndex + 1), true);
         setInnerEventGroups(currentEventGroups);
-    }, [innerEventGroups, setInnerEventGroups]);
-    var getModalProps = react_1["default"].useCallback(function (isCreate, eventInitialValues) { return (__assign(__assign({}, calendarModalProps), { component: calendarModalView, eventGroups: innerEventGroups, onModalFormSubmit: onModalFormSubmit, isCreate: isCreate, eventInitialValues: eventInitialValues })); }, [calendarModalProps, calendarModalView, innerEventGroups, onModalFormSubmit]);
+        var newUsers = (0, cloneDeep_1["default"])(users);
+        newUsers = newUsers.map(function (user) {
+            var newUser = (0, cloneDeep_1["default"])(user);
+            if (newUser.eventsIds.includes(updatedEvent.id) && !usersIds.includes(newUser.id)) {
+                return __assign(__assign({}, newUser), { eventsIds: __spreadArray([], newUser.eventsIds, true).filter(function (eventId) { return eventId !== updatedEvent.id; }) });
+            }
+            if (usersIds.includes(newUser.id) && !newUser.eventsIds.includes(updatedEvent.id)) {
+                return __assign(__assign({}, newUser), { eventsIds: __spreadArray(__spreadArray([], newUser.eventsIds, true), [updatedEvent.id], false) });
+            }
+            return newUser;
+        });
+        setUsers(newUsers);
+    }, [innerEventGroups, setInnerEventGroups, setUsers, users]);
+    var getModalProps = react_1["default"].useCallback(function (isCreate, eventInitialValues) { return (__assign(__assign({}, calendarModalProps), { component: calendarModalView, eventGroups: innerEventGroups, onModalFormSubmit: onModalFormSubmit, isCreate: isCreate, eventInitialValues: eventInitialValues, users: users })); }, [calendarModalProps, calendarModalView, innerEventGroups, onModalFormSubmit, users]);
     var getEventFromGroup = react_1["default"].useCallback(function (event) { return innerEventGroups
         .find(function (group) { return group.events
         .some(function (groupEvent) { return (0, isEqual_1["default"])((0, utils_1.getOmittedEvent)(groupEvent), (0, utils_1.getOmittedEvent)(event)); }); }); }, [innerEventGroups]);
     var openCreateModal = react_1["default"].useCallback(function (eventInitialDay) {
         if (eventInitialDay === void 0) { eventInitialDay = null; }
         var modalProps = eventInitialDay
-            ? getModalProps(true, { date: eventInitialDay.date }) : getModalProps(true);
+            ? getModalProps(true, { startDate: eventInitialDay.date }) : getModalProps(true);
         dispatch((0, modal_1.openModal)(calendarModalView, modalProps));
     }, [calendarModalView, dispatch, getModalProps]);
     var openEditModal = react_1["default"].useCallback(function (event) {
         var _a;
         var eventGroupId = ((_a = getEventFromGroup(event)) === null || _a === void 0 ? void 0 : _a.id) || 0;
-        dispatch((0, modal_1.openModal)(calendarModalView, getModalProps(false, __assign(__assign({}, event), { eventGroupId: eventGroupId }))));
-    }, [getModalProps, calendarModalView, dispatch, getEventFromGroup]);
+        dispatch((0, modal_1.openModal)(calendarModalView, getModalProps(false, __assign(__assign({}, event), { eventGroupId: eventGroupId, usersIds: users.map(function (user) {
+                if (!user.eventsIds.includes(event.id)) {
+                    return null;
+                }
+                return user.id;
+            }).filter(Boolean) }))));
+    }, [getEventFromGroup, dispatch, calendarModalView, getModalProps, users]);
     return {
         openCreateModal: openCreateModal,
         openEditModal: openEditModal,

package/ui/content/CalendarSystem/hooks/useCustomViews.d.ts

@@ -0,0 +1,24 @@
+/// <reference types="react" />
+import { ICalendarSystemProps } from '../CalendarSystem';
+export interface ICustomViews {
+    renderEventView: (componentProps: any) => JSX.Element;
+    renderHourView: (componentProps: any) => JSX.Element;
+    renderGridView: (componentProps: any) => JSX.Element;
+}
+export declare const useCustomViews: (props: Pick<ICalendarSystemProps, 'dayGrid' | 'weekGrid' | 'monthGrid'>) => {
+    dayGridViews: {
+        renderEventView: (componentProps: any) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+        renderHourView: (componentProps: any) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+        renderGridView: (componentProps: any) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+    };
+    weekGridViews: {
+        renderEventView: (componentProps: any) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+        renderHourView: (componentProps: any) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+        renderGridView: (componentProps: any) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+    };
+    monthGridViews: {
+        renderEventView: (componentProps: any) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+        renderHourView: (componentProps: any) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+        renderGridView: (componentProps: any) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+    };
+};

package/ui/content/CalendarSystem/hooks/useCustomViews.js

@@ -0,0 +1,45 @@
+"use strict";
+exports.__esModule = true;
+exports.useCustomViews = void 0;
+/* eslint-disable max-len */
+var react_1 = require("react");
+var hooks_1 = require("../../../../hooks");
+var DEFAULT_DAY_GRID_VIEWS = {
+    eventView: 'content.CalendarSystemDayEventView',
+    hourView: 'content.CalendarSystemDayHourView',
+    gridView: 'content.CalendarSystemDayGridView'
+};
+var DEFAULT_WEEK_GRID_VIEWS = {
+    eventView: 'content.CalendarSystemWeekEventView',
+    hourView: 'content.CalendarSystemWeekHourView',
+    gridView: 'content.CalendarSystemWeekGridView'
+};
+var DEFAULT_MONTH_GRID_VIEWS = {
+    eventView: 'content.CalendarSystemMonthEventView',
+    hourView: 'content.CalendarSystemMonthHourView',
+    gridView: 'content.CalendarSystemMonthGridView'
+};
+var useCustomViews = function (props) {
+    var components = (0, hooks_1.useComponents)();
+    var dayGridViews = (0, react_1.useMemo)(function () { return ({
+        renderEventView: function (componentProps) { var _a; return components.ui.renderView(((_a = props === null || props === void 0 ? void 0 : props.dayGrid) === null || _a === void 0 ? void 0 : _a.eventView) || DEFAULT_DAY_GRID_VIEWS.eventView, componentProps); },
+        renderHourView: function (componentProps) { var _a; return components.ui.renderView(((_a = props === null || props === void 0 ? void 0 : props.dayGrid) === null || _a === void 0 ? void 0 : _a.hourView) || DEFAULT_DAY_GRID_VIEWS.hourView, componentProps); },
+        renderGridView: function (componentProps) { var _a; return components.ui.renderView(((_a = props === null || props === void 0 ? void 0 : props.dayGrid) === null || _a === void 0 ? void 0 : _a.gridView) || DEFAULT_DAY_GRID_VIEWS.gridView, componentProps); }
+    }); }, [components.ui, props]);
+    var weekGridViews = (0, react_1.useMemo)(function () { return ({
+        renderEventView: function (componentProps) { var _a; return components.ui.renderView(((_a = props === null || props === void 0 ? void 0 : props.weekGrid) === null || _a === void 0 ? void 0 : _a.eventView) || DEFAULT_WEEK_GRID_VIEWS.eventView, componentProps); },
+        renderHourView: function (componentProps) { var _a; return components.ui.renderView(((_a = props === null || props === void 0 ? void 0 : props.weekGrid) === null || _a === void 0 ? void 0 : _a.hourView) || DEFAULT_WEEK_GRID_VIEWS.hourView, componentProps); },
+        renderGridView: function (componentProps) { var _a; return components.ui.renderView(((_a = props === null || props === void 0 ? void 0 : props.weekGrid) === null || _a === void 0 ? void 0 : _a.gridView) || DEFAULT_WEEK_GRID_VIEWS.gridView, componentProps); }
+    }); }, [components.ui, props]);
+    var monthGridViews = (0, react_1.useMemo)(function () { return ({
+        renderEventView: function (componentProps) { var _a; return components.ui.renderView(((_a = props === null || props === void 0 ? void 0 : props.monthGrid) === null || _a === void 0 ? void 0 : _a.eventView) || DEFAULT_MONTH_GRID_VIEWS.eventView, componentProps); },
+        renderHourView: function (componentProps) { var _a; return components.ui.renderView(((_a = props === null || props === void 0 ? void 0 : props.monthGrid) === null || _a === void 0 ? void 0 : _a.hourView) || DEFAULT_MONTH_GRID_VIEWS.hourView, componentProps); },
+        renderGridView: function (componentProps) { var _a; return components.ui.renderView(((_a = props === null || props === void 0 ? void 0 : props.monthGrid) === null || _a === void 0 ? void 0 : _a.gridView) || DEFAULT_MONTH_GRID_VIEWS.gridView, componentProps); }
+    }); }, [components.ui, props]);
+    return {
+        dayGridViews: dayGridViews,
+        weekGridViews: weekGridViews,
+        monthGridViews: monthGridViews
+    };
+};
+exports.useCustomViews = useCustomViews;

package/ui/content/CalendarSystem/hooks/useDayGrid.d.ts

@@ -0,0 +1,5 @@
+import { IDay } from '../CalendarSystem';
+export declare const useDayGrid: (generalCurrentDay: IDay) => {
+    dayGridCurrentDay: IDay;
+    dayGridTwentyFourHoursArray: string[];
+};

package/ui/content/CalendarSystem/hooks/useDayGrid.js

@@ -0,0 +1,9 @@
+"use strict";
+exports.__esModule = true;
+exports.useDayGrid = void 0;
+var utils_1 = require("../utils/utils");
+var useDayGrid = function (generalCurrentDay) { return ({
+    dayGridCurrentDay: generalCurrentDay,
+    dayGridTwentyFourHoursArray: (0, utils_1.getTwentyFourHoursArray)()
+}); };
+exports.useDayGrid = useDayGrid;

package/ui/content/CalendarSystem/hooks/useDisplayDate.d.ts

@@ -1,6 +1,7 @@
-export declare const MONTH_CONVERT_FORMAT = "MMMM YYYY";
-declare const useDisplayDate: () => {
+import { IDay } from '../CalendarSystem';
+declare const useDisplayDate: (generalCurrentDay: IDay) => {
     dateToDisplay: any;
-    setNewDateToDisplay: (newDate: Date) => void;
+    displayFormat: string;
+    changeDisplayFormat: (newFormat: string) => void;
 };
 export default useDisplayDate;

package/ui/content/CalendarSystem/hooks/useDisplayDate.js

@@ -3,25 +3,21 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 exports.__esModule = true;
-exports.MONTH_CONVERT_FORMAT = void 0;
-var react_1 = __importDefault(require("react"));
+var react_1 = require("react");
 var upperFirst_1 = __importDefault(require("lodash-es/upperFirst"));
 var calendar_1 = require("../../../../utils/calendar");
-exports.MONTH_CONVERT_FORMAT = 'MMMM YYYY';
-var getFirstDayOfCurrentMonth = function () {
-    var currentDate = new Date();
-    var firstDayOfMonth = new Date(currentDate.getFullYear(), currentDate.getMonth(), 1);
-    return firstDayOfMonth;
-};
-var convertDateToRequiredFormat = function (date) { return (0, calendar_1.convertDate)(date, null, exports.MONTH_CONVERT_FORMAT); };
-var useDisplayDate = function () {
-    var _a = react_1["default"].useState((0, upperFirst_1["default"])(convertDateToRequiredFormat(getFirstDayOfCurrentMonth()))), dateToDisplay = _a[0], setDateToDisplay = _a[1];
-    var setNewDateToDisplay = function (newDate) {
-        setDateToDisplay(convertDateToRequiredFormat(newDate));
+var DisplayDateFormatType_1 = __importDefault(require("../enums/DisplayDateFormatType"));
+var convertDateToRequiredFormat = function (date, toFormat) { return (0, calendar_1.convertDate)(date, null, DisplayDateFormatType_1["default"].getLabel(toFormat)); };
+var useDisplayDate = function (generalCurrentDay) {
+    var _a = (0, react_1.useState)(DisplayDateFormatType_1["default"].DEFAULT), displayFormat = _a[0], setDisplayFormat = _a[1];
+    var dateToDisplay = (0, react_1.useMemo)(function () { return (0, upperFirst_1["default"])(convertDateToRequiredFormat(generalCurrentDay.date, displayFormat)); }, [displayFormat, generalCurrentDay.date]);
+    var changeDisplayFormat = function (newFormat) {
+        setDisplayFormat(newFormat);
     };
     return {
         dateToDisplay: dateToDisplay,
-        setNewDateToDisplay: setNewDateToDisplay
+        displayFormat: displayFormat,
+        changeDisplayFormat: changeDisplayFormat
     };
 };
 exports["default"] = useDisplayDate;

package/ui/content/CalendarSystem/hooks/useEventsFromDate.js

@@ -23,6 +23,14 @@ var CALENDAR_TYPE_GETTING_EVENTS_PROPERTIES = (_a = {},
         },
         unit: 'hours'
     },
+    _a[CalendarType_1["default"].DAY] = {
+        getDayJsDate: function (date) {
+            var eventDate = new Date(date);
+            eventDate.setHours(eventDate.getHours(), 0, 0, 0);
+            return (0, dayjs_1["default"])(eventDate);
+        },
+        unit: 'hours'
+    },
     _a);
 var useEventsFromDate = function (innerEventGroups, selectedEventGroupsIds) {
     var getEventsFromDate = react_1["default"].useCallback(function (dateFromDay, currentCalendarType) {
@@ -37,7 +45,7 @@ var useEventsFromDate = function (innerEventGroups, selectedEventGroupsIds) {
         };
         var calendarTypeProperties = CALENDAR_TYPE_GETTING_EVENTS_PROPERTIES[currentCalendarType];
         forEachEventGroupEvent(function (event, eventGroup) {
-            var eventDateDayJs = calendarTypeProperties.getDayJsDate(event.date);
+            var eventDateDayJs = calendarTypeProperties.getDayJsDate(event.startDate);
             (0, addEventIfMatchDate_1.addEventIfMatchDate)(eventDateDayJs, dayjsDateFromDay, eventGroup, event, calendarTypeProperties.unit, selectedEventGroupsIds, resultEventsOnDate);
         });
         return resultEventsOnDate;

package/ui/content/CalendarSystem/hooks/useMonthGrid.d.ts

@@ -1,15 +1,6 @@
-import React from 'react';
 import { IDay } from '../CalendarSystem';
-declare const useMonthGrid: (currentMonthFirstDayDate: Date, setCurrentMonthFirstDayDate: React.Dispatch<React.SetStateAction<Date>>) => {
+declare const useMonthGrid: (generalCurrentDay: IDay) => {
     monthGridWeekDays: any;
     monthGridCalendarDays: IDay[];
-    getCalendarArray: () => IDay[];
-    getCurrentMonthDataUTC: () => {
-        currentMonth: number;
-        lastDayOfCurrentMonth: number;
-        firstDayOfCurrentMonth: Date;
-        daysInCurrentMonth: any[];
-    };
-    getWeekFromDate: (date: Date) => IDay[];
 };
 export default useMonthGrid;

package/ui/content/CalendarSystem/hooks/useMonthGrid.js

@@ -10,34 +10,25 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 exports.__esModule = true;
 /* eslint-disable no-plusplus */
 /* eslint-disable import/order */
-var react_1 = __importDefault(require("react"));
+var react_1 = require("react");
 var utils_1 = require("../utils/utils");
-var concat_1 = __importDefault(require("lodash-es/concat"));
-var slice_1 = __importDefault(require("lodash-es/slice"));
-var dayjs_1 = __importDefault(require("dayjs"));
-var upperFirst_1 = __importDefault(require("lodash-es/upperFirst"));
 var FIRST_DAY = 1;
 var ONE_MONTH = 1;
 var TOTAL_DAYS_IN_CALENDAR = 42;
-var useMonthGrid = function (currentMonthFirstDayDate, setCurrentMonthFirstDayDate) {
-    var getCurrentMonthDataUTC = react_1["default"].useCallback(function () {
-        var currentYear = (currentMonthFirstDayDate === null || currentMonthFirstDayDate === void 0 ? void 0 : currentMonthFirstDayDate.getFullYear()) || new Date().getFullYear();
-        var month = (currentMonthFirstDayDate === null || currentMonthFirstDayDate === void 0 ? void 0 : currentMonthFirstDayDate.getMonth()) || new Date().getMonth();
+var useMonthGrid = function (generalCurrentDay) {
+    var currentMonthData = (0, react_1.useMemo)(function () {
+        var _a, _b;
+        var currentYear = (_a = generalCurrentDay.date) === null || _a === void 0 ? void 0 : _a.getFullYear();
+        var month = (_b = generalCurrentDay.date) === null || _b === void 0 ? void 0 : _b.getMonth();
         var nextMonthFirstDay = new Date(currentYear, month + ONE_MONTH, FIRST_DAY);
-        var lastDayOfCurrentMonth = new Date(nextMonthFirstDay.getTime() - FIRST_DAY).getDate();
-        var firstDayOfCurrentMonth = new Date(Date.UTC(currentYear, month, FIRST_DAY));
-        if (currentMonthFirstDayDate === null) {
-            setCurrentMonthFirstDayDate(firstDayOfCurrentMonth);
-        }
+        var lastDateOfCurrentMonth = new Date(nextMonthFirstDay.getTime() - FIRST_DAY).getDate();
+        var firstDateOfCurrentMonth = new Date(Date.UTC(currentYear, month, FIRST_DAY));
         var daysInCurrentMonth = [];
         // Пройдемся по всем дням месяца и добавим их в массив
-        for (var dayNumber = 1; dayNumber <= lastDayOfCurrentMonth; dayNumber++) {
+        for (var dayNumber = 1; dayNumber <= lastDateOfCurrentMonth; dayNumber++) {
             var date = new Date(Date.UTC(currentYear, month, dayNumber));
             daysInCurrentMonth.push({
                 date: date,
@@ -46,51 +37,44 @@ var useMonthGrid = function (currentMonthFirstDayDate, setCurrentMonthFirstDayDa
         }
         return {
             currentMonth: month,
-            lastDayOfCurrentMonth: lastDayOfCurrentMonth,
-            firstDayOfCurrentMonth: firstDayOfCurrentMonth,
+            lastDateOfCurrentMonth: lastDateOfCurrentMonth,
+            firstDateOfCurrentMonth: firstDateOfCurrentMonth,
             daysInCurrentMonth: daysInCurrentMonth
         };
-    }, [currentMonthFirstDayDate, setCurrentMonthFirstDayDate]);
-    var getCalendarArray = react_1["default"].useCallback(function () {
-        var calendarArray = [];
-        var _a = getCurrentMonthDataUTC(), firstDayOfCurrentMonth = _a.firstDayOfCurrentMonth, month = _a.currentMonth, daysInCurrentMonth = _a.daysInCurrentMonth;
-        var firstWeekInMonth = (0, utils_1.getWeekDaysFromDate)(firstDayOfCurrentMonth);
-        firstWeekInMonth.forEach(function (day) { return calendarArray.push({
+    }, [generalCurrentDay.date]);
+    var calendarArray = (0, react_1.useMemo)(function () {
+        var innerCalendarArray = [];
+        var firstDateOfCurrentMonth = currentMonthData.firstDateOfCurrentMonth, currentMonth = currentMonthData.currentMonth, daysInCurrentMonth = currentMonthData.daysInCurrentMonth;
+        var firstWeekInMonth = (0, utils_1.getWeekDaysFromDate)(firstDateOfCurrentMonth);
+        firstWeekInMonth.forEach(function (day) { return innerCalendarArray.push({
             date: day.date,
             dayNumber: day.dayNumber,
-            outOfRange: day.date.getMonth() < month
+            outOfRange: day.date.getMonth() < currentMonth
         }); });
         daysInCurrentMonth.forEach(function (day) {
-            var existingDay = calendarArray.find(function (item) { return item.date.getTime() === day.date.getTime(); });
+            var existingDay = innerCalendarArray.find(function (item) { return item.date.getTime() === day.date.getTime(); });
             if (!existingDay) {
-                calendarArray.push({
+                innerCalendarArray.push({
                     date: day.date,
                     dayNumber: day.dayNumber,
                     outOfRange: false
                 });
             }
         });
-        var daysAfterCurrentMonth = TOTAL_DAYS_IN_CALENDAR - calendarArray.length;
+        var daysAfterCurrentMonth = TOTAL_DAYS_IN_CALENDAR - innerCalendarArray.length;
         for (var i = 1; i <= daysAfterCurrentMonth; i++) {
-            var currentDate = new Date(currentMonthFirstDayDate === null || currentMonthFirstDayDate === void 0 ? void 0 : currentMonthFirstDayDate.getFullYear(), month + 1, i);
-            calendarArray.push({
+            var currentDate = new Date(generalCurrentDay.date.getFullYear(), currentMonth + 1, i);
+            innerCalendarArray.push({
                 date: currentDate,
                 dayNumber: currentDate.getDate(),
-                outOfRange: currentDate.getMonth() > month
+                outOfRange: currentDate.getMonth() > currentMonth
             });
         }
-        return calendarArray.map(function (day) { return (0, utils_1.isDateIsToday)(day.date) ? (__assign(__assign({}, day), { isToday: true })) : day; });
-    }, [currentMonthFirstDayDate, getCurrentMonthDataUTC]);
-    var weekDays = react_1["default"].useMemo(function () {
-        var unformattedDaysOfWeek = dayjs_1["default"].weekdaysMin();
-        return (0, concat_1["default"])((0, slice_1["default"])(unformattedDaysOfWeek, 1), unformattedDaysOfWeek[0]).map(function (weekDay) { return __("".concat((0, upperFirst_1["default"])(weekDay))); });
-    }, []);
+        return innerCalendarArray.map(function (day) { return (0, utils_1.isDateIsToday)(day.date) ? (__assign(__assign({}, day), { isToday: true })) : day; });
+    }, [generalCurrentDay.date, currentMonthData]);
     return {
-        monthGridWeekDays: weekDays,
-        monthGridCalendarDays: getCalendarArray(),
-        getCalendarArray: getCalendarArray,
-        getCurrentMonthDataUTC: getCurrentMonthDataUTC,
-        getWeekFromDate: utils_1.getWeekDaysFromDate
+        monthGridWeekDays: (0, utils_1.getWeekDays)(),
+        monthGridCalendarDays: calendarArray
     };
 };
 exports["default"] = useMonthGrid;

package/ui/content/CalendarSystem/hooks/useWeekGrid.d.ts

@@ -1,6 +1,6 @@
-import DateControlEnum from '../enums/DateControlType';
-declare const useWeekGrid: (currentMonthFirstDayDate: Date) => {
-    weekGridTwentyFourHoursArray: any[];
+import { IDay } from '../CalendarSystem';
+declare const useWeekGrid: (generalCurrentDay: IDay) => {
+    weekGridTwentyFourHoursArray: string[];
     weekGridCurrentWeekDays: {
         dayNumber: number;
         date: Date;
@@ -8,9 +8,5 @@ declare const useWeekGrid: (currentMonthFirstDayDate: Date) => {
         isToday?: boolean;
         formattedDisplay?: string;
     }[];
-    weekGridControls: {
-        [key: string]: () => void | DateControlEnum;
-    };
-    updateWeekOnMonthChange: (newMonthDate: Date) => void;
 };
 export default useWeekGrid;

package/ui/content/CalendarSystem/hooks/useWeekGrid.js

@@ -1,72 +1,15 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 exports.__esModule = true;
-/* eslint-disable no-plusplus */
-var react_1 = __importDefault(require("react"));
-var dayjs_1 = __importDefault(require("dayjs"));
-var DateControlType_1 = __importDefault(require("../enums/DateControlType"));
+var react_1 = require("react");
 var utils_1 = require("../utils/utils");
-var ONE_DAY = 1;
-var getTwentyFourHoursArray = function () {
-    var hoursArray = [];
-    for (var i = 0; i < 24; i++) {
-        var formattedHour = (0, dayjs_1["default"])().startOf('day').add(i, 'hour').format('HH:00');
-        hoursArray.push(formattedHour);
-    }
-    return hoursArray;
-};
-var useWeekGrid = function (currentMonthFirstDayDate) {
-    var _a;
-    var _b = react_1["default"].useState((0, utils_1.getFormattedWeekFromDate)()), currentWeek = _b[0], setCurrentWeek = _b[1];
-    var updateWeekOnMonthChange = react_1["default"].useCallback(function (newMonthDate) {
-        setCurrentWeek((0, utils_1.getFormattedWeekFromDate)(newMonthDate));
-    }, []);
-    var changeMonthAfterWeekChanged = react_1["default"].useCallback(function (formattedWeek) {
-        var firstDayOfWeek = formattedWeek[0].date;
-        var currentMonthNumber = currentMonthFirstDayDate.getMonth();
-        var isWeekOutOfMonth = formattedWeek.every(function (dayOfWeek) { return dayOfWeek.date.getMonth() !== currentMonthNumber; });
-        if (!isWeekOutOfMonth) {
-            return;
-        }
-        if (currentMonthNumber - firstDayOfWeek.getMonth() === 1) {
-            var lastDayOfWeekInNewMonth = formattedWeek[formattedWeek.length - 1].date;
-            var prevMonthControl = (0, utils_1.getSourceCalendarControl)(DateControlType_1["default"].PREV_ONE);
-            prevMonthControl.click();
-            updateWeekOnMonthChange(lastDayOfWeekInNewMonth);
-        }
-        else {
-            var firstDayOfWeekInNewMonth = formattedWeek[0].date;
-            var nextMonthControl = (0, utils_1.getSourceCalendarControl)(DateControlType_1["default"].NEXT_ONE);
-            nextMonthControl.click();
-            updateWeekOnMonthChange(firstDayOfWeekInNewMonth);
-        }
-    }, [currentMonthFirstDayDate, updateWeekOnMonthChange]);
-    var setNextWeek = react_1["default"].useCallback(function () {
-        var lastDayOfWeek = currentWeek[currentWeek.length - 1].date;
-        lastDayOfWeek.setDate(lastDayOfWeek.getDate() + ONE_DAY);
-        var formattedNextWeek = (0, utils_1.getFormattedWeekFromDate)(lastDayOfWeek);
-        setCurrentWeek(formattedNextWeek);
-        changeMonthAfterWeekChanged(formattedNextWeek);
-    }, [currentWeek, changeMonthAfterWeekChanged]);
-    var setPrevWeek = react_1["default"].useCallback(function () {
-        var firstDayOfWeek = currentWeek[0].date;
-        firstDayOfWeek.setDate(firstDayOfWeek.getDate() - ONE_DAY);
-        var formattedPrevWeek = (0, utils_1.getFormattedWeekFromDate)(firstDayOfWeek);
-        setCurrentWeek(formattedPrevWeek);
-        changeMonthAfterWeekChanged(formattedPrevWeek);
-    }, [currentWeek, changeMonthAfterWeekChanged]);
+var useWeekGrid = function (generalCurrentDay) {
+    var currentWeek = (0, react_1.useMemo)(function () {
+        var formattedWeek = (0, utils_1.getFormattedWeekFromDate)(generalCurrentDay.date);
+        return formattedWeek;
+    }, [generalCurrentDay.date]);
     return {
-        weekGridTwentyFourHoursArray: getTwentyFourHoursArray(),
-        weekGridCurrentWeekDays: currentWeek,
-        weekGridControls: (_a = {},
-            _a[DateControlType_1["default"].NEXT_DOUBLE] = DateControlType_1["default"].NEXT_ONE,
-            _a[DateControlType_1["default"].NEXT_ONE] = setNextWeek,
-            _a[DateControlType_1["default"].PREV_ONE] = setPrevWeek,
-            _a[DateControlType_1["default"].PREV_DOUBLE] = DateControlType_1["default"].PREV_ONE,
-            _a),
-        updateWeekOnMonthChange: updateWeekOnMonthChange
+        weekGridTwentyFourHoursArray: (0, utils_1.getTwentyFourHoursArray)(),
+        weekGridCurrentWeekDays: currentWeek
     };
 };
 exports["default"] = useWeekGrid;

package/ui/content/CalendarSystem/utils/utils.d.ts

@@ -1,9 +1,11 @@
+import { CSSProperties } from 'react';
 import { IDay, IEvent, IEventGroup } from '../CalendarSystem';
 export declare const getWeekDaysFromDate: (date: Date) => IDay[];
 export declare const isDateIsToday: (date: Date) => boolean;
 export declare const getOmittedEvent: (event: IEvent | Omit<IEvent, 'color'>) => any;
 export declare const sortEventsInGroup: (group: IEventGroup) => Omit<IEvent, "color">[];
 export declare const getSourceCalendarControl: (control: string) => HTMLElement;
+export declare const getFormattedDay: (date?: Date) => IDay;
 export declare const getFormattedWeekFromDate: (fromDate?: Date) => {
     dayNumber: number;
     date: Date;
@@ -11,3 +13,8 @@ export declare const getFormattedWeekFromDate: (fromDate?: Date) => {
     isToday?: boolean;
     formattedDisplay?: string;
 }[];
+export declare const getTwentyFourHoursArray: () => string[];
+export declare const getWeekDays: () => any;
+export declare const getProportionFromEvent: (event: IEvent) => number;
+export declare const getTopMarginFromEvent: (event: IEvent) => CSSProperties;
+export declare const formatEventTime: (date: Date) => any;