Hide trace panel by default

[perkola]

The current version (0.3.2) has the trace panel open by default. In many instances, tracing is not required during development and having to hide it using ctrl + h every time the project is booted becomes cumbersome.

It would be nice to have the trace panel hidden by default or at least being able to configure the default open/closed state in a build profile.

[danielcompton]

@perkola the panel defaults to open only if it hasn't run before and can't find the previous trace panel state in localstorage. Are you finding that it opens on every page refresh? #202 covers the idea of setting build profiles for 10x.

[perkola]

Naturally when developing i tend to clear the local storage often. Hence the trace panel opens very often. Hiding it by default in a build profile would be nice 👍

[pesterhazy]

Another vote for this feature. When used in electron, local storage gets cleared very often, with the net result that the panel needs to be closed manually most of the time.

[nijk]

Another +1 from me, unless I'm missing something on how to hide the re-frame-10x sidebar it's incredibly annoying when doing mobile UI testing

[pesterhazy]

I now add this to my index.html

<script>
localStorage.setItem("day8.re-frame-10x.show-panel","\"false\"")
</script>

Not pretty but works

[nijk]

I've found it's also necessary to refresh the page after the first load with an empty localStorage and setting the show-panel value as above.

Re-frame-10x is a really valuable tool but I'm afraid it's badly let down by the UI implementation. For ideas on improvement, there is a lot that could be gleaned from looking at the Redux DevTools

[hkjels]

It's also very annoying when your testing on a handset where you might not be able to close it at all

[mike-thompson-day8]

We don't do any work on mobile, so the problem does not affect us ... which means we're a little clueless ... but we'd like to fix it and fix it properly. And it seems like the next most important thing to address.

So ... a couple of questions to those who are affected ...

1. Does @pesterhazy's suggestion (above) work for you? Although clumsy, is it sufficient #204 (comment)

2. Would this PR satisfy your needs? #210

3. If you answered "no" to either of the above, what further is needed for your usecases? Any other suggestions?

[perkola]

I am not a fan of having development specific code other than where it is absolutely necessary. I think the best solution (which I have read somewhere but cannot find at the moment) would be to have a configurable option in project.clj that determines if the panel should be open by default or not.

[nijk]

I agree with @perkola that being able to configure the panel's initial state via project.clj would be a good solution for the originally reported issue. However, the proposed solution doesn't address the usability issue of not being able to toggle the panel in/out of view on a mobile viewport where it is impossible to use an application's UI when the panel is open.

My feeling is that there is an additional requirement to improve the UI of the sidebar so that it is possible to show/hide the panel, this would be most useful on smaller devices - allowing developers to use the panel when required during device UI testing, then hide it and continue using the application UI.

[mike-thompson-day8]

@perkola okay, thanks. Makes sense.

@nijk As I explained, we don't do mobile, so "improve the UI of the sidebar" is just too vague for us to action.

[nijk]

@mike-thompson-day8 Sorry, I must have misunderstood - I thought when you said...

but we'd like to fix it and fix it properly

you meant that you were interested in making it work on a mobile device.

[mike-thompson-day8]

@nijk yep, we're trying to get feedback on how to fix this. But we do need specific, concrete suggestions. Nothing hand-waving or vague please because we don't have the necessary background with mobile to turn vague suggestions into something concrete. (Obviously, something as concrete as functioning PR would be the ultimate suggestion).

[Heliosmaster]

It would already be an improvement if there was a ui button on the left to close the pane. I don't mind it being shown, but i can't hide it on mobile :-(

[rlovtangen]

A workaround for hiding the panel on mobile:
Turn the mobile in landscape mode, and the "Pop out" button will be visible. Press that button and re-frame-10x will pop out to its own window. Then switch back to the original window.
Annoying, but it works.

[jtlocsei]

A workaround for hiding the panel on mobile:
Turn the mobile in landscape mode, and the "Pop out" button will be visible. Press that button and re-frame-10x will pop out to its own window. Then switch back to the original window.
Annoying, but it works.

Thanks, something like this works for me. Landscape mode wasn't wide enough for the pop out button to be visible, but in chrome on mobile I clicked "view as desktop site" and then the button was visible.

[rlovtangen]

Another workaround is to use CSS to hide re-frame-10x on small devices.

@media (max-width: 767px) {
    #--re-frame-10x-- {
        display: none;
    }
}