fix: headers having different values with the same key are not shown (#4112)

* feat: allow ability for multiple headers with the same key to be shown

* chore: remove extension inspector in selfhost-desktop

* chore: cleanup

---------

Co-authored-by: jamesgeorge007 <25279263+jamesgeorge007@users.noreply.github.com>

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

@@ -1,11 +1,11 @@
-/* eslint-disable */
-/* prettier-ignore */
-// @ts-nocheck
-// Generated by unplugin-vue-components
+// generated by unplugin-vue-components
+// We suggest you to commit this file into source control
 // Read more: https://github.com/vuejs/core/pull/3399
+import '@vue/runtime-core'
+
 export {}
 
-declare module 'vue' {
+declare module '@vue/runtime-core' {
   export interface GlobalComponents {
     AppActionHandler: typeof import('./components/app/ActionHandler.vue')['default']
     AppBanner: typeof import('./components/app/Banner.vue')['default']
@@ -148,7 +148,6 @@ declare module 'vue' {
     IconLucideAlertTriangle: typeof import('~icons/lucide/alert-triangle')['default']
     IconLucideArrowLeft: typeof import('~icons/lucide/arrow-left')['default']
     IconLucideArrowUpRight: typeof import('~icons/lucide/arrow-up-right')['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']
@@ -158,7 +157,6 @@ declare module 'vue' {
     IconLucideLayers: typeof import('~icons/lucide/layers')['default']
     IconLucideListEnd: typeof import('~icons/lucide/list-end')['default']
     IconLucideMinus: typeof import('~icons/lucide/minus')['default']
-    IconLucideRss: (typeof import("~icons/lucide/rss"))["default"]
     IconLucideSearch: typeof import('~icons/lucide/search')['default']
     IconLucideUsers: typeof import('~icons/lucide/users')['default']
     IconLucideX: typeof import('~icons/lucide/x')['default']
@@ -214,4 +212,5 @@ declare module 'vue' {
     WorkspaceCurrent: typeof import('./components/workspace/Current.vue')['default']
     WorkspaceSelector: typeof import('./components/workspace/Selector.vue')['default']
   }
+
 }

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

@@ -15,10 +15,6 @@ export type NetworkStrategy = (
   req: AxiosRequestConfig
 ) => TE.TaskEither<any, NetworkResponse>
 
-export const cancelRunningRequest = () => {
-  // TODO: Implement
-}
-
 function processResponse(
   res: NetworkResponse,
   req: EffectiveHoppRESTRequest,
@@ -34,10 +30,13 @@ function processResponse(
     statusCode: res.status,
     statusText: res.statusText,
     body: res.data,
-    headers: Object.keys(res.headers).map((x) => ({
-      key: x,
-      value: res.headers[x],
-    })),
+    // If multi headers are present, then we can just use that, else fallback to Axios type
+    headers:
+      res.additional?.multiHeaders ??
+      Object.keys(res.headers).map((x) => ({
+        key: x,
+        value: res.headers[x],
+      })),
     meta: {
       responseSize: contentLength,
       responseDuration: backupTimeEnd - backupTimeStart,

packages/hoppscotch-common/src/services/interceptor.service.ts

@@ -16,6 +16,22 @@ export type NetworkResponse = AxiosResponse<unknown> & {
       endTime: number
     }
   }
+  /**
+   * Optional additional fields with special optional metadata that can be used
+   */
+  additional?: {
+    /**
+     * By the HTTP spec, we can have multiple headers with the same name, but
+     * this is not accessible in the AxiosResponse type as the headers there are Record<string, string>
+     * (and hence cannot have secondary values).
+     *
+     * If this value is present, headers can be read from here which will have the data.
+     */
+    multiHeaders?: Array<{
+      key: string
+      value: string
+    }>
+  }
 }
 
 /**