merge: fix: update reaction icons in tutorial to match sharkey icons (!499)

View MR for information: https://activitypub.software/TransFem-org/Sharkey/-/merge_requests/499

Approved-by: dakkar <dakkar@thenautilus.net>
Approved-by: Tess K <me@thvxl.se>
Approved-by: Marie <marie@kaifa.ch>

locales/ca-ES.yml

@@ -1264,10 +1264,10 @@ _initialTutorial:
   _reaction:
     title: "Què són les Reaccions?"
     description: "Es poden reaccionar a les Notes amb diferents emoticones. Les reaccions et permeten expressar matisos que hi són més enllà d'un simple m'agrada."
-    letsTryReacting: "Es poden afegir reaccions fent clic al botó '+'. Prova reaccionant a aquesta nota!"
+    letsTryReacting: "Es poden afegir reaccions fent clic al botó '{reaction}'. Prova reaccionant a aquesta nota!"
     reactToContinue: "Afegeix una reacció per continuar."
     reactNotification: "Rebràs notificacions en temps real quan un usuari reaccioni a les teves notes."
-    reactDone: "Pots desfer una reacció fent clic al botó '-'."
+    reactDone: "Pots desfer una reacció fent clic al botó '{undo}'."
   _timeline:
     title: "El concepte de les línies de temps"
     description1: "Misskey mostra diferents línies de temps basades en l'ús (algunes poden no estar disponibles depenent de la política del servidor)"
@@ -2255,4 +2255,3 @@ _externalResourceInstaller:
       title: "Paràmetres no vàlids "
 _reversi:
   total: "Total"
-

locales/en-US.yml

@@ -1335,10 +1335,10 @@ _initialTutorial:
   _reaction:
     title: "What are Reactions?"
     description: "Notes can be reacted to with various emojis. Reactions allow you to express nuances that may not be conveyed with just a 'like.'"
-    letsTryReacting: "Reactions can be added by clicking the '+' button on the note. Try reacting to this sample note!"
+    letsTryReacting: "Reactions can be added by clicking the '{reaction}' button on the note. Try reacting to this sample note!"
     reactToContinue: "Add a reaction to proceed."
     reactNotification: "You'll receive real-time notifications when someone reacts to your note."
-    reactDone: "You can undo a reaction by pressing the '-' button."
+    reactDone: "You can undo a reaction by pressing the '{undo}' button."
   _timeline:
     title: "The Concept of Timelines"
     description1: "Sharkey provides multiple timelines based on usage (some may not be available depending on the server's policies)."

locales/es-ES.yml

@@ -1263,10 +1263,10 @@ _initialTutorial:
   _reaction:
     title: "¿Qué son las reacciones?"
     description: "Se puede reaccionar a las Notas con diferentes emojis. Las reacciones te permiten expresar matices que no se pueden transmitir con un simple 'me gusta'."
-    letsTryReacting: "Puedes añadir reacciones pulsando en el botón '+' de la nota. ¡Intenta reaccionar a esta nota de ejemplo!"
+    letsTryReacting: "Puedes añadir reacciones pulsando en el botón '{reaction}' de la nota. ¡Intenta reaccionar a esta nota de ejemplo!"
     reactToContinue: "Añade una reacción para continuar."
     reactNotification: "Recibirás notificaciones en tiempo real cuando alguien reaccione a tu nota."
-    reactDone: "Puedes deshacer una reacción pulsando en el botón '-'."
+    reactDone: "Puedes deshacer una reacción pulsando en el botón '{undo}'."
   _timeline:
     title: "El concepto de Línea de tiempo"
     description1: "Misskey proporciona múltiples líneas de tiempo basadas en su uso (algunas pueden no estar disponibles dependiendo de las políticas de la instancia)."
@@ -2449,4 +2449,3 @@ _reversi:
   reversi: "Reversi"
   won: "{name} ha ganado"
   total: "Total"
-

locales/fr-FR.yml

@@ -1245,10 +1245,10 @@ _initialTutorial:
   _reaction:
     title: "Qu'est-ce que les réactions ?"
     description: "Vous pouvez ajouter des « réactions » aux notes. Les réactions vous permettent d'exprimer à l'aise des nuances qui ne peuvent pas être exprimées par des mentions j'aime."
-    letsTryReacting: "Des réactions peuvent être ajoutées en cliquant sur le bouton « + » de la note. Essayez d'ajouter une réaction à cet exemple de note !"
+    letsTryReacting: "Des réactions peuvent être ajoutées en cliquant sur le bouton « {reaction} » de la note. Essayez d'ajouter une réaction à cet exemple de note !"
     reactToContinue: "Ajoutez une réaction pour procéder."
     reactNotification: "Vous recevez des notifications en temps réel lorsque quelqu'un réagit à votre note."
