Merge pull request #563 from canopas/add-nuxt-blog-kit

Add nuxt-blog-kit
canopas · Feb 22, 2024 · 3245d28 · 3245d28
2 parents 9cdcef9 + b0d9404
commit 3245d28
Show file tree

Hide file tree

Showing 10 changed files with 1,375 additions and 1,391 deletions.
diff --git a/nuxt-frontend/components/Blog.vue b/nuxt-frontend/components/Blog.vue
@@ -11,7 +11,7 @@
       v-else
       :mixpanel="$mixpanel"
       :posts="posts"
-      :featurePosts="featurePosts"
+      :feature-posts="featurePosts"
       :count="count"
       :status="status"
     />
@@ -24,9 +24,9 @@
     >
       <BlogFooter
         :mixpanel="$mixpanel"
-        :socialMediaData="config.SOCIAL_MEDIA_DATA"
-        :apiUrl="config.STRAPI_URL"
-        :companyName="config.COMPANY_NAME"
+        :social-media-data="config.SOCIAL_MEDIA_DATA"
+        :api-url="config.STRAPI_URL"
+        :company-name="config.COMPANY_NAME"
       />
     </div>
   </div>

diff --git a/nuxt-frontend/nuxt.config.js b/nuxt-frontend/nuxt.config.js
@@ -16,7 +16,7 @@ export default defineNuxtConfig({
     "@pinia/nuxt",
     "@nuxtjs/tailwindcss",
     "nuxt-icon",
-    "@canopassoftware/blog-components",
+    "@canopassoftware/nuxt-blog-kit",
     "nuxt-lazy-hydrate",
     "@nuxtjs/sitemap",
   ],

diff --git a/nuxt-frontend/package.json b/nuxt-frontend/package.json
@@ -11,7 +11,7 @@
   },
   "devDependencies": {
     "@babel/eslint-parser": "^7.22.15",
-    "@canopassoftware/blog-components": "^1.2.4",
+    "@canopassoftware/nuxt-blog-kit": "^1.0.1",
     "@ivanv/vue-collapse-transition": "^1.0.2",
     "@nuxt/devtools": "latest",
     "@nuxtjs/sitemap": "^5.1.0",

diff --git a/nuxt-frontend/pages/[slug].vue b/nuxt-frontend/pages/[slug].vue
@@ -2,18 +2,17 @@
   <div v-if="!assets">
     <Header />
     <BlogDetail
-      :slug="slug"
       :mixpanel="$mixpanel"
-      :recaptchaKey="config.VITE_RECAPTCHA_SITE_KEY"
+      :recaptcha-key="config.VITE_RECAPTCHA_SITE_KEY"
       :post="post"
-      :websiteUrl="config.BASE_URL"
-      :contactApiUrl="config.API_BASE"
+      :website-url="config.BASE_URL"
+      :contact-api-url="config.API_BASE"
     />
     <BlogFooter
       :mixpanel="$mixpanel"
-      :socialMediaData="config.SOCIAL_MEDIA_DATA"
-      :apiUrl="config.STRAPI_URL"
-      :companyName="config.COMPANY_NAME"
+      :social-media-data="config.SOCIAL_MEDIA_DATA"
+      :api-url="config.STRAPI_URL"
+      :company-name="config.COMPANY_NAME"
     />
   </div>
 </template>

diff --git a/nuxt-frontend/pages/author/[slug].vue b/nuxt-frontend/pages/author/[slug].vue
@@ -14,11 +14,11 @@
             <Icon
               name="fa6-solid:user"
               class="w-full h-full"
-              v-if="posts[0].authorImage == null"
+              v-if="posts[0].author.image == null"
             />
             <img
               v-else
-              :src="posts[0].authorImage"
+              :src="posts[0].author.image"
               :alt="slug"
               class="w-full h-full rounded-full"
             />
@@ -27,7 +27,7 @@
           <h1
             class="my-6 md:my-10 text-2xl md:text-3xl xl:text-4xl leading-7 tracking-none capitalize font-inter-semibold"
           >
-            {{ posts[0].authorName }}
+            {{ posts[0].author.name }}
           </h1>
         </nuxt-link>
         <div class="mb-6 md:mb-10">
@@ -37,9 +37,9 @@
     </section>
     <BlogFooter
       :mixpanel="$mixpanel"
-      :socialMediaData="config.SOCIAL_MEDIA_DATA"
-      :apiUrl="config.STRAPI_URL"
-      :companyName="config.COMPANY_NAME"
+      :social-media-data="config.SOCIAL_MEDIA_DATA"
+      :api-url="config.STRAPI_URL"
+      :company-name="config.COMPANY_NAME"
     />
   </div>
 </template>

diff --git a/nuxt-frontend/pages/tag/[slug].vue b/nuxt-frontend/pages/tag/[slug].vue
@@ -29,9 +29,9 @@
     </section>
     <BlogFooter
       :mixpanel="$mixpanel"
-      :socialMediaData="config.SOCIAL_MEDIA_DATA"
-      :apiUrl="config.STRAPI_URL"
-      :companyName="config.COMPANY_NAME"
+      :social-media-data="config.SOCIAL_MEDIA_DATA"
+      :api-url="config.STRAPI_URL"
+      :company-name="config.COMPANY_NAME"
     />
   </div>
 </template>

diff --git a/nuxt-frontend/pages/unsubscribe.vue b/nuxt-frontend/pages/unsubscribe.vue
@@ -1,8 +1,8 @@
 <template>
   <div>
     <UnSubscribe
-      :companyTitle="config.COMPANY_TITLE"
-      :apiUrl="config.STRAPI_URL"
+      :company-title="config.COMPANY_TITLE"
+      :api-url="config.STRAPI_URL"
     />
   </div>
 </template>

diff --git a/nuxt-frontend/stores/tags/index.js b/nuxt-frontend/stores/tags/index.js
@@ -31,7 +31,7 @@ export const useTagListStore = defineStore("tag-list", {
               .then((response) => {
                 let posts = [];
                 response.data.data.forEach((post) => {
-                  posts.push(setPostFields(post, slug));
+                  posts.push(setPostFields(post));
                 });
                 this.items = posts;
                 this.isLoading = false;

diff --git a/nuxt-frontend/utils.js b/nuxt-frontend/utils.js
@@ -106,7 +106,7 @@ function parseImageUrls(imageUrls) {
   return imageUrls.split(",").map((url) => url.trim());
 }
 
-function setPostFields(post, slug) {
+function setPostFields(post) {
   post = post.attributes ? post.attributes : post;
   const publishedDate = post.published_on;
   const [date] = formateDate(publishedDate);
@@ -116,36 +116,28 @@ function setPostFields(post, slug) {
     ? post.image.data?.attributes
     : post.image;
   post.image_url = postImg?.url || icon;
-  post.alternativeText = postImg?.alternativeText || post.title;
+  post.alternative_text = postImg?.alternative_text || post.title;
 
   const author = post.author?.data?.attributes
     ? post.author.data?.attributes
     : post.author;
-  post.authorName = author?.name || "author";
 
   const authorImg = author?.image?.data?.attributes
     ? author?.image.data?.attributes
     : author?.image;
 
-  post.authorSlug = author ? author.username : "";
-  post.authorImage = authorImg?.url || Avatar;
-  post.authorAltText = author ? author.username + " image" : "author";
-  post.authorBio = author?.bio || "";
-  post.authorRole = author?.role || "Editor for Canopas";
+  post.author = {
+    username: author?.username || "user",
+    name: author?.name || "author",
+    image: authorImg?.url || Avatar,
+    alt_text: author ? author.username + " image" : "author",
+    bio: author?.bio || "",
+    role: author?.role || "Editor for Canopas",
+  };
 
-  if (slug && post.tags && post.tags[0]) {
-    post.tags.map((tag) => {
-      if (tag.slug == slug) {
-        post.tagName = tag.name;
-      }
-    });
-  }
-
-  let newPost = post;
-  newPost.id = post.id;
-  newPost.tagName = post.tagName;
+  post.recommended_posts = post.recommendedPosts;
 
-  return newPost;
+  return post;
 }
 
 // Formate date and time from millis