From 47398807af635ad2dce68806cddaffaf3b7d14ff Mon Sep 17 00:00:00 2001
From: Alexey Sudilovskiy <sudilovskiy@yandex-team.ru>
Date: Fri, 31 May 2024 13:48:33 +0200
Subject: [PATCH] fix: add aria-label

---
 src/components/AvatarStack/AvatarStack.tsx           | 7 ++++++-
 src/components/AvatarStack/AvatarStackMoreButton.tsx | 8 +++++++-
 src/components/AvatarStack/i18n/en.json              | 2 +-
 src/components/AvatarStack/i18n/ru.json              | 2 +-
 4 files changed, 15 insertions(+), 4 deletions(-)

diff --git a/src/components/AvatarStack/AvatarStack.tsx b/src/components/AvatarStack/AvatarStack.tsx
index c68f5fa452..0bb51c20b6 100644
--- a/src/components/AvatarStack/AvatarStack.tsx
+++ b/src/components/AvatarStack/AvatarStack.tsx
@@ -5,6 +5,7 @@ import {block} from '../utils/cn';
 
 import {AvatarStackItem} from './AvatarStackItem';
 import {AvatarStackMoreButton} from './AvatarStackMoreButton';
+import i18n from './i18n';
 import type {AvatarStackProps} from './types';
 
 import './AvatarStack.scss';
@@ -50,7 +51,11 @@ const AvatarStackComponent = ({
                     {renderMoreButton ? (
                         renderMoreButton({count: moreItems})
                     ) : (
-                        <Avatar text={`+${moreItems}`} size={size} />
+                        <Avatar
+                            text={`+${moreItems}`}
+                            aria-label={i18n('more', {count: moreItems})}
+                            size={size}
+                        />
                     )}
                 </AvatarStackItem>
             ) : null}
diff --git a/src/components/AvatarStack/AvatarStackMoreButton.tsx b/src/components/AvatarStack/AvatarStackMoreButton.tsx
index 09a346b2af..df1b402e02 100644
--- a/src/components/AvatarStack/AvatarStackMoreButton.tsx
+++ b/src/components/AvatarStack/AvatarStackMoreButton.tsx
@@ -4,6 +4,8 @@ import type {AvatarSize} from '../Avatar';
 import {Avatar, DEFAULT_AVATAR_SIZE} from '../Avatar';
 import {block} from '../utils/cn';
 
+import i18n from './i18n';
+
 const b = block('avatar-stack');
 
 type Props = Pick<React.HTMLProps<HTMLButtonElement>, 'className' | 'onClick' | 'aria-label'> & {
@@ -15,7 +17,11 @@ export const AvatarStackMoreButton = React.forwardRef<HTMLButtonElement, Props>(
     ({className, size = DEFAULT_AVATAR_SIZE, onClick, count, 'aria-label': ariaLabel}, ref) => {
         return (
             <button ref={ref} className={b('more-button', {size}, className)} onClick={onClick}>
-                <Avatar text={`+${count}`} size={size} aria-label={ariaLabel} />
+                <Avatar
+                    text={`+${count}`}
+                    size={size}
+                    aria-label={ariaLabel || i18n('more', {count})}
+                />
             </button>
         );
     },
diff --git a/src/components/AvatarStack/i18n/en.json b/src/components/AvatarStack/i18n/en.json
index 5955d021a9..7a925041fb 100644
--- a/src/components/AvatarStack/i18n/en.json
+++ b/src/components/AvatarStack/i18n/en.json
@@ -1,3 +1,3 @@
 {
-  "more": "More"
+  "more": ["and {{count}} more", "and {{count}} more", "and {{count}} more"]
 }
diff --git a/src/components/AvatarStack/i18n/ru.json b/src/components/AvatarStack/i18n/ru.json
index a00355fc53..8d7e17ac08 100644
--- a/src/components/AvatarStack/i18n/ru.json
+++ b/src/components/AvatarStack/i18n/ru.json
@@ -1,3 +1,3 @@
 {
-  "more": "Больше"
+  "more": ["И eщё {{count}}", "И eщё {{count}}", "И eщё {{count}}"]
 }