feat: indicate request opened in the tab from the collection tree

packages/hoppscotch-common/src/components/new-collections/rest/Request.vue

@@ -24,7 +24,7 @@
             {{ requestView.request.name }}
           </span>
           <span
-            v-if="isActive"
+            v-if="props.isActive"
             v-tippy="{ theme: 'tooltip' }"
             class="relative mx-3 flex h-1.5 w-1.5 flex-shrink-0"
             :title="`${t('collection.request_in_use')}`"
@@ -133,6 +133,7 @@ import { getMethodLabelColorClassOf } from "~/helpers/rest/labelColoring"
 const t = useI18n()
 
 const props = defineProps<{
+  isActive: boolean
   requestView: RESTCollectionViewRequest
 }>()
 
@@ -152,9 +153,6 @@ const emit = defineEmits<{
 const tippyActions = ref<TippyComponent | null>(null)
 const options = ref<TippyComponent | null>(null)
 
-// TODO: implement
-const isActive = ref(true)
-
 const requestLabelColor = computed(() =>
   getMethodLabelColorClassOf(props.requestView.request)
 )

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

@@ -46,6 +46,7 @@
           />
           <NewCollectionsRestRequest
             v-else-if="node.data.type === 'request'"
+            :is-active="isActiveRequest(node.data.value.request.id)"
             :request-view="node.data.value"
             @duplicate-request="duplicateRequest"
             @edit-request="editRequest"
@@ -978,4 +979,22 @@ const isAlreadyInRoot = (id: string) => {
   const indexPath = pathToIndex(id)
   return indexPath.length === 1
 }
+
+const isActiveRequest = (requestID: string) => {
+  if (
+    tabs.currentActiveTab.value.document.saveContext?.originLocation !==
+    "workspace-user-collection"
+  ) {
+    return false
+  }
+
+  const requestHandle = ref(
+    tabs.currentActiveTab.value.document.saveContext?.requestHandle
+  )
+
+  if (requestHandle.value.type === "invalid") {
+    return false
+  }
+  return requestHandle.value.data.request.id === requestID
+}
 </script>