fix: add separate translation for tab bar accessibility (#1815)

Signed-off-by: Christian <christian.lippa@ontario.ca>

Author: LippaC-OPS

.changeset/eager-states-sip.md

@@ -0,0 +1,5 @@
+---
+'@bifold/core': patch
+---
+
+Add separate accessibility label for tab bar buttons

packages/core/src/localization/en/en.json

@@ -810,6 +810,11 @@
     "Scan": "Scan",
     "Credentials": "Credentials"
   },
+  "TabStackAccessibility": {
+    "Home": "Notifications tab {{notifications}} notifications",
+    "Scan": "Scan tab",
+    "Credentials": "Credentials tab"
+  },
   "RootStack": {
     "Contacts": "Contacts",
     "Settings": "Settings"

packages/core/src/localization/fr/fr.json

@@ -803,6 +803,11 @@
     "Scan": "Numériser",
     "Credentials": "Justificatifs"
   },
+  "TabStackAccessibility": {
+    "Home": "Notifications tab {{notifications}} notifications (FR)",
+    "Scan": "Scan tab (FR)",
+    "Credentials": "Credentials tab (FR)"
+  },
   "RootStack": {
     "Contacts": "Contacts",
     "Settings": "Paramètres"

packages/core/src/localization/pt-br/pt-br.json

@@ -779,6 +779,11 @@
     "Scan": "Scanear",
     "Credentials": "Credenciais"
   },
+  "TabStackAccessibility": {
+    "Home": "Notifications tab {{notifications}} notifications (PT-BR)",
+    "Scan": "Scan tab (PT-BR)",
+    "Credentials": "Credentials tab (PT-BR)"
+  },
   "RootStack": {
     "Contacts": "Contatos",
     "Settings": "Configurações"

packages/core/src/navigators/TabStack.tsx

@@ -174,7 +174,7 @@ const TabStack: React.FC = () => {
               </AttachTourStep>
             ),
             tabBarShowLabel: false,
-            tabBarAccessibilityLabel: `${t('TabStack.Home')} (${notifications.length ?? 0})`,
+            tabBarAccessibilityLabel: t('TabStackAccessibility.Home', { notifications: notifications?.length ?? 0 }),
             tabBarTestID: testIdWithKey(t('TabStack.Home')),
             tabBarBadge: notifications.length || undefined,
             tabBarBadgeStyle: {
@@ -248,7 +248,7 @@ const TabStack: React.FC = () => {
               </View>
             ),
             tabBarShowLabel: false,
-            tabBarAccessibilityLabel: t('TabStack.Scan'),
+            tabBarAccessibilityLabel: t('TabStackAccessibility.Scan'),
             tabBarTestID: testIdWithKey(t('TabStack.Scan')),
           }}
           listeners={({ navigation }) => ({
@@ -291,7 +291,7 @@ const TabStack: React.FC = () => {
               </AttachTourStep>
             ),
             tabBarShowLabel: false,
-            tabBarAccessibilityLabel: t('TabStack.Credentials'),
+            tabBarAccessibilityLabel: t('TabStackAccessibility.Credentials'),
             tabBarTestID: testIdWithKey(t('TabStack.Credentials')),
           }}
         />