From 93f0f33e84c8ec4bc79fe55444eb8ddb3ab764b7 Mon Sep 17 00:00:00 2001
From: ta264 <ta264@users.noreply.github.com>
Date: Thu, 13 May 2021 21:15:11 +0100
Subject: [PATCH] Fixed: restoring scroll position when going back to index
 page

---
 frontend/src/Author/Details/AuthorDetails.js     |  5 ++++-
 .../Author/Index/Banners/AuthorIndexBanners.js   |  8 +++++++-
 .../Index/Overview/AuthorIndexOverviews.js       |  7 ++++++-
 .../Author/Index/Posters/AuthorIndexPosters.js   |  8 +++++++-
 .../src/Author/Index/Table/AuthorIndexTable.js   |  5 ++++-
 frontend/src/Components/Link/Link.js             | 16 ++++++++++++++--
 .../src/Components/Page/Header/PageHeader.js     |  5 ++++-
 frontend/src/Components/Table/VirtualTable.js    |  7 +++++++
 frontend/src/Components/withScrollPosition.js    |  2 +-
 9 files changed, 54 insertions(+), 9 deletions(-)

diff --git a/frontend/src/Author/Details/AuthorDetails.js b/frontend/src/Author/Details/AuthorDetails.js
index 2a6e743fc..9db384f17 100644
--- a/frontend/src/Author/Details/AuthorDetails.js
+++ b/frontend/src/Author/Details/AuthorDetails.js
@@ -268,7 +268,10 @@ class AuthorDetails extends Component {
                 name={icons.ARROW_UP}
                 size={30}
                 title={translate('GoToAuthorListing')}
-                to={'/'}
+                to={{
+                  pathname: '/',
+                  state: { restoreScrollPosition: true }
+                }}
               />
 
               <IconButton
diff --git a/frontend/src/Author/Index/Banners/AuthorIndexBanners.js b/frontend/src/Author/Index/Banners/AuthorIndexBanners.js
index a36327cfe..e7dd49135 100644
--- a/frontend/src/Author/Index/Banners/AuthorIndexBanners.js
+++ b/frontend/src/Author/Index/Banners/AuthorIndexBanners.js
@@ -112,7 +112,8 @@ class AuthorIndexBanners extends Component {
       items,
       sortKey,
       bannerOptions,
-      jumpToCharacter
+      jumpToCharacter,
+      scrollTop
     } = this.props;
 
     const {
@@ -149,6 +150,10 @@ class AuthorIndexBanners extends Component {
         });
       }
     }
+
+    if (this._grid && scrollTop !== 0) {
+      this._grid.scrollToPosition({ scrollTop });
+    }
   }
 
   //
@@ -306,6 +311,7 @@ AuthorIndexBanners.propTypes = {
   sortKey: PropTypes.string,
   bannerOptions: PropTypes.object.isRequired,
   jumpToCharacter: PropTypes.string,
+  scrollTop: PropTypes.number.isRequired,
   scroller: PropTypes.instanceOf(Element).isRequired,
   showRelativeDates: PropTypes.bool.isRequired,
   shortDateFormat: PropTypes.string.isRequired,
diff --git a/frontend/src/Author/Index/Overview/AuthorIndexOverviews.js b/frontend/src/Author/Index/Overview/AuthorIndexOverviews.js
index 464050b66..4ce8caf8e 100644
--- a/frontend/src/Author/Index/Overview/AuthorIndexOverviews.js
+++ b/frontend/src/Author/Index/Overview/AuthorIndexOverviews.js
@@ -71,7 +71,8 @@ class AuthorIndexOverviews extends Component {
       items,
       sortKey,
       overviewOptions,
-      jumpToCharacter
+      jumpToCharacter,
+      scrollTop
     } = this.props;
 
     const {
@@ -103,6 +104,10 @@ class AuthorIndexOverviews extends Component {
         });
       }
     }
+
+    if (this._grid && scrollTop !== 0) {
+      this._grid.scrollToPosition({ scrollTop });
+    }
   }
 
   //
diff --git a/frontend/src/Author/Index/Posters/AuthorIndexPosters.js b/frontend/src/Author/Index/Posters/AuthorIndexPosters.js
index 3f97a817d..47646840e 100644
--- a/frontend/src/Author/Index/Posters/AuthorIndexPosters.js
+++ b/frontend/src/Author/Index/Posters/AuthorIndexPosters.js
@@ -114,7 +114,8 @@ class AuthorIndexPosters extends Component {
       sortKey,
       posterOptions,
       jumpToCharacter,
-      isSmallScreen
+      isSmallScreen,
+      scrollTop
     } = this.props;
 
     const {
@@ -151,6 +152,10 @@ class AuthorIndexPosters extends Component {
         });
       }
     }
+
+    if (this._grid && scrollTop !== 0) {
+      this._grid.scrollToPosition({ scrollTop });
+    }
   }
 
   //
