feat: add ability to set custom resource headers (#1187)

Add an ability to set a custom resource headers. For #1174

src/ResourceHeader.js

@@ -0,0 +1,14 @@
+import PropTypes from 'prop-types'
+import React from 'react'
+
+const ResourceHeader = ({ label }) => {
+  return <React.Fragment>{label}</React.Fragment>
+}
+
+ResourceHeader.propTypes = {
+  label: PropTypes.node,
+  index: PropTypes.number,
+  resource: PropTypes.object,
+}
+
+export default ResourceHeader

src/TimeGridHeader.js

@@ -6,6 +6,7 @@ import React from 'react'
 import dates from './utils/dates'
 import DateContentRow from './DateContentRow'
 import Header from './Header'
+import ResourceHeader from './ResourceHeader'
 import { notify } from './utils/helpers'
 
 class TimeGridHeader extends React.Component {
@@ -116,7 +117,10 @@ class TimeGridHeader extends React.Component {
       scrollRef,
       localizer,
       isOverflowing,
-      components: { timeGutterHeader: TimeGutterHeader },
+      components: {
+        timeGutterHeader: TimeGutterHeader,
+        resourceHeader: ResourceHeaderComponent = ResourceHeader,
+      },
     } = this.props
 
     let style = {}
@@ -142,9 +146,13 @@ class TimeGridHeader extends React.Component {
         {resources.map(([id, resource], idx) => (
           <div className="rbc-time-header-content" key={id || idx}>
             {resource && (
-              <div className="rbc-row rbc-row-resource">
-                <div key={`resource_${idx}`} className="rbc-header">
-                  {accessors.resourceTitle(resource)}
+              <div className="rbc-row rbc-row-resource" key={`resource_${idx}`}>
+                <div className="rbc-header">
+                  <ResourceHeaderComponent
+                    index={idx}
+                    label={accessors.resourceTitle(resource)}
+                    resource={resource}
+                  />
                 </div>
               </div>
             )}

src/less/time-grid.less

@@ -94,6 +94,11 @@
     border-left-width: 0;
     border-right: 1px solid @cell-border;
   }
+
+  >.rbc-row.rbc-row-resource {
+      border-bottom: 1px solid @cell-border;
+      flex-shrink: 0;
+  }
 }
 
 .rbc-time-content {