Files
overleaf-cep/services/web/frontend/js/features/ide-react/components/toolbar/download-project.tsx
Mathias Jakobsen 62d92b70dd Merge pull request #33341 from overleaf/mj-two-step-export-web
[web] Add two-step pandoc conversion download

GitOrigin-RevId: 093f435a497a7583d2b4d23558415cc442f84553
2026-05-12 08:06:13 +00:00

178 lines
4.7 KiB
TypeScript

import { useCommandProvider } from '@/features/ide-react/hooks/use-command-provider'
import OLDropdownMenuItem from '@/shared/components/ol/ol-dropdown-menu-item'
import OLTooltip from '@/shared/components/ol/ol-tooltip'
import { isSmallDevice, sendMB } from '@/infrastructure/event-tracking'
import { useDetachCompileContext as useCompileContext } from '@/shared/context/detach-compile-context'
import { useProjectContext } from '@/shared/context/project-context'
import { useCallback } from 'react'
import { useTranslation } from 'react-i18next'
import { useEditorAnalytics } from '@/shared/hooks/use-editor-analytics'
import getMeta from '@/utils/meta'
import { useFeatureFlag } from '@/shared/context/split-test-context'
import useConvertProject from '../../hooks/use-convert-project'
export const DownloadProjectZip = () => {
const { t } = useTranslation()
const { projectId } = useProjectContext()
const sendDownloadEvent = useCallback(() => {
sendMB('download-zip-button-click', {
projectId,
location: 'project-name-dropdown',
isSmallDevice,
})
}, [projectId])
useCommandProvider(
() => [
{
id: 'download-as-source-zip',
href: `/project/${projectId}/download/zip`,
label: t('download_as_source_zip'),
},
],
[t, projectId]
)
return (
<OLDropdownMenuItem
href={`/project/${projectId}/download/zip`}
target="_blank"
rel="noreferrer"
onClick={sendDownloadEvent}
>
{t('download_as_source_zip')}
</OLDropdownMenuItem>
)
}
export const DownloadProjectPDF = () => {
const { t } = useTranslation()
const { pdfDownloadUrl, pdfUrl } = useCompileContext()
const { projectId } = useProjectContext()
const { sendEvent } = useEditorAnalytics()
const sendDownloadEvent = useCallback(() => {
sendEvent('download-pdf-button-click', {
projectId,
location: 'project-name-dropdown',
isSmallDevice,
})
}, [projectId, sendEvent])
useCommandProvider(
() => [
{
id: 'download-pdf',
disabled: !pdfUrl,
href: pdfDownloadUrl || pdfUrl,
handler: ({ location }) => {
sendEvent('download-pdf-button-click', {
projectId,
location,
isSmallDevice,
})
},
label: t('download_as_pdf'),
},
],
[t, pdfUrl, projectId, pdfDownloadUrl, sendEvent]
)
const button = (
<OLDropdownMenuItem
href={pdfDownloadUrl || pdfUrl}
target="_blank"
rel="noreferrer"
onClick={sendDownloadEvent}
disabled={!pdfUrl}
>
{t('download_as_pdf')}
</OLDropdownMenuItem>
)
if (!pdfUrl) {
return (
<OLTooltip
id="tooltip-download-pdf-unavailable"
description={t('please_compile_pdf_before_download')}
overlayProps={{ placement: 'right', delay: 0 }}
>
<span>{button}</span>
</OLTooltip>
)
} else {
return button
}
}
export const ExportProjectDocx = () => {
const { t } = useTranslation()
const exportDocxEnabled = useFeatureFlag('export-docx')
const enablePandocConversions =
getMeta('ol-ExposedSettings')?.enablePandocConversions
const anonymous = getMeta('ol-anonymous')
const downloadConversion = useConvertProject('docx')
const showExportDocx =
exportDocxEnabled && enablePandocConversions && !anonymous
useCommandProvider(
() =>
showExportDocx
? [
{
id: 'export-as-docx',
handler: downloadConversion,
label: t('export_as_docx'),
},
]
: [],
[t, showExportDocx, downloadConversion]
)
if (!showExportDocx) {
return null
}
return (
<OLDropdownMenuItem onClick={downloadConversion}>
{t('export_as_docx')}
</OLDropdownMenuItem>
)
}
export const ExportProjectMarkdown = () => {
const { t } = useTranslation()
const exportMarkdownEnabled = useFeatureFlag('export-markdown')
const enablePandocConversions =
getMeta('ol-ExposedSettings')?.enablePandocConversions
const anonymous = getMeta('ol-anonymous')
const downloadConversion = useConvertProject('markdown')
const showExportMarkdown =
exportMarkdownEnabled && enablePandocConversions && !anonymous
useCommandProvider(
() =>
showExportMarkdown
? [
{
id: 'export-as-markdown',
handler: downloadConversion,
label: t('export_as_markdown'),
},
]
: [],
[t, showExportMarkdown, downloadConversion]
)
if (!showExportMarkdown) {
return null
}
return (
<OLDropdownMenuItem onClick={downloadConversion}>
{t('export_as_markdown')}
</OLDropdownMenuItem>
)
}