buttercup / buttercup-browser-extension

:earth_asia: Buttercup browser extension
https://buttercup.pw
MIT License
227 stars 42 forks source link

[FR] visually distinguish search results between exact match and soft match #475

Open gravistech412 opened 3 months ago

gravistech412 commented 3 months ago

I search using the FF ext lots. It would be nice to visually distinguish between the exact string results and soft matches. I think something simple like a slight background color would suffice.

perry-mitchell commented 3 months ago

How would you define a weak/strong match in this sense? When searching everything is treated the same. The only difference I can think of is the URL-based results vs the user search term results.

Search by term works by checking several fields in the entry - all of its properties - but all searching is done more or less automatically internally using a search library that fuzzy matches against all of the properties.

gravistech412 commented 3 months ago

Can you point me to the library used to fuzzy match?

perry-mitchell commented 3 months ago

@gravistech412 It's fuse.js

gravistech412 commented 3 months ago

GPT cause I don't know fuse.js https://www.fusejs.io/api/options.html#includescore To get Fuse.js to return results along with information about how close each match was, you can use the includeScore option. When set to true, this option includes a score with each search result, where the score is a number between 0 and 1 that indicates how well each result matches the search query. A score of 0 indicates a perfect match, and the score gets closer to 1 as the match becomes less exact.

You can then use this score to provide feedback about how close each match was to the original query.

perry-mitchell commented 3 months ago

I like the idea. Let's see about the design. Either some kind of icon/indicator or something similar might work.

gravistech412 commented 2 months ago

I just think a color distinction. Maybe a different background color for exact matches.