Fix mobile layout key, language picker close handler, and presentation download
Build and Deploy Verso / deploy (push) Has been cancelled
Build and Deploy Verso / deploy (push) Has been cancelled
- 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>
This commit is contained in:
@@ -37,17 +37,19 @@ li.language-picker
|
|||||||
'&return_to=' +
|
'&return_to=' +
|
||||||
encodeURIComponent(window.location.pathname)
|
encodeURIComponent(window.location.pathname)
|
||||||
})
|
})
|
||||||
|
var picker = toggle.closest('.language-picker')
|
||||||
function close() {
|
function close() {
|
||||||
menu.classList.remove('show')
|
menu.classList.remove('show')
|
||||||
toggle.setAttribute('aria-expanded', 'false')
|
toggle.setAttribute('aria-expanded', 'false')
|
||||||
}
|
}
|
||||||
toggle.addEventListener('click', function (e) {
|
toggle.addEventListener('click', function () {
|
||||||
e.stopPropagation()
|
|
||||||
var opening = !menu.classList.contains('show')
|
var opening = !menu.classList.contains('show')
|
||||||
menu.classList.toggle('show', opening)
|
menu.classList.toggle('show', opening)
|
||||||
toggle.setAttribute('aria-expanded', String(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) {
|
document.addEventListener('keydown', function (e) {
|
||||||
if (e.key === 'Escape') { close(); toggle.focus() }
|
if (e.key === 'Escape') { close(); toggle.focus() }
|
||||||
})
|
})
|
||||||
|
|||||||
@@ -80,8 +80,9 @@ export default function MainLayout() {
|
|||||||
<Panel id="ide-redesign-editor-and-pdf-panel" order={2}>
|
<Panel id="ide-redesign-editor-and-pdf-panel" order={2}>
|
||||||
<HistoryContainer />
|
<HistoryContainer />
|
||||||
<PanelGroup
|
<PanelGroup
|
||||||
|
key={isVertical ? 'vertical' : 'horizontal'}
|
||||||
autoSaveId={
|
autoSaveId={
|
||||||
pdfLayout === 'verticalSplit'
|
isVertical
|
||||||
? 'ide-redesign-editor-and-pdf-panel-group-vertical'
|
? 'ide-redesign-editor-and-pdf-panel-group-vertical'
|
||||||
: 'ide-redesign-editor-and-pdf-panel-group'
|
: 'ide-redesign-editor-and-pdf-panel-group'
|
||||||
}
|
}
|
||||||
|
|||||||
+7
-3
@@ -75,8 +75,9 @@ function DownloadPresentationButton({
|
|||||||
document.body.appendChild(link)
|
document.body.appendChild(link)
|
||||||
link.click()
|
link.click()
|
||||||
link.remove()
|
link.remove()
|
||||||
URL.revokeObjectURL(url)
|
|
||||||
setExporting(null)
|
setExporting(null)
|
||||||
|
// Revoke after a delay so the browser has time to initiate the download
|
||||||
|
setTimeout(() => URL.revokeObjectURL(url), 10000)
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
if (requestId !== requestIdRef.current) return
|
if (requestId !== requestIdRef.current) return
|
||||||
setExporting(null)
|
setExporting(null)
|
||||||
@@ -144,7 +145,7 @@ const DownloadPresentationButtonTooltip = memo(
|
|||||||
return (
|
return (
|
||||||
<DownloadPresentationButton project={project}>
|
<DownloadPresentationButton project={project}>
|
||||||
{(startExport, exporting) => (
|
{(startExport, exporting) => (
|
||||||
<Dropdown drop="up">
|
<Dropdown>
|
||||||
<DropdownToggle
|
<DropdownToggle
|
||||||
id={`download-presentation-toggle-${project.id}`}
|
id={`download-presentation-toggle-${project.id}`}
|
||||||
variant="link"
|
variant="link"
|
||||||
@@ -157,7 +158,10 @@ const DownloadPresentationButtonTooltip = memo(
|
|||||||
<MaterialIcon type="picture_as_pdf" />
|
<MaterialIcon type="picture_as_pdf" />
|
||||||
)}
|
)}
|
||||||
</DropdownToggle>
|
</DropdownToggle>
|
||||||
<DropdownMenu>
|
<DropdownMenu
|
||||||
|
popperConfig={{ strategy: 'fixed' }}
|
||||||
|
flip
|
||||||
|
>
|
||||||
<li role="none">
|
<li role="none">
|
||||||
<DropdownItem
|
<DropdownItem
|
||||||
as="button"
|
as="button"
|
||||||
|
|||||||
Reference in New Issue
Block a user