improving remove jobs

Author: manuelernestog

src/pages/empleo-editado.astro

@@ -14,7 +14,7 @@ const description = "Tu oferta de empleo ha sido actualizada con éxito.";
         {title}
       </h1>
       <article class="my-5 prose dark:prose-invert lg:prose-lg prose-img:mx-auto max-w-none break-words text-center">
-        <p>Los cambios reralizados en su oferta de empleo se han guardado correctamente.</p>
+        <p>Los cambios reralizados en su oferta de empleo se han guardado correctamente. Los cambios seran reflejados en el sitio tan pronto sea moderada.</p>
         <a href="/" class="text-blue-600 hover:text-blue-800 underline">Volver al inicio</a>
       </article>
     </div>

src/pages/empleo-eliminado.astro

@@ -14,7 +14,7 @@ const description = "Tu oferta de empleo ha sido eliminada con éxito.";
         {title}
       </h1>
       <article class="my-5 prose dark:prose-invert lg:prose-lg prose-img:mx-auto max-w-none break-words text-center">
-        <p>Su oferta de empleo ha sido eliminada correctamente y ya no será visible en el sitio.</p>
+        <p>Su oferta de empleo ha sido eliminada correctamente. Los cambios se propagaran en el sitio en unos minutos. </p>
         <a href="/" class="text-blue-600 hover:text-blue-800 underline">Volver al inicio</a>
       </article>
     </div>

src/pages/empleo-publicado.astro

@@ -26,9 +26,9 @@ const description =
           class="hidden p-4 mb-4 text-blue-800 border border-blue-300 rounded-lg bg-blue-50 dark:bg-gray-800 dark:text-blue-400 dark:border-blue-800"
           role="alert"
         >
-          <div class="flex items-center">
+          <div class="flex items-center center">
             <svg
-              class="flex-shrink-0 w-4 h-4 mr-2"
+              class="flex-shrink-0 w-6 h-6 mr-2"
               aria-hidden="true"
               xmlns="http://www.w3.org/2000/svg"
               fill="currentColor"
@@ -39,13 +39,13 @@ const description =
               ></path>
             </svg>
             <span class="sr-only">Info</span>
-            <h3 class="text-lg font-medium">Información importante</h3>
+            <h3 class="text-lg !my-0 font-medium">Información importante</h3>
           </div>
           <div class="mt-2 mb-4 text-sm">
             Guarde el siguiente enlace para poder editar o eliminar esta oferta de trabajo en el futuro. Si pierde este
             enlace no podrá realizar cambios.
           </div>
-          <div class="flex">
+          <div class="flex items-center">
             <a
               id="edit-link"
               href="#"
@@ -64,6 +64,24 @@ const description =
               </svg>
               Editar Empleo
             </a>
+            <button
+              id="copy-button"
+              type="button"
+              class="text-blue-800 bg-transparent border border-blue-300 hover:bg-blue-100 focus:ring-4 focus:outline-none focus:ring-blue-200 font-medium rounded-lg text-xs px-3 py-1.5 text-center inline-flex items-center dark:border-blue-800 dark:text-blue-400 dark:hover:bg-blue-700 dark:hover:text-white dark:focus:ring-blue-800"
+            >
+              <svg
+                class="w-3 h-3 mr-2"
+                aria-hidden="true"
+                xmlns="http://www.w3.org/2000/svg"
+                fill="currentColor"
+                viewBox="0 0 18 20"
+              >
+                <path
+                  d="M16 1h-3.278A1.992 1.992 0 0 0 11 0H7a1.993 1.993 0 0 0-1.722 1H2a2 2 0 0 0-2 2v15a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V3a2 2 0 0 0-2-2Zm-3 14H5a1 1 0 0 1 0-2h8a1 1 0 0 1 0 2Zm0-4H5a1 1 0 0 1 0-2h8a1 1 0 0 1 0 2Zm0-5H5a1 1 0 0 1 0-2h2V2h4v2h2a1 1 0 1 1 0 2Z"
+                ></path>
+              </svg>
+              <span id="copy-button-text">Copiar</span>
+            </button>
           </div>
         </div>
       </article>
@@ -77,12 +95,26 @@ const description =
 
   if (id) {
     const editLinkContainer = document.getElementById("edit-link-container");
-    const editLink = document.getElementById("edit-link");
+    const editLink = document.getElementById("edit-link") as HTMLAnchorElement;
+    const copyButton = document.getElementById("copy-button");
+    const copyButtonText = document.getElementById("copy-button-text");
 
     if (editLinkContainer && editLink) {
       editLinkContainer.classList.remove("hidden");
-      editLink.setAttribute("href", `/editar-empleo?id=${id}`);
-      editLink.innerText = `${window.location.origin}/editar-empleo?id=${id}`;
+      const url = `${window.location.origin}/editar-empleo?id=${id}`;
+      editLink.setAttribute("href", url);
+      editLink.innerText = url;
+
+      if (copyButton && copyButtonText) {
+        copyButton.addEventListener("click", () => {
+          navigator.clipboard.writeText(url).then(() => {
+            copyButtonText.innerText = "¡Copiado!";
+            setTimeout(() => {
+              copyButtonText.innerText = "Copiar";
+            }, 2000);
+          });
+        });
+      }
     }
   }
 </script>