Red Badge for new incoming mails

Closes #953 (closed)

What does this MR do?

Displays the number of unread mails as a red badge like it is done with bells and messages. That count is fetched using a new api endpoint api/emails/unread-count after the page finished loading.

Currently the badge doesn't update when reading a mail or when you receive a mail, but only if you refresh the page. I don't really know, if I should put in the time to change that, since it doesn't seem like a big deal to me. Not even the vue component listing the mailboxes updates after reading a mail. For now I think we could leave this implementation as is and create a new issue for updating unread mail badge and the mailbox list.

How confident are you it won't break things if deployed?

Confident, I am however not 100% certain the runtime is reasonable. I do believe however it should go easier on the server than many other of our requests 😅

Links to related issues

How to test

Screenshots (if applicable)

Checklist

• added a test, or explain why one is not needed/possible...
• no unrelated changes
• asked someone for a code review
• set a "for:" label to indicate who will be affected by this change
• used "state:" labels to track this MR's state until it was beta tested
• added to the next milestone (see https://gitlab.com/foodsharing-dev/foodsharing/-/milestones, unless it has a "for:Dev" label)
• added an entry to CHANGELOG.md
• added a short text that can be used in the release notes
• Once your MR has been merged, you are responsible to create a testing issue in the Beta Testing forum: https://foodsharing.de/?page=bezirk&bid=734&sub=forum. Please change the MRs label to "state:Beta testing".
  • Consider writing a detailed description in German.
  • Describe in a few sentences, what should be tested from a user perspective.
  • Also mention different settings (e.g. different browsers, roles, ...) how this change can be tested.
  • Be aware, that also non technical people should understand.

Release notes text in German

Die Anzahl ungelesener Emails wird nun in der Kopfzeile angezeigt, ähnlich wie bei neuen Nachrichten.