1580530 - Support for multiple panels in left side bar

Status: VERIFIED FIXED

(DevTools :: Netmonitor, enhancement, P3)

Description

[Jan Honza Odvarko [:Honza] (always need-info? me)]

The UI for blocking specific resources manually from DevTools Network panel will be part of the left side bar (not the right side bar for HTTP request details)

This left side bar already exists and is used for Search across all HTTP requests (resources).

This bug is about:

• Implementing support for multiple side panels in the left side bar (using tab bar)
• Convert the current Search panel into a tab in the side bar

Honza

Comment 1

[Jan Honza Odvarko [:Honza] (always need-info? me)]

Some pointers to the code base:

1. The Search panel is rendered here
   https://searchfox.org/mozilla-central/rev/a777ff11b6d700a698c61e5bd17e73b044304494/devtools/client/netmonitor/src/components/MonitorPanel.js#180

In this place we need to render the new side bar NetworkActionBar not just one panel.

The SearchPanel is implemented here:
https://searchfox.org/mozilla-central/rev/a777ff11b6d700a698c61e5bd17e73b044304494/devtools/client/netmonitor/src/components/search/SearchPanel.js#37

2. The existing right side bar is represented by NetworkDetailsPanel (should be renamed to NetworkDetailsBar in another bug) and rendered here:
   https://searchfox.org/mozilla-central/rev/a777ff11b6d700a698c61e5bd17e73b044304494/devtools/client/netmonitor/src/components/MonitorPanel.js#226

... and implemented here:
https://searchfox.org/mozilla-central/rev/a777ff11b6d700a698c61e5bd17e73b044304494/devtools/client/netmonitor/src/components/NetworkDetailsPanel.js#29

3. The new NetworkActionBar should be implemented exactly the same way as NetworkDetailsPanel. Based on Tabbar
   require("devtools/client/shared/components/tabs/TabBar")

NetworkDetailsPanel is using helper TabboxPanel, but it looks like it isn't needed for NetworkActionBar. Let's try to simplify it here.

4. Here is an example of adding a new panel into the TabBar
   https://searchfox.org/mozilla-central/rev/a777ff11b6d700a698c61e5bd17e73b044304494/devtools/client/netmonitor/src/components/TabboxPanel.js#124-137

We need to append the existing SearchPanel.

Honza

Comment 2

[David Walsh :davidwalsh]

Attachment: Bug 1580530 - Implement NetworkActionBar in the netmonitor r=honza

Creates a left sidebar panel for both search and request blocking.

Comment 4

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/d9b4b368aa2e
Implement NetworkActionBar in the netmonitor r=Honza

Comment 5

[Alexandru Michis [:malexandru]]

https://hg.mozilla.org/mozilla-central/rev/d9b4b368aa2e

Comment 6

[Cristian Fogel [:cfogel]]

Marking as verified for 71.0b9.