:recycle: relying on route based sort

vue-theme/src/pages/list.vue

@@ -73,22 +73,13 @@ export default {
             if (!this.pType) return
             return this[`all${this.pType}`]
         },
-        isWide() {
-            const wide = ['exhibition', 'event']
-            return wide.includes(this.type)
-        }
     },
     methods: {
-        _getSortBy() {
-            return this.sortBy
-                ? this.sortBy
-                : sortFromRoute(this.$route)
-        },
-        _getDispatchParams(perPage) {
+        _getDispatchParams(perPageOverride) {
             return {
-                sortType: this._getSortBy(),
+                sortType: this.sortBy,
                 params: {
-                    limit: perPage ? perPage : this.perPage,
+                    limit: perPageOverride ? perPageOverride : this.perPage,
                     page: this.page
                 }
             }
@@ -114,7 +105,7 @@ export default {
             let params = this._getDispatchParams()
             
             // For episodes, or material sort we grab EVERYTHING
-            const getAllClause = this.type == 'episode' || this.type == 'artist' && this._getSortBy() == sortTypes.material
+            const getAllClause = this.type == 'episode' || this.type == 'artist' && this.sortBy == sortTypes.material
             if(getAllClause) {
                 dispatchAction = `getAll${this.pType}`
                 params = this._getDispatchParams(-1)
@@ -207,11 +198,6 @@ export default {
         // and the post type has changed
         type(newType, oldType) {
             if(!postTypes.includes(newType)) return console.warn('type not valid...')
-
-            // !:Ignore these default sorted types and let the route watcher deal with it
-            const ignore = ['event', 'exhibition', 'post']
-            if(ignore.includes(this.type)) return
-
             this.clearAndInitPostList('type watcher')
         },
         // Only fire if the sort type has changed
@@ -221,9 +207,9 @@ export default {
             const validSorts = Object.values(sortTypes)
             if (
                 typeFromRoute(to) == typeFromRoute(from) &&
-                sortFromRoute(to) != sortFromRoute(from) &&
+                to.sortBy != from.sortBy &&
                 // Post slug sometimes appears as a sort so we check it against known sorts
-                validSorts.includes(sortFromRoute(to)) && validSorts.includes(sortFromRoute(from))
+                validSorts.includes(to.sortBy) && validSorts.includes(from.sortBy)
             ) {
                 this.clearAndInitPostList('$route watcher')
             } 

vue-theme/src/router/routes.js

@@ -4,6 +4,10 @@ import singlePage from '@/pages/single.vue'
 
 import { sortTypes } from '@/utils/helpers'
 
+const gridWithSidebar = { sidebar: true, grid: true }
+const gridSansSidebar = { sidebar: false, grid: true }
+const sansGridWithSidebar = { sidebar: true, grid: false }
+
 export default [
     // Home Page
     { path: '/', component: indexPage },
@@ -11,78 +15,48 @@ export default [
     {
         path: '/episode',
         component: listPage,
-        props: { sidebar: false, grid: true, sortBy: null },
+        props: { ...gridSansSidebar, sortBy: null },
     },
     {
         path: '/artist',
         component: listPage,
-        props: { sidebar: true, grid: true, sortBy: null },
+        props: { ...gridWithSidebar, sortBy: null },
     },
     // Sorted List Pages
     {
         path: `/artist/${sortTypes.alpha}`,
         component: listPage,
-        props: { sidebar: true, grid: true, sortBy: `${sortTypes.alpha}` },
+        props: { ...gridWithSidebar, sortBy: `${sortTypes.alpha}` },
     },
     {
         path: `/artist/${sortTypes.material}`,
         component: listPage,
-        props: { sidebar: true, grid: true, sortBy: `${sortTypes.material}` },
+        props: { ...gridWithSidebar, sortBy: `${sortTypes.material}` },
     },
     {
         path: `/event`,
         component: listPage,
-        props: { sidebar: true, sortBy: `${sortTypes.currentAndUpcoming}` },
-    },
-    {
-        path: `/exhibition`,
-        component: listPage,
-        props: { sidebar: true, sortBy: `${sortTypes.currentAndUpcoming}` },
-    },
-    {
-        path: `/:type/${sortTypes.past}`,
-        component: listPage,
-        props: { sidebar: true, sortBy: `${sortTypes.past}` },
-    },
-    {
-        path: `/:type/${sortTypes.current}`,
-        component: listPage,
-        props: { sidebar: true, sortBy: `${sortTypes.current}` },
+        props: { ...sansGridWithSidebar, sortBy: `${sortTypes.currentAndUpcoming}`, isWide: true },
     },
     {
-        path: `/:type/${sortTypes.currentAndUpcoming}`,
+        path: `/event/${sortTypes.currentAndUpcoming}`,
         component: listPage,
-        props: { sidebar: true, sortBy: `${sortTypes.currentAndUpcoming}` },
+        props: { ...sansGridWithSidebar, sortBy: `${sortTypes.currentAndUpcoming}`, isWide: true },
     },
     {
-        path: `/:type/${sortTypes.upcoming}`,
-        component: listPage,
-        props: { sidebar: true, sortBy: `${sortTypes.upcoming}` },
-    },
-    {
-        path: `/:type/${sortTypes.alpha}`,
-        component: listPage,
-        props: { sidebar: true, sortBy: `${sortTypes.alpha}` },
-    },
-    {
-        path: `/:type/${sortTypes.material}`,
-        component: listPage,
-        props: { sidebar: true, sortBy: `${sortTypes.material}` },
-    },
-    {
-        path: `/:type/${sortTypes.episode}`,
+        path: `/exhibition`,
         component: listPage,
-        props: { sidebar: true, sortBy: `${sortTypes.episode}` },
+        props: { ...sansGridWithSidebar, sortBy: `${sortTypes.currentAndUpcoming}`, isWide: true },
     },
     {
-        path: `/:type/${sortTypes.artist}`,
+        path: `/exhibition/${sortTypes.currentAndUpcoming}`,
         component: listPage,
-        props: { sidebar: true, sortBy: `${sortTypes.artist}` },
+        props: { ...sansGridWithSidebar, sortBy: `${sortTypes.currentAndUpcoming}`, isWide: true },
     },
     {
         path: '/:type',
         component: listPage,
-        props: { sidebar: true, sortBy: null },
+        props: { ...sansGridWithSidebar, sortBy: null },
     },
     // Single Pages
     {

vue-theme/src/utils/helpers.js

@@ -54,12 +54,6 @@ const typeFromRoute = route => {
     return type
 }
 
-const sortFromRoute = route => {
-    return route.sortBy ? route.sortBy : route.fullPath
-        .split('/')
-        .filter(p => p)
-        .pop()
-}
 
 const ytThumbnail = (url, desiredSize) => {
     const remove = [