Create reusable snippet and file for the copy button and use it instead

aleksis/core/templates/core/ical/ical_list.html

 {% extends 'core/base.html' %}
-{% load i18n msg_box static %}
+{% load i18n msg_box static html_helpers %}
 
 {% block page_title %}{% trans "ICal Feeds" %}{% endblock page_title %}
 {% block browser_title %}{% trans "ICal Feeds" %}{% endblock browser_title %}
@@ -25,17 +25,14 @@
              class="secondary-content btn-flat btn-small primary-color-text btn-smaller-padding waves-effect waves-primary">
             <i class="material-icons iconify" data-icon="mdi:pencil-outline"></i>
           </a>
-          <button type="button" data-target="input-{{ forloop.counter0 }}"
-                  class="secondary-content btn-flat btn-small secondary-color-text btn-smaller-padding copy-button waves-effect waves-secondary">
-            <i class="material-icons iconify copy-icon-copy" data-icon="mdi:content-copy"></i>
-            <i class="material-icons iconify copy-icon-success" style="display: none" data-icon="mdi:check"></i>
-          </button>
+          {% generate_random_id "ical-copy-" as id %}
+          {% include "core/partials/copy_button.html" with classes="secondary-content btn-flat btn-small secondary-color-text btn-smaller-padding" target=id %}
         </span>
         <p class="ical-description">{{ object.ical_feed_object.title }} – {{ object.ical_feed_object.description }}</p>
         <input type="url" readonly value="https://{{ request.site }}{{ object.get_absolute_url }}"
-               id="input-{{ forloop.counter0 }}">
+               id="{{ id }}">
       </div>
     {% endfor %}
   </div>
-  <script src="{% static "js/ical_urls.js" %}" type="text/javascript"></script>
+  <script src="{% static "js/copy_button.js" %}" type="text/javascript"></script>
 {% endblock content %}

aleksis/core/templates/core/partials/copy_button.html

+<button type="button" data-target="{{ target }}"
+        class="{{ classes }} copy-button waves-effect waves-secondary">
+  <i class="material-icons iconify copy-icon-copy" data-icon="mdi:content-copy"></i>
+  <i class="material-icons iconify copy-icon-success" style="display: none" data-icon="mdi:check"></i>
+</button>

aleksis/core/templatetags/html_helpers.py

+import random
+import string
+
 from django import template
 
 from bs4 import BeautifulSoup
@@ -22,3 +25,18 @@ def add_class_to_el(value: str, arg: str) -> str:
         el["class"] = el.get("class", []) + [cls]
 
     return str(soup)
+
+
+@register.simple_tag
+def generate_random_id(prefix: str, length: int = 10) -> str:
+    """Generate a random ID for templates.
+
+    :Example:
+
+    .. code-block::
+
+        {% generate_random_id "prefix-" %}
+    """
+    return prefix + "".join(
+        random.choice(string.ascii_lowercase) for i in range(length)  # noqa: S311
+    )