fix: bugs in shared request (#3704)

packages/hoppscotch-common/src/components/share/CreateModal.vue

@@ -103,7 +103,7 @@ const widgets: Widget[] = [
   },
 ]
 
-type Tabs = "parameters" | "body" | "headers" | "authorization"
+type Tabs = "params" | "bodyParams" | "headers" | "authorization"
 
 type EmbedOption = {
   selectedTab: Tabs
@@ -116,15 +116,15 @@ type EmbedOption = {
 }
 
 const embedOption = ref<EmbedOption>({
-  selectedTab: "parameters",
+  selectedTab: "params",
   tabs: [
     {
-      value: "parameters",
+      value: "params",
       label: t("tab.parameters"),
       enabled: true,
     },
     {
-      value: "body",
+      value: "bodyParams",
       label: t("tab.body"),
       enabled: true,
     },

packages/hoppscotch-common/src/components/share/CustomizeModal.vue

@@ -225,10 +225,10 @@ const props = defineProps({
   embedOptions: {
     type: Object as PropType<EmbedOption>,
     default: () => ({
-      selectedTab: "parameters",
+      selectedTab: "params",
       tabs: [
         {
-          value: "parameters",
+          value: "params",
           label: "shared_requests.parameters",
           enabled: true,
         },
@@ -290,7 +290,7 @@ const widgets: Widget[] = [
   },
 ]
 
-type EmbedTabs = "parameters" | "body" | "headers" | "authorization"
+type EmbedTabs = "params" | "bodyParams" | "headers" | "authorization"
 
 type EmbedOption = {
   selectedTab: EmbedTabs

packages/hoppscotch-common/src/components/share/Modal.vue

@@ -56,7 +56,7 @@ import { useI18n } from "~/composables/i18n"
 
 const t = useI18n()
 
-type EmbedTabs = "parameters" | "body" | "headers" | "authorization"
+type EmbedTabs = "params" | "bodyParams" | "headers" | "authorization"
 
 type EmbedOption = {
   selectedTab: EmbedTabs
@@ -93,15 +93,15 @@ const props = defineProps({
   embedOptions: {
     type: Object as PropType<EmbedOption>,
     default: () => ({
-      selectedTab: "parameters",
+      selectedTab: "params",
       tabs: [
         {
-          value: "parameters",
+          value: "params",
           label: "shared_requests.parameters",
           enabled: true,
         },
         {
-          value: "body",
+          value: "bodyParams",
           label: "shared_requests.body",
           enabled: true,
         },

packages/hoppscotch-common/src/components/share/index.vue

@@ -21,7 +21,7 @@
       />
     </div>
     <div class="flex flex-col">
-      <div v-if="loading" class="flex flex-col items-center justify-center">
+      <div v-if="loading" class="flex flex-col items-center justify-center p-4">
         <HoppSmartSpinner class="mb-4" />
         <span class="text-secondaryLight">{{ t("state.loading") }}</span>
       </div>
@@ -136,15 +136,15 @@ const shareRequestCreatingLoading = ref(false)
 const requestToShare = ref<HoppRESTRequest | null>(null)
 
 const embedOptions = ref<EmbedOption>({
-  selectedTab: "parameters",
+  selectedTab: "params",
   tabs: [
     {
-      value: "parameters",
+      value: "params",
       label: t("tab.parameters"),
       enabled: false,
     },
     {
-      value: "body",
+      value: "bodyParams",
       label: t("tab.body"),
       enabled: false,
     },
@@ -208,7 +208,7 @@ const currentUser = useReadonlyStream(
 
 const step = ref(1)
 
-type EmbedTabs = "parameters" | "body" | "headers" | "authorization"
+type EmbedTabs = "params" | "bodyParams" | "headers" | "authorization"
 
 type EmbedOption = {
   selectedTab: EmbedTabs
@@ -249,7 +249,15 @@ const loading = computed(
 
 onLoggedIn(() => {
   try {
-    adapter.initialize()
+    // wait for a bit to let the auth token to be set
+    // because in some race conditions, the token is not set this fixes that
+    const initLoadTimeout = setTimeout(() => {
+      adapter.initialize()
+    }, 10)
+
+    return () => {
+      clearTimeout(initLoadTimeout)
+    }
   } catch (e) {
     console.error(e)
   }
@@ -313,15 +321,15 @@ const displayCustomizeRequestModal = (
       info: t("shared_requests.button_info"),
     }
     embedOptions.value = {
-      selectedTab: "parameters",
+      selectedTab: "params",
       tabs: [
         {
-          value: "parameters",
+          value: "params",
           label: t("tab.parameters"),
           enabled: false,
         },
         {
-          value: "body",
+          value: "bodyParams",
           label: t("tab.body"),
           enabled: false,
         },
@@ -451,7 +459,7 @@ const getErrorMessage = (err: GQLError<string>) => {
   }
   switch (err.error) {
     case "shortcode/not_found":
-      return t("shared_request.not_found")
+      return t("shared_requests.not_found")
     default:
       return t("error.something_went_wrong")
   }

packages/hoppscotch-common/src/components/share/templates/Embeds.vue

@@ -57,7 +57,7 @@ import { computed } from "vue"
 
 import { useI18n } from "~/composables/i18n"
 
-type Tabs = "parameters" | "body" | "headers" | "authorization"
+type Tabs = "params" | "bodyParams" | "headers" | "authorization"
 
 type EmbedOption = {
   selectedTab: Tabs