Add dynamic sitemap

canopas · Feb 21, 2024 · 403aeb4 · 403aeb4
1 parent c0dceb6
commit 403aeb4
Show file tree

Hide file tree

Showing 12 changed files with 771 additions and 164 deletions.
diff --git a/.github/workflows/deploy-backend-dev.yml b/.github/workflows/deploy-backend-dev.yml
@@ -2,8 +2,6 @@ name: DeployBackendDev
 
 on:
   push:
-    branches:
-      - "master"
 
 jobs:
   deploy-backend-dev:

diff --git a/.github/workflows/deploy-frontend-dev.yml b/.github/workflows/deploy-frontend-dev.yml
@@ -6,7 +6,7 @@ on:
     types:
       - completed
     branches:
-      - "master"
+      - "add-dynamic-sitemap"
 
 jobs:
   deploy-frontend-dev:
@@ -37,6 +37,7 @@ jobs:
           sh ./../deploy/generate-sitemap.sh https://dev-stack.canopas.com https://dev-stack-api.canopas.com
           yarn install --frozen-lockfile && yarn build
           cd .output/server && zip canopas_website_SSR_dev_${{ github.sha }}-${{ github.run_attempt }}.zip -r . && aws s3 cp canopas_website_SSR_dev_${{ github.sha }}-${{ github.run_attempt }}.zip s3://canopas-lambda-handlers && cd ../..
+          aws s3 rm s3://canopas-website-ssr-dev --recursive
           aws s3 sync --cache-control 'max-age=604800' --exclude *.html ./.output/public s3://canopas-website-ssr-dev
           aws s3 sync ./.output/public s3://canopas-website-ssr-dev
           aws cloudfront create-invalidation --distribution-id ${{ secrets.CLOUDFRONT_DISTRIBUTION_ID_DEV }} --paths "/sitemap.xml"

diff --git a/.github/workflows/deploy-frontend-prod.yml b/.github/workflows/deploy-frontend-prod.yml
@@ -5,7 +5,7 @@ on:
     workflows: ["DeployBackendProd"]
     types:
       - completed
-    branches: 
+    branches:
       - "master"
 
 jobs:
@@ -38,6 +38,7 @@ jobs:
           sh ./../deploy/generate-sitemap.sh https://canopas.com https://prod-stack-api.canopas.com
           yarn install --frozen-lockfile && yarn build
           cd .output/server && zip canopas_website_SSR_prod_${{ github.sha }}-${{ github.run_attempt }}.zip -r . && aws s3 cp canopas_website_SSR_prod_${{ github.sha }}-${{ github.run_attempt }}.zip s3://canopas-lambda-handlers && cd ../..
+          aws s3 rm s3://canopas-website-ssr-dev --recursive
           aws s3 sync --cache-control 'max-age=604800' --exclude *.html ./.output/public s3://canopas-website-ssr-prod
           aws s3 sync ./.output/public s3://canopas-website-ssr-prod
           aws cloudfront create-invalidation --distribution-id ${{ secrets.CLOUDFRONT_DISTRIBUTION_ID_PROD }} --paths "/sitemap.xml"
@@ -52,5 +53,5 @@ jobs:
           timeout-in-minutes: "10"
           no-fail-on-empty-changeset: "1"
           parameter-overrides: >-
