baobab icon indicating copy to clipboard operation
baobab copied to clipboard

Published 20 hours ago • verified publisher icon Yomguithereal

add devtools?

Open sergeysova opened this issue 9 years ago • 12 comments

like redux-devtools

sergeysova avatar Feb 16 '16 01:02 sergeysova

Hello @LestaD. Devtools would be nice indeed. I think it should be easy to port redux' ones to work with Baobab. I don't have much time right now to test it however.

Yomguithereal avatar Feb 16 '16 09:02 Yomguithereal

https://github.com/zalmoxisus/redux-devtools-extension

sergeysova avatar Feb 16 '16 12:02 sergeysova

https://github.com/goatslacker/alt-devtool

sergeysova avatar Feb 16 '16 12:02 sergeysova

I've implemented this in my project for development: https://github.com/josdejong/jsoneditor

I get a widget that shows the tree nicely formatted and I see updates when the tree commits. It also pushes the changes to Baobab when you edit the tree in the widget.

It's that something that might interest you? I could publish the implementation if you think its something you might use.

dumconstantin avatar Mar 12 '16 15:03 dumconstantin

@dumconstantin it's very good solution! We can improve it's functionality

sergeysova avatar Mar 13 '16 14:03 sergeysova

Cool! I'll try and publish what I have so far and let you know

On 13 mar. 2016, at 16:20, Sergey Sova [email protected] wrote:

@dumconstantin it's very good solution! We can improve it's functionality

— Reply to this email directly or view it on GitHub.

dumconstantin avatar Mar 13 '16 19:03 dumconstantin

Hi @LestaD, I published the Baobab-JsonEditor implementation here:

https://github.com/dumconstantin/baobab-jsoneditor

Please let me know how it goes! :)

dumconstantin avatar Mar 14 '16 16:03 dumconstantin

Hi guys, did you manage to give the devtool a go?

dumconstantin avatar Mar 21 '16 14:03 dumconstantin

I tried them, but the placement resulted in it covering important things. The background was also transparent... Our tree can contain a lot of data and after accidentally clicking Expand All (which was just some symbol) the browser tab just frooze.

It looks like a neat thing, but so far it's nothing for me

Zache avatar Mar 22 '16 12:03 Zache

Ow, didn't realize that (was testing on a white background). So mainly aesthetically issues, I'll see if I can tweak https://github.com/josdejong/jsoneditor a bit (this is the underlying editor).

dumconstantin avatar Mar 22 '16 13:03 dumconstantin

Hi @Zache, I did some updates to the widget, maybe you can give it another go...

  • You can now move the widget around
  • I removed the Expand All button
  • Made a solid background
  • Added a toggle sync button that lets you freeze the state for inspection (also avoids having the tree collapsing when updated)

Just run npm i -D [email protected] to install the patched version.

dumconstantin avatar Mar 24 '16 16:03 dumconstantin

Hello @dumconstantin. Sorry for the late response. I'll try your devtool as soon as I find time to install it on one of my apps :).

Yomguithereal avatar Mar 24 '16 17:03 Yomguithereal