Refactor code and update UI components

resources/views/components/popup.blade.php

@@ -11,8 +11,10 @@
         class="flex flex-col items-center justify-between w-full h-full max-w-4xl p-6 mx-auto bg-white border-t shadow-lg dark:bg-coolgray-100 lg:p-8 lg:flex-row sm:border-0 sm:rounded-xl">
         <div
             class="flex flex-col items-start h-full pb-6 text-xs lg:items-center lg:flex-row lg:pb-0 lg:pr-6 lg:space-x-5 dark:text-neutral-300">
-            <img src="https://cdn-icons-png.flaticon.com/512/8236/8236748.png"
-                class="w-8 h-8 sm:w-12 sm:h-12 lg:w-16 lg:h-16">
+            @if (isset($icon))
+                {{ $icon }}
+            @endif
+
             <div class="pt-6 lg:pt-0">
                 <h4 class="w-full mb-1 text-xl font-bold leading-none -translate-y-1 text-neutral-900 dark:text-white">
                     {{ $title }}
@@ -21,7 +23,10 @@
             </div>
         </div>
         <div class="flex items-end justify-end w-full pl-3 space-x-3 lg:flex-shrink-0 lg:w-auto">
-            <button @click="bannerVisible=false;" {{ $buttonText->attributes }}
+            <button
+                @if ($buttonText->attributes->whereStartsWith('@click')->first()) @click="bannerVisible=false;{{ $buttonText->attributes->get('@click') }}"
+                @else
+                @click="bannerVisible=false;" @endif
                 class="inline-flex items-center justify-center flex-shrink-0 w-1/2 px-4 py-2 text-sm font-medium tracking-wide transition-colors duration-200 bg-white rounded-md dark:bg-coolgray-200 lg:w-auto dark:text-neutral-200 dark:hover:bg-coolgray-300 focus:shadow-outline focus:outline-none">
                 {{ $buttonText }}
             </button>