search

phoenixframework / phoenix_live_dashboard

Realtime dashboard with metrics, request logging, plus storage, OS and VM insights
MIT License
2.02k stars 184 forks source link

Way of having info modals for table rows #380

Open jotaviobiondo opened 2 years ago

jotaviobiondo commented 2 years ago

Currently some of the default pages, like ETS, Process, etc. have clickable rows that shows a modal with more detailed information. Right now, as far as I can see in the code there's no way of having this for custom pages.

There are plans for having such feature?

I was thinking that the PageBuilder could have a callback for defining some configuration for showing a modal. Maybe having 2 ways of configuring it:

  1. simple way with minimal config that just shows the complete row data in a tabular way (like in the ETS info modal)
  2. more configurable way for building a custom modal, like we have for rendering the page

I would be happy to help with an PR, but probably need to discuss the API for this, since its a big change 😄

josevalim commented 2 years ago

The modals that we have on the other pages are generic and meant to be triggered from any other page. If your goal is to support a modal only within a single page, then it should be much easier and I would probably apply some hardcoded logic to that. Something like ?modal=current and that invokes an event or a callback on the page. :)

jotaviobiondo commented 2 years ago

Hmm, to do that and be able to conditionally render the modal, it would require to create a custom component to be rendered in the PageBuilder.render_page/1, right?

If thats so, it should probably work fine :)

josevalim commented 2 years ago

I am not quite sure because I haven't used the dashboard for a while. :) So feel free to give whatever comes to your mind a try :)

jotaviobiondo commented 2 years ago

Hahah got it! Thanks for the help! :)

alexcastano commented 1 year ago

After working on #401, I had some ideas related to this issue. We can define a Modal behaviour to be implemented for the current modals, but also for external modals. Modals are based on a string decoding of the param info. If we have a list of Modal we can try to decode until we find one which can handle the current format.

External modals can be passed as an option in the router. Another option could be a Protocol, but not sure if it is the best option here.

@josevalim if you think it is worth the idea I will give it a try, or you have a better suggestion :)