feat: Show recipe tags on mobile view and meal plan

[AverageMarcus]

What type of PR is this?

• feature

What this PR does / why we need it:

This change makes it so that tags on a recipe will show in mobile view as well as on the meal plan for both mobile and desktop.

Meal plan - mobile

Meal plan - desktop

Which issue(s) this PR fixes:

N/A

Testing

Manual testing with example recipes. Created recipes with no tags, single tags and multiple (3) tags to ensure all show as expected.

[boc-the-git]

My initial thoughts here are how many tags should be displayed (you've capped at 2)? What if people don't want any tags displayed? Are there places other than the meal plan they should be displayed (from a skim it looks like you've only added it there)?
Is there any existing feature request around this with prior discussion?

I don't have good answers here, just dumping some thoughts.

[AverageMarcus]

There is currently a place where the tags are shown like this - on the recipe search page when viewed on desktop (ut not mobile, this PR adds that).

I capped at two tags because that was what was currently being used on the desktop view and thought it made sense to be consistent. See here:

mealie/frontend/components/Domain/Recipe/RecipeCard.vue

Line 42 in 1fcc2c7

<RecipeChips :truncate="true" :items="tags" :title="false" :limit="2" :small="true" url-prefix="tags" />

There isn't a previous feature request. Should I still open one?

[AverageMarcus]

It would be nice if this stuff could be configured in setting - e.g. show/hide tags, configure number of tags shown. But that's a larger change that effects other areas too and not something I'm currently comfortable with tackling.

[boc-the-git]

on the recipe search page when viewed on desktop (ut not mobile, this PR adds that).

Do you know why that isn't displaying on mobile? From a quick look I couldn't see why.. Assuming it's unintentional (not specifically coded for), that could be a good change to add in here?

There isn't a previous feature request. Should I still open one?

No stress, was just wondering if there was previous discussion.

It would be nice if this stuff could be configured in setting - e.g. show/hide tags, configure number of tags shown. But that's a larger change that effects other areas too and not something I'm currently comfortable with tackling.

Any chance you want to raise a feature request for that?

[AverageMarcus]

Do you know why that isn't displaying on mobile? From a quick look I couldn't see why.. Assuming it's unintentional (not specifically coded for), that could be a good change to add in here?

Yeah, because on mobile it uses the RecipeCardMobile.vue component which is what I've updated here so they will both be inline. This also happens to be what is used on the mealplan page for both desktop and mobile from what I can see.

Any chance you want to raise a feature request for that?

Good idea. I'll put something together later today hopefully. :)

[boc-the-git]

@michael-genson @Kuchenpirat , any concerns with this change?

[michael-genson]

Yeah this looks fine to me, looks like we just never added tags to the mobile card view

[boc-the-git]

Thanks Marcus!

[AverageMarcus]

Thank you so much for making my first contribution so pleasent! 😀 Will for sure be looking out for other things I can help improve.