Plugin: Zugriff auf toolbarEvent aus dem Modal

Entwickler
1

Mein Plugin fügt einen Button in die Symbolleiste des Editors ein. Diese Symbolleiste öffnet ein Modal, und wenn das Modal geschlossen wird, möchte ich Text zum Beitrag hinzufügen. Alles funktioniert perfekt, außer dem letzten Schritt, da ich Schwierigkeiten habe, dem Modal Zugriff auf den Editor zu verschaffen.

Wenn ich den Button unter einem Menü in der Symbolleiste platziere, funktioniert alles einwandfrei:

      api.modifyClass("controller:composer", {
        pluginId: "discourse-n8n-wf",
        actions: {
          showWfModal2() {
            showModal("discourse-n8n-wf").setProperties({"toolbarEvent": this.toolbarEvent});
          },
        },
      });
      api.addToolbarPopupMenuOptionsCallback(() => {
        return {
          action: "showWfModal2",
          icon: "network-wired",
          label: "n8n workflow"
        };
      });

Wenn ich ihn jedoch auf der obersten Ebene platziere, scheint ich keinen Zugriff auf das toolbarEvent zu haben, um es an das Modal weiterzugeben:

      Composer.reopen({
        actions: {
          showWfModal: function () {
            console.log(this.toolbarEvent); // undefined
            showModal('discourse-n8n-wf', {title:'Insert n8n workflow'});
          }
        }
      });

      api.onToolbarCreate(toolbar => {
        toolbar.addButton({
          id: 'discourse-n8n-wf',
          group: 'extras',
          icon: 'network-wired',
          action: 'showWfModal',
          title: 'Insert workflow'
        });
      });

Irgendwelche Tipps?

2 „Gefällt mir“
2

Das toolbarEvent sollte in deinem Modal-Controller (discourse-n8n-wf) verfügbar sein, du musst es also nicht übergeben. Du kannst dir auch ansehen, wie andere Modals dies handhaben, zum Beispiel in discourse-post-event-builder.js.es6 im Poll-Plugin.

3

Danke, Penar! Ich bin aber noch nicht ganz so weit:

Ich habe die Datei gefunden, auf die du dich im discourse-calendar-Plugin beziehst (im Poll-Plugin konnte ich sie nicht finden), aber dort scheint das toolbarEvent tatsächlich in der Aktion übergeben zu werden (durch setProperties())?

4

Ich wollte nur fragen, ob du noch weitere Gedanken dazu hast, @pmusaraj?

5

Hallo @sirdavidoff

Ich bin mir nicht sicher, ob du hier noch feststeckst, aber ich bin auch der Sache nachgegangen, wie man von einem Modal aus auf das Toolbar-Ereignis zugreifen kann, und ich habe herausgefunden, dass man das Ereignis als Parameter wie folgt übergeben kann:

action: (event) =>

Ich habe es also so verwendet:

  const composerController = api.container.lookup('controller:composer');

  api.onToolbarCreate((toolbar) => {
    toolbar.addButton({
      id: 'math-editor',
      group: 'extras',
      icon: 'square-root-alt',
      sendAction: (event) => composerController.send('showMathEditor', event),
      title: themePrefix('insert_equation'),
    });
  });

und dann kannst du es in deiner action: {} Methode wie folgt verwenden:

@action
showMathEditor(event) {
   showModal('matheditor-modal').set('toolbarEvent', event);
}
2 „Gefällt mir“
6

Ich möchte hinzufügen – Jahre später hatte ich dasselbe Problem (hatte keinen Zugriff auf toolbarEvent innerhalb eines Modals) und diese Lösung hat auch für mich funktioniert.

      api.onToolbarCreate((toolbar) => {
        toolbar.addButton({
          ...
          sendAction: (event) =>
            toolbar.context.send("triggerMyModal", event),
          ...
        });
      });

      api.modifyClass("component:d-editor", {
        modal: service(),
        pluginId: "poll",
        actions: {
          triggerMyModal(toolbarEvent) {
            this.modal.show(MyCustomModal, {
              model: {
                toolbarEvent,
              },
            });
          },
        },
      });

Danke für die Hilfe, Keegan.

3 „Gefällt mir“