feat: add renderer type to MarkdownRendererExtensionOptions

Signed-off-by: Tilman Vatteroth <git@tilmanvatteroth.de>
This commit is contained in:
Tilman Vatteroth 2023-04-13 19:00:18 +02:00
parent f338aae9c0
commit cfdf69869c
No known key found for this signature in database
GPG key ID: 42498463316F048B
5 changed files with 14 additions and 3 deletions

View file

@ -5,6 +5,7 @@
*/ */
import { allAppExtensions } from '../../../extensions/extra-integrations/all-app-extensions' import { allAppExtensions } from '../../../extensions/extra-integrations/all-app-extensions'
import { useFrontendConfig } from '../../common/frontend-config-context/use-frontend-config' import { useFrontendConfig } from '../../common/frontend-config-context/use-frontend-config'
import type { RendererType } from '../../render-page/window-post-message-communicator/rendering-message'
import type { MarkdownRendererExtension } from '../extensions/base/markdown-renderer-extension' import type { MarkdownRendererExtension } from '../extensions/base/markdown-renderer-extension'
import { DebuggerMarkdownExtension } from '../extensions/debugger-markdown-extension' import { DebuggerMarkdownExtension } from '../extensions/debugger-markdown-extension'
import { ProxyImageMarkdownExtension } from '../extensions/image/proxy-image-markdown-extension' import { ProxyImageMarkdownExtension } from '../extensions/image/proxy-image-markdown-extension'
@ -18,11 +19,13 @@ import { useMemo } from 'react'
* Provides a list of {@link MarkdownRendererExtension markdown extensions} that is a combination of the common extensions and the given additional. * Provides a list of {@link MarkdownRendererExtension markdown extensions} that is a combination of the common extensions and the given additional.
* *
* @param baseUrl The base url for the {@link LinkAdjustmentMarkdownExtension} * @param baseUrl The base url for the {@link LinkAdjustmentMarkdownExtension}
* @param rendererType The type of the renderer that uses the extensions
* @param additionalExtensions The additional extensions that should be included in the list * @param additionalExtensions The additional extensions that should be included in the list
* @return The created list of markdown extensions * @return The created list of markdown extensions
*/ */
export const useMarkdownExtensions = ( export const useMarkdownExtensions = (
baseUrl: string, baseUrl: string,
rendererType: RendererType,
additionalExtensions: MarkdownRendererExtension[] additionalExtensions: MarkdownRendererExtension[]
): MarkdownRendererExtension[] => { ): MarkdownRendererExtension[] => {
const extensionEventEmitter = useExtensionEventEmitter() const extensionEventEmitter = useExtensionEventEmitter()
@ -35,7 +38,8 @@ export const useMarkdownExtensions = (
...allAppExtensions.flatMap((extension) => ...allAppExtensions.flatMap((extension) =>
extension.buildMarkdownRendererExtensions({ extension.buildMarkdownRendererExtensions({
frontendConfig: frontendConfig, frontendConfig: frontendConfig,
eventEmitter: extensionEventEmitter eventEmitter: extensionEventEmitter,
rendererType
}) })
), ),
...additionalExtensions, ...additionalExtensions,
@ -45,5 +49,5 @@ export const useMarkdownExtensions = (
new DebuggerMarkdownExtension(), new DebuggerMarkdownExtension(),
new ProxyImageMarkdownExtension() new ProxyImageMarkdownExtension()
] ]
}, [additionalExtensions, baseUrl, extensionEventEmitter, frontendConfig]) }, [additionalExtensions, baseUrl, extensionEventEmitter, frontendConfig, rendererType])
} }

View file

