Manage state for already scheduled meeting user

nuxt-frontend/components/contact/CalendlyIframe.vue

@@ -20,6 +20,9 @@
 <script type="module">
 import config from "@/config.js";
 import loader from "@/assets/images/theme/loader.svg";
+import { contactDetailStore } from "@/stores/contact";
+
+const store = contactDetailStore();
 
 export default {
   data() {
@@ -68,9 +71,13 @@ export default {
       ) {
         setTimeout(() => {
           this.$emit("close");
+          this.setIsMeetingScheduled();
         }, 2000);
       }
     },
+    async setIsMeetingScheduled() {
+      await useAsyncData("contact", () => store.setMeetingScheduled());
+    },
   },
 };
 </script>

nuxt-frontend/pages/thank-you.vue

@@ -56,6 +56,10 @@ import Header from "@/components/partials/NewHeader.vue";
 import LandingSection from "@/components/contact/thank-you/LandingSection.vue";
 import { elementInViewPort } from "@/utils.js";
 import CalendlyIframe from "@/components/contact/CalendlyIframe.vue";
+import { contactDetailStore } from "@/stores/contact";
+
+const store = contactDetailStore();
+const isMeetingScheduled = computed(() => store.isMeetingScheduled);
 
 const BenefitSection = defineAsyncComponent(
   () => import("@/components/contact/thank-you/BenefitSection.vue"),
@@ -100,7 +104,10 @@ onMounted(() => {
   });
   window.addEventListener("scroll", sendEvent);
   $mixpanel.track("view_thankyou_page");
-  openCalendlyIframe();
+
+  if (!isMeetingScheduled.value) {
+    openCalendlyIframe();
+  }
 });
 
 onUnmounted(() => {

nuxt-frontend/stores/contact/index.js

@@ -0,0 +1,16 @@
+import { defineStore } from "pinia";
+
+export const contactDetailStore = defineStore("contact-detail", {
+  state: () => {
+    return {
+      isMeetingScheduled: false,
+    };
+  },
+  actions: {
+    async setMeetingScheduled() {
+      return new Promise(() => {
+        this.isMeetingScheduled = true;
+      });
+    },
+  },
+});