Updated StatusList, ScrollableList to use given props

• Updated:
- StatusList, ScrollableList to use given props

• Fixed:
- Issue with scrolling back to top onLoadMore

app/javascript/gabsocial/components/scrollable_list.js

@@ -228,8 +228,6 @@ export default class ScrollableList extends PureComponent {
     } = this.props
     const childrenCount = React.Children.count(children);
 
-    const loadMore = (hasMore && onLoadMore) ? <LoadMore visible={!isLoading} onClick={this.handleLoadMore} /> : null
-
     if (showLoading) {
       if (Placeholder) {
         return (
@@ -248,9 +246,7 @@ export default class ScrollableList extends PureComponent {
         )
       }
 
-      return (
+      return <ColumnIndicator type='loading' />
-        <ColumnIndicator type='loading' />
-      )
     } else if (isLoading || childrenCount > 0 || hasMore || !emptyMessage) {
       return (
         <div onMouseMove={this.handleMouseMove}>
@@ -278,14 +274,18 @@ export default class ScrollableList extends PureComponent {
               ))
             }
 
-            {loadMore}
+            {
+              (hasMore && onLoadMore && !isLoading) &&
+              <LoadMore onClick={this.handleLoadMore} />
+            }
+
             {
               isLoading &&
               <ColumnIndicator type='loading' />
             }
           </div>
         </div>
-      );
+      )
     }
 
     return (

app/javascript/gabsocial/components/status_list.js

@@ -224,11 +224,15 @@ class StatusList extends ImmutablePureComponent {
       isPartial,
       group,
       promotedStatuses,
-      ...other
+      scrollKey,
+      hasMore,
+      emptyMessage,
+      onScrollToTop,
+      onScroll,
     } = this.props
     const { fetchedContext, refreshing } = this.state
 
-    if (isPartial || isLoading && statusIds.size === 0) {
+    if (isPartial || (isLoading && statusIds.size === 0)) {
       return (
         <Fragment>
           <StatusPlaceholder />
@@ -320,10 +324,16 @@ class StatusList extends ImmutablePureComponent {
         <ScrollableList
           ref={this.setRef}
           isLoading={isLoading}
-          showLoading={(isLoading && statusIds.size === 0) || refreshing}
+          showLoading={(isLoading && statusIds.size === 0)}
           onLoadMore={onLoadMore && this.handleLoadOlder}
           onReload={this.handleOnReload}
-          {...other}
+          placeholderComponent={StatusPlaceholder}
+          placeholderCount={1}
+          scrollKey={scrollKey}
+          hasMore={hasMore}
+          emptyMessage={emptyMessage}
+          onScrollToTop={onScrollToTop}
+          onScroll={onScroll}
         >
           {scrollableContent}
         </ScrollableList>

app/javascript/gabsocial/features/account_timeline.js

@@ -87,7 +87,6 @@ class AccountTimeline extends ImmutablePureComponent {
         statusIds={statusIds}
         featuredStatusIds={featuredStatusIds}
         isLoading={isLoading}
-        showLoading={isLoading}
         hasMore={hasMore}
         onLoadMore={this.handleLoadMore}
         emptyMessage={intl.formatMessage(messages.empty)}

app/javascript/gabsocial/features/group_timeline.js

@@ -34,7 +34,6 @@ class GroupTimeline extends ImmutablePureComponent {
 	static propTypes = {
 		params: PropTypes.object.isRequired,
 		dispatch: PropTypes.func.isRequired,
-		columnId: PropTypes.string,
 		hasUnread: PropTypes.bool,
 		group: PropTypes.oneOfType([
 			ImmutablePropTypes.map,
@@ -77,7 +76,7 @@ class GroupTimeline extends ImmutablePureComponent {
 	}
 
 	render() {
-		const { columnId, group, relationships, account, intl } = this.props
+		const { group, relationships, account, intl } = this.props
 		const { collapsed } = this.state
 		const { id } = this.props.params
 
@@ -90,7 +89,7 @@ class GroupTimeline extends ImmutablePureComponent {
 		return (
 			<StatusList
 				alwaysPrepend
-				scrollKey={`group_timeline-${columnId}`}
+				scrollKey={`group_timeline-${id}`}
 				timelineId={`group:${id}`}
 				onLoadMore={this.handleLoadMore}
 				group={group}

app/javascript/gabsocial/features/shortcuts.js

@@ -38,9 +38,7 @@ class Shortcuts extends ImmutablePureComponent {
       shortcuts,
     } = this.props
 
-    if (isLoading) {
+    if (isError) {
-      return <ColumnIndicator type='loading' />
-    } else if (isError) {
       return <ColumnIndicator type='error' message='Error fetching shortcuts' />
     }
 
@@ -55,6 +53,7 @@ class Shortcuts extends ImmutablePureComponent {
         scrollKey='shortcuts'
         emptyMessage='You have no shortcuts'
         items={listItems}
+        showLoading={isLoading}
       />
     )
   }