Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Dropdown selector #117

Merged
merged 7 commits into from
Nov 18, 2019
Merged

Dropdown selector #117

merged 7 commits into from
Nov 18, 2019

Conversation

aabdaab
Copy link
Contributor

@aabdaab aabdaab commented Nov 18, 2019

This PR implements Dropdown Selector along with the fuzzy search functionality.
For fuzzy search fuse.js library is used. The dropdown component is custom.
On option selection, we are redirected to the sector/company's corresponding page.
Dropdown was added to three pages:

  • /tpi/sectors/ - corresponds to All sections option
  • /tpi/sectors/#{sector} - specific sector
  • /tpi/companies/#{company} - specific company

32E68C01-E62A-4AE7-8543-C5450585A446

Screenshot 2019-11-18 at 09 10 29

@aabdaab aabdaab requested review from tsubik and rapzo November 18, 2019 09:27
@tsubik
Copy link
Contributor

tsubik commented Nov 18, 2019

Nice! I'm on it.

Copy link
Contributor

@tsubik tsubik left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Great work!

Just couple of minor things to change/add

  • clicking outside should close it
  • after open or clicking on "filter by company", "filter by sector" search input should be focused

And it is too wide, should be of width as on designs

image

@tsubik
Copy link
Contributor

tsubik commented Nov 18, 2019

I see that on your screenshots @aabdaab the dropdown has a good width.

@aabdaab
Copy link
Contributor Author

aabdaab commented Nov 18, 2019

thanks for the review 🙏 i'm on it

* Focus the input on opening the dropdown
* On hitting escape, close dropdown
* On click outside the search container, close dropdown
* Fix dropdown width
@aabdaab
Copy link
Contributor Author

aabdaab commented Nov 18, 2019

Done:

  • Focus the input on opening the dropdown
  • On hitting escape, close dropdown
  • On click outside the search container, close dropdown
  • Fix dropdown width

@aabdaab
Copy link
Contributor Author

aabdaab commented Nov 18, 2019

Added:

  • Enter functionality - once you start typing and hit enter, user is redirected to the first option
  • Fix style for No results container

Before:
image

After:
image

  • Fix that issue:
    image

Copy link
Contributor

@tsubik tsubik left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

💯 🏅

@tsubik tsubik merged commit 82ac2f5 into develop Nov 18, 2019
@simaob simaob deleted the feature/dropdown-selector branch November 28, 2019 14:15
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants