From 0a5bd4e47d696a07d37bc84b5ce3d38f65528079 Mon Sep 17 00:00:00 2001
From: claude <claude@verso>
Date: Tue, 16 Jun 2026 11:01:15 +0000
Subject: [PATCH] Fix mobile layout key, language picker close handler, and
 presentation download
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Mobile vertical layout: add key= based on direction so react-resizable-panels
  remounts cleanly when switching between horizontal and vertical; also use
  isVertical (not just pdfLayout) for the autoSaveId to avoid restoring a
  mismatched layout from localStorage
- Language picker: replace stopPropagation pattern with a containment check on
  the document click handler — more robust on React pages where Bootstrap JS or
  React's event delegation can interfere with stopPropagation
- Presentation download dropdown: use popperConfig strategy:'fixed' so the menu
  escapes overflow:hidden table cells; remove forced drop='up' and let Popper
  choose; defer URL.revokeObjectURL by 10 s to give the browser time to start
  the download before the blob URL is released

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 services/web/app/views/layout/language-picker.pug      |  8 +++++---
 .../ide-react/components/layout/main-layout.tsx        |  3 ++-
 .../action-buttons/download-presentation-button.tsx    | 10 +++++++---
 3 files changed, 14 insertions(+), 7 deletions(-)

diff --git a/services/web/app/views/layout/language-picker.pug b/services/web/app/views/layout/language-picker.pug
index 8b9cf73135..70daf1ccd1 100644
--- a/services/web/app/views/layout/language-picker.pug
+++ b/services/web/app/views/layout/language-picker.pug
@@ -37,17 +37,19 @@ li.language-picker
 					'&return_to=' +
 					encodeURIComponent(window.location.pathname)
 			})
+			var picker = toggle.closest('.language-picker')
 			function close() {
 				menu.classList.remove('show')
 				toggle.setAttribute('aria-expanded', 'false')
 			}
-			toggle.addEventListener('click', function (e) {
-				e.stopPropagation()
+			toggle.addEventListener('click', function () {
 				var opening = !menu.classList.contains('show')
 				menu.classList.toggle('show', opening)
 				toggle.setAttribute('aria-expanded', String(opening))
 			})
-			document.addEventListener('click', close)
+			document.addEventListener('click', function (e) {
+				if (!picker || !picker.contains(e.target)) close()
+			})
 			document.addEventListener('keydown', function (e) {
 				if (e.key === 'Escape') { close(); toggle.focus() }
 			})
diff --git a/services/web/frontend/js/features/ide-react/components/layout/main-layout.tsx b/services/web/frontend/js/features/ide-react/components/layout/main-layout.tsx
index a14f82b6ee..04ceaffab6 100644
--- a/services/web/frontend/js/features/ide-react/components/layout/main-layout.tsx
+++ b/services/web/frontend/js/features/ide-react/components/layout/main-layout.tsx
@@ -80,8 +80,9 @@ export default function MainLayout() {
           <Panel id="ide-redesign-editor-and-pdf-panel" order={2}>
             <HistoryContainer />
             <PanelGroup
+              key={isVertical ? 'vertical' : 'horizontal'}
               autoSaveId={
-                pdfLayout === 'verticalSplit'
+                isVertical
                   ? 'ide-redesign-editor-and-pdf-panel-group-vertical'
                   : 'ide-redesign-editor-and-pdf-panel-group'
               }
diff --git a/services/web/frontend/js/features/project-list/components/table/cells/action-buttons/download-presentation-button.tsx b/services/web/frontend/js/features/project-list/components/table/cells/action-buttons/download-presentation-button.tsx
index 2d77d9f152..f8853d42ab 100644
--- a/services/web/frontend/js/features/project-list/components/table/cells/action-buttons/download-presentation-button.tsx
+++ b/services/web/frontend/js/features/project-list/components/table/cells/action-buttons/download-presentation-button.tsx
@@ -75,8 +75,9 @@ function DownloadPresentationButton({
         document.body.appendChild(link)
         link.click()
         link.remove()
-        URL.revokeObjectURL(url)
         setExporting(null)
+        // Revoke after a delay so the browser has time to initiate the download
+        setTimeout(() => URL.revokeObjectURL(url), 10000)
       } catch (err) {
         if (requestId !== requestIdRef.current) return
         setExporting(null)
@@ -144,7 +145,7 @@ const DownloadPresentationButtonTooltip = memo(
     return (
       <DownloadPresentationButton project={project}>
         {(startExport, exporting) => (
-          <Dropdown drop="up">
+          <Dropdown>
             <DropdownToggle
               id={`download-presentation-toggle-${project.id}`}
               variant="link"
@@ -157,7 +158,10 @@ const DownloadPresentationButtonTooltip = memo(
                 <MaterialIcon type="picture_as_pdf" />
               )}
             </DropdownToggle>
-            <DropdownMenu>
+            <DropdownMenu
+              popperConfig={{ strategy: 'fixed' }}
+              flip
+            >
               <li role="none">
                 <DropdownItem
                   as="button"