Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

hotfix: graphql connection error handler #4523

Merged
Prev Previous commit
Next Next commit
fix: handle graphql connection error and display error message
  • Loading branch information
anwarulislam committed Nov 9, 2024
commit bf21040df500eeacd1b23e87b26052cc416aaca1
2 changes: 1 addition & 1 deletion packages/hoppscotch-common/locales/en.json
Original file line number Diff line number Diff line change
Expand Up @@ -452,7 +452,7 @@
},
"graphql": {
"connection_switch_confirm": "Do you want to connect with the latest GraphQL endpoint?",
"connection_error_http": "HTTP Error",
"connection_error_http": "Failed to fetch GraphQL Schema due to network error.",
"connection_switch_new_url": "Switching to a tab will disconnected you from the active GraphQL connection. New connection URL is",
"connection_switch_url": "You're connected to a GraphQL endpoint the connection URL is",
"mutations": "Mutations",
Expand Down
10 changes: 9 additions & 1 deletion packages/hoppscotch-common/src/pages/graphql.vue
Original file line number Diff line number Diff line change
Expand Up @@ -87,7 +87,8 @@
import { usePageHead } from "@composables/head"
import { useI18n } from "@composables/i18n"
import { useService } from "dioc/vue"
import { computed, onBeforeUnmount, ref } from "vue"
import { computed, onBeforeUnmount, ref, watch } from "vue"
import { useToast } from "~/composables/toast"
import { defineActionHandler } from "~/helpers/actions"
import { connection, disconnect } from "~/helpers/graphql/connection"
import { getDefaultGQLRequest } from "~/helpers/graphql/default"
Expand All @@ -97,6 +98,7 @@ import { HoppTab } from "~/services/tab"
import { GQLTabService } from "~/services/tab/graphql"

const t = useI18n()
const toast = useToast()
const tabs = useService(GQLTabService)

const currentTabID = computed(() => tabs.currentTabID.value)
Expand Down Expand Up @@ -176,6 +178,12 @@ const onTabUpdate = (tab: HoppTab<HoppGQLDocument>) => {
tabs.updateTab(tab)
}

const connectionError = computed(() => connection.error)

watch(connectionError, (error) => {
if (error) toast.error(error.message(t))
})

onBeforeUnmount(() => {
if (connection.state === "CONNECTED") {
disconnect()
Expand Down