From e6dabbe0a6bfbe7ee3a894de944dee38a08cdf75 Mon Sep 17 00:00:00 2001
From: Jaime Idolpx <jaime@idolpx.com>
Date: Fri, 12 Jun 2026 05:22:58 -0400
Subject: [PATCH] feat(MediaManager): improve URL display handling with LTR
 embedding for better BiDi support

---
 src/app/components/MediaManager.tsx | 23 ++++++++++++++---------
 1 file changed, 14 insertions(+), 9 deletions(-)

diff --git a/src/app/components/MediaManager.tsx b/src/app/components/MediaManager.tsx
index 9d9f446..7bcd7b7 100644
--- a/src/app/components/MediaManager.tsx
+++ b/src/app/components/MediaManager.tsx
@@ -1300,15 +1300,20 @@ export default function MediaManager({ initialPath, rootPath, title, config, set
                     <HardDrive className={`w-5 h-5 flex-shrink-0 ${dev.enabled ? 'text-blue-500' : 'text-neutral-400'}`} />
                     <div className="min-w-0 flex-1">
                       <div className="font-medium text-sm">Device #{dev.key}</div>
-                      {(dev.base_url || dev.url) && (
-                        <div
-                          className="text-xs text-neutral-500 overflow-hidden whitespace-nowrap"
-                          style={{ direction: 'rtl', textOverflow: 'ellipsis' }}
-                          title={[dev.base_url, dev.url].filter(Boolean).join('').replace(/\/$/, '')}
-                        >
-                          {[dev.base_url, dev.url].filter(Boolean).join('').replace(/\/$/, '')}
-                        </div>
-                      )}
+                      {(dev.base_url || dev.url) && (() => {
+                        const displayUrl = [dev.base_url, dev.url]
+                          .filter(Boolean).join('');
+                        return (
+                          <div
+                            className="text-xs text-neutral-500 overflow-hidden whitespace-nowrap"
+                            style={{ direction: 'rtl', textOverflow: 'ellipsis' }}
+                            title={displayUrl}
+                          >
+                            {/* LTR embed prevents BiDi from reordering the leading '/' to the visual right */}
+                            <span style={{ direction: 'ltr', unicodeBidi: 'embed' }}>{displayUrl}</span>
+                          </div>
+                        );
+                      })()}
                     </div>
                     {!dev.enabled && <span className="text-xs text-neutral-400 flex-shrink-0">disabled</span>}
                   </button>