From 7b0a72db5b4e13a5ddbb9e24bb405253501ebe5f Mon Sep 17 00:00:00 2001
From: c0mrade <killmy666@gmail.com>
Date: Tue, 26 May 2026 00:03:17 +0300
Subject: [PATCH] fix(a11y): switch semantics for admin form toggles

Add role=switch + aria-checked + aria-label to 12 ad-hoc toggle buttons across admin
create/edit forms (AdminCampaignCreate/Edit, AdminPromocodeCreate, AdminPromoGroupCreate,
AdminPromoOfferTemplateEdit, AdminPaymentMethodEdit, AdminTariffCreate) so screen readers
announce on/off state (WCAG 4.1.2).
---
 src/pages/AdminCampaignCreate.tsx         | 3 +++
 src/pages/AdminCampaignEdit.tsx           | 3 +++
 src/pages/AdminPaymentMethodEdit.tsx      | 5 +++++
 src/pages/AdminPromoGroupCreate.tsx       | 6 ++++++
 src/pages/AdminPromoOfferTemplateEdit.tsx | 3 +++
 src/pages/AdminPromocodeCreate.tsx        | 6 ++++++
 src/pages/AdminTariffCreate.tsx           | 9 +++++++++
 7 files changed, 35 insertions(+)

diff --git a/src/pages/AdminCampaignCreate.tsx b/src/pages/AdminCampaignCreate.tsx
index 5021065..200eb43 100644
--- a/src/pages/AdminCampaignCreate.tsx
+++ b/src/pages/AdminCampaignCreate.tsx
@@ -366,6 +366,9 @@ export default function AdminCampaignCreate() {
           <button
             type="button"
             onClick={() => setIsActive(!isActive)}
+            role="switch"
+            aria-checked={isActive}
+            aria-label={t('admin.campaigns.form.active')}
             className={`relative h-6 w-11 rounded-full transition-colors ${
               isActive ? 'bg-accent-500' : 'bg-dark-600'
             }`}
diff --git a/src/pages/AdminCampaignEdit.tsx b/src/pages/AdminCampaignEdit.tsx
index f376b7a..f0c491a 100644
--- a/src/pages/AdminCampaignEdit.tsx
+++ b/src/pages/AdminCampaignEdit.tsx
@@ -390,6 +390,9 @@ export default function AdminCampaignEdit() {
           <button
             type="button"
             onClick={() => setIsActive(!isActive)}
+            role="switch"
+            aria-checked={isActive}
+            aria-label={t('admin.campaigns.form.active')}
             className={`relative h-6 w-11 rounded-full transition-colors ${
               isActive ? 'bg-accent-500' : 'bg-dark-600'
             }`}
diff --git a/src/pages/AdminPaymentMethodEdit.tsx b/src/pages/AdminPaymentMethodEdit.tsx
index dbe4f2b..bf6c750 100644
--- a/src/pages/AdminPaymentMethodEdit.tsx
+++ b/src/pages/AdminPaymentMethodEdit.tsx
@@ -207,6 +207,9 @@ export default function AdminPaymentMethodEdit() {
           </div>
           <button
             onClick={() => setIsEnabled(!isEnabled)}
+            role="switch"
+            aria-checked={isEnabled}
+            aria-label={t('admin.paymentMethods.methodEnabled')}
             className={`relative h-6 w-11 rounded-full transition-colors ${
               isEnabled ? 'bg-accent-500' : 'bg-dark-600'
             }`}
@@ -234,6 +237,8 @@ export default function AdminPaymentMethodEdit() {
           </div>
           <button
             onClick={() => setOpenUrlDirect(!openUrlDirect)}
+            role="switch"
+            aria-checked={openUrlDirect}
             className={`relative h-6 w-11 shrink-0 rounded-full transition-colors ${
               openUrlDirect ? 'bg-accent-500' : 'bg-dark-600'
             }`}
diff --git a/src/pages/AdminPromoGroupCreate.tsx b/src/pages/AdminPromoGroupCreate.tsx
index 11d7416..4e4dc43 100644
--- a/src/pages/AdminPromoGroupCreate.tsx
+++ b/src/pages/AdminPromoGroupCreate.tsx
@@ -378,6 +378,9 @@ export default function AdminPromoGroupCreate() {
           <button
             type="button"
             onClick={() => setApplyToAddons(!applyToAddons)}
+            role="switch"
+            aria-checked={applyToAddons}
+            aria-label={t('admin.promoGroups.form.applyToAddons')}
             className={`relative h-6 w-11 rounded-full transition-colors ${
               applyToAddons ? 'bg-accent-500' : 'bg-dark-600'
             }`}
@@ -396,6 +399,9 @@ export default function AdminPromoGroupCreate() {
           <button
             type="button"
             onClick={() => setIsDefault(!isDefault)}
+            role="switch"
+            aria-checked={isDefault}
+            aria-label={t('admin.promoGroups.form.isDefault')}
             className={`relative h-6 w-11 rounded-full transition-colors ${
               isDefault ? 'bg-accent-500' : 'bg-dark-600'
             }`}
diff --git a/src/pages/AdminPromoOfferTemplateEdit.tsx b/src/pages/AdminPromoOfferTemplateEdit.tsx
index 273bb70..40baff2 100644
--- a/src/pages/AdminPromoOfferTemplateEdit.tsx
+++ b/src/pages/AdminPromoOfferTemplateEdit.tsx
@@ -304,6 +304,9 @@ export default function AdminPromoOfferTemplateEdit() {
               <button
                 type="button"
                 onClick={() => setIsActive(!isActive)}
+                role="switch"
+                aria-checked={isActive}
+                aria-label={t('admin.promoOffers.form.templateActive')}
                 className={`relative h-6 w-11 rounded-full transition-colors ${
                   isActive ? 'bg-accent-500' : 'bg-dark-600'
                 }`}
diff --git a/src/pages/AdminPromocodeCreate.tsx b/src/pages/AdminPromocodeCreate.tsx
index 19c03a1..0bfb625 100644
--- a/src/pages/AdminPromocodeCreate.tsx
+++ b/src/pages/AdminPromocodeCreate.tsx
@@ -469,6 +469,9 @@ export default function AdminPromocodeCreate() {
             <button
               type="button"
               onClick={() => setIsActive(!isActive)}
+              role="switch"
+              aria-checked={isActive}
+              aria-label={t('admin.promocodes.form.active')}
               className={`relative h-6 w-10 rounded-full transition-colors ${
                 isActive ? 'bg-accent-500' : 'bg-dark-600'
               }`}
@@ -486,6 +489,9 @@ export default function AdminPromocodeCreate() {
             <button
               type="button"
               onClick={() => setFirstPurchaseOnly(!firstPurchaseOnly)}
+              role="switch"
+              aria-checked={firstPurchaseOnly}
+              aria-label={t('admin.promocodes.form.firstPurchaseOnly')}
               className={`relative h-6 w-10 rounded-full transition-colors ${
                 firstPurchaseOnly ? 'bg-accent-500' : 'bg-dark-600'
               }`}
diff --git a/src/pages/AdminTariffCreate.tsx b/src/pages/AdminTariffCreate.tsx
index c2116f5..dea8261 100644
--- a/src/pages/AdminTariffCreate.tsx
+++ b/src/pages/AdminTariffCreate.tsx
@@ -855,6 +855,9 @@ export default function AdminTariffCreate() {
               <button
                 type="button"
                 onClick={() => setTrafficTopupEnabled(!trafficTopupEnabled)}
+                role="switch"
+                aria-checked={trafficTopupEnabled}
+                aria-label={t('admin.tariffs.extraTrafficTitle')}
                 className={`relative h-6 w-11 rounded-full transition-colors ${
                   trafficTopupEnabled ? 'bg-accent-500' : 'bg-dark-600'
                 }`}
@@ -1117,6 +1120,9 @@ export default function AdminTariffCreate() {
               <button
                 type="button"
                 onClick={() => setIsActive(!isActive)}
+                role="switch"
+                aria-checked={isActive}
+                aria-label={t('admin.tariffs.isActiveLabel')}
                 className={`relative h-6 w-11 rounded-full transition-colors ${
                   isActive ? 'bg-success-500' : 'bg-dark-600'
                 }`}
@@ -1139,6 +1145,9 @@ export default function AdminTariffCreate() {
               <button
                 type="button"
                 onClick={() => setShowInGift(!showInGift)}
+                role="switch"
+                aria-checked={showInGift}
+                aria-label={t('admin.tariffs.showInGiftLabel')}
                 className={`relative h-6 w-11 rounded-full transition-colors ${
                   showInGift ? 'bg-accent-500' : 'bg-dark-600'
                 }`}