Hello everyone, I have a background in iOS (Swift) development, only surface level experience with Rails and Javascript. I’m trying to develop a plugin for discourse, and I’m having trouble showing a modal dialog after clicking a button in the toolbar of the post editor UI. I have successfully added the button through something like this: assets/javascripts/discourse/initializers/audio-message-button.js.es6 import { withPluginApi } from 'discourse/lib/plugin-api'; function initializeWithApi(api) { api.onToolbarCreate(toolbar => { toolbar.addButton({ id: "audio_message", group: "extras", icon: "microphone", perform: (editor) => { } }); }); } export default { name: 'audio-message-button', initialize(container) { withPluginApi('0.12.0', api => initializeWithApi(api)); } }; I’ve been trying to utilize ChatGPT to help me with the development, and it made several suggestions in regards to the folder structure. Using components, templates, controller files, but I can’t get the dialog to show. Either I get error messages or nothing happens at all. I’ve tried to search the forum here, but I can’t really find anything that would help with this. Can someone please point me in the right direction as to how I have to set up the folder structure and especially naming conventions of the files involved, so that I can show a simple modal dialog to get me started? Thank you in advance! EDIT: I’m aware the perform function doesn’t do anything in the code above. I’ve tried several methods to make it work, nothing helped tho. So I left it blank here, just demonstrating what I did so far to make the button show up in the toolbar.

Hi peter :slight_smile: I don’t have the knowledge to answer your question, but here are a plugin and a theme component that both add a button to the composer that opens a modal, maybe you’ll find some pointers in their code: [image] Locations Plugin earth_africa Plugin information_source Summary Allows you to associate geocoded locations with Topics and show them on a beautiful map. Also allows your users to record their location and collectively display them on a central users map on your site. hammer_and_wrench Repository Link GitHub - merefield/discourse-locations: Tools for handling locations in Discourse · GitHub open_book Install Guide How to install plugins in Discourse heart Sponsorship Please consider becoming an ongoing spons… [image] Video Upload to YouTube and Vimeo using Theme Component Theme component This new theme component enables video uploads from the Discourse composer to YouTube and Vimeo. For those already familiar with the plugin I developed recently, the same is now available in this Theme Component which can be added to any theme. This makes for a much easier installation and works in exactly the same way as the plugin. Features All forum members can upload videos to Vimeo or YouTube (admins can choose to enable either or both). Admins can control the view and embed privacy of th…

Thank you @Canapin, these plugins helped pointing me in the right direction :slight_smile:

I’ll definitely share the working code here, the entire plugin in fact, when it’s cleaned up and I’m done with it :slightly_smiling_face:

Sharing this here as promised: [image] Discourse Audio Message Development information_source Summary Discourse Audio Message allows users to directly record and attach audio messages to their posts. hammer_and_wrench Repository Link https://github.com/pbenkoe/discourse-audio-message open_book Install Guide How to install plugins in Discourse This plugin was developed with the help of ChatGPT, as my background in backend/javascript development is limited. The implementation is very basic, but I hope it will help some people and maybe it can ser…

Show a modal dialog after clicking toolbar button via a plugin

Development

Canapin (Coin-coin le Canapin) June 28, 2023, 12:11pm 4

Feel free to share your working code here, it will surely help other people

Topic		Replies	Views
Plugin: access to toolbarEvent from modal Development	5	875	January 21, 2025
How to put button in the corner of the screen? Development	5	1425	September 1, 2020
Plugin Modal Component Import Error - Followed Official Docs But Still Getting Errors Development	3	230	August 24, 2025
Render modal from theme client-side plugin API Product Support	14	4230	October 6, 2020
Discourse Audio Message Development	26	2664	June 9, 2024

Show a modal dialog after clicking toolbar button via a plugin

Related topics