-    reactDone: "Vous pouvez annuler la réaction en cliquant sur le bouton « - » ."
+    reactDone: "Vous pouvez annuler la réaction en cliquant sur le bouton « {undo} » ."
   _timeline:
     title: "Fonctionnement des fils"
     description1: "Misskey offre plusieurs fils selon l'usage (certains peuvent être désactivés par le serveur)."
@@ -2140,4 +2140,3 @@ _dataSaver:
     description: "Si la notation de mise en évidence du code est utilisée, par exemple dans la MFM, elle ne sera pas chargée tant qu'elle n'aura pas été tapée. La mise en évidence du code nécessite le chargement du fichier de définition de chaque langue à mettre en évidence, mais comme ces fichiers ne sont plus chargés automatiquement, on peut s'attendre à une réduction du trafic de données."
 _reversi:
   total: "Total"
-

locales/index.d.ts

@@ -5334,9 +5334,9 @@ export interface Locale extends ILocale {
              */
             "description": string;
             /**
-             * リアクションは、ノートの「＋」ボタンをクリックするとつけられます。試しにこのサンプルのノートにリアクションをつけてみてください！
+             * リアクションは、ノートの「{reaction}」ボタンをクリックするとつけられます。試しにこのサンプルのノートにリアクションをつけてみてください！
              */
-            "letsTryReacting": string;
+            "letsTryReacting": ParameterizedString<"reaction">;
             /**
              * リアクションをつけると先に進めるようになります。
              */
@@ -5346,9 +5346,9 @@ export interface Locale extends ILocale {
              */
             "reactNotification": string;
             /**
-             * 「ー」ボタンを押すとリアクションを取り消すことができます。
+             * 「{undo}」ボタンを押すとリアクションを取り消すことができます。
              */
-            "reactDone": string;
+            "reactDone": ParameterizedString<"undo">;
         };
         "_timeline": {
             /**

locales/it-IT.yml

@@ -1275,10 +1275,10 @@ _initialTutorial:
   _reaction:
     title: "Cosa sono le Reazioni?"
     description: "Puoi reagire alle Note. Le sensazioni che non si riescono a trasmettere con i \"Mi piace\" si possono esprimere facilmente inviando una reazione."
-    letsTryReacting: "Puoi aggiungere una Reazione cliccando il bottone \"+\" (più) della relativa Nota. Prova ad aggiungerne una a questa Nota di esempio!"
+    letsTryReacting: "Puoi aggiungere una Reazione cliccando il bottone \"{reaction}\" della relativa Nota. Prova ad aggiungerne una a questa Nota di esempio!"
     reactToContinue: "Aggiungere la Reazione ti consentirà di procedere col tutorial."
     reactNotification: "Quando qualcuno reagisce alle tue Note, ricevi una notifica in tempo reale."
-    reactDone: "Puoi annullare la tua Reazione premendo il bottone \"ー\" (meno)"
+    reactDone: "Puoi annullare la tua Reazione premendo il bottone \"{undo}\""
   _timeline:
     title: "Come funziona la Timeline"
     description1: "Misskey fornisce alcune Timeline (sequenze cronologiche di Note). Una di queste potrebbe essere stata disattivata dagli amministratori."
@@ -2509,4 +2509,3 @@ _reversi:
 _offlineScreen:
   title: "Scollegato. Impossibile connettersi al server"
   header: "Impossibile connettersi al server"
-

locales/ja-JP.yml

@@ -1338,10 +1338,10 @@ _initialTutorial:
   _reaction:
     title: "リアクションって何？"
     description: "ノートには「リアクション」をつけることができます。「いいね」では伝わらないニュアンスも、リアクションで簡単・気軽に表現できます。"
-    letsTryReacting: "リアクションは、ノートの「＋」ボタンをクリックするとつけられます。試しにこのサンプルのノートにリアクションをつけてみてください！"
+    letsTryReacting: "リアクションは、ノートの「{reaction}」ボタンをクリックするとつけられます。試しにこのサンプルのノートにリアクションをつけてみてください！"
     reactToContinue: "リアクションをつけると先に進めるようになります。"
     reactNotification: "あなたのノートが誰かにリアクションされると、リアルタイムで通知を受け取ります。"
-    reactDone: "「ー」ボタンを押すとリアクションを取り消すことができます。"
+    reactDone: "「{undo}」ボタンを押すとリアクションを取り消すことができます。"
   _timeline:
     title: "タイムラインのしくみ"
     description1: "Sharkeyには、使い方に応じて複数のタイムラインが用意されています（サーバーによってはいずれかが無効になっていることがあります）。"

locales/ja-KS.yml

@@ -1265,10 +1265,10 @@ _initialTutorial:
   _reaction:
     title: "ツッコミってなんや？"
     description: "ノートには「ツッコミ」できんねん。「いいね」とか何言っとるかわからんし、簡単に表現できるのはええことやん？"
-    letsTryReacting: "ノートの「＋」ボタンでツッコめるわ。試しに下のノートにツッコんでみ。"
+    letsTryReacting: "ノートの「{reaction}」ボタンでツッコめるわ。試しに下のノートにツッコんでみ。"
     reactToContinue: "ツッコんだら進めるようになるで。"
     reactNotification: "あんたのノートが誰かにツッコまれたら、すぐ通知するで。"
-    reactDone: "「ー」ボタンでツッコミやめれるで。"
+    reactDone: "「{undo}」ボタンでツッコミやめれるで。"
   _timeline:
     title: "タイムラインのしくみ"
     description1: "Sharkeyには、いろいろタイムラインがあんで（ただ、サーバーによっては無効化されてるところもあるな）。"

locales/ko-KR.yml

@@ -1271,10 +1271,10 @@ _initialTutorial:
   _reaction:
     title: "'리액션'이 무엇인가요?"
     description: "노트에 '리액션'을 보낼 수 있습니다. '좋아요'만으로는 충분히 전해지지 않는 감정을, 이모지에 실어서 가볍게 보낼 수 있습니다."
-    letsTryReacting: "리액션은 노트의 '+' 버튼을 클릭하여 붙일 수 있습니다. 지금 표시되는 샘플 노트에 리액션을 달아 보세요!"
+    letsTryReacting: "리액션은 노트의 '{reaction}' 버튼을 클릭하여 붙일 수 있습니다. 지금 표시되는 샘플 노트에 리액션을 달아 보세요!"
     reactToContinue: "다음으로 진행하려면 리액션을 보내세요."
     reactNotification: "누군가가 나의 노트에 리액션을 보내면 실시간으로 알림을 받게 됩니다."
-    reactDone: "'-' 버튼을 눌러서 리액션을 취소할 수 있습니다."
+    reactDone: "'{undo}' 버튼을 눌러서 리액션을 취소할 수 있습니다."
   _timeline:
     title: "타임라인에 대하여"
     description1: "Misskey에는 종류에 따라 여러 가지의 타임라인으로 구성되어 있습니다.(서버에 따라서는 일부 타임라인을 사용할 수 없는 경우가 있습니다)"
@@ -2505,4 +2505,3 @@ _reversi:
 _offlineScreen:
   title: "오프라인 - 서버에 접속할 수 없습니다"
   header: "서버에 접속할 수 없습니다"
-

locales/th-TH.yml

@@ -1285,10 +1285,10 @@ _initialTutorial:
   _reaction:
     title: "รีแอคชั่นคืออะไร?"
     description: "โน้ตสามารถ“รีแอคชั่น”ด้วยเอโมจิต่างๆ ซึ่งทำให้สามารถแสดงความแตกต่างเล็กๆ น้อยๆ ที่อาจไม่สามารถสื่อออกมาได้ด้วยการแค่การกด “ถูกใจ”"
-    letsTryReacting: "คุณสามารถเพิ่มรีแอคชั่นได้ด้วยการคลิกปุ่ม “+” บนโน้ต ลองรีแอคชั่นโน้ตตัวอย่างนี้ดูสิ!"
+    letsTryReacting: "คุณสามารถเพิ่มรีแอคชั่นได้ด้วยการคลิกปุ่ม “{reaction}” บนโน้ต ลองรีแอคชั่นโน้ตตัวอย่างนี้ดูสิ!"
     reactToContinue: "เพิ่มรีแอคชั่นเพื่อดำเนินการต่อ"
     reactNotification: "คุณจะได้รับการแจ้งเตือนแบบเรียลไทม์เมื่อมีคนตอบรีแอคชั่นโน้ตของคุณ"
-    reactDone: "คุณสามารถยกเลิกรีแอคชั่นได้โดยการกดปุ่ม “-”"
+    reactDone: "คุณสามารถยกเลิกรีแอคชั่นได้โดยการกดปุ่ม “{undo}”"
   _timeline:
     title: "แนวคิดเรื่องของไทม์ไลน์"
     description1: "Misskey มีหลายไทม์ไลน์ขึ้นอยู่กับวิธีการใช้งานของคุณ (บางไทม์ไลน์อาจไม่สามารถใช้ได้ขึ้นอยู่กับนโยบายของเซิร์ฟเวอร์)"
@@ -2524,4 +2524,3 @@ _reversi:
 _offlineScreen:
   title: "ออฟไลน์ - ไม่สามารถเชื่อมต่อกับเซิร์ฟเวอร์ได้"
   header: "ไม่สามารถเชื่อมต่อกับเซิร์ฟเวอร์ได้"
-

locales/zh-CN.yml

@@ -1284,10 +1284,10 @@ _initialTutorial:
   _reaction:
     title: "什么是回应？"
     description: "您可以在帖子中添加“回应”。 您可以使用反应轻松地表达点“赞”所无法传达的细微差别。"
-    letsTryReacting: "回应可以通过点击帖子中的「+」按钮来添加。试着给这个示例帖子添加一个回应！"
+    letsTryReacting: "回应可以通过点击帖子中的「{reaction}」按钮来添加。试着给这个示例帖子添加一个回应！"
     reactToContinue: "添加一个回应来继续"
     reactNotification: "当您的帖子被某人添加了回应时，将实时收到通知。"
-    reactDone: "通过按下「ー」按钮，可以取消已经添加的回应"
+    reactDone: "通过按下「{undo}」按钮，可以取消已经添加的回应"
   _timeline:
     title: "时间线的运作方式"
     description1: "Misskey 根据使用方式提供了多个时间线（根据服务器的设定，可能有一些被禁用）。"
@@ -2519,4 +2519,3 @@ _reversi:
 _offlineScreen:
   title: "离线——无法连接到服务器"
   header: "无法连接到服务器"
-

locales/zh-TW.yml

@@ -1285,10 +1285,10 @@ _initialTutorial:
   _reaction:
     title: "什麼是反應？"
     description: "您可以在貼文中添加「反應」。您可以使用反應輕鬆隨意地表達「最愛/大心」所無法傳達的細微差別。"
-    letsTryReacting: "可以透過點擊貼文上的「+」按鈕來添加反應。請嘗試在此範例貼文添加反應！"
+    letsTryReacting: "可以透過點擊貼文上的「{reaction}」按鈕來添加反應。請嘗試在此範例貼文添加反應！"
     reactToContinue: "添加反應以繼續教學課程。"
     reactNotification: "當有人對您的貼文做出反應時會即時接收到通知。"
-    reactDone: "按下「-」按鈕可以取消反應。"
+    reactDone: "按下「{undo}」按鈕可以取消反應。"
   _timeline:
     title: "時間軸如何運作"
     description1: "Misskey根據使用方式提供了多個時間軸（伺服器可能會將部份時間軸停用）。"
@@ -2524,4 +2524,3 @@ _reversi:
 _offlineScreen:
   title: "離線－無法連接伺服器"
   header: "無法連接伺服器"
-

packages/frontend/src/components/MkTutorialDialog.Note.vue

@@ -16,9 +16,20 @@ SPDX-License-Identifier: AGPL-3.0-only
 </div>
 <div v-else-if="phase === 'howToReact'" class="_gaps">
 	<div style="text-align: center; padding: 0 16px;">{{ i18n.ts._initialTutorial._reaction.description }}</div>
-	<div>{{ i18n.ts._initialTutorial._reaction.letsTryReacting }}</div>
+	<I18n :src="i18n.ts._initialTutorial._reaction.letsTryReacting" tag="div">
+		<template #reaction>
+			<i class="ph-smiley ph-bold ph-lg"></i>
+		</template>
+	</I18n>
 	<MkNote :class="$style.exampleNoteRoot" :note="exampleNote" :mock="true" @reaction="addReaction" @removeReaction="removeReaction"/>
-	<div v-if="onceReacted"><b style="color: var(--accent);"><i class="ph-check ph-bold ph-lg"></i> {{ i18n.ts._initialTutorial.wellDone }}</b> {{ i18n.ts._initialTutorial._reaction.reactNotification }}<br>{{ i18n.ts._initialTutorial._reaction.reactDone }}</div>
+	<div v-if="onceReacted">
+		<b style="color: var(--accent);"><i class="ph-check ph-bold ph-lg"></i> {{ i18n.ts._initialTutorial.wellDone }}</b> {{ i18n.ts._initialTutorial._reaction.reactNotification }}<br>
+		<I18n :src="i18n.ts._initialTutorial._reaction.reactDone">
+			<template #undo>
+				<i class="ph-minus ph-bold ph-lg"></i>
+			</template>
+		</I18n>
+	</div>
 </div>
 </template>