chore: Gist export flow updates

packages/hoppscotch-common/locales/en.json

@@ -313,10 +313,12 @@
   "export": {
     "as_json": "Export as JSON",
     "create_secret_gist": "Create secret Gist",
+    "create_secret_gist_tooltip_text": "Export as secret Gist",
     "failed": "Something went wrong while exporting",
-    "gist_created": "Gist created",
+    "secret_gist_success": "Successfully exported as secret Gist",
     "require_github": "Login with GitHub to create secret gist",
-    "title": "Export"
+    "title": "Export",
+    "success": "Successfully exported"
   },
   "filter": {
     "all": "All",

packages/hoppscotch-common/src/components/collections/ImportExport.vue

@@ -83,6 +83,8 @@ const currentUser = useReadonlyStream(
   platform.auth.getCurrentUser()
 )
 
+const myCollections = useReadonlyStream(restCollections$, [])
+
 const showImportFailedError = () => {
   toast.error(t("import.failed"))
 }
@@ -469,11 +471,20 @@ const HoppGistCollectionsExporter: ImporterOrExporter = {
     disabled: !currentUser.value
       ? true
       : currentUser.value.provider !== "github.com",
-    title: t("export.create_secret_gist"),
+    title:
+      // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+      // @ts-ignore
+      currentUser?.value.provider === "github.com"
+        ? "export.create_secret_gist_tooltip_text"
+        : "export.require_github",
     applicableTo: ["personal-workspace", "team-workspace"],
     isLoading: isHoppGistCollectionExporterInProgress,
   },
   action: async () => {
+    if (!myCollections.value.length) {
+      return toast.error(t("error.no_collections_to_export"))
+    }
+
     isHoppGistCollectionExporterInProgress.value = true
 
     const collectionJSON = await getCollectionJSON()
@@ -486,13 +497,29 @@ const HoppGistCollectionsExporter: ImporterOrExporter = {
     }
 
     if (E.isRight(collectionJSON)) {
-      collectionsGistExporter(collectionJSON.right, accessToken)
+      const res = await collectionsGistExporter(
+        collectionJSON.right,
+        accessToken
+      )
+
+      console.log(JSON.stringify(res, null, 2))
+
+      if (E.isLeft(res)) {
+        toast.error(t("export.failed"))
+        return
+      }
+
+      toast.success(t("export.secret_gist_success"))
 
       platform.analytics?.logEvent({
         type: "HOPP_EXPORT_COLLECTION",
         exporter: "gist",
         platform: "rest",
       })
+
+      if (res.right) {
+        window.open(res.right, "_blank")
+      }
     }
 
     isHoppGistCollectionExporterInProgress.value = false
@@ -560,8 +587,6 @@ const selectedTeamID = computed(() => {
     : undefined
 })
 
-const myCollections = useReadonlyStream(restCollections$, [])
-
 const getCollectionJSON = async () => {
   if (
     props.collectionsType.type === "team-collections" &&

packages/hoppscotch-common/src/components/collections/graphql/ImportExport.vue

@@ -15,6 +15,7 @@ import { HoppCollection } from "@hoppscotch/data"
 import { ImporterOrExporter } from "~/components/importExport/types"
 import { FileSource } from "~/helpers/import-export/import/import-sources/FileSource"
 import { GistSource } from "~/helpers/import-export/import/import-sources/GistSource"
+import { ref } from "vue"
 
 import * as E from "fp-ts/Either"
 
@@ -42,6 +43,10 @@ const currentUser = useReadonlyStream(
   platform.auth.getCurrentUser()
 )
 
+const gqlCollections = useReadonlyStream(graphqlCollections$, [])
+
+const isGqlCollectionGistExportInProgress = ref(false)
+
 const GqlCollectionsHoppImporter: ImporterOrExporter = {
   metadata: {
     id: "import.from_json",
@@ -119,8 +124,6 @@ const GqlCollectionsGistImporter: ImporterOrExporter = {
   }),
 }
 
-const gqlCollections = useReadonlyStream(graphqlCollections$, [])
-
 const GqlCollectionsHoppExporter: ImporterOrExporter = {
   metadata: {
     id: "export.as_json",
@@ -159,25 +162,31 @@ const GqlCollectionsGistExporter: ImporterOrExporter = {
   metadata: {
     id: "export.as_gist",
     name: "export.create_secret_gist",
-    title: !currentUser
-      ? "export.require_github"
-      : // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-        // @ts-ignore
-        currentUser.provider !== "github.com"
-        ? `export.require_github`
-        : "export.create_secret_gist",
+    title:
+      // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+      // @ts-ignore
+      currentUser?.value.provider === "github.com"
+        ? "export.create_secret_gist_tooltip_text"
+        : "export.require_github",
     icon: IconUser,
     disabled: !currentUser.value
       ? true
       : currentUser.value.provider !== "github.com",
     applicableTo: ["personal-workspace"],
+    isLoading: isGqlCollectionGistExportInProgress,
   },
   action: async () => {
+    if (!gqlCollections.value.length) {
+      return toast.error(t("error.no_collections_to_export"))
+    }
+
     if (!currentUser.value) {
       toast.error(t("profile.no_permission"))
       return
     }
 
+    isGqlCollectionGistExportInProgress.value = true
+
     const accessToken = currentUser.value?.accessToken
 
     if (accessToken) {
@@ -191,7 +200,7 @@ const GqlCollectionsGistExporter: ImporterOrExporter = {
         return
       }
 
-      toast.success(t("export.success"))
+      toast.success(t("export.secret_gist_success"))
 
       platform.analytics?.logEvent({
         type: "HOPP_EXPORT_COLLECTION",
@@ -201,6 +210,8 @@ const GqlCollectionsGistExporter: ImporterOrExporter = {
 
       platform.io.openExternalLink(res.right)
     }
+
+    isGqlCollectionGistExportInProgress.value = false
   },
 }
 

packages/hoppscotch-common/src/components/environments/ImportExport.vue

@@ -30,6 +30,7 @@ import { GQLError } from "~/helpers/backend/GQLClient"
 import { CreateTeamEnvironmentMutation } from "~/helpers/backend/graphql"
 import { postmanEnvImporter } from "~/helpers/import-export/import/postmanEnv"
 import { insomniaEnvImporter } from "~/helpers/import-export/import/insomniaEnv"
+import { ref } from "vue"
 
 import IconFolderPlus from "~icons/lucide/folder-plus"
 import IconPostman from "~icons/hopp/postman"
@@ -58,6 +59,8 @@ const currentUser = useReadonlyStream(
   platform.auth.getCurrentUser()
 )
 
+const isEnvironmentGistExportInProgress = ref(false)
+
 const isTeamEnvironment = computed(() => {
   return props.environmentType === "TEAM_ENV"
 })
@@ -262,21 +265,28 @@ const HoppEnvironmentsGistExporter: ImporterOrExporter = {
     title:
       // eslint-disable-next-line @typescript-eslint/ban-ts-comment
       // @ts-ignore
-      currentUser?.provider === "github.com"
-        ? "export.create_secret_gist"
+      currentUser?.value.provider === "github.com"
+        ? "export.create_secret_gist_tooltip_text"
         : "export.require_github",
     icon: IconUser,
     disabled: !currentUser.value
       ? true
       : currentUser.value.provider !== "github.com",
     applicableTo: ["personal-workspace", "team-workspace"],
+    isLoading: isEnvironmentGistExportInProgress,
   },
   action: async () => {
+    if (!environmentJson.value.length) {
+      return toast.error(t("error.no_environments_to_export"))
+    }
+
     if (!currentUser.value) {
       toast.error(t("profile.no_permission"))
       return
     }
 
+    isEnvironmentGistExportInProgress.value = true
+
     const accessToken = currentUser.value?.accessToken
 
     if (accessToken) {
@@ -287,10 +297,11 @@ const HoppEnvironmentsGistExporter: ImporterOrExporter = {
 
       if (E.isLeft(res)) {
         toast.error(t("export.failed"))
+        isEnvironmentGistExportInProgress.value = false
         return
       }
 
-      toast.success(t("export.success"))
+      toast.success(t("export.secret_gist_success"))
 
       platform.analytics?.logEvent({
         type: "HOPP_EXPORT_ENVIRONMENT",
@@ -299,6 +310,8 @@ const HoppEnvironmentsGistExporter: ImporterOrExporter = {
 
       platform.io.openExternalLink(res.right)
     }
+
+    isEnvironmentGistExportInProgress.value = false
   },
 }
 

packages/hoppscotch-common/src/helpers/import-export/export/gistExport.ts

@@ -18,5 +18,5 @@ export const collectionsGistExporter = async (
   if (E.isLeft(res)) {
     return E.left(res.left)
   }
-  return E.right(true)
+  return E.right(res.right.data.html_url as string)
 }