1
0
Fork 0
mirror of https://github.com/maybe-finance/maybe.git synced 2025-07-23 15:19:38 +02:00

Allow user to search transaction categories (#577)

Issue #573
This commit is contained in:
Mattia 2024-03-29 14:02:15 +00:00 committed by GitHub
parent 2181cdd118
commit 2d406274ac
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 27 additions and 10 deletions

View file

@ -2,15 +2,29 @@ import { Controller } from "@hotwired/stimulus";
// Basic functionality to filter a list based on a provided text attribute.
export default class extends Controller {
static targets = ["input", "list"];
static targets = ["input", "list", "emptyMessage"];
filter() {
const filterValue = this.inputTarget.value.toLowerCase();
const items = this.listTarget.querySelectorAll(".filterable-item");
let noMatchFound = true;
if (this.hasEmptyMessageTarget) {
this.emptyMessageTarget.classList.add("hidden");
}
items.forEach((item) => {
const text = item.getAttribute("data-filter-name").toLowerCase();
item.style.display = text.includes(filterValue) ? "" : "none";
const shouldDisplay = text.includes(filterValue);
item.style.display = shouldDisplay ? "" : "none";
if (shouldDisplay) {
noMatchFound = false;
}
});
if (noMatchFound && this.hasEmptyMessageTarget) {
this.emptyMessageTarget.classList.remove("hidden");
}
}
}