cleans stuff up.

src/clj/auto_ap/ssr/company_dropdown.clj

@@ -68,7 +68,7 @@
    (dropdown-search-results* {:options (get-clients identity (get (:query-params request) "search-text"))})))
 
 (defn dropdown [{:keys [client-selection client identity clients]}]
-  [:div#company-dropdown
+  [:div#company-dropdown {:x-data (hx/json {})}
    [:script
     (hiccup/raw
      "localStorage.setItem(\"last-client-id\", \"" (:db/id client) "\")" "\n"
@@ -81,23 +81,25 @@
                                                               client-selection) ")")]
    [:div
     [:button#company-dropdown-button {:class "text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-4 py-2.5 text-center inline-flex items-center dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800"
+                                      "x-tooltip.on.click" "{content: ()=>$refs.tooltip.innerHTML, theme: 'light', onMount(i) { htmx.process(i.popper); }, allowHTML: true, interactive:true}"
                                       :type   "button"}
      (cond
        (= :mine client-selection)
        "My Companies"
        (= :all client-selection)
        "All Companies"
-
+    
        (and client
             (= 1 (count clients)))
        (:client/name client)
-
+    
        :else
        (str (count clients) " Companies"))
      [:div.w-4.h-4.ml-2
       svg/drop-down]]
-    [:div#company-dropdown-list.hidden {"_" (hiccup/raw "init call initCompanyDropdown()")}
-     [:div {:class "z-10 bg-white rounded-lg shadow w-64 dark:bg-gray-700 slide-up duration-500 transition-all"}
+    [:template#company-dropdown-list {:x-ref "tooltip"}
+     [:div {:class "w-[300px]"
+            "x-init" "$refs.company.focus()"}
       [:div {:class "p-3"}
        [:label {:for "input-group-search", :class "sr-only"} "Search"]
        [:div {:class "relative"}
@@ -105,6 +107,7 @@
          [:div.w-5.h-5.text-gray-500.dark:text-gray-400
           svg/search]]
         [:input#company-search {:placeholder "Company name"
+                                :x-ref "company"
                                 :name        "search-text"
                                 :class       "block w-full p-2 pl-10 text-sm text-gray-900 border border-gray-300 rounded-lg bg-gray-50 focus:ring-blue-500 focus:border-blue-500 dark:bg-gray-600 dark:border-gray-500 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
                                 :autoFocus   true