:sparkles: sticky posts visible on the homepage template

vue-theme/src/pages/index.vue

@@ -2,6 +2,13 @@
 <template lang="pug">
 .page--index.f-row.between
     article.f-grow
+        .f-row
+            h3(v-if="!allStickyLoaded") loading...
+            section(v-else-if="allStickyLoaded").shadow
+                h4.t-cap sticky
+                ul
+                    li(v-for="sticky in allSticky")
+                        p {{ sticky.type }}: {{ sticky.title }}
         .f-row
             h3(v-if="!allPagesLoaded") loading...
             .content(v-else-if="allPages['welcome']" v-html="allPages['welcome'].content")
@@ -44,6 +51,7 @@ export default {
     mixins: [postTypeGetters, scrollTop],
     created() {
         // console.log(wp)
+        this.$store.dispatch(`getAllSticky`)
         postTypes.forEach(type => {
             const capitalizedType = convertTitleCase(type)
             this.$store.dispatch(`getAll${capitalizedType}`)

vue-theme/src/store/index.js

@@ -11,6 +11,7 @@ import artists from './modules/artist'
 import episodes from './modules/episode'
 import events from './modules/event'
 import exhibitions from './modules/exhibition'
+import sticky from './modules/sticky'
 
 const debug = process.env.NODE_ENV !== 'production'
 
@@ -70,6 +71,7 @@ const store = new Vuex.Store({
         episodes,
         events,
         exhibitions,
+        sticky,
     },
     strict: debug,
 })

vue-theme/src/store/modules/sticky.js

@@ -0,0 +1,36 @@
+import api from '../../utils/api'
+
+const state = {
+    all: [],
+    loaded: false,
+}
+
+const getters = {
+    allSticky: state => state.all,
+    allStickyLoaded: state => state.loaded,
+}
+
+const actions = {
+    getAllSticky({ commit }, sortType) {
+        commit('CLEAR_POSTS')
+        commit('POSTS_LOADED', false)
+        return api.getSticky(posts => {
+            commit('STORE_FETCHED_POSTS', { posts })
+            commit('POSTS_LOADED', true)
+        })
+    },
+}
+
+const mutations = {
+    STORE_FETCHED_POSTS(state, { posts }) {
+        state.all = posts
+    },
+    CLEAR_POSTS(state) {
+        state.all = []
+    },
+    POSTS_LOADED(state, val) {
+        state.loaded = val
+    },
+}
+
+export default { state, getters, actions, mutations }

vue-theme/src/utils/api.js

@@ -51,6 +51,16 @@ export default {
             })
     },
 
+    getSticky(cb) {
+        axios
+            .get(SETTINGS.API_BASE_PATH + 'sticky')
+            .then(response => {
+                cb(response.data)
+            })
+            .catch(e => {
+                cb(e)
+            })
+    },
     getPosts(limit = 5, cb) {
         axios
             .get(SETTINGS.API_BASE_PATH + 'posts')

vue-theme/src/utils/helpers.js

@@ -27,6 +27,7 @@ const postTypes = [
     'events',
     'posts',
     'pages',
+    'sticky',
 ]
 
 /**
@@ -59,12 +60,12 @@ const ytThumbnail = (url, desiredSize) => {
         'youtu.be',
         'www.youtube.com',
         'youtube.com',
-        'embed'
+        'embed',
     ]
     const videoId = url
         .split('/')
         .filter(urlSection => !remove.includes(urlSection))
-        
+
     // Uncomment to see what the url transformer is finding
     // console.log('video:', videoId[0])
     let size = '0'