Reports page design changes

package.json

@@ -126,6 +126,7 @@
     "react-pose": "4.0.8",
     "react-router-dom": "5.0.0",
     "react-transition-group": "2.4.0",
+    "react-window": "^1.8.3",
     "sinon": "7.2.2",
     "smartcharts-beta": "0.4.36",
     "tt-react-custom-scrollbars": "4.2.1-tt2",

src/javascript/app/App/Components/Elements/Calendar/calendar-footer.jsx

@@ -3,13 +3,16 @@ import React        from 'react';
 import Icon         from 'Assets/icon.jsx';
 import { localize } from '_common/localize';
 
+const FooterIcon = (use_icon) => use_icon || 'IconCalendarToday';
+
 const CalendarFooter = ({
     footer,
     has_today_btn,
     has_range_selection,
     duration_date,
     is_minimum,
     onClick,
+    use_icon,
 }) => (
     <React.Fragment>
         { (has_today_btn || footer || has_range_selection) &&
@@ -18,7 +21,7 @@ const CalendarFooter = ({
                 { has_range_selection && <span className='calendar__text'>{ `${!is_minimum ? localize('Duration: ') : ''}${duration_date}` }</span> }
                 { has_today_btn &&
                     <Icon
-                        icon='IconCalendarToday'
+                        icon={FooterIcon(use_icon)}
                         className='calendar__icon'
                         onClick={onClick}
                     />
@@ -35,6 +38,7 @@ CalendarFooter.propTypes = {
     has_today_btn      : PropTypes.bool,
     is_minimum         : PropTypes.bool,
     onClick            : PropTypes.func,
+    use_icon           : PropTypes.string,
 };
 
 export default CalendarFooter;