From 9d2d085aee8fb0ed5fd5bb63830887011e8093ed Mon Sep 17 00:00:00 2001
From: Ron Rennick <ron@ronandandrea.com>
Date: Fri, 23 Aug 2019 15:34:44 -0300
Subject: [PATCH] handle offset attribute and children

---
 .../client/analytics/settings/index.js        |  9 +++++--
 .../components/src/scroll-to/index.js         | 24 +++++++++++++++----
 2 files changed, 27 insertions(+), 6 deletions(-)

diff --git a/plugins/woocommerce-admin/client/analytics/settings/index.js b/plugins/woocommerce-admin/client/analytics/settings/index.js
index a078f6ac925..dc30437dcbb 100644
--- a/plugins/woocommerce-admin/client/analytics/settings/index.js
+++ b/plugins/woocommerce-admin/client/analytics/settings/index.js
@@ -190,8 +190,13 @@ class Settings extends Component {
 						</Button>
 					</div>
 				</div>
-				{ query.import === 'true' ? <ScrollTo /> : '' }
-				<HistoricalData createNotice={ createNotice } />
+				{ query.import === 'true' ? (
+					<ScrollTo offset="-56">
+						<HistoricalData createNotice={ createNotice } />
+					</ScrollTo>
+				) : (
+					<HistoricalData createNotice={ createNotice } />
+				) }
 			</Fragment>
 		);
 	}
diff --git a/plugins/woocommerce-admin/packages/components/src/scroll-to/index.js b/plugins/woocommerce-admin/packages/components/src/scroll-to/index.js
index 07e829497e5..27871649a24 100644
--- a/plugins/woocommerce-admin/packages/components/src/scroll-to/index.js
+++ b/plugins/woocommerce-admin/packages/components/src/scroll-to/index.js
@@ -3,10 +3,11 @@
  * External dependencies
  */
 import { Component, createRef } from '@wordpress/element';
+import PropTypes from 'prop-types';
 
 class ScrollTo extends Component {
-	constructor() {
-		super();
+	constructor( props ) {
+		super( props );
 		this.scrollTo = this.scrollTo.bind( this );
 	}
 
@@ -15,19 +16,34 @@ class ScrollTo extends Component {
 	}
 
 	scrollTo() {
+		const { offset } = this.props;
 		if ( this.ref.current && this.ref.current.offsetTop ) {
-			window.scrollTo( 0, this.ref.current.offsetTop );
+			window.scrollTo( 0, this.ref.current.offsetTop + parseInt( offset ) );
 		} else {
 			setTimeout( this.scrollTo, 250 );
 		}
 	}
 
 	render() {
+		const { children } = this.props;
 		this.ref = createRef();
 		return (
-			<span ref={ this.ref }></span>
+			<span ref={ this.ref }>
+				{ children }
+			</span>
 		);
 	}
 }
 
+ScrollTo.propTypes = {
+	/**
+	 * The offset from the top of the component.
+	 */
+	offset: PropTypes.string,
+};
+
+ScrollTo.defaultProps = {
+	offset: '0',
+};
+
 export default ScrollTo;