From a37d93f6cd487c13f0c166c82286b45f4b6b3e88 Mon Sep 17 00:00:00 2001
From: "soroush.asadi" <soroush.asadi@aliasaas.com>
Date: Tue, 2 Jun 2026 13:24:20 +0330
Subject: [PATCH] fix(ui): force dir=ltr on remaining RTL pill toggles

The branch-menu-overrides availability switch (dashboard) and the BlogToggle
(admin website editor) still moved their knob with translate-x while inheriting
RTL, so the knob escaped the track on the right. Pin both to dir="ltr" like the
other switches. All four role="switch" toggles in the codebase now share the fix.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
---
 web/admin/src/components/admin/admin-website-screens.tsx    | 1 +
 web/dashboard/src/components/menu/branch-menu-overrides.tsx | 2 ++
 2 files changed, 3 insertions(+)

diff --git a/web/admin/src/components/admin/admin-website-screens.tsx b/web/admin/src/components/admin/admin-website-screens.tsx
index a9101e8..7c883df 100644
--- a/web/admin/src/components/admin/admin-website-screens.tsx
+++ b/web/admin/src/components/admin/admin-website-screens.tsx
@@ -162,6 +162,7 @@ function BlogToggle({
     <button
       type="button"
       role="switch"
+      dir="ltr"
       aria-checked={checked}
       onClick={() => onChange(!checked)}
       className={cn(
diff --git a/web/dashboard/src/components/menu/branch-menu-overrides.tsx b/web/dashboard/src/components/menu/branch-menu-overrides.tsx
index 1b3fcf1..4265320 100644
--- a/web/dashboard/src/components/menu/branch-menu-overrides.tsx
+++ b/web/dashboard/src/components/menu/branch-menu-overrides.tsx
@@ -193,6 +193,8 @@ export function BranchMenuOverrides({
                   <button
                     type="button"
                     role="switch"
+                    // Force LTR so the knob's translate-x stays inside the track in RTL.
+                    dir="ltr"
                     aria-checked={row.isAvailable}
                     className={cn(
                       "relative inline-flex h-6 w-11 shrink-0 rounded-full border transition-colors",