Add Minutes to Header in Day View instead of only showing hours.

[rahul-mahato]

Hi! 👋

Firstly, thanks for your work on this project! 🙂

Today I used patch-package to patch react-big-scheduler@0.2.7 for the project I'm working on.

I needed to add minutes to the header, which was not there in the config. So I added a config key showMinutes which takes a boolean value and based on the config showMinutes now it adds minutes into the header. [ SS attached below ]

Here is the diff that solved my problem:

diff --git a/node_modules/react-big-scheduler/lib/HeaderView.js b/node_modules/react-big-scheduler/lib/HeaderView.js
index ce3e02b..3a2074b 100644
--- a/node_modules/react-big-scheduler/lib/HeaderView.js
+++ b/node_modules/react-big-scheduler/lib/HeaderView.js
@@ -47,16 +47,16 @@ var HeaderView = (_temp = _class = function (_Component) {
             var headerHeight = schedulerData.getTableHeaderHeight();
             var cellWidth = schedulerData.getContentCellWidth();
             var minuteStepsInHour = schedulerData.getMinuteStepsInHour();
-
+            var showMinutes= config.showMinutes;
             var headerList = [];
             var style = {};
-            if (cellUnit === _index.CellUnits.Hour) {
+            if ( cellUnit === _index.CellUnits.Hour) {
                 headers.forEach(function (item, index) {
-                    if (index % minuteStepsInHour === 0) {
+                    if (showMinutes || index % minuteStepsInHour === 0) {
                         var datetime = localeMoment(item.time);
                         var isCurrentTime = datetime.isSame(new Date(), 'hour');

-                        style = !!item.nonWorkingTime ? { width: cellWidth * minuteStepsInHour, color: config.nonWorkingTimeHeadColor, backgroundColor: config.nonWorkingTimeHeadBgColor } : { width: cellWidth * minuteStepsInHour };
+                        style = !!item.nonWorkingTime ? { width: showMinutes ? cellWidth : cellWidth * minuteStepsInHour, color: config.nonWorkingTimeHeadColor, backgroundColor: config.nonWorkingTimeHeadBgColor } : { width: showMinutes ? cellWidth : cellWidth * minuteStepsInHour };

                         if (index === headers.length - minuteStepsInHour) style = !!item.nonWorkingTime ? { color: config.nonWorkingTimeHeadColor, backgroundColor: config.nonWorkingTimeHeadBgColor } : {};

This issue body was partially generated by patch-package.

[malith-gammanpila]

Hi Rahul, can you share the full code, please?