fix: added preview link to structure image

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');

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'"