diff --git a/packages/hoppscotch-app/components/collections/ImportExport.vue b/packages/hoppscotch-app/components/collections/ImportExport.vue
index 542336983..6ed7c0355 100644
--- a/packages/hoppscotch-app/components/collections/ImportExport.vue
+++ b/packages/hoppscotch-app/components/collections/ImportExport.vue
@@ -156,6 +156,7 @@
 <script setup lang="ts">
 import { ref } from "@nuxtjs/composition-api"
 import { HoppRESTRequest, translateToNewRequest } from "@hoppscotch/data"
+import * as E from "fp-ts/Either"
 import { apolloClient } from "~/helpers/apollo"
 import {
   useAxios,
@@ -173,6 +174,7 @@ import {
   Collection,
   makeCollection,
 } from "~/newstore/collections"
+import { RESTCollectionImporters } from "~/helpers/import-export/import"
 
 const props = defineProps<{
   show: boolean
@@ -557,7 +559,7 @@ const importFromJSON = () => {
 
   const reader = new FileReader()
 
-  reader.onload = ({ target }) => {
+  reader.onload = async ({ target }) => {
     let content = target!.result as string | null
 
     if (!content) {
@@ -566,6 +568,8 @@ const importFromJSON = () => {
     }
 
     let collections = JSON.parse(content)
+    await hoppImporterOutput(content)
+
     if (isInsomniaCollection(collections)) {
       collections = parseInsomniaCollection(content)
       content = JSON.stringify(collections)
@@ -653,4 +657,16 @@ const exportJSON = () => {
     URL.revokeObjectURL(url)
   }, 1000)
 }
+
+const hoppImporter = RESTCollectionImporters[0]
+
+const hoppImporterOutput = async (content: string) => {
+  const importedFunc = await hoppImporter.importer()
+  const result = await importedFunc(content)()
+  if (E.isLeft(result)) {
+    console.log("error", result.left)
+  } else if (E.isRight(result)) {
+    console.log("success", result)
+  }
+}
 </script>
diff --git a/packages/hoppscotch-app/helpers/import-export/import/hopp.ts b/packages/hoppscotch-app/helpers/import-export/import/hopp.ts
index bd7877c06..66be98062 100644
--- a/packages/hoppscotch-app/helpers/import-export/import/hopp.ts
+++ b/packages/hoppscotch-app/helpers/import-export/import/hopp.ts
@@ -8,10 +8,13 @@ import {
   translateToNewRESTCollection,
 } from "~/newstore/collections"
 
-const importer: HoppImporter<Collection<HoppRESTRequest>> = (content) =>
+const importer: HoppImporter<Collection<HoppRESTRequest>[]> = (content) =>
   pipe(
     E.tryCatch(
-      () => translateToNewRESTCollection(content),
+      () =>
+        JSON.parse(content).map((coll: any) =>
+          translateToNewRESTCollection(coll)
+        ),
       () => IMPORTER_INVALID_FILE_FORMAT
     ),
     TE.fromEither
diff --git a/packages/hoppscotch-app/helpers/import-export/import/index.ts b/packages/hoppscotch-app/helpers/import-export/import/index.ts
index 090c23f03..239d06052 100644
--- a/packages/hoppscotch-app/helpers/import-export/import/index.ts
+++ b/packages/hoppscotch-app/helpers/import-export/import/index.ts
@@ -30,7 +30,7 @@ export type HoppImporterDefintion<T> = {
 }
 
 export const RESTCollectionImporters: HoppImporterDefintion<
-  Collection<HoppRESTRequest>
+  Collection<HoppRESTRequest>[]
 >[] = [
   {
     name: "Hoppscotch REST Collection",
diff --git a/packages/hoppscotch-app/locales/en.json b/packages/hoppscotch-app/locales/en.json
index 44ed5f82b..9efd1bbfc 100644
--- a/packages/hoppscotch-app/locales/en.json
+++ b/packages/hoppscotch-app/locales/en.json
@@ -236,7 +236,7 @@
     "from_postman": "Import from Postman",
     "from_url": "Import from URL",
     "gist_url": "Enter Gist URL",
-    "json": "Import from JSON",
+    "json": "Import from file",
     "title": "Import"
   },
   "layout": {