triv: #26869 Initializing trees on afterSwap event

Author: LuboZ

src/django_smartbase_admin/static/sb_admin/src/js/main.js

@@ -32,7 +32,7 @@ import Autocomplete from "./autocomplete"
 import StaticAutocomplete from "./static_autocomplete"
 import ChoicesJS from "./choices"
 import TextTags from "./text_tags"
-import { ensureFilterForms, setCookie, setDropdownLabel, shouldProcessAfterSwap } from "./utils"
+import { SBADMIN_INIT_TREES_EVENT, ensureFilterForms, setCookie, setDropdownLabel, shouldProcessAfterSwap } from "./utils"
 import Multiselect from "./multiselect"
 import Radio from "./radio"
 import "./inline_paginator"
@@ -82,6 +82,7 @@ class Main {
                 this.initTooltips(target)
                 this.syncEmptyFieldsets(target)
                 this.scheduleScrollToFirstErrorField(target)
+                document.dispatchEvent(new CustomEvent(SBADMIN_INIT_TREES_EVENT, {detail: {target: target}}))
             }
             window.htmx.on("htmx:afterSwap", (event) => {
                 if (!shouldProcessAfterSwap(event)) {

src/django_smartbase_admin/static/sb_admin/src/js/tree_widget.js

@@ -1,4 +1,5 @@
 import {sanitizeHtml} from './sanitize'
+import {SBADMIN_INIT_TREES_EVENT} from './utils'
 
 const loadValue = function ($inputEl, treeWidgetData, treeInstance) {
     let value = $inputEl.val()
@@ -397,12 +398,8 @@ const loadValue = function ($inputEl, treeWidgetData, treeInstance) {
             initAllTrees(event.target)
         })
 
-        document.addEventListener('htmx:afterSwap', (event) => {
-            initAllTrees(event.detail && event.detail.elt)
-        })
-
-        document.addEventListener('htmx:oobAfterSwap', (event) => {
-            initAllTrees(event.detail && event.detail.elt)
+        document.addEventListener(SBADMIN_INIT_TREES_EVENT, (event) => {
+            initAllTrees(event.detail && event.detail.target)
         })
 
         const queryBuilderEl$ = $(".query-builder-advanced")

src/django_smartbase_admin/static/sb_admin/src/js/utils.js

@@ -1,5 +1,7 @@
 import {sanitizeHtml} from './sanitize'
 
+export const SBADMIN_INIT_TREES_EVENT = 'SBAdminInitTrees'
+
 export const createIcon = (iconId, classes = ['w-24', 'h-24']) => {
     const svgEl = document.createElementNS('http://www.w3.org/2000/svg', 'svg')
     svgEl.classList.add(...classes)