@@ -314,6 +319,7 @@ AuthorIndexPosters.propTypes = {
   sortKey: PropTypes.string,
   posterOptions: PropTypes.object.isRequired,
   jumpToCharacter: PropTypes.string,
+  scrollTop: PropTypes.number.isRequired,
   scroller: PropTypes.instanceOf(Element).isRequired,
   showRelativeDates: PropTypes.bool.isRequired,
   shortDateFormat: PropTypes.string.isRequired,
diff --git a/frontend/src/Author/Index/Table/AuthorIndexTable.js b/frontend/src/Author/Index/Table/AuthorIndexTable.js
index 149e1ab86..22e366dfd 100644
--- a/frontend/src/Author/Index/Table/AuthorIndexTable.js
+++ b/frontend/src/Author/Index/Table/AuthorIndexTable.js
@@ -83,7 +83,8 @@ class AuthorIndexTable extends Component {
       showBanners,
       isSmallScreen,
       onSortPress,
-      scroller
+      scroller,
+      scrollTop
     } = this.props;
 
     return (
@@ -91,6 +92,7 @@ class AuthorIndexTable extends Component {
         className={styles.tableContainer}
         items={items}
         scrollIndex={this.state.scrollIndex}
+        scrollTop={scrollTop}
         isSmallScreen={isSmallScreen}
         scroller={scroller}
         rowHeight={showBanners ? 70 : 38}
@@ -120,6 +122,7 @@ AuthorIndexTable.propTypes = {
   sortDirection: PropTypes.oneOf(sortDirections.all),
   showBanners: PropTypes.bool.isRequired,
   jumpToCharacter: PropTypes.string,
+  scrollTop: PropTypes.number,
   scroller: PropTypes.instanceOf(Element).isRequired,
   isSmallScreen: PropTypes.bool.isRequired,
   onSortPress: PropTypes.func.isRequired
diff --git a/frontend/src/Components/Link/Link.js b/frontend/src/Components/Link/Link.js
index 8787a10aa..46e2778ec 100644
--- a/frontend/src/Components/Link/Link.js
+++ b/frontend/src/Components/Link/Link.js
@@ -38,7 +38,7 @@ class Link extends Component {
     const linkProps = { target };
     let el = component;
 
-    if (to) {
+    if (to && typeof to === 'string') {
       if ((/\w+?:\/\//).test(to)) {
         el = 'a';
         linkProps.href = to;
@@ -53,6 +53,18 @@ class Link extends Component {
         linkProps.to = `${window.Readarr.urlBase}/${to.replace(/^\//, '')}`;
         linkProps.target = target;
       }
+    } else if (to && typeof to === 'object') {
+      el = RouterLink;
+      linkProps.target = target;
+      if (to.pathname.startsWith(`${window.Readarr.urlBase}/`)) {
+        linkProps.to = to;
+      } else {
+        const pathname = `${window.Readarr.urlBase}/${to.pathname.replace(/^\//, '')}`;
+        linkProps.to = {
+          ...to,
+          pathname
+        };
+      }
     }
 
     if (el === 'button' || el === 'input') {
@@ -83,7 +95,7 @@ class Link extends Component {
 Link.propTypes = {
   className: PropTypes.string,
   component: PropTypes.oneOfType([PropTypes.string, PropTypes.func]),
-  to: PropTypes.string,
+  to: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),
   target: PropTypes.string,
   isDisabled: PropTypes.bool,
   noRouter: PropTypes.bool,
diff --git a/frontend/src/Components/Page/Header/PageHeader.js b/frontend/src/Components/Page/Header/PageHeader.js
index 215f7b4f2..ab85c4ff0 100644
--- a/frontend/src/Components/Page/Header/PageHeader.js
+++ b/frontend/src/Components/Page/Header/PageHeader.js
@@ -53,7 +53,10 @@ class PageHeader extends Component {
         <div className={styles.logoContainer}>
           <Link
             className={styles.logoLink}
-            to={'/'}
+            to={{
+              pathname: '/',
+              state: { restoreScrollPosition: true }
+            }}
           >
             <img
               className={styles.logo}
diff --git a/frontend/src/Components/Table/VirtualTable.js b/frontend/src/Components/Table/VirtualTable.js
index c630dbb52..55e701778 100644
--- a/frontend/src/Components/Table/VirtualTable.js
+++ b/frontend/src/Components/Table/VirtualTable.js
@@ -47,6 +47,7 @@ class VirtualTable extends Component {
     const {
       items,
       scrollIndex,
+      scrollTop,
       onRecompute
     } = this.props;
 
@@ -68,6 +69,10 @@ class VirtualTable extends Component {
         columnIndex: 0
       });
     }
+
+    if (this._grid && scrollTop !== undefined && scrollTop !== 0) {
+      this._grid.scrollToPosition({ scrollTop });
+    }
   }
 
   //
@@ -95,6 +100,7 @@ class VirtualTable extends Component {
       className,
       items,
       scroller,
+      scrollTop: ignored,
       header,
       headerHeight,
       rowHeight,
@@ -179,6 +185,7 @@ VirtualTable.propTypes = {
   className: PropTypes.string.isRequired,
   items: PropTypes.arrayOf(PropTypes.object).isRequired,
   scrollIndex: PropTypes.number,
+  scrollTop: PropTypes.number,
   scroller: PropTypes.instanceOf(Element).isRequired,
   header: PropTypes.node.isRequired,
   headerHeight: PropTypes.number.isRequired,
diff --git a/frontend/src/Components/withScrollPosition.js b/frontend/src/Components/withScrollPosition.js
index 110da9ab2..bb089b8b0 100644
--- a/frontend/src/Components/withScrollPosition.js
+++ b/frontend/src/Components/withScrollPosition.js
@@ -8,7 +8,7 @@ function withScrollPosition(WrappedComponent, scrollPositionKey) {
       history
     } = props;
 
-    const scrollTop = history.action === 'POP' ?
+    const scrollTop = history.action === 'POP' || (history.location.state && history.location.state.restoreScrollPosition) ?
       scrollPositions[scrollPositionKey] :
       0;