diff --git a/CHANGELOG.md b/CHANGELOG.md index 98cb6a4..8d43619 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,11 @@ +## [4.3.4](https://github.com/react-scheduler/react-big-schedule/compare/4.3.3...4.3.4) + +`2024-02-21` + +- Updated `node_modules` version by [@ansulagrawal](https://github.com/ansulagrawal) in [#132](https://github.com/react-scheduler/react-big-schedule/pull/132). +- Fix Issue of Displaying hour headers properly in ViewType.Da by [@ansulagrawal](https://github.com/ansulagrawal) in [#131](https://github.com/react-scheduler/react-big-schedule/pull/131). +- Bump webpack-dev-server from 4.15.1 to 5.0.2 by [@dependabot](https://github.com/dependabot) in [#130](https://github.com/react-scheduler/react-big-schedule/pull/130). + ## [4.3.3](https://github.com/react-scheduler/react-big-schedule/compare/4.3.2...4.3.3) `2023-12-16` diff --git a/SECURITY.md b/SECURITY.md index 9b4eb88..ab99966 100644 --- a/SECURITY.md +++ b/SECURITY.md @@ -7,7 +7,7 @@ We take the security of react-big-schedule seriously. If you believe you have fo | Version | Supported | | --------| --------- | -| 4.3.1 | :white_check_mark: | +| 4.3.2 or grater | :white_check_mark: | | 4.2.5 | :white_check_mark: | | rest all | :x: | diff --git a/package.json b/package.json index 634696e..f2d300c 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "react-big-schedule", - "version": "4.3.3", + "version": "4.3.4", "description": "React Big Schedule is a powerful and intuitive scheduler and resource planning solution built with React. Seamlessly integrate this modern browser-compatible component into your applications to effectively manage time, appointments, and resources. With drag-and-drop functionality, interactive UI, and granular views, react-big-schedule empowers users to effortlessly schedule and allocate resources with precision. Enhance productivity and streamline your workflow with this React-based solution, designed to optimize time management and simplify calendar-based operations. Perfect for applications requiring advanced scheduling capabilities, react-big-schedule offers a seamless and intuitive experience for managing appointments, resource allocation, and time slots. Unlock the potential of your React projects with react-big-schedule and revolutionize the way you handle scheduling and resource planning. It is the updated version of react-big-scheduler", "keywords": [ "react-big-schedule", @@ -59,8 +59,8 @@ "fix": "eslint ./" }, "dependencies": { - "@ant-design/icons": "^5.2.6", - "antd": "^5.12.2", + "@ant-design/icons": "^5.3.0", + "antd": "^5.14.1", "dayjs": "^1.11.10", "prop-types": "^15.8.1", "react": "^18.2.0", @@ -70,14 +70,14 @@ "rrule": "^2.8.1" }, "devDependencies": { - "@babel/cli": "^7.23.4", - "@babel/core": "^7.23.6", - "@babel/eslint-parser": "^7.23.3", - "@babel/preset-env": "^7.23.6", + "@babel/cli": "^7.23.9", + "@babel/core": "^7.23.9", + "@babel/eslint-parser": "^7.23.10", + "@babel/preset-env": "^7.23.9", "@babel/preset-react": "^7.23.3", "babel-loader": "^9.1.3", - "copy-webpack-plugin": "^11.0.0", - "css-loader": "^6.8.1", + "copy-webpack-plugin": "^12.0.2", + "css-loader": "^6.10.0", "eslint": "^8.56.0", "eslint-config-airbnb": "^19.0.4", "eslint-plugin-import": "^2.29.1", @@ -86,10 +86,10 @@ "eslint-plugin-react-hooks": "^4.6.0", "eslint-webpack-plugin": "^4.0.1", "fs-extra": "^11.2.0", - "html-webpack-plugin": "^5.5.4", - "style-loader": "^3.3.3", - "webpack": "^5.89.0", + "html-webpack-plugin": "^5.6.0", + "style-loader": "^3.3.4", + "webpack": "^5.90.3", "webpack-cli": "^5.1.4", - "webpack-dev-server": "^4.15.1" + "webpack-dev-server": "^5.0.2" } } diff --git a/src/components/SchedulerData.js b/src/components/SchedulerData.js index 25d7b51..44089a3 100644 --- a/src/components/SchedulerData.js +++ b/src/components/SchedulerData.js @@ -657,124 +657,126 @@ export default class SchedulerData { } // Previous Code - // _createHeaders() { - // const headers = []; - // let start = this.localeDayjs(new Date(this.startDate)); - // let end = this.localeDayjs(new Date(this.endDate)); - // let header = start; - - // if (this.showAgenda) { - // headers.push({ time: header.format(DATETIME_FORMAT), nonWorkingTime: false }); - // } else if (this.cellUnit === CellUnit.Hour) { - // if (start.hour() === 0) { - // start = start.add(this.config.dayStartFrom, 'hours'); - // } - // if (end.hour() === 0) { - // end = end.add(this.config.dayStopTo, 'hours'); - // } - // header = start; - - // let prevHour = -1; - // while (header >= start && header <= end) { - // // prevent doubled hours on time change - // if (header.hour() === prevHour) { - // header = header.add(1, 'hours'); - // continue; - // } - // prevHour = header.hour(); - // const minuteSteps = this.getMinuteStepsInHour(); - // for (let i = 0; i < minuteSteps; i++) { - // const hour = header.hour(); - // if (hour >= this.config.dayStartFrom && hour <= this.config.dayStopTo) { - // const time = header.format(DATETIME_FORMAT); - // const nonWorkingTime = this.behaviors.isNonWorkingTimeFunc(this, time); - // headers.push({ time, nonWorkingTime }); - // } - - // header = header.add(this.config.minuteStep, 'minutes'); - // } - // } - // } else if (this.cellUnit === CellUnit.Day) { - // while (header >= start && header <= end) { - // const time = header.format(DATETIME_FORMAT); - // const dayOfWeek = header.weekday(); - // if (this.config.displayWeekend || (dayOfWeek !== 0 && dayOfWeek !== 6)) { - // const nonWorkingTime = this.behaviors.isNonWorkingTimeFunc(this, time); - // headers.push({ time, nonWorkingTime }); - // } - - // header = header.add(1, 'days'); - // } - // } else if (this.cellUnit === CellUnit.Week) { - // while (header >= start && header <= end) { - // const time = header.format(DATE_FORMAT); - // headers.push({ time }); - // header = header.add(1, 'weeks').startOf('week'); - // } - // } else if (this.cellUnit === CellUnit.Month) { - // while (header >= start && header <= end) { - // const time = header.format(DATE_FORMAT); - // headers.push({ time }); - // header = header.add(1, 'months').startOf('month'); - // } - // } else if (this.cellUnit === CellUnit.Year) { - // while (header >= start && header <= end) { - // const time = header.format(DATE_FORMAT); - // headers.push({ time }); - // header = header.add(1, 'years').startOf('year'); - // } - // } - - // this.headers = headers; - // } - _createHeaders() { const headers = []; - const start = this.localeDayjs(new Date(this.startDate)); - const end = this.localeDayjs(new Date(this.endDate)); + let start = this.localeDayjs(new Date(this.startDate)); + let end = this.localeDayjs(new Date(this.endDate)); + let header = start; - const processHeader = (header, format, unit, incrementFn) => { - let head = header; - while (head >= start && head <= end) { - const time = head.format(format); - if (unit === CellUnit.Day) { - const dayOfWeek = head.weekday(); - if (this.config.displayWeekend || (dayOfWeek !== 0 && dayOfWeek !== 6)) { + if (this.showAgenda) { + headers.push({ time: header.format(DATETIME_FORMAT), nonWorkingTime: false }); + } else if (this.cellUnit === CellUnit.Hour) { + if (start.hour() === 0) { + start = start.add(this.config.dayStartFrom, 'hours'); + } + if (end.hour() === 0) { + end = end.add(this.config.dayStopTo, 'hours'); + } + header = start; + + let prevHour = -1; + while (header >= start && header <= end) { + // prevent doubled hours on time change + if (header.hour() === prevHour) { + header = header.add(1, 'hours'); + // eslint-disable-next-line no-continue + continue; + } + prevHour = header.hour(); + const minuteSteps = this.getMinuteStepsInHour(); + for (let i = 0; i < minuteSteps; i += 1) { + const hour = header.hour(); + if (hour >= this.config.dayStartFrom && hour <= this.config.dayStopTo) { + const time = header.format(DATETIME_FORMAT); const nonWorkingTime = this.behaviors.isNonWorkingTimeFunc(this, time); headers.push({ time, nonWorkingTime }); } - } else { - headers.push({ time }); + + header = header.add(this.config.minuteStep, 'minutes'); } - head = head.add(1, incrementFn); } - }; - - if (this.showAgenda) { - headers.push({ time: start.format(DATETIME_FORMAT), nonWorkingTime: false }); - } else if (this.cellUnit === CellUnit.Hour) { - const hourIncrement = this.config.minuteStep < 60 ? 'minutes' : 'hours'; - const minuteSteps = this.getMinuteStepsInHour(); - let header = start.hour() === 0 ? start.add(this.config.dayStartFrom, 'hours') : start; - while (header <= end) { - const hour = header.hour(); - if (hour >= this.config.dayStartFrom && hour <= this.config.dayStopTo) { - const time = header.format(DATETIME_FORMAT); + } else if (this.cellUnit === CellUnit.Day) { + while (header >= start && header <= end) { + const time = header.format(DATETIME_FORMAT); + const dayOfWeek = header.weekday(); + if (this.config.displayWeekend || (dayOfWeek !== 0 && dayOfWeek !== 6)) { const nonWorkingTime = this.behaviors.isNonWorkingTimeFunc(this, time); headers.push({ time, nonWorkingTime }); } - header = header.add(minuteSteps, hourIncrement); + + header = header.add(1, 'days'); + } + } else if (this.cellUnit === CellUnit.Week) { + while (header >= start && header <= end) { + const time = header.format(DATE_FORMAT); + headers.push({ time }); + header = header.add(1, 'weeks').startOf('week'); + } + } else if (this.cellUnit === CellUnit.Month) { + while (header >= start && header <= end) { + const time = header.format(DATE_FORMAT); + headers.push({ time }); + header = header.add(1, 'months').startOf('month'); + } + } else if (this.cellUnit === CellUnit.Year) { + while (header >= start && header <= end) { + const time = header.format(DATE_FORMAT); + headers.push({ time }); + header = header.add(1, 'years').startOf('year'); } - } else { - const header = start; - const format = this.cellUnit === CellUnit.Day ? DATETIME_FORMAT : DATE_FORMAT; - const incrementFn = this.cellUnit === CellUnit.Day ? 'days' : `${this.cellUnit}s`; - processHeader(header, format, this.cellUnit, incrementFn); } this.headers = headers; } + // Fix Optimited code + // _createHeaders() { + // const headers = []; + // const start = this.localeDayjs(new Date(this.startDate)); + // const end = this.localeDayjs(new Date(this.endDate)); + + // const processHeader = (header, format, unit, incrementFn) => { + // let head = header; + // while (head >= start && head <= end) { + // const time = head.format(format); + // if (unit === CellUnit.Day) { + // const dayOfWeek = head.weekday(); + // if (this.config.displayWeekend || (dayOfWeek !== 0 && dayOfWeek !== 6)) { + // const nonWorkingTime = this.behaviors.isNonWorkingTimeFunc(this, time); + // headers.push({ time, nonWorkingTime }); + // } + // } else { + // headers.push({ time }); + // } + // head = head.add(1, incrementFn); + // } + // }; + + // if (this.showAgenda) { + // headers.push({ time: start.format(DATETIME_FORMAT), nonWorkingTime: false }); + // } else if (this.cellUnit === CellUnit.Hour) { + // const hourIncrement = this.config.minuteStep < 60 ? 'minutes' : 'hours'; + // const minuteSteps = this.getMinuteStepsInHour(); + // let header = start.hour() === 0 ? start.add(this.config.dayStartFrom, 'hours') : start; + // while (header <= end) { + // const hour = header.hour(); + // if (hour >= this.config.dayStartFrom && hour <= this.config.dayStopTo) { + // const time = header.format(DATETIME_FORMAT); + // const nonWorkingTime = this.behaviors.isNonWorkingTimeFunc(this, time); + // headers.push({ time, nonWorkingTime }); + // } + // header = header.add(minuteSteps, hourIncrement); + // } + // } else { + // const header = start; + // const format = this.cellUnit === CellUnit.Day ? DATETIME_FORMAT : DATE_FORMAT; + // const incrementFn = this.cellUnit === CellUnit.Day ? 'days' : `${this.cellUnit}s`; + // processHeader(header, format, this.cellUnit, incrementFn); + // } + + // this.headers = headers; + // } + _createInitHeaderEvents(header) { const start = this.localeDayjs(new Date(header.time)); const startValue = start.format(DATETIME_FORMAT); diff --git a/webpack/webpack.dev.config.js b/webpack/webpack.dev.config.js index c68e0c8..f590e1e 100644 --- a/webpack/webpack.dev.config.js +++ b/webpack/webpack.dev.config.js @@ -1,3 +1,4 @@ +/* eslint-disable import/no-extraneous-dependencies */ const path = require('path'); const HtmlWebpackPlugin = require('html-webpack-plugin'); const ESLintWebpackPlugin = require('eslint-webpack-plugin');