fix: do not print undefined class names in TimelineHeaders

Closes #566

Author: trevdor

package.json

@@ -112,6 +112,7 @@
     "babel-plugin-transform-object-rest-spread": "^6.26.0",
     "babel-preset-env": "1.7.0",
     "babel-preset-react": "^6.5.0",
+    "classnames": "^2.2.6",
     "cross-env": "^5.1.4",
     "css-loader": "~0.26.0",
     "enzyme": "^3.3.0",

src/lib/headers/TimelineHeaders.js

@@ -1,4 +1,5 @@
 import React from 'react'
+import classNames from 'classnames';
 import { TimelineHeadersConsumer } from './HeadersContext'
 import PropTypes from 'prop-types'
 import SidebarHeader from './SidebarHeader'
@@ -75,13 +76,16 @@ class TimelineHeaders extends React.Component {
         ref={this.handleRootRef}
         data-testid="headerRootDiv"
         style={this.getRootStyle()}
-        className={`rct-header-root ${this.props.className}`}
+        className={classNames('rct-header-root', this.props.className)}
       >
         {leftSidebarHeader}
         <div
           ref={this.props.registerScroll}
           style={this.getCalendarHeaderStyle()}
-          className={`rct-calendar-header ${this.props.calendarHeaderClassName}`}
+          className={classNames(
+            'rct-calendar-header',
+            this.props.calendarHeaderClassName
+          )}
           data-testid="headerContainer"
         >
           {calendarHeaders}