Add AccountSelect widget and update account field in forms

- Introduced AccountSelect widget for improved account selection in forms.
- Updated AccountForm, StatementForm, and TransactionFiltersForm to use AccountSelect.
- Modified account model options to include 'archived' in ordering.
- Added new migration for account model options change.

nummi/account/forms.py

@@ -1,3 +1,4 @@
+from django.forms.widgets import Select
 from main.forms import IconInput, NummiForm
 
 from .models import Account
@@ -15,3 +16,7 @@ class AccountForm(NummiForm):
         widgets = {
             "icon": IconInput(),
         }
+
+
+class AccountSelect(Select):
+    template_name = "account/forms/widgets/account.html"

nummi/account/migrations/0004_alter_account_options.py

@@ -0,0 +1,20 @@
+# Generated by Django 4.2.7 on 2025-01-04 17:44
+
+from django.db import migrations
+
+
+class Migration(migrations.Migration):
+    dependencies = [
+        ("account", "0003_account_archived"),
+    ]
+
+    operations = [
+        migrations.AlterModelOptions(
+            name="account",
+            options={
+                "ordering": ["-default", "archived", "name"],
+                "verbose_name": "Account",
+                "verbose_name_plural": "Accounts",
+            },
+        ),
+    ]

nummi/account/models.py

@@ -41,7 +41,7 @@ class Account(UserModel):
         )
 
     class Meta:
-        ordering = ["-default", "name"]
+        ordering = ["-default", "archived", "name"]
         verbose_name = _("Account")
         verbose_name_plural = _("Accounts")
 

nummi/account/templates/account/forms/widgets/account.html

@@ -0,0 +1,5 @@
+{% load main_extras %}
+<span class="ico-input account-select">
+  {{ "bank"|remix }}
+  {% include "django/forms/widgets/select.html" %}
+</span>

nummi/main/static/main/js/base.js

@@ -34,6 +34,21 @@ for (let form of forms) {
       setTimeout(setIcon, 0);
     });
   }
+  let accountSelect = form.querySelector(".account-select");
+  if (accountSelect) {
+    let input = accountSelect.querySelector("select");
+    let icon = accountSelect.querySelector("span");
+    let icons = JSON.parse(input.dataset.icons);
+
+    function setIcon(event) {
+      icon.className = `ri-${icons[input.value] || "bank"}-line`;
+    }
+    setIcon();
+    input.addEventListener("input", setIcon);
+    form.addEventListener("reset", (event) => {
+      setTimeout(setIcon, 0);
+    });
+  }
 
   let iconSelect = form.querySelector(".icon-select");
   if (iconSelect) {

nummi/statement/forms.py

@@ -1,3 +1,6 @@
+import json
+
+from account.forms import AccountSelect
 from django import forms
 from django.forms.widgets import Select
 from django.utils.translation import gettext_lazy as _
@@ -13,6 +16,7 @@ class StatementForm(NummiForm):
         fields = ["account", "start_date", "date", "start_value", "value", "file"]
         widgets = {
             "file": NummiFileInput,
+            "account": AccountSelect,
         }
 
     meta_fieldsets = [
@@ -40,6 +44,16 @@ class StatementForm(NummiForm):
             required=False,
         )
 
+        self.fields["account"].widget.attrs |= {
+            "class": "account",
+            "data-icons": json.dumps(
+                {
+                    str(acc.id): acc.icon
+                    for acc in self.fields["account"].queryset.only("id", "icon")
+                }
+            ),
+        }
+
         if _disable_account:
             self.fields["account"].disabled = True
 

nummi/transaction/forms.py

@@ -1,5 +1,6 @@
 import json
 
+from account.forms import AccountSelect
 from category.forms import CategorySelect
 from django import forms
 from django.forms import formset_factory
@@ -168,7 +169,9 @@ class TransactionFiltersForm(forms.Form):
     category = forms.ModelChoiceField(
         queryset=None, required=False, widget=CategorySelect()
     )
-    account = forms.ModelChoiceField(queryset=None, required=False)
+    account = forms.ModelChoiceField(
+        queryset=None, required=False, widget=AccountSelect()
+    )
     search = forms.CharField(label=_("Search"), required=False)
     sort_by = forms.ChoiceField(
         label=_("Sort by"),
@@ -198,3 +201,12 @@ class TransactionFiltersForm(forms.Form):
                 }
             ),
         }
+        self.fields["account"].widget.attrs |= {
+            "class": "account",
+            "data-icons": json.dumps(
+                {
+                    str(acc.id): acc.icon
+                    for acc in self.fields["account"].queryset.only("id", "icon")
+                }
+            ),
+        }