-              EnvName=prod,
-              ZipFileName=canopas_website_SSR_prod_${{ github.sha }}-${{ github.run_attempt }}.zip
+            EnvName=prod,
+            ZipFileName=canopas_website_SSR_prod_${{ github.sha }}-${{ github.run_attempt }}.zip
diff --git a/nuxt-frontend/nuxt.config.js b/nuxt-frontend/nuxt.config.js
@@ -18,7 +18,16 @@ export default defineNuxtConfig({
     "nuxt-icon",
     "@canopassoftware/blog-components",
     "nuxt-lazy-hydrate",
+    "@nuxtjs/sitemap",
   ],
+  sitemap: {
+    defaults: {
+      lastmod: new Date(),
+    },
+    sources: [config.API_BASE + "/api/sitemap"],
+    xsl: false,
+    xslTips: false,
+  },
   css: ["~/assets/css/global.css", "~/assets/css/app.css"],
   generate: { fallback: true },
   imports: {
@@ -49,9 +58,9 @@ export default defineNuxtConfig({
     "/android-app-development": { prerender: true },
     "/ios-app-development": { prerender: true },
     "/mobile-app-development": { prerender: true },
-    "/backend-app-development": { prerender: true },
-    "/flutter-app-development": { prerender: true },
-    "/frontend-development": { prerender: true },
+    "/backend-development": { prerender: true, sitemap: !config.IS_PROD },
+    "/flutter-app-development": { prerender: true, sitemap: !config.IS_PROD },
+    "/frontend-development": { prerender: true, sitemap: !config.IS_PROD },
     "/thank-you": { prerender: true },
     "/unsubscribe": { prerender: true },
   },

diff --git a/nuxt-frontend/package.json b/nuxt-frontend/package.json
@@ -14,6 +14,7 @@
     "@canopassoftware/blog-components": "^1.2.4",
     "@ivanv/vue-collapse-transition": "^1.0.2",
     "@nuxt/devtools": "latest",
+    "@nuxtjs/sitemap": "^5.1.0",
     "@types/lozad": "^1.16.4",
     "@vue/cli-plugin-babel": "^5.0.8",
     "@vue/cli-plugin-eslint": "^5.0.8",

diff --git a/nuxt-frontend/pages/author/[slug].vue b/nuxt-frontend/pages/author/[slug].vue
@@ -1,8 +1,15 @@
 <template>
-  <div>
+  <div :class="slug == '' || status == config.NOT_FOUND ? 'h-screen' : ''">
     <Header />
-    <section v-if="slug !== ''" class="container min-h-[50vh]">
-      <div class="md:mx-8 xl:mx-20">
+
+    <section class="container min-h-[50vh]">
+      <div
+        v-if="status == config.NOT_FOUND"
+        class="h-1/2 flex text-[1.4rem] text-black-900 items-center justify-center"
+      >
+        {{ config.POST_NOT_FOUND_MESSAGE }}
+      </div>
+      <div v-else class="md:mx-8 xl:mx-20">
         <nuxt-link :to="'/author/' + slug" class="flex space-x-4 items-center">
           <div class="w-8 h-8 md:w-9 md:h-9">
             <Icon
@@ -50,15 +57,16 @@ const slug = ref(route.params.slug);
 const posts = ref([]);
 const store = useAuthorListStore();
 const resources = computed(() => store.items);
-const count = computed(() => store.totalPosts);
 const status = computed(() => store.status);
 let postLimit = 10;
 
 await useAsyncData("authors", () =>
   store.loadAuthorBlogs(config.SHOW_DRAFT_POSTS, slug.value, 0, postLimit),
 );
 
-posts.value = resources.value?.slice(0, postLimit);
+if (status.value === config.SUCCESS) {
+  posts.value = resources.value?.slice(0, postLimit);
+}
 
 const handleScroll = () => {
   if (
@@ -79,13 +87,6 @@ onUnmounted(() => {
   window.removeEventListener("scroll", handleScroll);
 });
 
-if (status.value !== config.SUCCESS) {
-  navigateTo({
-    name: "Error404Page",
-    params: { pathMatch: ["author", slug.value] },
-  });
-}
-
 useSeoMeta({
   title: "Stories by " + slug.value + " | Canopas",
   ogTitle: "Stories by " + slug.value + " | Canopas",

diff --git a/nuxt-frontend/pages/tag/[slug].vue b/nuxt-frontend/pages/tag/[slug].vue
@@ -1,8 +1,14 @@
 <template>
   <div>
     <Header />
+    <div
+      v-if="slug == '' || status == config.NOT_FOUND"
+      class="h-1/2 flex text-[1.4rem] text-black-900 items-center justify-center"
+    >
+      {{ config.POST_NOT_FOUND_MESSAGE }}
+    </div>
     <section
-      v-if="slug !== ''"
+      v-else
       class="container min-h-[50vh] my-10 md:my-16 sm:mx-auto 3xl:px-24"
     >
       <div class="md:mx-8 xl:mx-20">
@@ -42,13 +48,14 @@ const slug = ref(route.params.slug);
 const posts = ref([]);
 const store = useTagListStore();
 const resources = computed(() => store.items);
-const count = computed(() => store.totalPosts);
 const status = computed(() => store.status);
 let postLimit = 2;
 
 await useAsyncData("tags", () => store.loadTagBlogs(slug.value, 0, postLimit));
 
-posts.value = resources.value?.slice(0, postLimit);
+if (status.value === config.SUCCESS) {
+  posts.value = resources.value?.slice(0, postLimit);
+}
 
 const tagName = posts.value[0].tags.filter((tag) => tag.slug === slug.value)[0]
   .name;
@@ -72,13 +79,6 @@ onUnmounted(() => {
   window.removeEventListener("scroll", handleScroll);
 });
 
-if (status.value !== config.SUCCESS) {
-  navigateTo({
-    name: "Error404Page",
-    params: { pathMatch: ["tag", slug.value] },
-  });
-}
-
 useSeoMeta({
   title: "Stories on " + slug.value + " | Canopas",
   ogTitle: "Stories on " + slug.value + " | Canopas",

diff --git a/nuxt-frontend/stores/author/index.js b/nuxt-frontend/stores/author/index.js
@@ -14,7 +14,7 @@ export const useAuthorListStore = defineStore("authors", {
   },
   actions: {
     async loadAuthorBlogs(showDrafts, slug, start, limit) {
-      return new Promise((resolve) => {
+      return new Promise((resolve, reject) => {
         this.isLoading = true;
         this.error = null;
 
@@ -36,22 +36,32 @@ export const useAuthorListStore = defineStore("authors", {
           limitQuery;
 
         axios
-          .get(url)
-          .then((response) => {
-            let posts = [];
-            response.data.data.forEach((post) => {
-              posts.push(setPostFields(post));
-            });
-            this.items = posts;
-            this.isLoading = false;
-            this.status = posts.length > 0 ? response.status : config.NOT_FOUND;
-            resolve();
+          .get(config.STRAPI_URL + "/favicon.ico")
+          .then(() => {
+            axios
+              .get(url)
+              .then((response) => {
+                let posts = [];
+                response.data.data.forEach((post) => {
+                  posts.push(setPostFields(post));
+                });
+                this.items = posts;
+                this.isLoading = false;
+                this.status =
+                  posts.length > 0 ? response.status : config.NOT_FOUND;
+                resolve();
+              })
+              .catch((error) => {
+                this.error = error;
+                this.isLoading = false;
+                this.status = config.NOT_FOUND;
+                resolve();
+              });
           })
           .catch((error) => {
             this.error = error;
-            this.isLoading = false;
             this.status = config.NOT_FOUND;
-            resolve();
+            reject(error);
           });
       });
     },

diff --git a/nuxt-frontend/stores/tags/index.js b/nuxt-frontend/stores/tags/index.js
@@ -14,7 +14,7 @@ export const useTagListStore = defineStore("tag-list", {
   },
   actions: {
     async loadTagBlogs(slug) {
-      return new Promise((resolve) => {
+      return new Promise((resolve, reject) => {
         this.isLoading = true;
         this.error = null;
 
@@ -23,24 +23,32 @@ export const useTagListStore = defineStore("tag-list", {
           "/v1/tag/" +
           slug +
           "?populate=deep&publicationState=live";
-
         axios
-          .get(url)
-          .then((response) => {
-            let posts = [];
-            response.data.data.forEach((post) => {
-              posts.push(setPostFields(post, slug));
-            });
-            this.items = posts;
-            this.isLoading = false;
-            this.status = posts.length > 0 ? response.status : config.NOT_FOUND;
-            resolve();
+          .get(config.STRAPI_URL + "/favicon.ico")
+          .then(() => {
+            axios
+              .get(url)
+              .then((response) => {
+                let posts = [];
+                response.data.data.forEach((post) => {
+                  posts.push(setPostFields(post, slug));
+                });
+                this.items = posts;
+                this.isLoading = false;
+                this.status =
+                  posts.length > 0 ? response.status : config.NOT_FOUND;
+                resolve();
+              })
+              .catch((error) => {
+                this.error = error;
+                this.isLoading = false;
+                this.status = config.NOT_FOUND;
+                resolve();
+              });
           })
           .catch((error) => {
-            this.error = error;
-            this.isLoading = false;
             this.status = config.NOT_FOUND;
-            resolve();
+            reject(error);
           });
       });
     },
-Original file line number
+Diff line change
@@ Expand Up / @@ -2,8 +2,6 @@ name: DeployBackendDev @@
     on:
       push:
-        branches:
-          - "master"
     jobs:
       deploy-backend-dev:
@@ Expand Down @@