Refactoring

Author: onurkerimov

src/components/DayCell/index.js

@@ -150,7 +150,6 @@ class DayCell extends Component {
     ));
   };
   render() {
-    const { styles } = this.props;
     return (
       <button
         type="button"
@@ -163,12 +162,12 @@ class DayCell extends Component {
         onPauseCapture={this.handleMouseEvent}
         onKeyDown={this.handleKeyEvent}
         onKeyUp={this.handleKeyEvent}
-        className={this.getClassNames(styles)}
+        className={this.getClassNames(this.props.styles)}
         {...(this.props.disabled || this.props.isPassive ? { tabIndex: -1 } : {})}
         style={{ color: this.props.color }}>
         {this.renderSelectionPlaceholders()}
         {this.renderPreviewPlaceholder()}
-        <span className={styles.dayNumber}>
+        <span className={this.props.styles.dayNumber}>
           <span>{format(this.props.day, this.props.dayDisplayFormat)}</span>
         </span>
       </button>

src/components/DefinedRange/index.js

@@ -45,13 +45,23 @@ class DefinedRange extends Component {
   }
 
   render() {
-    const { onPreviewChange, ranges, renderStaticRangeLabel, rangeColors, className } = this.props;
+    const {
+      headerContent,
+      footerContent,
+      onPreviewChange,
+      inputRanges,
+      staticRanges,
+      ranges,
+      renderStaticRangeLabel,
+      rangeColors,
+      className,
+    } = this.props;
 
     return (
       <div className={cx(styles.definedRangesWrapper, className)}>
-        {this.props.headerContent}
+        {headerContent}
         <div className={styles.staticRanges}>
-          {this.props.staticRanges.map((staticRange, i) => {
+          {staticRanges.map((staticRange, i) => {
             const { selectedRange, focusedRangeIndex } = this.getSelectedRange(ranges, staticRange);
             let labelContent;
 
@@ -79,7 +89,7 @@ class DefinedRange extends Component {
                   onPreviewChange && onPreviewChange(staticRange.range(this.props))
                 }
                 onMouseLeave={() => {
-                  this.props.onPreviewChange && this.props.onPreviewChange();
+                  onPreviewChange && onPreviewChange();
                 }}>
                 <span tabIndex={-1} className={styles.staticRangeLabel}>
                   {labelContent}
@@ -89,7 +99,7 @@ class DefinedRange extends Component {
           })}
         </div>
         <div className={styles.inputRanges}>
-          {this.props.inputRanges.map((rangeOption, i) => (
+          {inputRanges.map((rangeOption, i) => (
             <InputRangeField
               key={i}
               styles={styles}
@@ -101,7 +111,7 @@ class DefinedRange extends Component {
             />
           ))}
         </div>
-        {this.props.footerContent}
+        {footerContent}
       </div>
     );
   }