diff --git a/frontend/components/sidebar-02/app-sidebar.tsx b/frontend/components/sidebar-02/app-sidebar.tsx index 2a4babc..5a7b904 100644 --- a/frontend/components/sidebar-02/app-sidebar.tsx +++ b/frontend/components/sidebar-02/app-sidebar.tsx @@ -31,8 +31,7 @@ export function DashboardSidebar() { const { t, i18n } = useTranslation(); // Anchor the sidebar to the right for RTL locales (Arabic) so the whole shell // mirrors instead of leaving the fixed sidebar pinned physically left. - const isRtl = dirFor(i18n.language) === "rtl"; - const side = isRtl ? "right" : "left"; + const side = dirFor(i18n.language) === "rtl" ? "right" : "left"; const role = useActiveRole(); const { allowed: aiAllowed } = useAiAccess(); const isCollapsed = state === "collapsed"; @@ -65,11 +64,7 @@ export function DashboardSidebar() { "flex md:pt-3.5", isCollapsed ? "flex-row items-center justify-between gap-y-4 md:flex-col md:items-start md:justify-start" - : "flex-row items-center justify-between", - // RTL (Arabic): stack the logo and the toggle/bell controls into a - // right-aligned column so the collapse arrow sits ABOVE the nav icons - // instead of being pinned to the opposite (left) edge. - isRtl && !isCollapsed && "flex-col items-end justify-start gap-y-3" + : "flex-row items-center justify-between" )} > diff --git a/frontend/components/sidebar-02/nav-notifications.tsx b/frontend/components/sidebar-02/nav-notifications.tsx index b0bde89..8fd8f51 100644 --- a/frontend/components/sidebar-02/nav-notifications.tsx +++ b/frontend/components/sidebar-02/nav-notifications.tsx @@ -15,7 +15,6 @@ import { MenuSeparator, MenuTrigger, } from "@/components/ui/menu"; -import { dirFor } from "@/lib/i18n/config"; import { markNotificationRead, notificationHref } from "@/lib/notifications"; import { useNotifications } from "@/lib/use-notifications"; @@ -31,11 +30,9 @@ function relativeTime(iso: string): string { } export function NotificationsPopover() { - const { t, i18n } = useTranslation(); + const { t } = useTranslation(); const router = useRouter(); const { items, unread, markAllRead } = useNotifications(); - // Open toward the content side; flips to the left under RTL. - const popupSide = dirFor(i18n.language) === "rtl" ? "left" : "right"; return ( )} - + {t("nav.notifications")} diff --git a/frontend/components/ui/sidebar.tsx b/frontend/components/ui/sidebar.tsx index 4422b25..6a42dbf 100644 --- a/frontend/components/ui/sidebar.tsx +++ b/frontend/components/ui/sidebar.tsx @@ -299,8 +299,7 @@ export function SidebarTrigger({ variant="ghost" {...props} > - {/* Mirror the panel arrow under RTL so it points toward the sidebar edge. */} - + Toggle Sidebar ); @@ -597,7 +596,7 @@ export function SidebarMenuAction({ }): React.ReactElement { const defaultProps = { className: cn( - "absolute top-1.5 right-1 flex aspect-square w-5 items-center justify-center rounded-lg p-0 text-sidebar-foreground outline-hidden ring-sidebar-ring transition-transform hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 peer-hover/menu-button:text-sidebar-accent-foreground [&>svg:not([class*='size-'])]:size-4 [&>svg]:shrink-0", + "absolute top-1.5 end-1 flex aspect-square w-5 items-center justify-center rounded-lg p-0 text-sidebar-foreground outline-hidden ring-sidebar-ring transition-transform hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 peer-hover/menu-button:text-sidebar-accent-foreground [&>svg:not([class*='size-'])]:size-4 [&>svg]:shrink-0", // Increases the hit area of the button on mobile. "after:absolute after:-inset-2 md:after:hidden", "peer-data-[size=sm]/menu-button:top-1",