refactor(core): further improve improve extensibility of PostStreamScrubber

Author: DavideIadeluca

framework/core/js/src/forum/components/PostStreamScrubber.js

@@ -69,7 +69,7 @@ export default class PostStreamScrubber extends Component {
     );
   }
 
-  scrubberItems(viewing, unreadCount, _unreadPercent, styleUnread) {
+  scrubberItems(viewing, unreadCount, unreadPercent, styleUnread) {
     const items = new ItemList();
 
     items.add(
@@ -82,21 +82,7 @@ export default class PostStreamScrubber extends Component {
 
     items.add(
       'scrollbar',
-      <div className="Scrubber-scrollbar">
-        <div className="Scrubber-before" />
-        <div className="Scrubber-handle">
-          <div className="Scrubber-bar" />
-          <div className="Scrubber-info">
-            <strong>{viewing}</strong>
-            <span className="Scrubber-description"></span>
-          </div>
-        </div>
-        <div className="Scrubber-after" />
-
-        <div className="Scrubber-unread" oncreate={styleUnread} onupdate={styleUnread}>
-          {app.translator.trans('core.forum.post_scrubber.unread_text', { count: unreadCount })}
-        </div>
-      </div>,
+      <div className="Scrubber-scrollbar">{this.scrollbarItems(viewing, unreadCount, unreadPercent, styleUnread).toArray()}</div>,
       90
     );
 
@@ -111,6 +97,35 @@ export default class PostStreamScrubber extends Component {
     return items;
   }
 
+  scrollbarItems(viewing, unreadCount, _unreadPercent, styleUnread) {
+    const items = new ItemList();
+
+    items.add('before', <div className="Scrubber-before" />, 100);
+
+    items.add(
+      'handle',
+      <div className="Scrubber-handle">
+        <div className="Scrubber-bar" />
+        <div className="Scrubber-info">
+          <strong>{viewing}</strong>
+          <span className="Scrubber-description"></span>
+        </div>
+      </div>,
+      90
+    );
+
+    items.add('after', <div className="Scrubber-after" />, 80);
+
+    items.add(
+      'unread',
+      <div className="Scrubber-unread" oncreate={styleUnread} onupdate={styleUnread}>
+        {app.translator.trans('core.forum.post_scrubber.unread_text', { count: unreadCount })}
+      </div>,
+      70
+    );
+
+    return items;
+  }
   onupdate(vnode) {
     super.onupdate(vnode);