From 055e66b2b86b8c6651bcb9a4f850291f94588570 Mon Sep 17 00:00:00 2001
From: Venkata Chandra Sekhar Nainala <mailcs76@gmail.com>
Date: Tue, 10 Sep 2024 11:22:19 +0200
Subject: [PATCH] fix: added preview link to structure image

---
 app/Livewire/MoleculeDepict2d.php                   |  6 ++++++
 .../views/livewire/molecule-depict2d.blade.php      | 13 +++++++++++++
 2 files changed, 19 insertions(+)

diff --git a/app/Livewire/MoleculeDepict2d.php b/app/Livewire/MoleculeDepict2d.php
index aa2d4868..71dd406b 100644
--- a/app/Livewire/MoleculeDepict2d.php
+++ b/app/Livewire/MoleculeDepict2d.php
@@ -27,6 +27,12 @@ public function source()
         return env('CM_API').'depict/2D?smiles='.urlencode($this->smiles).'&height='.$this->height.'&width='.$this->width;
     }
 
+    #[Computed]
+    public function preview()
+    {
+        return env('CM_API').'depict/2D?smiles='.urlencode($this->smiles);
+    }
+
     public function render()
     {
         return view('livewire.molecule-depict2d');
diff --git a/resources/views/livewire/molecule-depict2d.blade.php b/resources/views/livewire/molecule-depict2d.blade.php
index a83377a1..f1637040 100644
--- a/resources/views/livewire/molecule-depict2d.blade.php
+++ b/resources/views/livewire/molecule-depict2d.blade.php
@@ -35,6 +35,19 @@ class="h-5 w-5" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
                 </svg>
                 <span class="pointer-events-none absolute -inset-px rounded-lg border-2" aria-hidden="true"></span>
             </label>
+            <label aria-label="Existing Customers"
+                aria-description="Last message sent 2 weeks ago to 1200 users"
+                class="relative flex cursor-pointer rounded-lg bg-white p-3 focus:outline-none">
+                <a :href="'{{ $this->preview }}&toolkit=' + toolkit + '&CIP=true&unicolor=false'" target="_blank"><svg xmlns="http://www.w3.org/2000/svg"
+                    fill="none" viewBox="0 0 24 24"
+                    stroke-width="1.5" stroke="currentColor"
+                    class="size-5 inline">
+                    <path stroke-linecap="round"
+                        stroke-linejoin="round"
+                        d="M13.5 6H5.25A2.25 2.25 0 0 0 3 8.25v10.5A2.25 2.25 0 0 0 5.25 21h10.5A2.25 2.25 0 0 0 18 18.75V10.5m-10.5 6L21 3m0 0h-5.25M21 3v5.25">
+                    </path>
+                </svg></a>
+            </label>
         </div>
     </fieldset>
     <img alt="{{ $this->name }}" class="mx-auto w-100" :src="'{{ $this->source }}&toolkit=' + toolkit + '&CIP=true&unicolor=false'"