Pagination and redirection to in mobile view (#3123)

Author: kushthedude

app/routes/explore.js

@@ -145,11 +145,16 @@ export default Route.extend({
       });
     }
 
-    return this.store.query('event', {
-      sort    : 'starts-at',
-      filter  : filterOptions,
-      include : 'event-topic,event-sub-topic,event-type'
+    return this.infinity.model('event', {
+      include      : 'event-topic,event-sub-topic,event-type',
+      filter       : filterOptions,
+      sort         : 'starts-at',
+      perPage      : 6,
+      startingPage : 1,
+      perPageParam : 'page[size]',
+      pageParam    : 'page[number]'
     });
+
   },
 
   async model(params) {

app/templates/components/side-bar.hbs

@@ -1,5 +1,5 @@
 <div class="ui left inverted vertical menu sidebar {{if sidebarVisible 'visible'}}">
-  {{#link-to 'index' class='item' activeClass=''}}{{t 'Browse Events'}}{{/link-to}}
+  {{#link-to 'explore' class='item' activeClass=''}}{{t 'Browse Events'}}{{/link-to}}
   {{#if session.isAuthenticated}}
     <div class="item">
       {{widgets/safe-image isAvatar=true class='ui avatar round image side-bar' src=(if authManager.currentUser.avatarUrl authManager.currentUser.avatarUrl

app/templates/explore.hbs

@@ -43,5 +43,10 @@
       <div class="ui disabled header">{{t 'No events found for selected filters'}}</div>
     {{/each}}
     {{modals/event-share-modal isOpen=isShareModalOpen event=eventToShare}}
+    {{#infinity-loader infinityModel=filteredEvents}}
+      <div class="ui loading very padded basic segment">
+      </div>
+      {{infintyModel.reachedInfinity}}
+    {{/infinity-loader}}
   </div>
 </div>