fix(react/dialogs): bulk actions not working in search notes

apps/client/src/widgets/react/ReactBasicWidget.tsx

@@ -9,13 +9,24 @@ export default abstract class ReactBasicWidget extends BasicWidget {
     abstract get component(): JSX.Element;
 
     doRender() {        
-        const renderContainer = new DocumentFragment();
+        this.$widget = renderReactWidget(this, this.component);
-        render((
-            <ParentComponent.Provider value={this}>
-                {this.component}
-            </ParentComponent.Provider>
-        ), renderContainer);
-        this.$widget = $(renderContainer.firstChild as HTMLElement);
     }
 
 }
+
+/**
+ * Renders a React component and returns the corresponding DOM element wrapped in JQuery.
+ * 
+ * @param parentComponent the parent Trilium component for the component to be able to handle events.
+ * @param el the JSX element to render.
+ * @returns the rendered wrapped DOM element.
+ */
+export function renderReactWidget(parentComponent: Component, el: JSX.Element) {
+    const renderContainer = new DocumentFragment();
+    render((
+        <ParentComponent.Provider value={parentComponent}>
+            {el}
+        </ParentComponent.Provider>
+    ), renderContainer);
+    return $(renderContainer.firstChild as HTMLElement);
+}

apps/client/src/widgets/ribbon_widgets/search_definition.ts

@@ -19,6 +19,7 @@ import bulkActionService from "../../services/bulk_action.js";
 import { Dropdown } from "bootstrap";
 import type FNote from "../../entities/fnote.js";
 import type { AttributeType } from "../../entities/fattribute.js";
+import { renderReactWidget } from "../react/ReactBasicWidget.jsx";
 
 const TPL = /*html*/`
 <div class="search-definition-widget">
@@ -306,7 +307,7 @@ export default class SearchDefinitionWidget extends NoteContextAwareWidget {
 
         const actions = bulkActionService.parseActions(this.note);
         const renderedEls = actions
-            .map((action) => action.render())
+            .map((action) => renderReactWidget(this, action.doRender()))
             .filter((e) => e) as JQuery<HTMLElement>[];
 
         this.$actionOptions.empty().append(...renderedEls);