Opening a modal using "plus" button from clay:management-toolbar taglibOpening a modal using "plus" button from clay:management-toolbar taglibhttps://liferay.dev/en/c/message_boards/find_thread?p_l_id=119785333&threadId=1191517072024-03-29T10:40:53Z2024-03-29T10:40:53ZOpening a modal using "plus" button from clay:management-toolbar taglibRui Antóniohttps://liferay.dev/en/c/message_boards/find_message?p_l_id=119785333&messageId=1191517062020-05-13T18:04:35Z2020-05-13T18:04:35Z<html><head></head><body>Hi all,<br><br>I'm building a custom admin panel module in Liferay 7.2.1 GA2 release. My view.jsp has a<strong> clay:management-toolbar</strong> taglib and now I need to build the action for the "plus" button. I want to open a modal when it's clicked, like the "plus" button of Site Builder -> Navigation Menus<br><img src="/documents/portlet_file_entry/14/Screenshot+from+2020-05-13+18-21-11--tempRandomSuffix--NgG7IDB8.png/7fbdd211-98ea-4218-11e9-e9f8e8eff2a5"><br><br><img src="/documents/portlet_file_entry/14/Screenshot+from+2020-05-13+18-21-21--tempRandomSuffix--9Ldgt5X4.png/b337ce49-9d7f-3708-bced-83d475f922f8"><br>I looked into this file /modules/apps/site-navigation/site-navigation-admin-web/src/main/resources/META-INF/resources/view.jsp from liferay source code to understand how it's done. <br><br>Right now, I have a class that extends com.liferay.frontend.taglib.clay.servlet.taglib.display.context.SearchContainerManagementToolbarDisplayContext, already overrided getCreationMenu() method to have this "plus" button, copied ManagementToolbarDefaultEventHandler.es.js from site-navigation-admin-web into my admin panel module and also included the following taglib to call it:<br><br><pre><code><liferay-frontend:component componentId="<%= channelsAdminManagementToolbarDisplayContext.getDefaultEventHandler() %>" module="js/ManagementToolbarDefaultEventHandler.es" /></code></pre>This module is deployed successfully, but when I try to open the page it throws this js error:<br><br><br>Missing dependency ':ERROR:Missing version constraints for anonymous-questions-admin-panel$frontend-js-web in package.json of <a href="anonymous-questions-admin-panel@1.0.0">anonymous-questions-admin-panel@1.0.0</a>' of '<a href="anonymous-questions-admin-panel@1.0.0/js/ManagementToolbarDefaultEventHandler.es">anonymous-questions-admin-panel@1.0.0/js/ManagementToolbarDefaultEventHandler.es</a>'<br><br><br>In my module I have created this package.json:<br><pre><code>{
"dependencies": {
&nbsp; "metal-dom": "2.16.8",
"metal-drag-drop": "3.3.1",
"metal-position": "2.1.2",
"metal-state": "2.16.8"
},
"devDependencies": {
"@babel/cli": "^7.8.4",
"@babel/core": "^7.8.4",
"@babel/preset-env": "^7.9.6",
"liferay-npm-bundler": "^2.18.5"
},
"main": "js/ManagementToolbarDefaultEventHandler.es.j",
"name": "anonymous-questions-admin-panel",
"private": true,
"scripts": {
"build": "babel --source-maps -d build/resources/main/META-INF/resources src/main/resources/META-INF/resources &amp;&amp; liferay-npm-bundler"
},
"version": "1.0.0"
}</code></pre>I already tried to include "frontend-js-web": "*" dependency into package.json as it is in package.json from site-navigation-admin-web module, but it doesn't solve my problem. <br><br>Is it how this event handler should be implemented ? How can I solve my problem with this frontend-js-web dependeny ? </body>&l