diff --git a/CHANGELOG.md b/CHANGELOG.md index b4f85614..93a7db33 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -88,6 +88,10 @@ and this project adheres to - ✨(frontend) load docs logo from public folder via url #1462 - 🔧(keycloak) Fix https required issue in dev mode #1286 +## Removed + +- 🔥(frontend) remove custom DividerBlock ##1375 + ## [3.7.0] - 2025-09-12 ### Added diff --git a/src/frontend/apps/e2e/__tests__/app-impress/doc-export.spec.ts b/src/frontend/apps/e2e/__tests__/app-impress/doc-export.spec.ts index 7985b2a2..8e9c36b6 100644 --- a/src/frontend/apps/e2e/__tests__/app-impress/doc-export.spec.ts +++ b/src/frontend/apps/e2e/__tests__/app-impress/doc-export.spec.ts @@ -274,49 +274,6 @@ test.describe('Doc Export', () => { expect(pdfData.text).toContain('Hello World'); // This is the pdf text }); - /** - * We cannot assert the line break is visible in the pdf, but we can assert the - * line break is visible in the editor and that the pdf is generated. - */ - test('it exports the doc with divider', async ({ page, browserName }) => { - const [randomDoc] = await createDoc(page, 'export-divider', browserName, 1); - - const editor = page.locator('.ProseMirror'); - await editor.click(); - await editor.fill('Hello World'); - - // Trigger slash menu to show menu - await editor.locator('.bn-block-outer').last().fill('/'); - await page.getByText('Add a horizontal line').click(); - - await expect( - editor.locator('.bn-block-content[data-content-type="divider"]'), - ).toBeVisible(); - - await page - .getByRole('button', { - name: 'Export the document', - }) - .click(); - - await expect( - page.getByTestId('doc-open-modal-download-button'), - ).toBeVisible(); - - const downloadPromise = page.waitForEvent('download', (download) => { - return download.suggestedFilename().includes(`${randomDoc}.pdf`); - }); - - void page.getByTestId('doc-export-download-button').click(); - - const download = await downloadPromise; - expect(download.suggestedFilename()).toBe(`${randomDoc}.pdf`); - - const pdfBuffer = await cs.toBuffer(await download.createReadStream()); - const pdfData = await pdf(pdfBuffer); - expect(pdfData.text).toContain('Hello World'); - }); - test('it exports the doc with multi columns', async ({ page, browserName, diff --git a/src/frontend/apps/impress/src/features/docs/doc-editor/components/BlockNoteEditor.tsx b/src/frontend/apps/impress/src/features/docs/doc-editor/components/BlockNoteEditor.tsx index 3c507f8e..f36ec8f4 100644 --- a/src/frontend/apps/impress/src/features/docs/doc-editor/components/BlockNoteEditor.tsx +++ b/src/frontend/apps/impress/src/features/docs/doc-editor/components/BlockNoteEditor.tsx @@ -36,7 +36,6 @@ import { BlockNoteToolbar } from './BlockNoteToolBar/BlockNoteToolbar'; import { AccessibleImageBlock, CalloutBlock, - DividerBlock, PdfBlock, UploadLoaderBlock, } from './custom-blocks'; @@ -54,7 +53,6 @@ const baseBlockNoteSchema = withPageBreak( blockSpecs: { ...defaultBlockSpecs, callout: CalloutBlock, - divider: DividerBlock, image: AccessibleImageBlock, pdf: PdfBlock, uploadLoader: UploadLoaderBlock, diff --git a/src/frontend/apps/impress/src/features/docs/doc-editor/components/BlockNoteSuggestionMenu.tsx b/src/frontend/apps/impress/src/features/docs/doc-editor/components/BlockNoteSuggestionMenu.tsx index 62999dc8..f0b3f208 100644 --- a/src/frontend/apps/impress/src/features/docs/doc-editor/components/BlockNoteSuggestionMenu.tsx +++ b/src/frontend/apps/impress/src/features/docs/doc-editor/components/BlockNoteSuggestionMenu.tsx @@ -17,7 +17,6 @@ import { import { getCalloutReactSlashMenuItems, - getDividerReactSlashMenuItems, getPdfReactSlashMenuItems, } from './custom-blocks'; import { useGetInterlinkingMenuItems } from './custom-inline-content'; @@ -59,7 +58,6 @@ export const BlockNoteSuggestionMenu = () => { getCalloutReactSlashMenuItems(editor, t, basicBlocksName), getMultiColumnSlashMenuItems?.(editor) || [], getPageBreakReactSlashMenuItems(editor), - getDividerReactSlashMenuItems(editor, t, basicBlocksName), getPdfReactSlashMenuItems(editor, t, fileBlocksName), ), query, diff --git a/src/frontend/apps/impress/src/features/docs/doc-editor/components/custom-blocks/DividerBlock.tsx b/src/frontend/apps/impress/src/features/docs/doc-editor/components/custom-blocks/DividerBlock.tsx deleted file mode 100644 index 9d402a82..00000000 --- a/src/frontend/apps/impress/src/features/docs/doc-editor/components/custom-blocks/DividerBlock.tsx +++ /dev/null @@ -1,51 +0,0 @@ -import { insertOrUpdateBlock } from '@blocknote/core'; -import { createReactBlockSpec } from '@blocknote/react'; -import { TFunction } from 'i18next'; - -import { Box, Icon } from '@/components'; -import { useCunninghamTheme } from '@/cunningham'; - -import { DocsBlockNoteEditor } from '../../types'; - -export const DividerBlock = createReactBlockSpec( - { - type: 'divider', - propSchema: {}, - content: 'none', - }, - { - render: () => { - // eslint-disable-next-line react-hooks/rules-of-hooks - const { colorsTokens } = useCunninghamTheme(); - - return ( - - ); - }, - }, -); - -export const getDividerReactSlashMenuItems = ( - editor: DocsBlockNoteEditor, - t: TFunction<'translation', undefined>, - group: string, -) => [ - { - title: t('Divider'), - onItemClick: () => { - insertOrUpdateBlock(editor, { - type: 'divider', - }); - }, - aliases: ['divider', 'hr', 'horizontal rule', 'line', 'separator'], - group, - icon: , - subtext: t('Add a horizontal line'), - }, -]; diff --git a/src/frontend/apps/impress/src/features/docs/doc-editor/components/custom-blocks/index.ts b/src/frontend/apps/impress/src/features/docs/doc-editor/components/custom-blocks/index.ts index 7aad893b..96148388 100644 --- a/src/frontend/apps/impress/src/features/docs/doc-editor/components/custom-blocks/index.ts +++ b/src/frontend/apps/impress/src/features/docs/doc-editor/components/custom-blocks/index.ts @@ -1,5 +1,4 @@ export * from './AccessibleImageBlock'; export * from './CalloutBlock'; -export * from './DividerBlock'; export * from './PdfBlock'; export * from './UploadLoaderBlock'; diff --git a/src/frontend/apps/impress/src/features/docs/doc-export/blocks-mapping/dividerDocx.tsx b/src/frontend/apps/impress/src/features/docs/doc-export/blocks-mapping/dividerDocx.tsx deleted file mode 100644 index 406002e4..00000000 --- a/src/frontend/apps/impress/src/features/docs/doc-export/blocks-mapping/dividerDocx.tsx +++ /dev/null @@ -1,24 +0,0 @@ -import { Paragraph } from 'docx'; - -import { useCunninghamTheme } from '@/cunningham'; - -import { DocsExporterDocx } from '../types'; - -export const blockMappingDividerDocx: DocsExporterDocx['mappings']['blockMapping']['divider'] = - () => { - const { colorsTokens } = useCunninghamTheme.getState(); - - return new Paragraph({ - spacing: { - before: 200, - }, - border: { - top: { - color: colorsTokens['greyscale-300'], - size: 1, - style: 'single', - space: 1, - }, - }, - }); - }; diff --git a/src/frontend/apps/impress/src/features/docs/doc-export/blocks-mapping/dividerPDF.tsx b/src/frontend/apps/impress/src/features/docs/doc-export/blocks-mapping/dividerPDF.tsx deleted file mode 100644 index ca5e7c18..00000000 --- a/src/frontend/apps/impress/src/features/docs/doc-export/blocks-mapping/dividerPDF.tsx +++ /dev/null @@ -1,20 +0,0 @@ -import { Text } from '@react-pdf/renderer'; - -import { useCunninghamTheme } from '@/cunningham'; - -import { DocsExporterPDF } from '../types'; - -export const blockMappingDividerPDF: DocsExporterPDF['mappings']['blockMapping']['divider'] = - () => { - const { colorsTokens } = useCunninghamTheme.getState(); - - return ( - - ); - }; diff --git a/src/frontend/apps/impress/src/features/docs/doc-export/blocks-mapping/index.ts b/src/frontend/apps/impress/src/features/docs/doc-export/blocks-mapping/index.ts index e8d7328a..0eabf226 100644 --- a/src/frontend/apps/impress/src/features/docs/doc-export/blocks-mapping/index.ts +++ b/src/frontend/apps/impress/src/features/docs/doc-export/blocks-mapping/index.ts @@ -1,7 +1,5 @@ export * from './calloutDocx'; export * from './calloutPDF'; -export * from './dividerDocx'; -export * from './dividerPDF'; export * from './headingPDF'; export * from './imageDocx'; export * from './imagePDF'; diff --git a/src/frontend/apps/impress/src/features/docs/doc-export/mappingDocx.tsx b/src/frontend/apps/impress/src/features/docs/doc-export/mappingDocx.tsx index 0a26644a..1d1f607c 100644 --- a/src/frontend/apps/impress/src/features/docs/doc-export/mappingDocx.tsx +++ b/src/frontend/apps/impress/src/features/docs/doc-export/mappingDocx.tsx @@ -1,9 +1,8 @@ import { docxDefaultSchemaMappings } from '@blocknote/xl-docx-exporter'; -import { Paragraph } from 'docx'; +import { TextRun } from 'docx'; import { blockMappingCalloutDocx, - blockMappingDividerDocx, blockMappingImageDocx, blockMappingQuoteDocx, blockMappingUploadLoaderDocx, @@ -16,9 +15,8 @@ export const docxDocsSchemaMappings: DocsExporterDocx['mappings'] = { blockMapping: { ...docxDefaultSchemaMappings.blockMapping, callout: blockMappingCalloutDocx, - divider: blockMappingDividerDocx, - // We're using the file block mapping for PDF blocks - // The types don't match exactly but the implementation is compatible + // We're reusing the file block mapping for PDF blocks; both share the same + // implementation signature, so we can reuse the handler directly. // eslint-disable-next-line @typescript-eslint/no-explicit-any pdf: docxDefaultSchemaMappings.blockMapping.file as any, quote: blockMappingQuoteDocx, @@ -27,7 +25,7 @@ export const docxDocsSchemaMappings: DocsExporterDocx['mappings'] = { }, inlineContentMapping: { ...docxDefaultSchemaMappings.inlineContentMapping, - interlinkingSearchInline: () => new Paragraph(''), + interlinkingSearchInline: () => new TextRun(''), interlinkingLinkInline: inlineContentMappingInterlinkingLinkDocx, }, styleMapping: { diff --git a/src/frontend/apps/impress/src/features/docs/doc-export/mappingPDF.tsx b/src/frontend/apps/impress/src/features/docs/doc-export/mappingPDF.tsx index ed100e84..0d0c7cbd 100644 --- a/src/frontend/apps/impress/src/features/docs/doc-export/mappingPDF.tsx +++ b/src/frontend/apps/impress/src/features/docs/doc-export/mappingPDF.tsx @@ -2,7 +2,6 @@ import { pdfDefaultSchemaMappings } from '@blocknote/xl-pdf-exporter'; import { blockMappingCalloutPDF, - blockMappingDividerPDF, blockMappingHeadingPDF, blockMappingImagePDF, blockMappingParagraphPDF, @@ -21,7 +20,6 @@ export const pdfDocsSchemaMappings: DocsExporterPDF['mappings'] = { heading: blockMappingHeadingPDF, image: blockMappingImagePDF, paragraph: blockMappingParagraphPDF, - divider: blockMappingDividerPDF, quote: blockMappingQuotePDF, table: blockMappingTablePDF, // We're using the file block mapping for PDF blocks