diff --git a/src/frontend/apps/e2e/__tests__/app-impress/doc-editor.spec.ts b/src/frontend/apps/e2e/__tests__/app-impress/doc-editor.spec.ts
index e0ea8f59..11796c65 100644
--- a/src/frontend/apps/e2e/__tests__/app-impress/doc-editor.spec.ts
+++ b/src/frontend/apps/e2e/__tests__/app-impress/doc-editor.spec.ts
@@ -976,7 +976,10 @@ test.describe('Doc Editor', () => {
await expect(pdfBlock).toBeVisible();
// Try with invalid PDF first
- await page.getByText(/Add (PDF|file)/).click();
+ await page
+ .getByText(/Add (PDF|file)/)
+ .first()
+ .click();
await page.locator('[data-test="embed-tab"]').click();
@@ -994,7 +997,6 @@ test.describe('Doc Editor', () => {
// Now with a valid PDF
await page.getByText(/Add (PDF|file)/).click();
const fileChooserPromise = page.waitForEvent('filechooser');
- const downloadPromise = page.waitForEvent('download');
await page.getByText(/Upload (PDF|file)/).click();
const fileChooser = await fileChooserPromise;
@@ -1003,24 +1005,16 @@ test.describe('Doc Editor', () => {
// Wait for the media-check to be processed
await page.waitForTimeout(1000);
- const pdfEmbed = page
- .locator('.--docs--editor-container embed.bn-visual-media')
+ const pdfIframe = page
+ .locator('.--docs--editor-container iframe.bn-visual-media')
.first();
// Check src of pdf
- expect(await pdfEmbed.getAttribute('src')).toMatch(
+ expect(await pdfIframe.getAttribute('src')).toMatch(
/http:\/\/localhost:8083\/media\/.*\/attachments\/.*.pdf/,
);
- await expect(pdfEmbed).toHaveAttribute('type', 'application/pdf');
- await expect(pdfEmbed).toHaveAttribute('role', 'presentation');
-
- // Check download with original filename
- await pdfBlock.click();
- await page.locator('[data-test="downloadfile"]').click();
-
- const download = await downloadPromise;
- expect(download.suggestedFilename()).toBe('test-pdf.pdf');
+ await expect(pdfIframe).toHaveAttribute('role', 'presentation');
});
test('it preserves text when switching between mobile and desktop views', async ({
diff --git a/src/frontend/apps/impress/src/features/docs/doc-editor/components/custom-blocks/PdfBlock.tsx b/src/frontend/apps/impress/src/features/docs/doc-editor/components/custom-blocks/PdfBlock.tsx
index 1130d2b5..bac459c9 100644
--- a/src/frontend/apps/impress/src/features/docs/doc-editor/components/custom-blocks/PdfBlock.tsx
+++ b/src/frontend/apps/impress/src/features/docs/doc-editor/components/custom-blocks/PdfBlock.tsx
@@ -15,14 +15,18 @@ import {
import { TFunction } from 'i18next';
import { useEffect, useState } from 'react';
import { useTranslation } from 'react-i18next';
-import { createGlobalStyle, css } from 'styled-components';
+import { createGlobalStyle } from 'styled-components';
import { Box, Icon, Loading } from '@/components';
+import Warning from '../../assets/warning.svg';
import { ANALYZE_URL } from '../../conf';
import { DocsBlockNoteEditor } from '../../types';
const PDFBlockStyle = createGlobalStyle`
+ .bn-block-content[data-content-type="pdf"] .bn-file-block-content-wrapper {
+ width: fit-content;
+ }
.bn-block-content[data-content-type="pdf"] .bn-file-block-content-wrapper[style*="fit-content"] {
width: 100% !important;
}
@@ -59,11 +63,7 @@ interface PdfBlockComponentProps {
>;
}
-const PdfBlockComponent = ({
- editor,
- block,
- contentRef,
-}: PdfBlockComponentProps) => {
+const PdfBlockComponent = ({ editor, block }: PdfBlockComponentProps) => {
const pdfUrl = block.props.url;
const { i18n, t } = useTranslation();
const lang = i18n.resolvedLanguage;
@@ -114,27 +114,29 @@ const PdfBlockComponent = ({
void validatePDFContent();
}, [pdfUrl]);
+ const isInvalidPDF =
+ !isPDFContentLoading && isPDFContent !== null && !isPDFContent;
+
+ if (isInvalidPDF) {
+ return (
+
+
+ {t('Invalid or missing PDF file.')}
+
+ );
+ }
+
return (
-
+ <>
{isPDFContentLoading && }
- {!isPDFContentLoading && isPDFContent !== null && !isPDFContent && (
- editor.setTextCursorPosition(block)}
- >
- {t('Invalid or missing PDF file.')}
-
- )}
@@ -144,21 +146,19 @@ const PdfBlockComponent = ({
>
{!isPDFContentLoading && isPDFContent && (
editor.setTextCursorPosition(block)}
/>
)}
-
+ >
);
};