mealie-recipes / mealie

Mealie is a self hosted recipe manager and meal planner with a RestAPI backend and a reactive frontend application built in Vue for a pleasant user experience for the whole family. Easily add recipes into your database by providing the url and mealie will automatically import the relevant data or add a family recipe with the UI editor
https://docs.mealie.io
GNU Affero General Public License v3.0
6.81k stars 700 forks source link

fix: Recipe Search Quirks and Session Storage #3541

Closed michael-genson closed 5 months ago

michael-genson commented 5 months ago

What type of PR is this?

(REQUIRED)

What this PR does / why we need it:

(REQUIRED)

This fixes a few issues with the recipe search state from https://github.com/mealie-recipes/mealie/pull/3332. https://github.com/mealie-recipes/mealie/pull/3332 fixed most issues, but introduced a few smaller ones. This mostly had to do with the search param not updating properly when cleared.

@Kuchenpirat also mentioned in https://github.com/mealie-recipes/mealie/pull/3332 that persisting state forever seems weird (e.g. if I search for a recipe, then come back to Mealie the next day, I don't really want to see that search again). This moves the search params to session storage so it's cleared when you leave (note: if you just refresh the page it may not look cleared since your query params are there. This behavior is only when navigating back to the home page without query params).

I also refactored a bit and moved default values to an object, since it made some of these changes easier. As a bonus, if we ever implement user-preferred default sorts, this will be very easy to merge in (just load the defaults).

Which issue(s) this PR fixes:

(REQUIRED)

N/A, I'm a little surprised no one's opened an issue for the search being wonky.

Special notes for your reviewer:

(fill-in or delete this section)

Testing

(fill-in or delete this section)

Manually poked around the search a lot.