Merge pull request #26 from 19pdh/feature/json-api

Feature/json api

5 files changed, 15 insertions, 24 deletions

diff --git a/components/Posts/PostLink.stories.js b/components/Posts/PostLink.stories.js
index 5fdfb6f..723ed4d 100644
--- a/components/Posts/PostLink.stories.js
+++ b/components/Posts/PostLink.stories.js
@@ -5,11 +5,14 @@ import PostLink from './PostLink'
 
 export const postLink = {
   title: 'Test PostLink',
+  author: 'Tester',
   description:
     'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pulvinar non ex non sagittis. Quisque in enim tellus. Aliquam consequat mi id sapien congue, sit amet vulputate tortor viverra. Donec.',
   route: '/kronika/2019/20/11/test',
-  image:
-    'https://images.unsplash.com/photo-1573145881456-0708c72340ca?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1350&q=80',
+  meta: {
+    image:
+      'https://images.unsplash.com/photo-1573145881456-0708c72340ca?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1350&q=80',
+  },
 }
 
 storiesOf('Posts/PostLink', module)
@@ -24,7 +27,7 @@ storiesOf('Posts/PostLink', module)
   .add('with image', () => {
     return {
       components: { PostLink },
-      template: `<post-link :title="title" :description="description" :route="route" :image="image"/>`,
+      template: `<post-link :title="title" :description="description" :route="route" :image="meta.image"/>`,
       data: () => postLink,
     }
   })
diff --git a/components/Posts/PostLink.vue b/components/Posts/PostLink.vue
index 3f80bae..b7bfab4 100644
--- a/components/Posts/PostLink.vue
+++ b/components/Posts/PostLink.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="post-link">
-    <a :href="route">
+    <nuxt-link :to="route" no-prefetch>
       <div>
         <div class="image" :style="`background-image: url('${image}')`" />
         <div class="post-container">
@@ -8,7 +8,7 @@
           <p class="post-description">{{ shortenedDescription }}...</p>
         </div>
       </div>
-    </a>
+    </nuxt-link>
   </div>
 </template>
 
@@ -31,7 +31,7 @@ export default {
     image: {
       type: String,
       required: false,
-      default: () => '/assets/og/default.jpg',
+      default: '/assets/og/default.jpg',
     },
   },
   computed: {
diff --git a/components/Posts/PostList/PurePostList.stories.js b/components/Posts/PostList/PurePostList.stories.js
index a159982..d51a551 100644
--- a/components/Posts/PostList/PurePostList.stories.js
+++ b/components/Posts/PostList/PurePostList.stories.js
@@ -4,8 +4,8 @@ import { postLink } from '../PostLink.stories'
 
 import PurePostList from './PurePostList'
 
-const postLinkNoImage = { ...postLink }
-delete postLinkNoImage['image']
+const postLinkNoImage = JSON.parse(JSON.stringify(postLink))
+delete postLinkNoImage.meta['image']
 
 export const posts = [
   ...Array(3).fill(postLinkNoImage),
diff --git a/components/Posts/PostList/PurePostList.vue b/components/Posts/PostList/PurePostList.vue
index 210973e..cdbaffc 100644
--- a/components/Posts/PostList/PurePostList.vue
+++ b/components/Posts/PostList/PurePostList.vue
@@ -12,7 +12,7 @@
           :route="post.route"
           :title="post.title"
           :description="post.description"
-          :image="post.image"
+          :image="post.meta.image"
         />
       </div>
     </transition>
diff --git a/components/Posts/PostList/index.js b/components/Posts/PostList/index.js
index 7e0b1f4..dad805d 100644
--- a/components/Posts/PostList/index.js
+++ b/components/Posts/PostList/index.js
@@ -1,23 +1,11 @@
 import axios from 'axios'
 
-import k from '~/api'
+import { apiUrl, parsePosts } from '~/api'
 import PostList from './PostList'
 
 export const getPosts = async () => {
-  if (process.client) {
-    let posts = await axios.get(`${window.location.origin}/api/posts.json`)
-    return parsePosts(posts.data)
-  } else {
-    return parsePosts(k.getPosts())
-  }
+  let posts = await axios.get(`${apiUrl}/posts.json`)
+  return parsePosts(posts.data)
 }
 
-export const parsePosts = (posts) =>
-  posts.map((post) => ({
-    title: post.content.meta.title,
-    image: post.content.meta.image,
-    description: post.content.description,
-    route: post.route,
-  }))
-
 export default PostList