From ea20f1a5a7728e589d913b436b05368c46ea1b85 Mon Sep 17 00:00:00 2001
From: Sean Morley <zipsm15@gmail.com>
Date: Sat, 15 Jun 2024 16:44:47 +0000
Subject: [PATCH] Fix up image selection modal

---
 src/lib/components/ImageModal.svelte | 26 ++++++++++++++++----------
 1 file changed, 16 insertions(+), 10 deletions(-)

diff --git a/src/lib/components/ImageModal.svelte b/src/lib/components/ImageModal.svelte
index b5cc10d..fd7bfe1 100644
--- a/src/lib/components/ImageModal.svelte
+++ b/src/lib/components/ImageModal.svelte
@@ -27,6 +27,10 @@
   }
 
   async function submit() {
+    if (!imageUrl && !imageFile) {
+      close();
+    }
+
     try {
       let key: string;
       if (viewType === "url") {
@@ -125,12 +129,8 @@
       />
     </div>
     {#if viewType == "url"}
-      <button class="btn btn-secondary mb-2" on:click={searchImage}
-        >Search for Image</button
-      >
-      <form method="dialog" style="width: 100%;" class="mb-4">
-        <div>
-          <label for="rating">Image URL</label>
+      <form method="dialog" style="width: 100%;" class="mb-8">
+        <div class="flex justify-center items-center gap-2">
           <input
             type="text"
             id="imageUrl"
@@ -138,19 +138,25 @@
             class="input input-bordered w-full max-w-xs"
             placeholder="Enter the URL of the image"
           />
+          <button
+            type="button"
+            class="btn btn-neutral mb-2"
+            on:click={searchImage}
+            >Search for Image <iconify-icon icon="mdi:magnify" class="text-xl"
+            ></iconify-icon></button
+          >
         </div>
       </form>
     {/if}
     {#if viewType == "upload"}
-      <form method="dialog" style="width: 100%;" class="mb-4">
-        <div>
-          <label for="rating">Image Upload</label>
+      <form method="dialog" style="width: 100%;" class="mb-8">
+        <div class="flex justify-center items-center">
           <input
             type="file"
             id="imageFile"
             on:change={handleFileChange}
             placeholder="Upload an image file"
-            class="input input-bordered w-full max-w-xs"
+            class="file-input file-input-bordered w-full max-w-xs"
           />
         </div>
       </form>