From a1e253484bdab076943d6c7430b0d7125b4e91dd Mon Sep 17 00:00:00 2001
From: erosselli <67162025+erosselli@users.noreply.github.com>
Date: Sat, 8 Jun 2024 16:22:08 +0200
Subject: [PATCH] Fixed #12 - Added app labels to model list dialog

---
 .../static/admin/css/shortcuts.css            |  1 +
 .../static/admin/js/shortcuts.js              | 48 ++++++++++++++-----
 .../templates/admin/base.html                 | 43 ++++++++++-------
 .../templatetags/shortcuts.py                 | 21 ++++----
 4 files changed, 77 insertions(+), 36 deletions(-)

diff --git a/django_admin_keyboard_shortcuts/static/admin/css/shortcuts.css b/django_admin_keyboard_shortcuts/static/admin/css/shortcuts.css
index 9fd8aa3..94d946f 100644
--- a/django_admin_keyboard_shortcuts/static/admin/css/shortcuts.css
+++ b/django_admin_keyboard_shortcuts/static/admin/css/shortcuts.css
@@ -63,4 +63,5 @@ dialog {
 
 #model-list-dialog-search {
   margin: 0.5em 0em;
+  width: 12vw;
 }
diff --git a/django_admin_keyboard_shortcuts/static/admin/js/shortcuts.js b/django_admin_keyboard_shortcuts/static/admin/js/shortcuts.js
index 626afe7..9d8529c 100644
--- a/django_admin_keyboard_shortcuts/static/admin/js/shortcuts.js
+++ b/django_admin_keyboard_shortcuts/static/admin/js/shortcuts.js
@@ -56,15 +56,25 @@ function replaceModifiers() {
 // defined in django/contrib/admin/static/admin/js/nav_sidebar.js
 // If/when merged into core, we could try to reuse some parts
 function filterModelList() {
-  const options = [];
   const modelListDialog = document.getElementById('model-list-dialog');
   if (!modelListDialog) {
       return;
   }
-  modelListDialog.querySelectorAll('li a').forEach((container) => {
-      options.push({title: container.innerHTML, node: container});
-  });
 
+  const appSections = [];
+  
+  modelListDialog.querySelectorAll('section').forEach(section => {
+    const options = [];
+    section.querySelectorAll('li a').forEach(container => options.push({
+      title: container.innerHTML,
+      node: container
+    }));
+    
+    appSections.push({
+      node: section, 
+      options,
+    });
+  });
 
   function checkValue(event) {
       let filterValue = event.target.value;
@@ -75,14 +85,30 @@ function filterModelList() {
           filterValue = '';
           event.target.value = ''; // clear input
       }
-      for (const option of options) {
-          let displayValue = '';
-          if (!filterValue || option.title.toLowerCase().indexOf(filterValue) === -1) {
-            displayValue = 'none'
-          }
-          option.node.parentNode.style.display = displayValue;
-      }
 
+      appSections.forEach(section => {
+        let matched = false;
+        // Check if any of the app models match the filter text
+        section.options.forEach((option) => {
+          let optionDisplay = '';
+          if (option.title.toLowerCase().indexOf(filterValue) === -1) {
+            optionDisplay = 'none';
+          } else {
+            matched = true;
+          }
+          // Set display in parent <li> element
+          option.node.parentNode.style.display = optionDisplay;
+        });
+
+        let sectionDisplay = '';
+        // If there's no filter value or no matched models
+        // for the section, we hide the section entirely
+        if (!filterValue || !matched) {
+          sectionDisplay = 'none';
+        }
+        // Set display for the app section
+        section.node.style.display = sectionDisplay;
+      });
   }
 
   const nav = document.getElementById('model-list-dialog-search');
diff --git a/django_admin_keyboard_shortcuts/templates/admin/base.html b/django_admin_keyboard_shortcuts/templates/admin/base.html
index 50e18fc..15b8b51 100644
--- a/django_admin_keyboard_shortcuts/templates/admin/base.html
+++ b/django_admin_keyboard_shortcuts/templates/admin/base.html
@@ -22,22 +22,33 @@ <h2>{% translate "Models" %}</h2>
         <button aria-label="{% translate 'Close' %}">&#10006;</button>
       </form>
     </div>
-    <input type="search" id="model-list-dialog-search"
-      placeholder="{% translate 'Start typing to search' %}"
-      aria-label="{% translate 'Search models' %}"
-  >
-    <section>
-      <ul>
-        {% all_models as models %}
-        {% for model in models %}
-          <li>
-            <a href="{{ model.url }}"{{ model.name }}>
-              {{ model.name }}
-            </a>
-          </li>
-        {% endfor %}
-      </ul>
-    </section>
+    <form id="model-list-dialog-form">
+      <label for="model-list-dialog-search">
+        {% translate 'Search model' %}
+      </label>
+      <input
+        type="search"
+        id="model-list-dialog-search"
+        placeholder="{% translate 'Start typing to search...' %}"
+      >
+    </form>
+    <div>
+      {% all_apps as apps %}
+      {% for app_label, models in apps.items %}
+        <section>
+          <h3>{{ app_label }}</h3>
+          <ul>
+          {% for model in models %}
+            <li>
+              <a href="{{ model.url }}"{{ model.name }}>
+                {{ model.name }}
+              </a>
+            </li>
+          {% endfor %}
+          </ul>
+        </section>
+      {% endfor %}
+    </div>
   </dialog>
   <dialog id="shortcuts-dialog">
     <div class="dialog-heading">
diff --git a/django_admin_keyboard_shortcuts/templatetags/shortcuts.py b/django_admin_keyboard_shortcuts/templatetags/shortcuts.py
index fbce66b..e0628eb 100644
--- a/django_admin_keyboard_shortcuts/templatetags/shortcuts.py
+++ b/django_admin_keyboard_shortcuts/templatetags/shortcuts.py
@@ -6,16 +6,19 @@
 
 
 @register.simple_tag
-def all_models():
-    models = []
+def all_apps():
+    apps = {}
     for model in site._registry.keys():
         app_label = model._meta.app_label
         model_name = model._meta.model_name
         changelist_url = reverse('admin:%s_%s_changelist' % (app_label, model_name))
-        models.append(
-            {
-                "name": model._meta.verbose_name,
-                "url": changelist_url,
-            }
-        )
-    return models
+        model_data = {
+            "name": model._meta.verbose_name,
+            "url": changelist_url
+        }
+        if app_label not in apps:
+            apps[app_label] = [model_data]
+        else:
+            apps[app_label].append(model_data)            
+      
+    return apps