Filter on session status in the API request

vuejs/src/App.vue

@@ -32,7 +32,8 @@ export default {
     const baseUrl = process.env.VUE_APP_DRUPAL_URL
 
     const params = qs.stringify({
-      'fields[node--session]': 'title'
+      'fields[node--session]': 'title',
+      'filter[field_session_status]': 'accepted'
     })
 
     axios.get(`${baseUrl}/jsonapi/node/session?${params}`)
@@ -51,6 +52,7 @@ export default {
   computed: {
     sortedSessions: function () {
       return _(this.sessions).sortBy(({ attributes }) => attributes.title)
+        .value()
     }
   }
 }

vuejs/src/components/AcceptedSessionsList.vue

@@ -2,9 +2,9 @@
   <div>
     <h1 class="text-4xl mb-2">Sessions</h1>
 
-    <div v-if="acceptedSessions.length" class="bg-white p-6 rounded-lg border">
+    <div v-if="sessions.length" class="bg-white p-6 rounded-lg border">
       <ul class="-mb-3">
-        <li v-for="{ attributes } in acceptedSessions" :key="attributes.drupal_internal__nid" class="mb-3">
+        <li v-for="{ attributes } in sessions" :key="attributes.drupal_internal__nid" class="mb-3">
           {{ attributes.title }}
         </li>
       </ul>
@@ -19,20 +19,6 @@ export default {
       type: Object,
       required: true
     }
-  },
-
-  computed: {
-    acceptedSessions: function () {
-      return this.sessions
-        .filter(session => this.isAccepted(session))
-        .value()
-    }
-  },
-
-  methods: {
-    isAccepted: function ({ attributes }) {
-      return attributes.field_session_status === 'accepted'
-    }
   }
 }
 </script>