:recycle: reformatting according to prettier rules

vue-theme/postcss.config.js

@@ -1,9 +1,9 @@
 module.exports = {
-  parser: "sugarss",
-  plugins: [
-    require("postcss-import"),
-    require("precss"),
-    require("postcss-calc"),
-    require("autoprefixer"),
-  ],
-};
+    parser: 'sugarss',
+    plugins: [
+        require('postcss-import'),
+        require('precss'),
+        require('postcss-calc'),
+        require('autoprefixer'),
+    ],
+}

vue-theme/src/index.js

@@ -6,6 +6,4 @@ import App from '@/app.vue'
 
 const craft = createApp(App)
 
-craft.use(router)
-    .use(store)
-    .mount('#wp-app')
+craft.use(router).use(store).mount('#wp-app')

vue-theme/src/pages/mixin-post-types.js

@@ -7,7 +7,7 @@ import { mapGetters, mapState } from 'vuex'
  * See modules folder
  */
 const getterHelper = {}
-for(let type of postTypes) {
+for (let type of postTypes) {
     const capitalized = convertTitleCase(type)
     getterHelper[`all${capitalized}BySlug`] = `all${capitalized}BySlug`
     getterHelper[`all${capitalized}`] = `all${capitalized}`
@@ -15,20 +15,20 @@ for(let type of postTypes) {
 }
 
 const stateHelper = {}
-for(let type of postTypes) {
+for (let type of postTypes) {
     stateHelper[type] = type
 }
 
 const postTypeGetters = {
     computed: {
         ...mapGetters(getterHelper),
-        ...mapState(stateHelper)
-    }
+        ...mapState(stateHelper),
+    },
 }
 const scrollTop = {
     mounted() {
         window.scrollTo(0, 0)
-    }
+    },
 }
 
-export { postTypeGetters, scrollTop }
+export { postTypeGetters, scrollTop }

vue-theme/src/pages/single.vue

@@ -53,7 +53,7 @@ import credits from '@/components/credits'
 import { postTypeGetters, scrollTop } from './mixin-post-types'
 
 import { convertTitleCase, dePluralize, typeFromRoute } from '@/utils/helpers'
-
+ 
 export default {
     components: { sidebar, gallery, block, credits },
     props: {

vue-theme/src/router/index.js

@@ -5,20 +5,21 @@ import { convertTitleCase } from '@/utils/helpers'
 
 const router = createRouter({
     history: createWebHistory(),
-    routes
+    routes,
 })
 
 router.beforeEach((to, from, next) => {
     document.title = 'Craft in America'
     // Append list type
-    if(to.path.split('/').length > 1 && to.path.split('/')[1]) {
+    if (to.path.split('/').length > 1 && to.path.split('/')[1]) {
         const path = convertTitleCase(to.path.split('/')[1])
         document.title = `${document.title} - ${path}`
     }
     // Append slugs and sort titles
-    if(to.path.split('/')[2]) document.title = `${document.title} - ${to.path.split('/')[2]}`
+    if (to.path.split('/')[2])
+        document.title = `${document.title} - ${to.path.split('/')[2]}`
 
     next()
 })
 
-export default router
+export default router

vue-theme/src/router/routes.js

@@ -8,33 +8,53 @@ export default [
     // Home Page
     { path: '/', component: indexPage },
     // List Pages
-    { 
+    {
         path: '/episodes',
         component: listPage,
-        props: { sidebar: false, grid: true }
+        props: { sidebar: false, grid: true },
     },
-    { 
+    {
         path: '/artists',
         component: listPage,
-        props: { sidebar: true, grid: true }
+        props: { sidebar: true, grid: true },
     },
     { path: '/:type', component: listPage, props: { sidebar: true } },
-    // Sorted List Pages 
-    { 
+    // Sorted List Pages
+    {
         path: `/artists/${sortTypes.alpha}`,
         component: listPage,
-        props: { sidebar: true, grid: true, sortBy: `${sortTypes.alpha}` }
+        props: { sidebar: true, grid: true, sortBy: `${sortTypes.alpha}` },
     },
-    { 
+    {
         path: `/artists/${sortTypes.recent}`,
         component: listPage,
-        props: { sidebar: true, grid: true, sortBy: `${sortTypes.material}` }
+        props: { sidebar: true, grid: true, sortBy: `${sortTypes.material}` },
+    },
+    {
+        path: `/:type/${sortTypes.alpha}`,
+        component: listPage,
+        props: { sidebar: true, sortBy: `${sortTypes.alpha}` },
+    },
+    {
+        path: `/:type/${sortTypes.recent}`,
+        component: listPage,
+        props: { sidebar: true, sortBy: `${sortTypes.recent}` },
+    },
+    {
+        path: `/:type/${sortTypes.material}`,
+        component: listPage,
+        props: { sidebar: true, sortBy: `${sortTypes.material}` },
+    },
+    {
+        path: '/:type/by-episode',
+        component: listPage,
+        props: { sidebar: true, sortBy: 'by-episode' },
+    },
+    {
+        path: '/:type/by-artist',
+        component: listPage,
+        props: { sidebar: true, sortBy: 'by-artist' },
     },
-    { path: `/:type/${sortTypes.alpha}`, component: listPage, props: { sidebar: true, sortBy: `${sortTypes.alpha}` } },
-    { path: `/:type/${sortTypes.recent}`, component: listPage, props: { sidebar: true, sortBy: `${sortTypes.recent}` } },
-    { path: `/:type/${sortTypes.material}`, component: listPage, props: { sidebar: true, sortBy: `${sortTypes.material}` } },
-    { path: '/:type/by-episode', component: listPage, props: { sidebar: true, sortBy: 'by-episode' } },
-    { path: '/:type/by-artist', component: listPage, props: { sidebar: true, sortBy: 'by-artist' } },
     // Single Pages
     { path: '/:type/:slug', component: singlePage, props: { sidebar: true } },
-]
+]

vue-theme/src/store/actions.js

@@ -1,2 +1,2 @@
 // for global actions
-export default () => {}
+export default () => {}

vue-theme/src/store/getters.js

@@ -1,3 +1,2 @@
-
 // For global getters
-export default () => {}
+export default () => {}

vue-theme/src/store/index.js

@@ -18,48 +18,48 @@ const debug = process.env.NODE_ENV !== 'production'
 
 // Current page state
 const state = {
-  title: wp.site_name,
-  hero: {
-    url: 'http://sample-image-url/',
-    text: 'sample hero text',
-    playbutton: true
-  },
-  currentGallery: null,
-  view: 'list'
+    title: wp.site_name,
+    hero: {
+        url: 'http://sample-image-url/',
+        text: 'sample hero text',
+        playbutton: true,
+    },
+    currentGallery: null,
+    view: 'list',
 }
 
 const mutations = {
-  SET_HERO(state, hero) {
-    if(!hero) return
-    
-    if (hero.url) {
-      state.hero.text = state.hero.url = hero.url
-    } else {
-      state.hero.text = hero
-    }
-  },
-  SET_GALLERY(state, idList) {
-    state.gallery = idList
-  },
-  CLEAR_GALLERY(state) {
-    state.gallery = null
-  }
+    SET_HERO(state, hero) {
+        if (!hero) return
+
+        if (hero.url) {
+            state.hero.text = state.hero.url = hero.url
+        } else {
+            state.hero.text = hero
+        }
+    },
+    SET_GALLERY(state, idList) {
+        state.gallery = idList
+    },
+    CLEAR_GALLERY(state) {
+        state.gallery = null
+    },
 }
 
 const store = new Vuex.Store({
-  actions,
-  getters,
-  mutations,
-  state,
-  modules: {
-      posts,
-      pages,
-      artists,
-      episodes,
-      events,
-      exhibitions
-  },
-  strict: debug,
+    actions,
+    getters,
+    mutations,
+    state,
+    modules: {
+        posts,
+        pages,
+        artists,
+        episodes,
+        events,
+        exhibitions,
+    },
+    strict: debug,
 })
 
-export default store
+export default store

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

@@ -8,11 +8,12 @@ const state = {
 
 const getters = {
     allArtists: state => state.all,
-    allArtistsBySlug: state => Object.values(state.all).reduce((bySlug, artist) => {
-        bySlug[artist.slug] = artist
-        return bySlug
-    }, {}),
-    allArtistsLoaded: state => state.loaded
+    allArtistsBySlug: state =>
+        Object.values(state.all).reduce((bySlug, artist) => {
+            bySlug[artist.slug] = artist
+            return bySlug
+        }, {}),
+    allArtistsLoaded: state => state.loaded,
 }
 
 const actions = {
@@ -28,19 +29,29 @@ const actions = {
         console.log('getting single Artist...')
         commit('CLEAR_SINGLE_ARTIST')
         commit('ARTISTS_LOADED', false)
-        api.getSingleType('artists', id,  artist => {
+        api.getSingleType('artists', id, artist => {
             commit('STORE_FETCHED_SINGLE_ARTIST', artist)
             commit('ARTISTS_LOADED', true)
         })
-    }
+    },
 }
 
 const mutations = {
-    STORE_FETCHED_ARTISTS(state, { artists }) { state.all = artists },
-    STORE_FETCHED_SINGLE_ARTIST(state, artist) { state.singleArtist = artist },
-    CLEAR_ARTISTS(state) { state.all = [] },
-    CLEAR_SINGLE_ARTIST(state) { state.singleArtist = null },
-    ARTISTS_LOADED(state, val) { state.loaded = val },
+    STORE_FETCHED_ARTISTS(state, { artists }) {
+        state.all = artists
+    },
+    STORE_FETCHED_SINGLE_ARTIST(state, artist) {
+        state.singleArtist = artist
+    },
+    CLEAR_ARTISTS(state) {
+        state.all = []
+    },
+    CLEAR_SINGLE_ARTIST(state) {
+        state.singleArtist = null
+    },
+    ARTISTS_LOADED(state, val) {
+        state.loaded = val
+    },
 }
 
-export default { state, getters, actions, mutations }
+export default { state, getters, actions, mutations }

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

@@ -8,10 +8,11 @@ const state = {
 
 const getters = {
     allEpisodes: state => state.all,
-    allEpisodesBySlug: state => Object.values(state.all).reduce((bySlug, episode) => {
-        bySlug[episode.slug] = episode
-        return bySlug
-    }, {}),
+    allEpisodesBySlug: state =>
+        Object.values(state.all).reduce((bySlug, episode) => {
+            bySlug[episode.slug] = episode
+            return bySlug
+        }, {}),
     allEpisodesLoaded: state => state.loaded,
 }
 
@@ -27,19 +28,29 @@ const actions = {
     getSingleEpisode({ commit }, id) {
         commit('CLEAR_SINGLE_EPISODE')
         commit('EPISODES_LOADED', false)
-        api.getSingleType('episodes', id,  episode => {
+        api.getSingleType('episodes', id, episode => {
             commit('STORE_FETCHED_SINGLE_EPISODE', episode)
             commit('EPISODES_LOADED', true)
         })
-    }
+    },
 }
 
 const mutations = {
-    STORE_FETCHED_EPISODES(state, { episodes }) { state.all = episodes },
-    STORE_FETCHED_SINGLE_EPISODE(state, episode) { state.singleEpisode = episode },
-    CLEAR_EPISODES(state) { state.all = [] },
-    CLEAR_SINGLE_EPISODE(state) { state.episode = null },
-    EPISODES_LOADED(state, val) { state.loaded = val },
+    STORE_FETCHED_EPISODES(state, { episodes }) {
+        state.all = episodes
+    },
+    STORE_FETCHED_SINGLE_EPISODE(state, episode) {
+        state.singleEpisode = episode
+    },
+    CLEAR_EPISODES(state) {
+        state.all = []
+    },
+    CLEAR_SINGLE_EPISODE(state) {
+        state.episode = null
+    },
+    EPISODES_LOADED(state, val) {
+        state.loaded = val
+    },
 }
 
-export default { state, getters, actions, mutations }
+export default { state, getters, actions, mutations }

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

@@ -8,7 +8,7 @@ const state = {
 
 const getters = {
     allEvents: state => state.all,
-    allEventsLoaded: state => state.loaded
+    allEventsLoaded: state => state.loaded,
 }
 
 const actions = {
@@ -23,19 +23,29 @@ const actions = {
     getSingleEvent({ commit }, id) {
         commit('CLEAR_SINGLE_EVENT')
         commit('EVENTS_LOADED', false)
-        api.getSingleType('events', id,  event => {
+        api.getSingleType('events', id, event => {
             commit('STORE_FETCHED_SINGLE_EVENT', event)
             commit('EVENTS_LOADED', true)
         })
-    }
+    },
 }
 
 const mutations = {
-    STORE_FETCHED_EVENTS(state, { events }) { state.all = events },
-    STORE_FETCHED_SINGLE_EVENT(state, event) { state.singleEvent = event },
-    CLEAR_EVENTS(state) { state.all = [] },
-    CLEAR_SINGLE_EVENT(state) { state.singleEvent = null },
-    EVENTS_LOADED(state, val) { state.loaded = val },
+    STORE_FETCHED_EVENTS(state, { events }) {
+        state.all = events
+    },
+    STORE_FETCHED_SINGLE_EVENT(state, event) {
+        state.singleEvent = event
+    },
+    CLEAR_EVENTS(state) {
+        state.all = []
+    },
+    CLEAR_SINGLE_EVENT(state) {
+        state.singleEvent = null
+    },
+    EVENTS_LOADED(state, val) {
+        state.loaded = val
+    },
 }
 
-export default { state, getters, actions, mutations }
+export default { state, getters, actions, mutations }

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

@@ -8,7 +8,7 @@ const state = {
 
 const getters = {
     allExhibitions: state => state.all,
-    allExhibitionsLoaded: state => state.loaded
+    allExhibitionsLoaded: state => state.loaded,
 }
 
 const actions = {
@@ -23,19 +23,29 @@ const actions = {
     getSingleExhibition({ commit }, id) {
         commit('CLEAR_SINGLE_EXHIBITION')
         commit('EXHIBITIONS_LOADED', false)
-        api.getSingleType('exhibitions', id,  exhibition => {
+        api.getSingleType('exhibitions', id, exhibition => {
             commit('STORE_FETCHED_SINGLE_EXHIBITION', exhibition)
             commit('EXHIBITIONS_LOADED', true)
         })
-    }
+    },
 }
 
 const mutations = {
-    STORE_FETCHED_EXHIBITIONS(state, { exhibitions }) { state.all = exhibitions },
-    STORE_FETCHED_SINGLE_EXHIBITION(state, exhibition) { state.singleExhibition = exhibition },
-    CLEAR_EXHIBITIONS(state) { state.all = [] },
-    CLEAR_SINGLE_EXHIBITION(state) { state.singleExhibition = null },
-    EXHIBITIONS_LOADED(state, val) { state.loaded = val },
+    STORE_FETCHED_EXHIBITIONS(state, { exhibitions }) {
+        state.all = exhibitions
+    },
+    STORE_FETCHED_SINGLE_EXHIBITION(state, exhibition) {
+        state.singleExhibition = exhibition
+    },
+    CLEAR_EXHIBITIONS(state) {
+        state.all = []
+    },
+    CLEAR_SINGLE_EXHIBITION(state) {
+        state.singleExhibition = null
+    },
+    EXHIBITIONS_LOADED(state, val) {
+        state.loaded = val
+    },
 }
 
-export default { state, getters, actions, mutations }
+export default { state, getters, actions, mutations }

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

@@ -10,7 +10,7 @@ const state = {
 // getters
 const getters = {
     allPages: state => state.all,
-    allPagesLoaded: state => state.loaded
+    allPagesLoaded: state => state.loaded,
 }
 
 // actions
@@ -25,20 +25,30 @@ const actions = {
     getSinglePage({ commit }, id) {
         commit('CLEAR_SINGLE_PAGE')
         commit('PAGES_LOADED', false)
-        api.getSingleType('pages', id,  page => {
+        api.getSingleType('pages', id, page => {
             commit('STORE_FETCHED_SINGLE_PAGE', page)
             commit('PAGES_LOADED', true)
         })
-    }
+    },
 }
 
 // mutations
 const mutations = {
-    STORE_FETCHED_PAGES(state, { pages }) { state.all = pages },
-    STORE_FETCHED_SINGLE_PAGE(state, page) { state.singlePage = page },
-    CLEAR_PAGES(state) { state.all = [] },
-    CLEAR_SINGLE_PAGE(state) { state.singlePage = null },
-    PAGES_LOADED(state, val) { state.loaded = val },
+    STORE_FETCHED_PAGES(state, { pages }) {
+        state.all = pages
+    },
+    STORE_FETCHED_SINGLE_PAGE(state, page) {
+        state.singlePage = page
+    },
+    CLEAR_PAGES(state) {
+        state.all = []
+    },
+    CLEAR_SINGLE_PAGE(state) {
+        state.singlePage = null
+    },
+    PAGES_LOADED(state, val) {
+        state.loaded = val
+    },
 }
 
-export default { state, getters, actions, mutations }
+export default { state, getters, actions, mutations }

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

@@ -23,19 +23,29 @@ const actions = {
     getSinglePost({ commit }, id) {
         commit('CLEAR_SINGLE_POST')
         commit('POSTS_LOADED', false)
-        api.getSingleType('posts', id,  post => {
+        api.getSingleType('posts', id, post => {
             commit('STORE_FETCHED_SINGLE_POST', post)
             commit('POSTS_LOADED', true)
         })
-    }
+    },
 }
 
 const mutations = {
-    STORE_FETCHED_POSTS(state, { posts }) { state.all = posts },
-    STORE_FETCHED_SINGLE_POST(state, post) { state.singlePost = post },
-    CLEAR_POSTS(state) { state.all = [] },
-    CLEAR_SINGLE_POST(state) { state.singlePost = null },
-    POSTS_LOADED(state, val) { state.loaded = val },
+    STORE_FETCHED_POSTS(state, { posts }) {
+        state.all = posts
+    },
+    STORE_FETCHED_SINGLE_POST(state, post) {
+        state.singlePost = post
+    },
+    CLEAR_POSTS(state) {
+        state.all = []
+    },
+    CLEAR_SINGLE_POST(state) {
+        state.singlePost = null
+    },
+    POSTS_LOADED(state, val) {
+        state.loaded = val
+    },
 }
 
-export default { state, getters, actions, mutations }
+export default { state, getters, actions, mutations }

vue-theme/src/utils/api.js

@@ -9,38 +9,56 @@ const SETTINGS = {
 export default {
     getByType(type, sortType, cb) {
         if (sortType) {
-            return axios.get(SETTINGS.API_BASE_PATH + `sort/${type}/${sortType}`).then(response => {
-                cb(response.data)
-                return response.data
-            }).catch(e => { cb(e) })
-        }
-
-        else {
-            return axios.get(SETTINGS.API_BASE_PATH + `${type}`).then(response => {
-                cb(response.data)
-                return response.data
-            }).catch(e => { cb(e) })
+            return axios
+                .get(SETTINGS.API_BASE_PATH + `sort/${type}/${sortType}`)
+                .then(response => {
+                    cb(response.data)
+                    return response.data
+                })
+                .catch(e => {
+                    cb(e)
+                })
+        } else {
+            return axios
+                .get(SETTINGS.API_BASE_PATH + `${type}`)
+                .then(response => {
+                    cb(response.data)
+                    return response.data
+                })
+                .catch(e => {
+                    cb(e)
+                })
         }
     },
     async getSingleType(type, id, cb) {
-        await axios.get(SETTINGS.API_BASE_PATH + `${type}/${id}`).then(response => {
-            cb(Object.values(response.data)[0])
-        }).catch(e => { cb(e) })
+        await axios
+            .get(SETTINGS.API_BASE_PATH + `${type}/${id}`)
+            .then(response => {
+                cb(Object.values(response.data)[0])
+            })
+            .catch(e => {
+                cb(e)
+            })
     },
     async getSingleMedia(id, cb) {
-        await axios.get(SETTINGS.API_MEDIA_PATH + `${id}`).then(response => {
-            cb(response.data)
-        }).catch(e => { cb(e) })
+        await axios
+            .get(SETTINGS.API_MEDIA_PATH + `${id}`)
+            .then(response => {
+                cb(response.data)
+            })
+            .catch(e => {
+                cb(e)
+            })
     },
 
     getPosts(limit = 5, cb) {
         axios
-        .get(SETTINGS.API_BASE_PATH + 'posts')
-        .then(response => {
-            cb(response.data)
-        })
-        .catch(e => {
-            cb(e)
-        })
+            .get(SETTINGS.API_BASE_PATH + 'posts')
+            .then(response => {
+                cb(response.data)
+            })
+            .catch(e => {
+                cb(e)
+            })
     },
-}
+}

vue-theme/webpack.config.js

@@ -6,27 +6,28 @@ const CompressionPlugin = require('compression-webpack-plugin')
 const PostCssPlugins = [
     require('postcss-import'),
     require('precss'),
-    require('autoprefixer')
+    require('autoprefixer'),
 ]
 
 module.exports = (env = {}) => {
     return {
         mode: env.production ? 'production' : 'development',
         resolve: {
-        alias: {
+            alias: {
                 '@': path.resolve(__dirname, 'src'),
             },
-            extensions: ['*', '.js', '.sss', '.vue', '.json']
+            extensions: ['*', '.js', '.sss', '.vue', '.json'],
         },
         module: {
-            rules: [{
+            rules: [
+                {
                     test: /\.vue$/,
-                    use: ['vue-loader']
+                    use: ['vue-loader'],
                 },
                 {
                     test: /\.(js)$/,
                     loader: 'babel-loader',
-                    exclude: /node_modules/
+                    exclude: /node_modules/,
                 },
                 {
                     test: /\.pug$/,
@@ -34,42 +35,38 @@ module.exports = (env = {}) => {
                         // this applies to `<template lang="pug">` in Vue components
                         {
                             resourceQuery: /^\?vue/,
-                            use: ['pug-plain-loader']
-                        }
-                    ]
+                            use: ['pug-plain-loader'],
+                        },
+                    ],
                 },
                 {
                     test: /\.(png|jpg|gif|svg|ttf|woff2|woff)$/,
                     loader: 'url-loader',
                     options: {
                         limit: 10000,
-                        name: '[name].[ext]?[hash]'
-                    }
+                        name: '[name].[ext]?[hash]',
+                    },
                 },
                 {
                     test: /(\.html$|favicon)/,
                     loader: 'file-loader',
                     options: {
-                        name: '[name].[ext]'
-                    }
+                        name: '[name].[ext]',
+                    },
                 },
                 {
                     test: /\.(css|sss|postcss)$/,
-                    use: [
-                        'style-loader',
-                        'css-loader',
-                        'postcss-loader',
-                    ]
-                }
-            ]
+                    use: ['style-loader', 'css-loader', 'postcss-loader'],
+                },
+            ],
         },
         output: {
             path: path.join(__dirname, 'build'),
-            publicPath: '/build/'
+            publicPath: '/build/',
         },
         // https://github.com/Tech-Nomad/wue-theme
         devServer: {
-            publicPath: "/build/",
+            publicPath: '/build/',
             https: false,
             inline: true,
             noInfo: false,
@@ -81,7 +78,7 @@ module.exports = (env = {}) => {
             writeToDisk: true,
             proxy: {
                 '/': {
-                    target: "http://localhost:8080",
+                    target: 'http://localhost:8080',
                     secure: false,
                     changeOrigin: true,
                     autoRewrite: true,
@@ -94,11 +91,11 @@ module.exports = (env = {}) => {
         devtool: env.production ? false : 'cheap-module-eval-source-map',
         plugins: [
             new webpack.DefinePlugin({
-                PRODUCTION: JSON.stringify(env.production)
+                PRODUCTION: JSON.stringify(env.production),
             }),
             new VueLoaderPlugin(),
             new CompressionPlugin({ threshold: 8192 }),
-            new webpack.HotModuleReplacementPlugin()
-        ]
+            new webpack.HotModuleReplacementPlugin(),
+        ],
     }
-}
+}