From 7b837651ddbae455ae81232ec22ce73d4d0d4486 Mon Sep 17 00:00:00 2001
From: Namekuji <nmkj@mx.kazuno.co>
Date: Fri, 28 Apr 2023 14:15:24 -0400
Subject: [PATCH] add aria-label to buttons missing content

---
 audon-fe/src/locales/en.yaml    | 21 ++++++++++++++++++---
 audon-fe/src/locales/ja.yaml    | 12 ++++++++++++
 audon-fe/src/views/RoomView.vue | 24 ++++++++++++++++++++++++
 3 files changed, 54 insertions(+), 3 deletions(-)

diff --git a/audon-fe/src/locales/en.yaml b/audon-fe/src/locales/en.yaml
index bf9a3fe..61fff6c 100644
--- a/audon-fe/src/locales/en.yaml
+++ b/audon-fe/src/locales/en.yaml
@@ -17,6 +17,21 @@ enterRoom: "Enter"
 leaveRoom: "Leave but keep this room open"
 closeRoom: "Close this room"
 close: "Close"
+emojiReaction: "Open emoji reaction picker"
+micStatus:
+  mute: "Mute microphone"
+  unmute: "Unmute microphone"
+  retry: "Retry enabling microphone"
+  request: "Send speaker request"
+roomOperation:
+  operation: "Leave or close"
+  leave: "Leave this room"
+  close: "Close this room"
+  openRequests: "Open list of speaker requests"
+  edit: "Edit room information"
+requestOperation:
+  decline: "Decline this speaker request"
+  accept: "Accept this speaker request"
 connecting: "Connecting"
 server: "Your Mastodon instance"
 addressRequired: "Enter your instance address"
@@ -40,9 +55,9 @@ form:
   advertise: "Allow the bot ({bot}) to advertise your room"
   relationships:
     everyone: "Everyone"
-    following: "Followed accounts only"
-    follower: "Followers-only"
-    knowing: "Followed accounts and/or followers"
+    following: "Followees only (Accounts you're following)"
+    follower: "Followers only (Accounts following you)"
+    knowing: "Followees and/or followers"
     mutual: "Your mutuals"
     private: "CoHosts only"
 shareRoomMessage: "Join my Audon room!\n{link}\n\nTitle: {title}"
diff --git a/audon-fe/src/locales/ja.yaml b/audon-fe/src/locales/ja.yaml
index 27f9b84..38f41c1 100644
--- a/audon-fe/src/locales/ja.yaml
+++ b/audon-fe/src/locales/ja.yaml
@@ -17,6 +17,18 @@ enterRoom: "入室"
 leaveRoom: "部屋を閉じずに退室"
 closeRoom: "部屋を閉じる"
 close: "閉じる"
+emojiReaction: "絵文字ピッカーを開く"
+micStatus:
+  mute: "マイクをミュート"
+  unmute: "マイクのミュートを解除"
+  retry: "マイク有効化を再試行"
+  request: "発言リクエストを送る"
+roomOperation:
+  operation: "退室または閉室"
+  leave: "部屋から退室する"
+  close: "部屋を閉室する"
+  openRequests: "発言リクエストの一覧を開く"
+  edit: "部屋の情報を編集する"
 connecting: "接続中"
 server: "Mastodon サーバー"
 addressRequired: "アドレスを入力してください"
diff --git a/audon-fe/src/views/RoomView.vue b/audon-fe/src/views/RoomView.vue
index 7c5173b..08865b1 100644
--- a/audon-fe/src/views/RoomView.vue
+++ b/audon-fe/src/views/RoomView.vue
@@ -257,6 +257,18 @@ export default {
       }
       return mdiMicrophone;
     },
+    micStatusLabel() {
+      if (!this.micGranted) {
+        return this.$t("micStatus.retry");
+      }
+      if (!(this.iamHost || this.iamCohost || this.iamSpeaker)) {
+        return this.$t("micStatus.request");
+      }
+      if (this.iamMuted) {
+        return this.$t("micStatus.unmute");
+      }
+      return this.$t("micStatus.mute");
+    },
     titleErrors() {
       const errors = this.v$.editingRoomInfo.title.$errors;
       const messages = map(errors, (e) => e.$message);
@@ -797,6 +809,7 @@ export default {
                 :icon="mdiCheck"
                 :disabled="isRequestLoading"
                 @click.once="onModerate(id, 'speaker')"
+                :aria-label="$t('requestOperation.accept')"
               ></v-btn>
               <v-btn
                 size="small"
@@ -804,6 +817,7 @@ export default {
                 :icon="mdiClose"
                 :disabled="isRequestLoading"
                 @click="onDeclineRequest(id)"
+                :aria-label="$t('requestOperation.decline')"
               ></v-btn>
             </template>
             <v-list-item-subtitle>
@@ -839,6 +853,7 @@ export default {
         @click="showRequestedNotification = false"
         :icon="mdiClose"
         size="small"
+        :aria-label="$t('close')"
       ></v-btn>
     </template>
   </v-snackbar>
@@ -863,6 +878,7 @@ export default {
         @click="showRequestNotification = false"
         :icon="mdiClose"
         size="small"
+        :aria-label="$('close')"
       ></v-btn>
     </template>
   </v-snackbar>
@@ -879,6 +895,7 @@ export default {
             size="small"
             variant="text"
             color="white"
+            :aria-label="$t('roomOperation.edit')"
             :icon="mdiPencil"
             @click="showEditDialog = true"
           ></v-btn>
@@ -955,6 +972,7 @@ export default {
       <v-card-actions v-else class="justify-center" style="gap: 20px">
         <v-btn
           :icon="mdiEmoticon"
+          :aria-label="$t('emojiReaction')"
           color="white"
           variant="flat"
           @click="onPickerPopup"
@@ -963,6 +981,7 @@ export default {
         </v-btn>
         <v-btn
           :icon="micStatusIcon"
+          :aria-label="micStatusLabel"
           color="white"
           variant="flat"
           @click="onToggleMute"
@@ -972,6 +991,7 @@ export default {
             <v-btn
               :icon="mdiLogout"
               color="red"
+              :aria-label="$t('roomOperation.operation')"
               :disabled="loading"
               variant="flat"
               v-bind="props"
@@ -980,6 +1000,7 @@ export default {
           <v-list>
             <v-list-item
               :title="$t('closeRoom')"
+              :aria-label="$t('roomOperation.close')"
               :prepend-icon="mdiCloseBoxOutline"
               @click="onRoomClose"
               class="text-red"
@@ -987,6 +1008,7 @@ export default {
             <v-list-item
               :disabled="isLastHost"
               :title="$t('leaveRoom')"
+              :aria-label="$t('roomOperation.leave')"
               :prepend-icon="mdiExitRun"
               @click="onLeave"
             >
@@ -998,6 +1020,7 @@ export default {
           :icon="mdiLogout"
           color="red"
           :disabled="loading"
+          :aria-label="$t('roomOperation.leave')"
           @click="onLeave"
           variant="flat"
         ></v-btn>
@@ -1009,6 +1032,7 @@ export default {
         >
           <v-btn
             :icon="mdiAccountVoice"
+            :aria-label="$t('roomOperation.openRequests')"
             variant="flat"
             color="white"
             @click="