feat: add file extensions to response exports (hoppscotch#4367)

Co-authored-by: Dmitry Mukovkin <[email protected]>

Author: shipko

packages/hoppscotch-common/src/components/lenses/renderers/HTMLLensRenderer.vue

@@ -130,12 +130,14 @@ const responseName = computed(() => {
 })
 
 const { responseBodyText } = useResponseBody(props.response)
+
+const filename = t("filename.lens", {
+  request_name: responseName.value,
+})
 const { downloadIcon, downloadResponse } = useDownloadResponse(
   "text/html",
   responseBodyText,
-  t("filename.lens", {
-    request_name: responseName.value,
-  })
+  `${filename}.html`
 )
 
 const defaultPreview = computedAsync(

packages/hoppscotch-common/src/components/lenses/renderers/PDFLensRenderer.vue

@@ -51,12 +51,14 @@ const pdfsrc = computed(() =>
   )
 )
 
+const filename = t("filename.lens", {
+  request_name: props.response.req.name,
+})
+
 const { downloadIcon, downloadResponse } = useDownloadResponse(
   "application/pdf",
   computed(() => props.response.body),
-  t("filename.lens", {
-    request_name: props.response.req.name,
-  })
+  `${filename}.pdf`
 )
 
 defineActionHandler("response.file.download", () => downloadResponse())

packages/hoppscotch-common/src/components/lenses/renderers/XMLLensRenderer.vue

@@ -135,12 +135,14 @@ const responseName = computed(() => {
   return props.response.name
 })
 
+const filename = t("filename.lens", {
+  request_name: responseName.value,
+})
+
 const { downloadIcon, downloadResponse } = useDownloadResponse(
   responseType.value,
   responseBodyText,
-  t("filename.lens", {
-    request_name: responseName.value,
-  })
+  `${filename}.xml`
 )
 
 const { copyIcon, copyResponse } = useCopyResponse(responseBodyText)