From 65beeb2a263040c44dbeafbf59d02a5ed9c7e47e Mon Sep 17 00:00:00 2001
From: Egor fureunoir Gorbunov <contact@fureunoir.com>
Date: Tue, 1 Jul 2025 18:51:44 +0300
Subject: [PATCH] Features: 1) Add custom stylesheet and JavaScript for
 autocomplete functionality in admin filter template;

Fixes: None;

Extra: 1) Improve HTML indentation for better readability;
---
 .../admin/autocomplete_list_filter.html       | 33 +++++++++++--------
 1 file changed, 19 insertions(+), 14 deletions(-)

diff --git a/core/templates/admin/autocomplete_list_filter.html b/core/templates/admin/autocomplete_list_filter.html
index 925d4672..f45ca8d8 100644
--- a/core/templates/admin/autocomplete_list_filter.html
+++ b/core/templates/admin/autocomplete_list_filter.html
@@ -1,17 +1,22 @@
 {% load i18n %}
 <div class="filter-autocomplete">
-  <select name="{{ spec.lookup_kwarg }}"
-          id="id_{{ spec.lookup_kwarg }}"
-          class="admin-autocomplete"
-          style="width:90%;"
-          data-ajax--url="{{ spec.autocomplete_url }}"
-          data-app-label="{{ spec.app_label }}"
-          data-model-name="{{ spec.model_name }}"
-          data-field-name="{{ spec.field_name }}"
-          data-allow-clear="true"
-          data-placeholder="{% blocktrans with label=spec.field_label %}Search by {{ label }}…{% endblocktrans %}">
-    {% if spec.lookup_val %}
-      <option value="{{ spec.lookup_val }}" selected>{{ spec.initial_text }}</option>
-    {% endif %}
-  </select>
+    <select name="{{ spec.lookup_kwarg }}"
+            id="id_{{ spec.lookup_kwarg }}"
+            class="admin-autocomplete"
+            style="width:90%;"
+            data-ajax--url="{{ spec.autocomplete_url }}"
+            data-app-label="{{ spec.app_label }}"
+            data-model-name="{{ spec.model_name }}"
+            data-field-name="{{ spec.field_name }}"
+            data-allow-clear="true"
+            data-placeholder="{% blocktrans with label=spec.field_label %}Search by {{ label }}…{% endblocktrans %}">
+        {% if spec.lookup_val %}
+        <option value="{{ spec.lookup_val }}" selected>{{ spec.initial_text }}</option>
+        {% endif %}
+    </select>
 </div>
+
+<link rel="stylesheet"
+      href="{% static 'admin/css/autocomplete.css' %}"/>
+
+<script src="{% static 'admin/js/autocomplete.js' %}"></script>