:recycle: tweaking type pluralization

vue-theme/src/pages/list.vue

@@ -52,23 +52,23 @@ export default {
             // Checks for type and fixes Episodes route edge case
             return typeFromRoute(this.$route)
         },
+        pType() {
+            const plural = this.type + 's'
+            return convertTitleCase(plural)
+        },
         dispatchName() {
-            let type = convertTitleCase(this.type) + 's'
-            return this.sortBy ? `getAll${type.split('/')[0]}` : `getAll${type}`
+            return this.sortBy ? `getAll${this.pType.split('/')[0]}` : `getAll${this.pType}`
         },
         getMoreName() {
-            let type = convertTitleCase(this.type) + 's'
-            return this.sortBy ? `getMore${type.split('/')[0]}` : `getMore${type}`
+            return this.sortBy ? `getMore${this.pType.split('/')[0]}` : `getMore${this.pType}`
         },
         loaded() {
-            let type = convertTitleCase(this.type) + 's'
-            if (!type) return
-            return this[`all${type}Loaded`]
+            if (!this.pType) return
+            return this[`all${this.pType}Loaded`]
         },
         posts() {
-            let type = convertTitleCase(this.type) + 's'
-            if (!type) return
-            return this[`all${type}`]
+            if (!this.pType) return
+            return this[`all${this.pType}`]
         },
     },
     methods: {
@@ -145,14 +145,14 @@ export default {
             }, TIMEOUT)
         },
         setIntersectionLoader() {
-            console.warn('setting up intersection handler...', this.type)
+            console.warn('setting up intersection handler for:', this.type)
             window.removeEventListener("load", e => {}, false)
             const footerEl = document.querySelector(".footer-wrapper footer")
-            console.log('footer for intersection:', footerEl)
             if(!footerEl) return
+
             window.addEventListener("load", e => {
                 const observer = new IntersectionObserver(this.loadMorePosts, {
-                    rootMargin: "0px 0px 20px 0px",
+                    rootMargin: "0px 0px -20px 0px",
                 })
                 observer.observe(footerEl)
             }, false)
@@ -185,12 +185,11 @@ export default {
         this.setIntersectionLoader()
     },
     created() {
-        let type = convertTitleCase(this.type) + 's'
-        this.checkAndSetHero(this.type)
+        this.checkAndSetHero(this.pType)
 
         // We also need to check if only ONE has been loaded because
         // coming from the homepage there will only be 1 item
-        if (!this[`all${type}Loaded`] || this[`all${type}`].length < 2) this.getPosts(true)
+        if (!this[`all${this.pType}Loaded`] || this[`all${this.pType}`].length < 2) this.getPosts(true)
     },
 }
 </script>

vue-theme/src/pages/single.vue

@@ -200,8 +200,6 @@ export default {
              * which is derived from the route
              * !: posts watcher fires when this finishes
              */
-            let type = convertTitleCase(this.type) + 's'
-
             // modules are NOT plural because module key
             if (!this.$store.state[this.type]) return
             let allPostsOfType = this.$store.state[this.type].all
@@ -217,7 +215,7 @@ export default {
 
             // Look if it exists before you try and load everything!
             if(!singlePostData) {
-                const res = await this.$store.dispatch(`getAll${type}`, { sortType: null, params: null})
+                const res = await this.$store.dispatch(`getAll${convertTitleCase(this.type)}s`, { sortType: null, params: null})
                 allPostsOfType = res
                 singlePostData = allPostsOfType.filter(
                     post => post.slug == this.$route.params.slug,
@@ -226,10 +224,9 @@ export default {
 
             if (!singlePostData) return
             
-            this.checkAndSetHero(singlePostData)
-
             // NOT plural
-            const post = await this.$store.dispatch(
+            this.checkAndSetHero(singlePostData)
+            await this.$store.dispatch(
                 `getSingle${convertTitleCase(this.type)}`,
                 singlePostData.id,
             )