From 4d5a90f14f48de421a9b8d171e604295964f8db1 Mon Sep 17 00:00:00 2001
From: Andrew Bastin <andrewbastin.k@gmail.com>
Date: Wed, 16 Feb 2022 01:37:15 +0530
Subject: [PATCH] feat: linting for raw key value lang editors

---
 .../components/http/Headers.vue               |  3 ++-
 .../components/http/Parameters.vue            |  3 ++-
 .../components/http/URLEncodedParams.vue      |  3 ++-
 .../helpers/editor/linting/rawKeyValue.ts     | 24 +++++++++++++++++++
 4 files changed, 30 insertions(+), 3 deletions(-)
 create mode 100644 packages/hoppscotch-app/helpers/editor/linting/rawKeyValue.ts

diff --git a/packages/hoppscotch-app/components/http/Headers.vue b/packages/hoppscotch-app/components/http/Headers.vue
index de1a051d5..2a6a942a4 100644
--- a/packages/hoppscotch-app/components/http/Headers.vue
+++ b/packages/hoppscotch-app/components/http/Headers.vue
@@ -148,6 +148,7 @@ import { useCodemirror } from "~/helpers/editor/codemirror"
 import { restHeaders$, setRESTHeaders } from "~/newstore/RESTSession"
 import { commonHeaders } from "~/helpers/headers"
 import { useI18n, useStream, useToast } from "~/helpers/utils/composables"
+import linter from "~/helpers/editor/linting/rawKeyValue"
 
 const t = useI18n()
 const toast = useToast()
@@ -163,7 +164,7 @@ useCodemirror(bulkEditor, bulkHeaders, {
     mode: "text/x-yaml",
     placeholder: `${t("state.bulk_mode_placeholder")}`,
   },
-  linter: null,
+  linter,
   completer: null,
   environmentHighlights: true,
 })
diff --git a/packages/hoppscotch-app/components/http/Parameters.vue b/packages/hoppscotch-app/components/http/Parameters.vue
index 93d201d69..2c7f67112 100644
--- a/packages/hoppscotch-app/components/http/Parameters.vue
+++ b/packages/hoppscotch-app/components/http/Parameters.vue
@@ -132,6 +132,7 @@ import { ref, watch } from "@nuxtjs/composition-api"
 import { HoppRESTParam } from "@hoppscotch/data"
 import isEqual from "lodash/isEqual"
 import clone from "lodash/clone"
+import linter from "~/helpers/editor/linting/rawKeyValue"
 import { useCodemirror } from "~/helpers/editor/codemirror"
 import { useI18n, useToast, useStream } from "~/helpers/utils/composables"
 import { restParams$, setRESTParams } from "~/newstore/RESTSession"
@@ -152,7 +153,7 @@ useCodemirror(bulkEditor, bulkParams, {
     mode: "text/x-yaml",
     placeholder: `${t("state.bulk_mode_placeholder")}`,
   },
-  linter: null,
+  linter,
   completer: null,
   environmentHighlights: true,
 })
diff --git a/packages/hoppscotch-app/components/http/URLEncodedParams.vue b/packages/hoppscotch-app/components/http/URLEncodedParams.vue
index 5d4cb2352..c916fe710 100644
--- a/packages/hoppscotch-app/components/http/URLEncodedParams.vue
+++ b/packages/hoppscotch-app/components/http/URLEncodedParams.vue
@@ -138,6 +138,7 @@ import {
   RawKeyValueEntry,
 } from "@hoppscotch/data"
 import { useCodemirror } from "~/helpers/editor/codemirror"
+import linter from "~/helpers/editor/linting/rawKeyValue"
 import { useRESTRequestBody } from "~/newstore/RESTSession"
 import { pluckRef, useI18n, useToast } from "~/helpers/utils/composables"
 
@@ -155,7 +156,7 @@ useCodemirror(bulkEditor, bulkUrlEncodedParams, {
     mode: "text/x-yaml",
     placeholder: `${t("state.bulk_mode_placeholder")}`,
   },
-  linter: null,
+  linter,
   completer: null,
   environmentHighlights: true,
 })
diff --git a/packages/hoppscotch-app/helpers/editor/linting/rawKeyValue.ts b/packages/hoppscotch-app/helpers/editor/linting/rawKeyValue.ts
new file mode 100644
index 000000000..314a53adf
--- /dev/null
+++ b/packages/hoppscotch-app/helpers/editor/linting/rawKeyValue.ts
@@ -0,0 +1,24 @@
+import * as E from "fp-ts/Either"
+import { strictParseRawKeyValueEntriesE } from "@hoppscotch/data"
+import { convertIndexToLineCh } from "../utils"
+import { LinterDefinition, LinterResult } from "./linter"
+
+const linter: LinterDefinition = (text) => {
+  const result = strictParseRawKeyValueEntriesE(text)
+  if (E.isLeft(result)) {
+    const pos = convertIndexToLineCh(text, result.left.pos + 1)
+
+    return Promise.resolve([
+      <LinterResult>{
+        from: pos,
+        to: pos,
+        message: result.left.message,
+        severity: "error",
+      },
+    ])
+  } else {
+    return Promise.resolve([])
+  }
+}
+
+export default linter