feat: Implementing infinityModel at public session route (#4022)

Author: kushthedude

app/routes/public/sessions/list.js

@@ -16,169 +16,64 @@ export default Route.extend({
   },
   async model(params) {
     const eventDetails = this.modelFor('public');
-    let sessions =  null;
-    if (params.session_status === 'today') {
-      sessions = await this.store.query('session', {
-        filter: [
+    const filterOptions = [
+      {
+        and: [
           {
-            and: [
-              {
-                name : 'event',
-                op   : 'has',
-                val  : {
-                  name : 'identifier',
-                  op   : 'eq',
-                  val  : eventDetails.id
-                }
-              },
-              {
-                name : 'starts-at',
-                op   : 'ge',
-                val  : moment().startOf('day').toISOString()
-              },
-              {
-                name : 'starts-at',
-                op   : 'lt',
-                val  : moment().endOf('day').toISOString()
-              },
-              {
-                or: [
-                  {
-                    name : 'state',
-                    op   : 'eq',
-                    val  : 'confirmed'
-                  },
-                  {
-                    name : 'state',
-                    op   : 'eq',
-                    val  : 'accepted'
-                  }
-                ]
-              }
-            ]
-          }
-        ]
-      });
-    } else if (params.session_status === 'week') {
-      sessions = await this.store.query('session', {
-        filter: [
+            name : 'event',
+            op   : 'has',
+            val  : {
+              name : 'identifier',
+              op   : 'eq',
+              val  : eventDetails.id
+            }
+          },
           {
-            and: [
+            or: [
               {
-                name : 'event',
-                op   : 'has',
-                val  : {
-                  name : 'identifier',
-                  op   : 'eq',
-                  val  : eventDetails.id
-                }
+                name : 'state',
+                op   : 'eq',
+                val  : 'confirmed'
               },
               {
-                name : 'starts-at',
-                op   : 'ge',
-                val  : moment().startOf('week').toISOString()
-              },
-              {
-                name : 'starts-at',
-                op   : 'lt',
-                val  : moment().endOf('week').toISOString()
-              },
-              {
-                or: [
-                  {
-                    name : 'state',
-                    op   : 'eq',
-                    val  : 'confirmed'
-                  },
-                  {
-                    name : 'state',
-                    op   : 'eq',
-                    val  : 'accepted'
-                  }
-                ]
+                name : 'state',
+                op   : 'eq',
+                val  : 'accepted'
               }
             ]
           }
         ]
-      });
-    } else if (params.session_status === 'month') {
-      sessions = await this.store.query('session', {
-        filter: [
+      }
+    ];
+
+    if (params.session_status !== 'all') {
+
+      const period = params.session_status === 'today' ? 'day' : params.session_status;
+      filterOptions.push({
+        and: [
           {
-            and: [
-              {
-                name : 'event',
-                op   : 'has',
-                val  : {
-                  name : 'identifier',
-                  op   : 'eq',
-                  val  : eventDetails.id
-                }
-              },
-              {
-                name : 'starts-at',
-                op   : 'ge',
-                val  : moment().startOf('month').toISOString()
-              },
-              {
-                name : 'starts-at',
-                op   : 'lt',
-                val  : moment().add('month').toISOString()
-              },
-              {
-                or: [
-                  {
-                    name : 'state',
-                    op   : 'eq',
-                    val  : 'confirmed'
-                  },
-                  {
-                    name : 'state',
-                    op   : 'eq',
-                    val  : 'accepted'
-                  }
-                ]
-              }
-            ]
-          }
-        ]
-      });
-    } else {
-      sessions = await this.store.query('session', {
-        filter: [
+            name : 'starts-at',
+            op   : 'ge',
+            val  : moment().startOf(period).toISOString()
+          },
           {
-            and: [
-              {
-                name : 'event',
-                op   : 'has',
-                val  : {
-                  name : 'identifier',
-                  op   : 'eq',
-                  val  : eventDetails.id
-                }
-              },
-              {
-                or: [
-                  {
-                    name : 'state',
-                    op   : 'eq',
-                    val  : 'confirmed'
-                  },
-                  {
-                    name : 'state',
-                    op   : 'eq',
-                    val  : 'accepted'
-                  }
-                ]
-              }
-            ]
+            name : 'starts-at',
+            op   : 'lt',
+            val  : moment().endOf(period).toISOString()
           }
         ]
       });
+
     }
     return {
       event   : eventDetails,
-      session : sessions
+      session : await this.infinity.model('session', {
+        filter       : filterOptions,
+        perPage      : 6,
+        startingPage : 1,
+        perPageParam : 'page[size]',
+        pageParam    : 'page[number]'
+      })
     };
   }
 });

app/templates/public/sessions/list.hbs

@@ -10,4 +10,10 @@
   {{else}}
     <div class="ui disabled header">{{t 'No Sessions exist for this time period'}}</div>
   {{/each}}
+  {{#infinity-loader infinityModel=model.session triggerOffset=300 eventDebounce=50}}
+    <div class="center aligned five wide column">
+      <div class="ui loading very padded basic segment">
+      </div>
+    </div>
+  {{/infinity-loader}}
 </div>