Hide some components rather than unmounting (#2271)

Hide some components rather than unmounting them to allow to show again
quickly and keep the view state such as the scrolled offset.

1 files changed, 10 insertions, 20 deletions

diff --git a/app/assets/javascripts/components/features/notifications/index.jsx b/app/assets/javascripts/components/features/notifications/index.jsx
index 14c00b9ce..da3ce2f62 100644
--- a/app/assets/javascripts/components/features/notifications/index.jsx
+++ b/app/assets/javascripts/components/features/notifications/index.jsx
@@ -80,7 +80,7 @@ class Notifications extends React.PureComponent {
   }
 
   render () {
-    const { intl, notifications, trackScroll, isLoading, isUnread } = this.props;
+    const { intl, notifications, shouldUpdateScroll, isLoading, isUnread } = this.props;
 
     let loadMore       = '';
     let scrollableArea = '';
@@ -113,25 +113,15 @@ class Notifications extends React.PureComponent {
       );
     }
 
-    if (trackScroll) {
-      return (
-        <Column icon='bell' active={isUnread} heading={intl.formatMessage(messages.title)}>
-          <ColumnSettingsContainer />
-          <ClearColumnButton onClick={this.handleClear} />
-          <ScrollContainer scrollKey='notifications'>
-            {scrollableArea}
-          </ScrollContainer>
-        </Column>
-      );
-    } else {
-      return (
-        <Column icon='bell' active={isUnread} heading={intl.formatMessage(messages.title)}>
-          <ColumnSettingsContainer />
-          <ClearColumnButton onClick={this.handleClear} />
+    return (
+      <Column icon='bell' active={isUnread} heading={intl.formatMessage(messages.title)}>
+        <ColumnSettingsContainer />
+        <ClearColumnButton onClick={this.handleClear} />
+        <ScrollContainer scrollKey='notifications' shouldUpdateScroll={shouldUpdateScroll}>
           {scrollableArea}
-        </Column>
-      );
-    }
+        </ScrollContainer>
+      </Column>
+    );
   }
 
 }
@@ -139,7 +129,7 @@ class Notifications extends React.PureComponent {
 Notifications.propTypes = {
   notifications: ImmutablePropTypes.list.isRequired,
   dispatch: PropTypes.func.isRequired,
-  trackScroll: PropTypes.bool,
+  shouldUpdateScroll: PropTypes.func,
   intl: PropTypes.object.isRequired,
   isLoading: PropTypes.bool,
   isUnread: PropTypes.bool