From 9f065262385b8abf357fd8b3cff34e21b472bbc7 Mon Sep 17 00:00:00 2001
From: c0mrade <killmy666@gmail.com>
Date: Tue, 26 May 2026 12:06:15 +0300
Subject: [PATCH] fix(a11y): aria-label on icon-only buttons (Subscription copy
 + InstallationGuide back/QR)

Subscription copy-URL button only had a title attribute; back and QR-open buttons in
InstallationGuide had no accessible name. Add aria-label so screen readers announce
the action (WCAG 2.4.6).
---
 src/components/connection/InstallationGuide.tsx | 2 ++
 src/pages/Subscription.tsx                      | 1 +
 2 files changed, 3 insertions(+)

diff --git a/src/components/connection/InstallationGuide.tsx b/src/components/connection/InstallationGuide.tsx
index 108cc91..055b761 100644
--- a/src/components/connection/InstallationGuide.tsx
+++ b/src/components/connection/InstallationGuide.tsx
@@ -197,6 +197,7 @@ export default function InstallationGuide({
         {!isTelegramWebApp && (
           <button
             onClick={onGoBack}
+            aria-label={t('common.back', 'Back')}
             className="flex h-10 w-10 items-center justify-center rounded-xl border border-dark-700 bg-dark-800 transition-colors hover:border-dark-600"
           >
             <BackIcon />
@@ -208,6 +209,7 @@ export default function InstallationGuide({
         {appConfig.subscriptionUrl && onOpenQR && (
           <button
             onClick={() => onOpenQR()}
+            aria-label={t('subscription.connection.openQr', 'Open QR code')}
             className="flex h-10 w-10 items-center justify-center rounded-xl border border-dark-700 bg-dark-800 text-dark-200 transition-colors hover:border-dark-600"
           >
             <svg
diff --git a/src/pages/Subscription.tsx b/src/pages/Subscription.tsx
index 92823e6..2979ec9 100644
--- a/src/pages/Subscription.tsx
+++ b/src/pages/Subscription.tsx
@@ -1023,6 +1023,7 @@ export default function Subscription() {
                         : `1px solid ${g.trackBg}`,
                       color: copied ? 'rgb(var(--color-accent-400))' : g.textMuted,
                     }}
+                    aria-label={t('subscription.copyLink')}
                     title={t('subscription.copyLink')}
                   >
                     {copied ? <CheckIcon /> : <CopyIcon />}