Answered

Widget context menu button extension api deprecated?

  • 14 February 2021
  • 9 replies
  • 90 views

Badge +4

I see that https://developers.miro.com/docs/interface-ipluginconfigextensionpoints#section-get-widget-menu-items is marked as deprecated, but I can't find any alternative way to extend the widget menu, nor can I find any announcement around it. What's the official story here? Is this going away completely, or is there an alternative on the way that hasn't been documented or communicated yet? Or am I blind 😛

icon

Best answer by farbodsaraf 17 February 2021, 17:30

Thanks for looping me in @Max Harper.

 

 @Mikal H Henriksen I can fully understand your confusion as we didn’t shed any lights on what’s coming while deprecating the existing method. We’re planning to sunset the context menu API so I strongly advise to not use it. We don’t have any alternative to offer yet but we’re working on it. For the time being, I’d recommend using the side panel. As you said it might be a bit intrusive/tedious to open and close all the time but this is the most reliable interim alternative until we offer a solid long-term solution for your use case.

View original

9 replies

Badge +4

And a related question that I think you could include in the extension point guidelines: Where's the best place to put tools for editing the selected widget? A widget context menu button would be limited to one specific action (but there are already other posts that request more possibilities), the bottom bar is a bit limited and hard to notice, and a side panel or modal is a bit intrusive/tedious to open and close all the time. I suppose the answer heavily depends on specifics, though.

Userlevel 6
Badge +10

@Mikal H Henriksen  ... cc’ing @Farbod Saraf 

I think we had to track down the API team last summer on this question and got an answer that lead us to the below code.

 

Note that in our context it was designed as a widget context menu access point to a sidebar plugin. This gets called as miro.board.ui.openLeftSidebar('builder.html')

Also note that our code below is setting up toolbar extension point also…   You’ll focus on the bottom half … on the section: getWidgetMenuItems: () => {…} 
It sounds like in your case you’d like the onclick to just run a function - easy enough → put that in the ‘onClick’  value (‘function assignment’ -- not sure what to call it in this context.) onClick: __<your function here>__

 

Here’s an image of the below sample index.js file in action.
 Hope this helps. Let me know if you hit a snag.

 

miro.onReady(run)

const icon24 = '<YOUR SVG HERE>'



function run() {
miro.initialize({
extensionPoints: {
toolbar: {
title: 'Perception-Map-Demo',
toolbarSvgIcon: icon24,
librarySvgIcon: icon24,
onClick: async () => {
const authorized = await miro.isAuthorized();
if (authorized) {
miro.board.ui.openLeftSidebar('builder.html', { title: 'Perception-Map-Demo' })
console.log(window.location.host)
} else {
miro.board.ui.openModal('not-authorized.html')
.then(res => {
if (res === 'success') {
miro.board.ui.openLeftSidebar('builder.html', { title: 'Perception-Map-Demo' })
}
});
}
}
},

getWidgetMenuItems: () => {
return Promise.resolve({
tooltip: "Perception-Map-Demo",
svgIcon: icon24,
onClick: async (widgets) => {
const authorized = await miro.isAuthorized();
if (authorized) {
miro.board.ui.openLeftSidebar('builder.html')
} else {
miro.board.ui.openModal('not-authorized.html')
.then(res => {
if (res === 'success') {
miro.board.ui.openLeftSidebar('builder.html')
}
});
}
}
})
}
}
})
}

 

Badge +4

Thank you, @Max Harper, that's helpful and will for sure save me some time! Although I was more asking about the "why" and "if" rather than the "how" which you've answered, so I'm still holding out for an official answer on that.

Also, thanks for making Clusterizer, it impressed and inspired me enough to actually try making my own plugin! 

Badge +4

Hey, no, who marked that as an answer? I don’t want that, I don’t have the answer yet, and I can’t take it off again myself :/ Read a bit more closely, please.

Userlevel 6
Badge +10

@Mikal H Henriksen   I sincerely apologize … My thumb accidentally hit the wrong button on the mobile screen … was trying to just ‘thumbs up’ your last comment… but I hit the ‘mark as best answer’ which is a checkmark that sits right next to it.   I tried everything to undo it, but It looks like that’s not an option - like its irreversible from my user-type (weird)…  I reached out to a community admin @Marina to help us unmark as ‘best-answered’ until you get a satisfactory answer.  (I’m deputized to be able to mark “Best Answer” … but I totally messed it up here -- #fired.  :(   

@Farbod Saraf 
Is listening to the developer community as they encounter issues with the API/SDK and related documentation, I hope he might be able to help with this issue.  
 

@Mikal H Henriksen -- Excited you’re venturing into developing Miro apps. Happy to help any time with any other questions you encounter, just PM me and I’ll lend a hand. 

 

Badge +4

Oh, no worries, you're forgiven 😁

Badge +4

And now it's fixed! Thanks, mods! 

Userlevel 1
Badge +4

Thanks for looping me in @Max Harper.

 

 @Mikal H Henriksen I can fully understand your confusion as we didn’t shed any lights on what’s coming while deprecating the existing method. We’re planning to sunset the context menu API so I strongly advise to not use it. We don’t have any alternative to offer yet but we’re working on it. For the time being, I’d recommend using the side panel. As you said it might be a bit intrusive/tedious to open and close all the time but this is the most reliable interim alternative until we offer a solid long-term solution for your use case.

Badge +4

Thanks @farbodsaraf that's precisely what I needed to know (and feel validated for being right about my suspicion 😇). Take your time, get it right. I'm happy with using the side panel for now. 

Reply