:bug: fixed page route bug | have to block template wth v-if

vue-theme/package.json

@@ -15,35 +15,35 @@
   "author": "TOJ",
   "license": "UNLICENSED",
   "devDependencies": {
-    "@babel/core": "^7.12.3",
+    "@babel/core": "^7.12.10",
     "@babel/plugin-syntax-dynamic-import": "^7.8.3",
-    "@babel/preset-env": "^7.9.0",
-    "@vue/compiler-sfc": "^3.0.2",
-    "axios": "^0.19.2",
-    "babel-loader": "^8.1.0",
+    "@babel/preset-env": "^7.12.11",
+    "@vue/compiler-sfc": "^3.0.5",
+    "axios": "^0.21.1",
+    "babel-loader": "^8.2.2",
     "css-loader": "^3.6.0",
-    "file-loader": "^6.1.1",
+    "file-loader": "^6.2.0",
     "postcss-calc": "^7.0.5",
     "postcss-import": "^12.0.1",
     "postcss-loader": "^3.0.0",
     "precss": "^4.0.0",
     "pug": "^2.0.4",
-    "pug-plain-loader": "^1.0.0",
+    "pug-plain-loader": "^1.1.0",
     "style-loader": "^2.0.0",
     "sugarss": "^2.0.0",
-    "url-loader": "^4.0.0",
+    "url-loader": "^4.1.1",
     "vue-hot-reload-api": "^2.3.4",
-    "vue-loader": "^16.0.0-beta.8",
+    "vue-loader": "^16.1.2",
     "vue-template-compiler": "^2.6.12",
-    "webpack": "^4.44.2",
+    "webpack": "^4.45.0",
     "webpack-cli": "^3.3.12",
-    "webpack-dev-server": "^3.11.0"
+    "webpack-dev-server": "^3.11.1"
   },
   "dependencies": {
     "compression-webpack-plugin": "^3.1.0",
-    "vue": "^3.0.2",
-    "vue-router": "^4.0.0-rc.1",
-    "vuex": "^4.0.0-beta.4"
+    "vue": "^3.0.5",
+    "vue-router": "^4.0.2",
+    "vuex": "^4.0.0-rc.2"
   },
   "babel": {
     "presets": [

vue-theme/src/components/navigation/navigation.vue

@@ -9,16 +9,16 @@ nav.main.f-row.center
         li.f-grow
             p  
         li
-            router-link(to="/")
+            router-link(:to="`/`")
                 p.t-up home
         li
-            router-link(to="/posts")
+            router-link(:to="`/posts`")
                 p.t-up news
         li
-            router-link(to="/artists")
+            router-link(:to="`/artists`")
                 p.t-up artists
         li
-            router-link(to="/episodes")
+            router-link(:to="`/episodes`")
                 p.t-up episodes
 </template>
 

vue-theme/src/pages/index.vue

@@ -3,25 +3,25 @@
 .page--index.f-row.between
     article.f-grow
         .f-row
-            section(v-if="allEpisodesLoaded").shadow
+            section(v-if="allEpisodesLoaded && allEpisodes.length").shadow
                 router-link(:to="`./episodes`")
                     h4.t-cap episodes
                 router-link(:to="{ path: `/episodes/${Object.values(allEpisodes)[0].slug}` }")
                     p {{ Object.values(allEpisodes)[0].title }}
 
-            section(v-if="allArtistsLoaded").shadow
+            section(v-if="allArtistsLoaded && allArtists.length").shadow
                 router-link(:to="`./artists`")
                     h4.t-cap artists
                 router-link(:to="{ path: `/artists/${Object.values(allArtists)[0].slug}` }")
                     p {{ Object.values(allArtists)[0].title }}
                     
-            section(v-if="allPagesLoaded").shadow
+            section(v-if="allPagesLoaded && allPages.length").shadow
                 h4.t-cap pages
                 router-link(:to="{ path: `/pages/${Object.values(allPages)[0].slug}` }")
                     p {{ Object.values(allPages)[0].title }}
         
         .f-row
-            section(v-if="allPostsLoaded").shadow
+            section(v-if="allPostsLoaded && allPosts.length").shadow
                 router-link(:to="`./posts`")
                     h4.t-cap posts
                 router-link(:to="{ path: `/posts/${Object.values(allPosts)[0].slug}` }")

vue-theme/src/pages/list.vue

@@ -7,7 +7,7 @@
                 h1  sorted by {{ sortBy.replace('-', ' ') }}
 
         .posts(:class="{ 'is-grid': isGrid }")
-            section(v-for="post in posts").shadow
+            section(v-for="post in posts" :key="post.slug").shadow.post
                 router-link(:to="`/${type}/${post.slug}`")
                     h4 {{ post.title }} 
                     p(style="font-size: 9px;") {{ post.date }}

vue-theme/src/pages/single.vue

@@ -1,32 +1,28 @@
 <template lang="pug">
 .page--single.f-row.between
-    article.f-grow.shadow
+    article(v-if="post").f-grow.shadow
         header
-            h1 {{ type }}:{{ $route.params.slug }} single
-            p categories: 
-                span(v-for="category in post.categories") {{ category }}&nbsp;
+            h1 {{ type }}:{{ $route.params.slug }} {{ post.title }}
+            p categories: {{ post.categories }}
 
-        section(v-if="post")
-            h4 {{ post.title }}
+        .post-single.block-wrapper(v-for="(block, i) in post.blocks" :key="`block-${i}`")
+            //- ?: are objects are always gallery blocks
+            .gallery.block(v-if="typeof block === 'object'")
+                p gallery number: {{ i }}
+                ul
+                    li(v-for="(imageID, j) in post.galleries[block.gallery].ids") 
+                        button(@click="openGallery(i - 1, j)") gallery: {{ i }} image: {{ imageID }}
+                //- Fullscreen gallery
+                gallery(
+                    v-if="activeGalleryIndex == (i - 1)"
+                    :image-ids="post.galleries[block.gallery].ids"
+                    :activeImageIndex="activeImageIndex"
+                    v-on:close="activeGalleryIndex = -1"
+                    :image-sizes="post.attached"
+                )
 
-            .block-wrapper(v-for="(block, i) in post.blocks")
-                    //- ?: are objects are always gallery blocks
-                    .gallery.block(v-if="typeof block === 'object'")
-                        p gallery number: {{ i }}
-                        ul
-                            li(v-for="(imageID, j) in post.galleries[block.gallery].ids") 
-                                button(@click="openGallery(i - 1, j)") gallery: {{ i }} image: {{ imageID }}
-                        //- Fullscreen gallery
-                        gallery(
-                            v-if="activeGalleryIndex == (i - 1)"
-                            :image-ids="post.galleries[block.gallery].ids"
-                            :activeImageIndex="activeImageIndex"
-                            v-on:close="activeGalleryIndex = -1"
-                            :image-sizes="post.attached"
-                        )
-
-                    //- Just a regular block
-                    .block(v-else v-html="block")
+            //- Just a regular block
+            .block(v-else v-html="block")
 
     sidebar(v-if="sidebar" :type="`${type}`")
         .shadow

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

@@ -6,8 +6,8 @@ const state = {
 }
 
 const getters = {
-    allArtists: state => state.all,
-    allArtistsLoaded: state => state.loaded,
+    allMedia: state => state.all,
+    allMediaLoaded: state => state.loaded,
 }
 
 const actions = {