Add copy link button

static/assets/js/copy-button.js

@@ -0,0 +1,19 @@
+document.addEventListener('DOMContentLoaded', () => {
+    const copyButton = document.getElementById('copyButton');
+    if (copyButton) {
+        copyButton.addEventListener('click', () => {
+            const linkToCopy = window.location.href; // Or any specific link
+            navigator.clipboard.writeText(linkToCopy)
+                .then(() => {
+                    // Change button text
+                    copyButton.innerText = 'Link Copied';
+                    copyButton.disabled = true; // Optional: Disable button to prevent repeated clicks
+                    setTimeout(() => {
+                        copyButton.innerText = 'Copy Link'; // Reset text after 3 seconds
+                        copyButton.disabled = false;
+                    }, 3000);
+                })
+                .catch(err => console.error('Failed to copy: ', err));
+        });
+    }
+});

templates/details_base.html

@@ -56,6 +56,9 @@ <h2 class="govuk-heading-s govuk-!-margin-top-3">
         </div>
         {% block extra_description %}
         {% endblock extra_description %}
+      <button id="copyButton" class="govuk-button govuk-button--secondary">
+        Copy link
+      </button>
         {% block metadata_list %}
           <ul class="govuk-list govuk-body" id="metadata-property-list">
             {% if entity.created %}
@@ -120,3 +123,7 @@ <h2 class="govuk-heading-s govuk-!-margin-top-3">
   {% block extra_details %}
   {% endblock extra_details %}
 {% endblock content %}
+
+{% block scripts %}
+  <script src="{% static 'assets/js/copy-button.js' %}"></script>
+{% endblock scripts %}