From 634f7e41e2fbd1e5446ee52914d4fc2262ad7af7 Mon Sep 17 00:00:00 2001
From: KKlochko <KKlochko@protonmail.com>
Date: Fri, 19 Apr 2024 08:09:27 +0300
Subject: [PATCH] Add a validation for the about form in the admin panel.

---
 src/main/blog/handlers.cljs        | 23 +++++++++++++++++++++++
 src/main/blog/server.cljs          |  7 +++++++
 views/about_content_validation.hbs |  8 ++++++++
 views/admin_panel.hbs              |  4 ++--
 4 files changed, 40 insertions(+), 2 deletions(-)
 create mode 100644 views/about_content_validation.hbs

diff --git a/src/main/blog/handlers.cljs b/src/main/blog/handlers.cljs
index 9c72a2e..10b7490 100644
--- a/src/main/blog/handlers.cljs
+++ b/src/main/blog/handlers.cljs
@@ -258,6 +258,29 @@
             (res/status 500)
             (res/send (ex-message err))))))))
 
+(defn htmx-about-validation-handler-factory
+  []
+  (fn [req res]
+    (let [channel (chan)
+          about-content (.-content (.-body req))]
+      (go
+        (try
+          (let [error (cond
+                        (= (count about-content) 0)
+                        "Content must nonempty!!!"
+
+                        :else
+                        nil)]
+            (res/status 200)
+            (.render res "about_content_validation"
+                     (-> {:error error
+                          :about-content about-content
+                          :layout false}
+                         (clj->js))))
+          (catch js/Error err
+            (res/status 500)
+            (res/send (ex-message err))))))))
+
 (defn htmx-update-about-handler-factory
   [client]
   (fn [req res]
diff --git a/src/main/blog/server.cljs b/src/main/blog/server.cljs
index 0abca7a..f4a880e 100644
--- a/src/main/blog/server.cljs
+++ b/src/main/blog/server.cljs
@@ -94,6 +94,13 @@
   (. app use "/admin"
      (handlers/user-not-authorized-factory))
 
+  (. app post "/htmx/validation/about/"
+     handlers/is-user-authorized
+     (handlers/htmx-about-validation-handler-factory))
+
+  (. app use "/htmx/validation/about/"
+     (handlers/user-not-authorized-factory))
+
   (. app patch "/htmx/about/"
      handlers/is-user-authorized
      (handlers/htmx-update-about-handler-factory client))
diff --git a/views/about_content_validation.hbs b/views/about_content_validation.hbs
new file mode 100644
index 0000000..0bfdb42
--- /dev/null
+++ b/views/about_content_validation.hbs
@@ -0,0 +1,8 @@
+<div hx-target="this" hx-swap="outerHTML">
+  <label for="content" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">Content</label>
+  <textarea id="about-content" name="content" hx-post="/htmx/validation/about/" rows="4" class="block p-2.5 w-full text-sm text-gray-900 bg-gray-50 rounded-lg border border-gray-300 focus:ring-[#3b82f6] focus:border-[#3b82f6] dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-[#3b82f6] dark:focus:border-[#3b82f6]" placeholder="Write about you and your blog here"
+  {{#if error}}aria-invalid="true"{{/if}}>{{ about-content }}</textarea>
+  {{#if error}}
+    <div class='text-sm font-bold leading-tight tracking-tight text-red-600 mt-2'>{{ error }}</div>
+  {{/if}}
+</div>
diff --git a/views/admin_panel.hbs b/views/admin_panel.hbs
index 9558baf..8e39d4b 100644
--- a/views/admin_panel.hbs
+++ b/views/admin_panel.hbs
@@ -16,9 +16,9 @@
         <!-- form -->
         <form class="p-4" x-show="show">
           <div class="grid gap-4 mb-4 sm:grid-cols-1">
-            <div>
+            <div hx-target="this" hx-swap="outerHTML">
               <label for="content" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">Content</label>
-              <textarea id="about-content" name="content" rows="4" class="block p-2.5 w-full text-sm text-gray-900 bg-gray-50 rounded-lg border border-gray-300 focus:ring-[#3b82f6] focus:border-[#3b82f6] dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-[#3b82f6] dark:focus:border-[#3b82f6]" placeholder="Write about you and your blog here">{{ about-content }}</textarea>
+              <textarea id="about-content" name="content" hx-post="/htmx/validation/about/" rows="4" class="block p-2.5 w-full text-sm text-gray-900 bg-gray-50 rounded-lg border border-gray-300 focus:ring-[#3b82f6] focus:border-[#3b82f6] dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-[#3b82f6] dark:focus:border-[#3b82f6]" placeholder="Write about you and your blog here">{{ about-content }}</textarea>
             </div>
           </div>
           <button type="submit" hx-patch="/htmx/about/" hx-swap="none" class="text-white inline-flex items-center bg-[#1d4ed8] hover:bg-[#1e40af] focus:ring-4 focus:outline-none focus:ring-[#93c5fd] font-medium rounded-lg text-sm px-5 py-2.5 text-center dark:bg-[#2563eb] dark:hover:bg-[#1d4ed8] dark:focus:ring-[#1e40af]">