chore: merge hoppscotch/staging into self-hosted/main

packages/hoppscotch-common/src/components.d.ts

@@ -98,8 +98,8 @@ declare module '@vue/runtime-core' {
     HttpTestResultReport: typeof import('./components/http/TestResultReport.vue')['default']
     HttpTests: typeof import('./components/http/Tests.vue')['default']
     HttpURLEncodedParams: typeof import('./components/http/URLEncodedParams.vue')['default']
+    IconLucideAlertTriangle: typeof import('~icons/lucide/alert-triangle')['default']
     IconLucideArrowLeft: typeof import('~icons/lucide/arrow-left')['default']
-    IconLucideBrush: typeof import('~icons/lucide/brush')['default']
     IconLucideCheckCircle: typeof import('~icons/lucide/check-circle')['default']
     IconLucideChevronRight: typeof import('~icons/lucide/chevron-right')['default']
     IconLucideGlobe: typeof import('~icons/lucide/globe')['default']
@@ -108,7 +108,6 @@ declare module '@vue/runtime-core' {
     IconLucideInfo: typeof import('~icons/lucide/info')['default']
     IconLucideLayers: typeof import('~icons/lucide/layers')['default']
     IconLucideMinus: typeof import('~icons/lucide/minus')['default']
-    IconLucideRss: typeof import('~icons/lucide/rss')['default']
     IconLucideSearch: typeof import('~icons/lucide/search')['default']
     IconLucideUser: typeof import('~icons/lucide/user')['default']
     IconLucideUsers: typeof import('~icons/lucide/users')['default']

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

@@ -234,6 +234,7 @@ import {
   getFoldersByPath,
   resolveSaveContextOnCollectionReorder,
   updateSaveContextForAffectedRequests,
+  resetTeamRequestsContext,
 } from "~/helpers/collection/collection"
 import { currentReorderingStatus$ } from "~/newstore/reordering"
 
@@ -990,10 +991,10 @@ const removeCollection = (id: string) => {
  * since folder is treated as collection in the BE.
  * @param collectionID - ID of the collection or folder to be deleted.
  */
-const removeTeamCollectionOrFolder = (collectionID: string) => {
+const removeTeamCollectionOrFolder = async (collectionID: string) => {
   modalLoadingState.value = true
 
-  pipe(
+  await pipe(
     deleteCollection(collectionID),
     TE.match(
       (err: GQLError<string>) => {
@@ -1047,7 +1048,9 @@ const onRemoveCollection = () => {
       emit("select", null)
     }
 
-    removeTeamCollectionOrFolder(collectionID)
+    removeTeamCollectionOrFolder(collectionID).then(() => {
+      resetTeamRequestsContext()
+    })
   }
 }
 
@@ -1099,7 +1102,9 @@ const onRemoveFolder = () => {
       emit("select", null)
     }
 
-    removeTeamCollectionOrFolder(collectionID)
+    removeTeamCollectionOrFolder(collectionID).then(() => {
+      resetTeamRequestsContext()
+    })
   }
 }
 

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

@@ -255,15 +255,6 @@ watch(
   }
 )
 
-watch(
-  () => environmentType.value.selectedTeam,
-  (newTeam) => {
-    if (newTeam) {
-      adapter.changeTeamID(newTeam.id)
-    }
-  }
-)
-
 const switchToMyEnvironments = () => {
   environmentType.value.selectedTeam = undefined
   updateEnvironmentType("my-environments")
@@ -282,17 +273,10 @@ const updateEnvironmentType = (newEnvironmentType: EnvironmentType) => {
 }
 
 watch(
-  () => environmentType.value.selectedTeam?.id,
-  (newTeamID) => {
-    adapter.changeTeamID(newTeamID)
-  }
-)
-
-watch(
-  () => currentUser.value,
-  (newValue) => {
-    if (!newValue) {
-      switchToMyEnvironments()
+  () => environmentType.value.selectedTeam,
+  (newTeam) => {
+    if (newTeam) {
+      adapter.changeTeamID(newTeam.id)
     }
   }
 )
@@ -320,6 +304,15 @@ watch(
   }
 )
 
+watch(
+  () => currentUser.value,
+  (newValue) => {
+    if (!newValue) {
+      switchToMyEnvironments()
+    }
+  }
+)
+
 const showModalDetails = ref(false)
 const action = ref<"new" | "edit">("edit")
 const editingEnvironmentIndex = ref<"Global" | null>(null)

packages/hoppscotch-common/src/components/environments/teams/index.vue

@@ -125,14 +125,14 @@ import { useColorMode } from "~/composables/theming"
 import IconPlus from "~icons/lucide/plus"
 import IconArchive from "~icons/lucide/archive"
 import IconHelpCircle from "~icons/lucide/help-circle"
-import { Team } from "~/helpers/backend/graphql"
 import { defineActionHandler } from "~/helpers/actions"
+import { GetMyTeamsQuery } from "~/helpers/backend/graphql"
 
 const t = useI18n()
 
 const colorMode = useColorMode()
 
-type SelectedTeam = Team | undefined
+type SelectedTeam = GetMyTeamsQuery["myTeams"][number] | undefined
 
 const props = defineProps<{
   team: SelectedTeam

packages/hoppscotch-common/src/helpers/collection/collection.ts

@@ -1,6 +1,9 @@
 import { HoppCollection, HoppRESTRequest } from "@hoppscotch/data"
 import { getTabsRefTo } from "../rest/tab"
 import { getAffectedIndexes } from "./affectedIndex"
+import { GetSingleRequestDocument } from "../backend/graphql"
+import { runGQLQuery } from "../backend/GQLClient"
+import * as E from "fp-ts/Either"
 
 /**
  * Resolve save context on reorder
@@ -115,6 +118,33 @@ function resetSaveContextForAffectedRequests(folderPath: string) {
   }
 }
 
+/**
+ * Reset save context to null if requests are deleted from the team collection or its folder
+ * only runs when collection or folder is deleted
+ */
+
+export async function resetTeamRequestsContext() {
+  const tabs = getTabsRefTo((tab) => {
+    return tab.document.saveContext?.originLocation === "team-collection"
+  })
+
+  for (const tab of tabs) {
+    if (tab.value.document.saveContext?.originLocation === "team-collection") {
+      const data = await runGQLQuery({
+        query: GetSingleRequestDocument,
+        variables: {
+          requestID: tab.value.document.saveContext?.requestID,
+        },
+      })
+
+      if (E.isRight(data) && data.right.request === null) {
+        tab.value.document.saveContext = null
+        tab.value.document.isDirty = true
+      }
+    }
+  }
+}
+
 export function getFoldersByPath(
   collections: HoppCollection<HoppRESTRequest>[],
   path: string

packages/hoppscotch-common/src/helpers/teams/TeamEnvironmentAdapter.ts

@@ -45,6 +45,7 @@ export default class TeamEnvironmentAdapter {
     this.teamEnvironmentCreated$ = null
     this.teamEnvironmentDeleted$ = null
     this.teamEnvironmentUpdated$ = null
+
     this.teamEnvironmentCreatedSub = null
     this.teamEnvironmentDeletedSub = null
     this.teamEnvironmentUpdatedSub = null
@@ -56,6 +57,7 @@ export default class TeamEnvironmentAdapter {
     this.teamEnvironmentCreated$?.unsubscribe()
     this.teamEnvironmentDeleted$?.unsubscribe()
     this.teamEnvironmentUpdated$?.unsubscribe()
+
     this.teamEnvironmentCreatedSub?.unsubscribe()
     this.teamEnvironmentDeletedSub?.unsubscribe()
     this.teamEnvironmentUpdatedSub?.unsubscribe()

packages/hoppscotch-common/src/pages/r/_id.vue

@@ -59,8 +59,8 @@
   </div>
 </template>
 
-<script lang="ts">
-import { defineComponent, watch } from "vue"
+<script setup lang="ts">
+import { onMounted, ref, watch } from "vue"
 import { useRoute, useRouter } from "vue-router"
 import * as E from "fp-ts/Either"
 import { safelyExtractRESTRequest } from "@hoppscotch/data"
@@ -77,71 +77,56 @@ import IconRefreshCW from "~icons/lucide/refresh-cw"
 import { createNewTab } from "~/helpers/rest/tab"
 import { getDefaultRESTRequest } from "~/helpers/rest/default"
 
-export default defineComponent({
-  setup() {
-    const route = useRoute()
-    const router = useRouter()
+const route = useRoute()
+const router = useRouter()
 
-    const t = useI18n()
+const t = useI18n()
 
-    const shortcodeDetails = useGQLQuery<
-      ResolveShortcodeQuery,
-      ResolveShortcodeQueryVariables,
-      ""
-    >({
-      query: ResolveShortcodeDocument,
-      variables: {
-        code: route.params.id as string,
-      },
-    })
+const invalidLink = ref(false)
+const shortcodeID = ref("")
 
-    watch(
-      () => shortcodeDetails.data,
-      () => {
-        if (shortcodeDetails.loading) return
-
-        const data = shortcodeDetails.data
-
-        if (E.isRight(data)) {
-          const request: unknown = JSON.parse(
-            data.right.shortcode?.request as string
-          )
-
-          createNewTab({
-            request: safelyExtractRESTRequest(request, getDefaultRESTRequest()),
-            isDirty: false,
-          })
-
-          router.push({ path: "/" })
-        }
-      }
-    )
-
-    const reloadApplication = () => {
-      window.location.reload()
-    }
-
-    return {
-      E,
-      shortcodeDetails,
-      reloadApplication,
-      t,
-      route,
-      IconHome,
-      IconRefreshCW,
-    }
-  },
-  data() {
-    return {
-      invalidLink: false,
-      shortcodeID: "",
-    }
-  },
-  mounted() {
-    if (typeof this.route.params.id === "string") {
-      this.shortcodeID = this.route.params.id
-    }
-    this.invalidLink = !this.shortcodeID
+const shortcodeDetails = useGQLQuery<
+  ResolveShortcodeQuery,
+  ResolveShortcodeQueryVariables,
+  ""
+>({
+  query: ResolveShortcodeDocument,
+  variables: {
+    code: route.params.id.toString(),
   },
 })
+
+watch(
+  () => shortcodeDetails.data,
+  () => addRequestToTab()
+)
+
+const addRequestToTab = () => {
+  if (shortcodeDetails.loading) return
+
+  const data = shortcodeDetails.data
+
+  if (E.isRight(data)) {
+    const request: unknown = JSON.parse(data.right.shortcode?.request as string)
+
+    createNewTab({
+      request: safelyExtractRESTRequest(request, getDefaultRESTRequest()),
+      isDirty: false,
+    })
+
+    router.push({ path: "/" })
+  }
+}
+
+const reloadApplication = () => {
+  window.location.reload()
+}
+
+onMounted(() => {
+  if (typeof route.params.id === "string") {
+    shortcodeID.value = route.params.id
+    shortcodeDetails.execute()
+  }
+  invalidLink.value = !shortcodeID.value
+})
 </script>