Merge branch 'blog-reaction-unlogged-feedback' into 'main'

show feedback to unlogged users when hovering over blog reaction buttons

See merge request PronounsPage/PronounsPage!567

components/blog/BlogReactionSection.vue

@@ -1,4 +1,5 @@
 <script setup lang="ts">
+import Tooltip from '~/components/Tooltip.vue';
 import type { BlogReactions } from '~/server/blog.ts';
 import { reactionOptions } from '~/src/blog/reactions.ts';
 import { useMainStore } from '~/store/index.ts';
@@ -41,9 +42,13 @@ const toggleReaction = async (emoji: string) => {
                 <T>links.blogReact</T><T>quotation.colon</T>
             </p>
         </template>
-        <button
+        <component
+            :is="store.user ? 'span' : Tooltip"
             v-for="emoji in reactionOptions"
             :key="emoji"
+            :text="$t('links.blogReactAuthRequired')"
+        >
+            <button
                 type="button"
                 :inert="!store.user"
                 :class="['btn', classForEmoji(emoji), 'm-1']"
@@ -51,5 +56,6 @@ const toggleReaction = async (emoji: string) => {
             >
                 {{ reactions?.total[emoji] ?? 0 }} {{ emoji }}
             </button>
+        </component>
     </Loading>
 </template>

locale/_base/translations.suml

@@ -470,6 +470,7 @@ links:
     blogLatest: 'Latest blog entries'
     blogFeed: 'Feed'
     blogReact: 'React'
+    blogReactAuthRequired: 'You must log in to leave a reaction'
     mediaShort: 'Media'
     media: 'Pronouns.page in the media'
 

locale/en/translations.suml

@@ -651,6 +651,7 @@ links:
     blogLatest: 'Latest blog entries'
     blogFeed: 'Feed'
     blogReact: 'React'
+    blogReactAuthRequired: 'You must log in to leave a reaction'
     mediaShort: 'Media'
     media: 'Pronouns.page in the media'
 

locale/pl/translations.suml

@@ -999,6 +999,7 @@ links:
     blog: 'Blog'
     blogTOC: 'Spis treści'
     blogLatest: 'Najnowsze wpisy na naszym blogu'
+    blogReactAuthRequired: 'Żeby zostawić reakcję, musisz się zalogować'
     academic:
         header: 'Nauka'
         intro: