From 8a0f659a866700e812bd3f55dc3e9e36ba61638c Mon Sep 17 00:00:00 2001
From: Tusooa Zhu <tusooa@kazv.moe>
Date: Sun, 10 Jul 2022 22:46:53 -0400
Subject: [PATCH] Add optional/required indicator for registration fields

---
 src/components/registration/registration.vue | 9 +++++++--
 src/i18n/en.json                             | 3 ++-
 2 files changed, 9 insertions(+), 3 deletions(-)

diff --git a/src/components/registration/registration.vue b/src/components/registration/registration.vue
index cc655c0b..d78d8da9 100644
--- a/src/components/registration/registration.vue
+++ b/src/components/registration/registration.vue
@@ -23,6 +23,7 @@
                 v-model.trim="v$.user.username.$model"
                 :disabled="isPending"
                 class="form-control"
+                :aria-required="true"
                 :placeholder="$t('registration.username_placeholder')"
               >
             </div>
@@ -50,6 +51,7 @@
                 v-model.trim="v$.user.fullname.$model"
                 :disabled="isPending"
                 class="form-control"
+                :aria-required="true"
                 :placeholder="$t('registration.fullname_placeholder')"
               >
             </div>
@@ -71,13 +73,14 @@
               <label
                 class="form--label"
                 for="email"
-              >{{ $t('registration.email') }}</label>
+              >{{ accountActivationRequired ? $t('registration.email') : $t('registration.email_optional') }}</label>
               <input
                 id="email"
                 v-model="v$.user.email.$model"
                 :disabled="isPending"
                 class="form-control"
                 type="email"
+                :aria-required="accountActivationRequired"
               >
             </div>
             <div
@@ -95,7 +98,7 @@
               <label
                 class="form--label"
                 for="bio"
-              >{{ $t('registration.bio') }} ({{ $t('general.optional') }})</label>
+              >{{ $t('registration.bio_optional') }}</label>
               <textarea
                 id="bio"
                 v-model="user.bio"
@@ -119,6 +122,7 @@
                 :disabled="isPending"
                 class="form-control"
                 type="password"
+                :aria-required="true"
               >
             </div>
             <div
@@ -146,6 +150,7 @@
                 :disabled="isPending"
                 class="form-control"
                 type="password"
+                :aria-required="true"
               >
             </div>
             <div
diff --git a/src/i18n/en.json b/src/i18n/en.json
index 8ad411b2..93b78c6a 100644
--- a/src/i18n/en.json
+++ b/src/i18n/en.json
@@ -234,8 +234,9 @@
     }
   },
   "registration": {
-    "bio": "Bio",
+    "bio_optional": "Bio (optional)",
     "email": "Email",
+    "email_optional": "Email (optional)",
     "fullname": "Display name",
     "password_confirm": "Password confirmation",
     "registration": "Registration",