1567372 - Add a reverse search button to the Editor Toolbar

Status: RESOLVED FIXED

(DevTools :: Console, task, P3)

Description

[Nicolas Chevobbe [:nchevobbe]]

it should be similar to the one we'll have in the inline input

Comment 1

[Nicolas Chevobbe [:nchevobbe]]

Armando, would you be interested by this bug?

Comment 2

[Armando Ferreira]

Of course! I will start working on it. Can you please assign it to me? (:

Comment 3

[Armando Ferreira]

Hi Nicolas,

Hope your are doing well!

Can you please give me a little bit more of explanation? I can't find any reverse search button in the inline input :(

Comment 4

[Nicolas Chevobbe [:nchevobbe]]

Attachment: reverse-search.svg

Sure, sorry.
So for now the button i'm talking about in comment 0 does not exist in the input yet.
You can use the icon I attached here.

To see how to add an icon, you may want to look how it's done for the Run button icon: https://searchfox.org/mozilla-central/search?q=run.svg&case=false&regexp=false&path=

Let me know if you have other questions :)

Comment 5

[Nicolas Chevobbe [:nchevobbe]]

Attachment: reverse-search.svg

This should be close to the final version of the icon :)

Comment 6

[Armando Ferreira]

Attachment: reverse-search-button-suggestion-1.png

Comment 7

[Armando Ferreira]

Attachment: reverse-search-button-suggestion-2.png

Comment 8

[Armando Ferreira]

Attachment: reverse-search-button-suggestion-3.png

Comment 9

[Armando Ferreira]

Attachment: reverse-search-button-suggestion-4.png

Comment 10

[Armando Ferreira]

Hi Nicolas,

I attached some suggestions about the new location of the reverse search button. My friend and I think that it looks better if the Reverse Search button is placed before the Run button as showed in reverse-search-button-suggestion-4.png.

What are your opinions? :)
Let me know what will be the best location for the new reverse search button.

Comment 11

[Nicolas Chevobbe [:nchevobbe]]

Thanks a lot Armando!
So I think it looks better in 4.png, but it may not be the place it makes the most sense?
Since this button is related to history, it should be grouped with the navigation buttons. With that in mind, I think 3.png looks the best.
We might want to add a separator between the search and the close button so we emphasize the fact that the 3 buttons are part of the same group

▶︎ Run                         ˄ ˅ 🔍  |  ✖️

Here's an example of separator devtools/client/webconsole/components/FilterBar/FilterBar.js#264-266

Comment 12

[Armando Ferreira]

Attachment: reverse-search-button-proposal-1.png

Hi Nicolas,

Thanks for your comments! :) What do you think about the final design? I place the reverse search button after the history navigation buttons and added the separator between the close button and the reverse search button.

I think now it looks better. Let me know if you have any other suggestions

Comment 13

[Armando Ferreira]

Attachment: reverse-search-button-proposal-1-no-tooltip.png

Here is how it will look like without the tool tip

Comment 14

[:Harald Kirschner :digitarald]

I like the last one as well. The alignment with search navigation and separator to the close button segments it better.

Comment 15

[Armando Ferreira]

Attachment: Bug 1567372 - Add a reverse search button to the Editor Toolbar. r=nchevobbe

Comment 16

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/c05c17a1b9b1
Add a reverse search button to the Editor Toolbar. r=nchevobbe

Comment 17

[Alexandru Michis [:malexandru]]

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