[WIP] [NEW] Project 08 - Adding Reactions VoiceOver accessible

Rocket.Chat/External/RCEmojiKit/Views/EmojiPicker/EmojiCollectionViewCell.swift

@@ -22,6 +22,7 @@ final class EmojiCollectionViewCell: UICollectionViewCell {
         emojiLabel.baselineAdjustment = .alignCenters
         emojiLabel.font = UIFont.systemFont(ofSize: 32)
         emojiLabel.backgroundColor = UIColor.white
+        emojiLabel.isAccessibilityElement = true
         return emojiLabel
     }()
 
@@ -44,8 +45,10 @@ final class EmojiCollectionViewCell: UICollectionViewCell {
                 guard let url = url else { return }
                 ImageManager.loadImage(with: url, into: emojiImageView)
                 emojiImageView.isHidden = false
+                emojiImageView.isAccessibilityElement = true
             case .standard(let string):
                 emojiLabel.text = string
+                emojiImageView.accessibilityLabel = string
                 emojiLabel.isHidden = false
             }
         }

Rocket.Chat/External/RCEmojiKit/Views/EmojiPicker/EmojiPicker.swift

@@ -121,13 +121,15 @@ final class EmojiPicker: UIView, RCEmojiKitLocalizable {
             skinToneButton.layer.cornerRadius = skinToneButton.frame.width/2
             skinToneButton.backgroundColor = currentSkinTone.color
             skinToneButton.showsTouchWhenHighlighted = true
+            skinToneButton.accessibilityLabel = localized("skinTone.label")
         }
     }
 
     @IBAction func didPressSkinToneButton(_ sender: UIButton) {
         currentSkinToneIndex += 1
         currentSkinToneIndex = currentSkinToneIndex % skinTones.count
         skinToneButton.backgroundColor = currentSkinTone.color
+        skinToneButton.accessibilityHint = currentSkinTone.name
         emojisCollectionView.reloadData()
     }
 
@@ -180,6 +182,8 @@ final class EmojiPicker: UIView, RCEmojiKitLocalizable {
         let categoryItems = currentCategories.map { category -> UITabBarItem in
             let image = UIImage(named: category.name) ?? UIImage(named: "custom")
             let item = UITabBarItem(title: nil, image: image, selectedImage: image)
+            item.isAccessibilityElement = true
+            item.accessibilityLabel = category.name
             item.imageInsets = UIEdgeInsets(top: 6, left: 0, bottom: -6, right: 0)
             return item
         }
@@ -230,6 +234,8 @@ extension EmojiPicker: UICollectionViewDataSource {
 
         if let file = emoji.imageUrl {
             cell.emoji = .custom(URL(string: file))
+            cell.emojiImageView.accessibilityLabel = emoji.name
+            cell.emojiImageView.accessibilityTraits = .staticText
         } else {
             var toneModifier = ""
             if emoji.supportsTones, let currentTone = currentSkinTone.name { toneModifier = "_\(currentTone)" }

Rocket.Chat/External/RCEmojiKit/cs.lproj/RCEmojiKit.strings

@@ -21,3 +21,7 @@
 "categories.flags" = "FLAGS"; //TODO
 
 "reactorlist.title" = "Reactions"; //TODO
+
+// Accessibility
+
+"skinTone.label" = "Change skintone"; //TODO

Rocket.Chat/External/RCEmojiKit/de.lproj/RCEmojiKit.strings

@@ -21,3 +21,7 @@
 "categories.flags" = "FLAGGEN";
 
 "reactorlist.title" = "Reaktionen";
+
+// Accessibility
+
+"skinTone.label" = "Change skintone"; //TODO

Rocket.Chat/External/RCEmojiKit/el.lproj/RCEmojiKit.strings

@@ -22,3 +22,6 @@
 
 "reactorlist.title" = "Αντιδράσεις";
 
+// Accessibility
+
+"skinTone.label" = "Change skintone"; //TODO

Rocket.Chat/External/RCEmojiKit/en.lproj/RCEmojiKit.strings

@@ -22,3 +22,6 @@
 
 "reactorlist.title" = "Reactions";
 
+// Accessibility
+
+"skinTone.label" = "Change skintone";

Rocket.Chat/External/RCEmojiKit/es.lproj/RCEmojiKit.strings

@@ -22,3 +22,6 @@
 
 "reactorlist.title" = "Reactions";
 
+// Accessibility
+
+"skinTone.label" = "Change skintone"; //TODO

Rocket.Chat/External/RCEmojiKit/it.lproj/RCEmojiKit.strings

@@ -22,3 +22,6 @@
 
 "reactorlist.title" = "Reazioni";
 
+// Accessibility
+
+"skinTone.label" = "Change skintone"; //TODO

Rocket.Chat/External/RCEmojiKit/ja.lproj/RCEmojiKit.strings

@@ -22,3 +22,6 @@
 
 "reactorlist.title" = "Reactions";
 
+// Accessibility
+
+"skinTone.label" = "Change skintone"; //TODO

Rocket.Chat/External/RCEmojiKit/pl.lproj/RCEmojiKit.strings

@@ -21,3 +21,7 @@
 "categories.flags" = "FLAGI";
 
 "reactorlist.title" = "Reakcje";
+
+// Accessibility
+
+"skinTone.label" = "Change skintone"; //TODO

Rocket.Chat/External/RCEmojiKit/pt-BR.lproj/RCEmojiKit.strings

@@ -21,3 +21,7 @@
 "categories.flags" = "BANDEIRAS";
 
 "reactorlist.title" = "Reações";
+
+// Accessibility
+
+"skinTone.label" = "Change skintone"; //TODO

Rocket.Chat/External/RCEmojiKit/zh-Hans.lproj/RCEmojiKit.strings

@@ -22,3 +22,6 @@
 
 "reactorlist.title" = "Reactions";
 
+// Accessibility
+
+"skinTone.label" = "Change skintone"; //TODO

Rocket.Chat/External/RCEmojiKit/zh-Hant.lproj/RCEmojiKit.strings

@@ -22,3 +22,6 @@
 
 "reactorlist.title" = "Reactions";
 
+// Accessibility
+
+"skinTone.label" = "Change skintone"; //TODO