@ -12,6 +12,7 @@ import { useCalculateLineMarkerPosition } from '../../../markdown-renderer/hooks
import { useMarkdownExtensions } from '../../../markdown-renderer/hooks/use-markdown-extensions' import { useMarkdownExtensions } from '../../../markdown-renderer/hooks/use-markdown-extensions'
import { MarkdownToReact } from '../../../markdown-renderer/markdown-to-react/markdown-to-react' import { MarkdownToReact } from '../../../markdown-renderer/markdown-to-react/markdown-to-react'
import { useDocumentSyncScrolling } from '../../hooks/sync-scroll/use-document-sync-scrolling' import { useDocumentSyncScrolling } from '../../hooks/sync-scroll/use-document-sync-scrolling'
import { RendererType } from '../../window-post-message-communicator/rendering-message'
import type { CommonMarkdownRendererProps, HeightChangeRendererProps } from '../common-markdown-renderer-props' import type { CommonMarkdownRendererProps, HeightChangeRendererProps } from '../common-markdown-renderer-props'
import { DocumentTocSidebar } from './document-toc-sidebar' import { DocumentTocSidebar } from './document-toc-sidebar'
import styles from './markdown-document.module.scss' import styles from './markdown-document.module.scss'
@ -67,6 +68,7 @@ export const DocumentMarkdownRenderer: React.FC<DocumentMarkdownRendererProps> =
const extensions = useMarkdownExtensions( const extensions = useMarkdownExtensions(
baseUrl, baseUrl,
RendererType.DOCUMENT,
useMemo( useMemo(
() => [ () => [
new HeadlineAnchorsMarkdownExtension(), new HeadlineAnchorsMarkdownExtension(),

View file

@ -6,6 +6,7 @@
import { cypressId } from '../../../../utils/cypress-attribute' import { cypressId } from '../../../../utils/cypress-attribute'
import { useMarkdownExtensions } from '../../../markdown-renderer/hooks/use-markdown-extensions' import { useMarkdownExtensions } from '../../../markdown-renderer/hooks/use-markdown-extensions'
import { MarkdownToReact } from '../../../markdown-renderer/markdown-to-react/markdown-to-react' import { MarkdownToReact } from '../../../markdown-renderer/markdown-to-react/markdown-to-react'
import { RendererType } from '../../window-post-message-communicator/rendering-message'
import type { CommonMarkdownRendererProps, HeightChangeRendererProps } from '../common-markdown-renderer-props' import type { CommonMarkdownRendererProps, HeightChangeRendererProps } from '../common-markdown-renderer-props'
import useResizeObserver from '@react-hook/resize-observer' import useResizeObserver from '@react-hook/resize-observer'
import React, { useEffect, useRef, useState } from 'react' import React, { useEffect, useRef, useState } from 'react'
@ -32,7 +33,7 @@ export const SimpleMarkdownRenderer: React.FC<SimpleMarkdownRendererProps> = ({
setRendererSize(entry.contentRect) setRendererSize(entry.contentRect)
}) })
useEffect(() => onHeightChange?.((rendererSize?.height ?? 0) + 1), [rendererSize, onHeightChange]) useEffect(() => onHeightChange?.((rendererSize?.height ?? 0) + 1), [rendererSize, onHeightChange])
const extensions = useMarkdownExtensions(baseUrl, []) const extensions = useMarkdownExtensions(baseUrl, RendererType.SIMPLE, [])
return ( return (
<div className={`vh-100 bg-transparent overflow-y-hidden`}> <div className={`vh-100 bg-transparent overflow-y-hidden`}>

View file

@ -7,6 +7,7 @@ import { RevealMarkdownExtension } from '../../../markdown-renderer/extensions/r
import { useMarkdownExtensions } from '../../../markdown-renderer/hooks/use-markdown-extensions' import { useMarkdownExtensions } from '../../../markdown-renderer/hooks/use-markdown-extensions'
import { REVEAL_STATUS, useReveal } from '../../../markdown-renderer/hooks/use-reveal' import { REVEAL_STATUS, useReveal } from '../../../markdown-renderer/hooks/use-reveal'
import { MarkdownToReact } from '../../../markdown-renderer/markdown-to-react/markdown-to-react' import { MarkdownToReact } from '../../../markdown-renderer/markdown-to-react/markdown-to-react'
import { RendererType } from '../../window-post-message-communicator/rendering-message'
import type { CommonMarkdownRendererProps } from '../common-markdown-renderer-props' import type { CommonMarkdownRendererProps } from '../common-markdown-renderer-props'
import { LoadingSlide } from './loading-slide' import { LoadingSlide } from './loading-slide'
import type { SlideOptions } from '@hedgedoc/commons' import type { SlideOptions } from '@hedgedoc/commons'
@ -34,6 +35,7 @@ export const SlideshowMarkdownRenderer: React.FC<SlideshowMarkdownRendererProps>
const extensions = useMarkdownExtensions( const extensions = useMarkdownExtensions(
baseUrl, baseUrl,
RendererType.SLIDESHOW,
useMemo(() => [new RevealMarkdownExtension()], []) useMemo(() => [new RevealMarkdownExtension()], [])
) )

View file

@ -7,6 +7,7 @@ import type { FrontendConfig } from '../../api/config/types'
import type { CheatsheetExtension } from '../../components/editor-page/cheatsheet/cheatsheet-extension' import type { CheatsheetExtension } from '../../components/editor-page/cheatsheet/cheatsheet-extension'
import type { Linter } from '../../components/editor-page/editor-pane/linter/linter' import type { Linter } from '../../components/editor-page/editor-pane/linter/linter'
import type { MarkdownRendererExtension } from '../../components/markdown-renderer/extensions/base/markdown-renderer-extension' import type { MarkdownRendererExtension } from '../../components/markdown-renderer/extensions/base/markdown-renderer-extension'
import type { RendererType } from '../../components/render-page/window-post-message-communicator/rendering-message'
import type { CompletionSource } from '@codemirror/autocomplete' import type { CompletionSource } from '@codemirror/autocomplete'
import type { EventEmitter2 } from 'eventemitter2' import type { EventEmitter2 } from 'eventemitter2'
import type React from 'react' import type React from 'react'
@ -15,6 +16,7 @@ import { Fragment } from 'react'
export interface MarkdownRendererExtensionOptions { export interface MarkdownRendererExtensionOptions {
frontendConfig: FrontendConfig frontendConfig: FrontendConfig
eventEmitter: EventEmitter2 eventEmitter: EventEmitter2
rendererType: RendererType
} }
export abstract class AppExtension { export abstract class AppExtension {