From 0347765adcac9a39eb3eeed5999ac7a68d6947a0 Mon Sep 17 00:00:00 2001
From: Danielo Rodriguez <rdanielo@gmail.com>
Date: Sun, 24 Dec 2023 12:22:01 +0100
Subject: [PATCH] chore: nicer

---
 src/std/index.ts                              |  1 +
 src/views/FormBuilder.svelte                  |  6 ++++++
 .../InputBuilderDocumentBlock.svelte          | 20 ++++++++++++++++---
 styles.css                                    |  4 ++++
 4 files changed, 28 insertions(+), 3 deletions(-)

diff --git a/src/std/index.ts b/src/std/index.ts
index fc21cf31..62f4508c 100644
--- a/src/std/index.ts
+++ b/src/std/index.ts
@@ -77,6 +77,7 @@ export const E = {
     ap,
     flap,
     chainW,
+    fold: match,
 };
 
 export const O = {
diff --git a/src/views/FormBuilder.svelte b/src/views/FormBuilder.svelte
index 36e69cd0..97623634 100644
--- a/src/views/FormBuilder.svelte
+++ b/src/views/FormBuilder.svelte
@@ -22,6 +22,7 @@
         ParsedTemplate,
         parsedTemplateToString,
     } from "src/core/template/templateParser";
+    import InputBuilderDocumentBlock from "./components/InputBuilderDocumentBlock.svelte";
 
     export let definition: EditableFormDefinition = {
         title: "",
@@ -370,6 +371,11 @@
                                         {index}
                                         bind:value={field.input.query}
                                     />
+                                    {:else if field.input.type === "document_block"}
+                                    <InputBuilderDocumentBlock
+                                        {index}
+                                        bind:body={field.input.body}
+                                    />
                                 {/if}
                             </div>
                             <div class="flex gap1">
diff --git a/src/views/components/InputBuilderDocumentBlock.svelte b/src/views/components/InputBuilderDocumentBlock.svelte
index 134ee058..3fedd403 100644
--- a/src/views/components/InputBuilderDocumentBlock.svelte
+++ b/src/views/components/InputBuilderDocumentBlock.svelte
@@ -1,9 +1,19 @@
 <script lang="ts">
+    import { E, pipe, parseFunctionBody } from "@std";
     import FormRow from "./FormRow.svelte";
 
-    let text = "";
-    const id = "document_block";
+    export let body = "";
+    export let index: number;
+    $: id = "document_block_" + index;
     const placeholder = "return `Hello ${form.name}!`";
+    $: errors = pipe(
+        parseFunctionBody(body),
+        E.fold(
+            (e) => e.message,
+            () => "",
+        ),
+    );
+    $: console.log(errors);
 </script>
 
 <FormRow label="Document block" {id}>
@@ -15,11 +25,15 @@
         variable. For example:
         <pre class="language-js">{placeholder}</pre>
         <textarea
-            bind:value={text}
+            bind:value={body}
             name="document_block"
             class="form-control"
             rows="3"
             {placeholder}
         />
+        {#if errors}
+            Your function body has errors:
+            <div class="modal-form-error-message">{errors}</div>
+        {/if}
     </span></FormRow
 >
diff --git a/styles.css b/styles.css
index 992c8670..701eec35 100644
--- a/styles.css
+++ b/styles.css
@@ -85,3 +85,7 @@ If your plugin does not need CSS, delete this file.
 .notice-error {
     color: var(--text-error);
 }
+.modal-form-error-message {
+    color: var(--text-error);
+    font-weight: bold;
+}