refactor: validate constraint through gateway

Author: camargo

package-lock.json

@@ -40,7 +40,6 @@
     "@types/toastify-js": "^1.9.2",
     "@typescript-eslint/eslint-plugin": "^5.3.1",
     "@typescript-eslint/parser": "^5.3.1",
-    "ajv": "^8.7.1",
     "bootstrap-icons": "^1.7.0",
     "cloc": "^2.8.0",
     "cookie": "^0.4.1",

package.json

@@ -2,30 +2,28 @@
 
 <script lang="ts">
   import { createEventDispatcher, onMount } from 'svelte';
-  import Ajv from 'ajv';
-  import type { ValidateFunction } from 'ajv';
   import Field from '../form/Field.svelte';
   import Label from '../form/Label.svelte';
   import Card from '../ui/Card.svelte';
   import CodeMirrorJsonEditor from '../ui/CodeMirrorJsonEditor.svelte';
   import AlertError from '../ui/AlertError.svelte';
   import Panel from '../ui/Panel.svelte';
   import type { Constraint, CreateConstraint } from '../../types';
+  import { reqValidateConstraint } from '../../utilities/requests';
 
   const dispatch = createEventDispatcher();
 
   export let constraint: Constraint | null = null;
   export let modelId: number;
   export let planId: number;
 
-  let ajv: Ajv;
+  let debounce: NodeJS.Timeout;
   let definition: string = '';
   let definitionError: string | null = null;
   let description: string = '';
   let name: string = '';
   let summary: string = '';
   let type: string = 'model';
-  let validateSchema: ValidateFunction<any>;
 
   $: valid = definition !== '' && !definitionError && name !== '';
 
@@ -43,30 +41,21 @@
       summary = '';
       type = 'model';
     }
-    await initAjv();
   });
 
-  async function initAjv() {
-    ajv = new Ajv();
-    ajv.addKeyword('$anchor');
-    const response = await fetch('/schemas/constraint.json');
-    const constraintSchema = await response.json();
-    validateSchema = ajv.compile<any>(constraintSchema);
-  }
-
-  function onTextChanged(event: CustomEvent<string>) {
+  async function onTextChanged(event: CustomEvent<string>) {
     const { detail: json } = event;
     try {
-      const parsedJson = JSON.parse(json);
       definition = json;
       definitionError = null;
-      if (validateSchema) {
-        const schemaValid = validateSchema(parsedJson);
-        if (!schemaValid) {
-          console.log(validateSchema.errors);
+
+      clearTimeout(debounce);
+      debounce = setTimeout(async () => {
+        const { valid } = await reqValidateConstraint(json);
+        if (!valid) {
           definitionError = 'Input is not a valid constraint';
         }
-      }
+      }, 200);
     } catch (e) {
       console.log(e);
       definitionError = e.message;

src/components/constraint/Editor.svelte

@@ -1252,3 +1252,32 @@ export async function reqValidateActivityArguments(
     return { errors: [message], success: false };
   }
 }
+
+export async function reqValidateConstraint(body: string) {
+  let response: Response;
+  let json: any;
+  try {
+    const GATEWAY_URL = gatewayUrl();
+    const options = {
+      body,
+      headers: {
+        'Content-Type': 'application/json',
+      },
+      method: 'POST',
+    };
+
+    response = await fetch(`${GATEWAY_URL}/constraint/validate`, options);
+    json = await response.json();
+    if (!response.ok) throw new Error(response.statusText);
+
+    return json;
+  } catch (e) {
+    console.log(e);
+    console.log(response);
+    console.log(json);
+    return {
+      errors: ['An unexpected error occurred'],
+      valid: false,
+    };
+  }
+}