feat: ui for new importer

packages/hoppscotch-app/helpers/import-export/import/hopp.ts

@@ -6,7 +6,8 @@ import { defineImporter, IMPORTER_INVALID_FILE_FORMAT } from "."
 import { translateToNewRESTCollection } from "~/newstore/collections"
 
 export default defineImporter({
-  name: "Hoppscotch REST Collection",
+  name: "import.json",
+  icon: "folder-plus",
   steps: [
     step({
       stepName: "FILE_OR_URL_IMPORT",

packages/hoppscotch-app/helpers/import-export/import/index.ts

@@ -22,6 +22,11 @@ type HoppImporterDefintion<T, Y, E> = {
    */
   name: string
 
+  /**
+   * Icon for importer button
+   */
+  icon: string
+
   /**
    * The importer function, It is a Promise because its supposed to be loaded in lazily (dynamic imports ?)
    */
@@ -38,6 +43,7 @@ type HoppImporterDefintion<T, Y, E> = {
  */
 export const defineImporter = <ReturnType, StepType, Errors>(input: {
   name: string
+  icon: string
   importer: HoppImporter<ReturnType, StepType, Errors>
   steps: StepType
 }) => {

packages/hoppscotch-app/helpers/import-export/import/insomnia.ts

@@ -11,6 +11,7 @@ import { Collection } from "~/newstore/collections"
 
 export default defineImporter({
   name: "Insomnia Collection",
+  icon: "insomnia",
   steps: [
     step({
       stepName: "FILE_OR_URL_IMPORT",

packages/hoppscotch-app/helpers/import-export/import/openapi.ts

@@ -585,7 +585,8 @@ const parseOpenAPIDocContent = (str: string) =>
   )
 
 export default defineImporter({
-  name: "Swagger/OpenAPI v3 Schema",
+  name: "import.from_openapi",
+  icon: "file",
   steps: [
     step({
       stepName: "FILE_OR_URL_IMPORT",

packages/hoppscotch-app/helpers/import-export/import/postman.ts

@@ -180,6 +180,7 @@ const safeParseJSON = (str: string) => O.tryCatch(() => JSON.parse(str))
 
 export default defineImporter({
   name: "Postman Collection",
+  icon: "postman",
   steps: [
     step({
       stepName: "FILE_OR_URL_IMPORT",