Basic transaction categories CRUD actions (inline) (#601)

* Fix dropdown issues and add dummy transaction category modal

* Minor namings tweaks

* Add search type

* Use new menu controller

* Complete basic transaction category inline CRUD actions

* Fix lint error

---------

Co-authored-by: Jakub Kottnauer <jk@jakubkottnauer.com>

app/javascript/controllers/menu_controller.js

@@ -6,11 +6,25 @@ import { Controller } from "@hotwired/stimulus";
  * - If you need a form-enabled "select" element, use the "listbox" controller instead.
  */
 export default class extends Controller {
-  static targets = ["button", "content"];
+  static targets = [
+    "button",
+    "content",
+    "submenu",
+    "submenuButton",
+    "submenuContent",
+  ];
+
+  static values = {
+    show: { type: Boolean, default: false },
+    showSubmenu: { type: Boolean, default: false },
+  };
+
+  initialize() {
+    this.show = this.showValue;
+    this.showSubmenu = this.showSubmenuValue;
+  }
 
   connect() {
-    this.show = false;
-    this.contentTarget.classList.add("hidden"); // Initially hide the popover
     this.buttonTarget.addEventListener("click", this.toggle);
     this.element.addEventListener("keydown", this.handleKeydown);
     document.addEventListener("click", this.handleOutsideClick);
@@ -38,11 +52,6 @@ export default class extends Controller {
 
   handleKeydown = (event) => {
     switch (event.key) {
-      case " ":
-        event.preventDefault(); // Prevent the default action to avoid scrolling
-        if (document.activeElement === this.buttonTarget) {
-          this.toggle();
-        }
       case "Escape":
         this.close();
         this.buttonTarget.focus(); // Bring focus back to the button