Closed Bug 1344120 Opened 3 years ago Closed 6 months ago

[translate] Reset search placeholder if filter selection not applied

Categories

(Webtools :: Pontoon, enhancement, P3)

enhancement

Tracking

(Not tracked)

RESOLVED FIXED

People

(Reporter: yfdyh000, Assigned: michaelumanah, Mentored)

References

Details

(Whiteboard: outreachyround19)

Attachments

(1 file)

After selecting some filter, user must click the Apply x filters. I think it should be done automatically when user closes the selection bar.
If I understand correctly, we have the following problem:

1. Select a Missing filter with checkbox.

2. Close the filter menu by clicking outside of it.

3. The search placeholder reflects the Missing filter selection, but the filters aren't applied. If you start searching, you only search Missing filters.

--

We should either apply the selected filters when the filter menu is closed or reset the search placeholder to reflect previously applied filter.

Is that correct?
Status: UNCONFIRMED → NEW
Ever confirmed: true
Yes.
(In reply to YF (Yang) from comment #2)
> Yes.

Thanks for confirming. I would actually suggest we go with the 2nd option here: reset search placeholder on filter menu close, unless you explicitly click the "Apply x filters" button or enter the Search field.

(In reply to Michal Stanke (Mozilla.cz) [:MikkCZ] (off until 05/2017, use needinfo) from comment #3)
> Can we do similar for the main navigation, i.e. get rid of the "Go" button?

Maybe in the Resources menu only? If you change locale or project, there's a high chance you want to change the resource, too. Which means a high chance for an unnecessary request (and waiting). Of course, making Resource menu behave differently than the other two menus should also be reflected in styling.
Priority: -- → P3
Summary: [translate] automatic apply filters will be better → [translate] Reset search placeholder if fitler selection not applied

As agreed over email, I'm assigning the bug to Michael.

Please let us know if you have any questions, either here or in #pontoon.

You can start by installing Pontoon locally using Docker.

Once you have a working local environment, please make sure to read our contribution docs. It contains information on how to style code, how to run tests, how to name your commits, etc. All the things you need to know if you want your work to be merged into Pontoon!

Assignee: nobody → michaelumanah
Mentor: m
Status: NEW → ASSIGNED

Hi, I have been able to install pontoon locally.
I am finding it difficult to reproduce the bug locally and I will need guidance on that.

Flags: needinfo?(m)

(In reply to michaelumanah from comment #8)

Hi, I have been able to install pontoon locally.

Great job!

I am finding it difficult to reproduce the bug locally and I will need guidance on that.

These are the steps to reproduce:

  1. Go to any translate page, e.g. https://pontoon.mozilla.org/translate/sl/firefox/all-resources/.
  2. Open the filter menu by clicking on the funnel icon in the Search box.
  3. Toggle Missing filter by clicking on the grey square icon (that turns into a tick on hover).
  4. Click outside the filter menu to close it.

Expected result:
The filter icon changes to the grey square (representing Missing strings) and the Search box reads "Search in Missing", but the string list remains unchanged (it still shows all strings).

Actual result:
We should reset the filter icon and the Search box placeholder to reflect the applied filters on filter menu close.

Flags: needinfo?(m)
Summary: [translate] Reset search placeholder if fitler selection not applied → [translate] Reset search placeholder if filter selection not applied

(In reply to Matjaz Horvat [:mathjazz] from comment #11)

However, you should be able to reproduce the bug locally in http://localhost:8000/projects/tutorial/playground/.

Hi, thanks. I have been able to reproduce the bug locally.

I went through the code base and realise that the components handling the search are the filter and search box component.
The filter component has the handleClickOutside method which I think controls the filter and changes its visibility to false when clicked outside.

So my thought process is to set the filter icon to be equal to all in the handleClickOutside method, and pass props to the search bar component to reset the value too.

I would love your advice on this.

Also, I noticed that I am not really seeing any changes on the browser when I edit something on my codebase.

(In reply to michaelumanah from comment #12)

I went through the code base and realise that the components handling the search are the filter and search box component.
The filter component has the handleClickOutside method which I think controls the filter and changes its visibility to false when clicked outside.

So my thought process is to set the filter icon to be equal to all in the handleClickOutside method, and pass props to the search bar component to reset the value too.

That is correct - you should put the logic into the handleClickOutside method.

It should call into a newly created method on the SearchBox component (e.g. this.props.initializeFilters()), that will reset filters to the state provided by the URL parameters. The code is already available in the contructor() of the SearchBox component - you only need to factor it out into a method and call it from handleClickOutside and the constructor().

Also, I noticed that I am not really seeing any changes on the browser when I edit something on my codebase.

If you for example empty the contents of the handleClickOutside, does the menu still close on click outside?

(In reply to Matjaz Horvat [:mathjazz] from comment #13)

If you for example empty the contents of the handleClickOutside, does the menu still close on click outside?

Hi, yes it still closes even when I empty the contents of the handleClickOutside I feel the build that is running on my browser is different from what I am editing or do I need to restart the server after every change?

It does not still show the changes even when I restart the server. I am using the command make run to start the server.

Flags: needinfo?(adrian)
Status: ASSIGNED → RESOLVED
Closed: 6 months ago
Resolution: --- → FIXED
Whiteboard: outreachyround19
You need to log in before you can comment on or make changes to this bug.