add model to the image drawer

src/lib/components/community/drawer/Drawer.svelte

@@ -45,6 +45,12 @@
       handleClose();
     }
   };
+  const handleClickModel = (id?: string) => {
+    if (!id) return;
+    $page.url.searchParams.set('model', id);
+    $page.url.searchParams.delete('gallery');
+    goto(`/?${$page.url.searchParams.toString()}`);
+  };
 </script>
 
 <div
@@ -76,11 +82,26 @@
               <Icon icon="carbon:close" class="w-6 h-6 text-white cursor-pointer" />
             </button>
           </header>
-          <main class="w-full grid grid-cols-1 gap-5">
-            <div class="w-full">
+          <main class="w-full grid grid-cols-2 gap-5">
+            <div class="w-full col-span-2">
               <Reactions reactions={gallery?.reactions} gallery_id={gallery.id} />
             </div>
-            <img src="/api/images/{gallery?.image}" class="max-w-[450px] w-full h-[450px] bg-neutral-800 object-cover rounded-xl" alt={gallery?.prompt} />
+            <img src="/api/images/{gallery?.image}" class="max-w-[450px] w-full h-[450px] bg-neutral-800 object-cover rounded-xl col-span-2" alt={gallery?.prompt} />
+            <div class="col-span-2">
+              <button
+                class="flex items-center justify-start gap-4 cursor-pointer w-full text-left transition-all duration-200 hover:bg-neutral-900 p-3 group relative rounded-lg"
+                on:click={() => handleClickModel(gallery?.model?.id)}
+              >
+                <img src={gallery?.model?.image} alt={gallery?.model?.id} class="w-14 h-14 rounded-lg object-cover" />
+                <div>
+                  <p class="text-neutral-200 text-base font-medium">{gallery?.model?.id}</p>
+                  <p class="text-neutral-400 text-sm">{gallery?.model?.id}</p>
+                </div>
+                <div class="rounded-full absolute top-1/2 -translate-y-1/2 text-neutral-100 w-8 h-8 right-4 bg-pink-500 flex items-center justify-center transition-all duration-200 group-hover:opacity-100 opacity-0">
+                  <Icon icon="tabler:arrow-up" class="w-5 h-5 transform rotate-45 font-bold" />
+                </div>
+              </button>
+            </div>
             <div class="px-2">
               <p class="text-neutral-400 font-semibold text-xs uppercase">
                 Prompt