mirror of
https://github.com/hedgedoc/hedgedoc.git
synced 2025-05-23 19:47:03 -04:00
refactor: extract height monitor hook
Signed-off-by: Tilman Vatteroth <git@tilmanvatteroth.de>
This commit is contained in:
parent
21b2fb042c
commit
71e5d00f55
3 changed files with 41 additions and 14 deletions
|
@ -6,10 +6,10 @@
|
|||
import { cypressId } from '../../../../utils/cypress-attribute'
|
||||
import { useMarkdownExtensions } from '../../../markdown-renderer/hooks/use-markdown-extensions'
|
||||
import { MarkdownToReact } from '../../../markdown-renderer/markdown-to-react/markdown-to-react'
|
||||
import { useOnHeightChange } from '../../hooks/use-on-height-change'
|
||||
import { RendererType } from '../../window-post-message-communicator/rendering-message'
|
||||
import type { CommonMarkdownRendererProps, HeightChangeRendererProps } from '../common-markdown-renderer-props'
|
||||
import useResizeObserver from '@react-hook/resize-observer'
|
||||
import React, { useEffect, useRef, useState } from 'react'
|
||||
import React, { useRef } from 'react'
|
||||
|
||||
export type SimpleMarkdownRendererProps = CommonMarkdownRendererProps & HeightChangeRendererProps
|
||||
|
||||
|
@ -28,11 +28,7 @@ export const SimpleMarkdownRenderer: React.FC<SimpleMarkdownRendererProps> = ({
|
|||
newLinesAreBreaks
|
||||
}) => {
|
||||
const rendererRef = useRef<HTMLDivElement | null>(null)
|
||||
const [rendererSize, setRendererSize] = useState<DOMRectReadOnly>()
|
||||
useResizeObserver(rendererRef.current, (entry) => {
|
||||
setRendererSize(entry.contentRect)
|
||||
})
|
||||
useEffect(() => onHeightChange?.((rendererSize?.height ?? 0) + 1), [rendererSize, onHeightChange])
|
||||
useOnHeightChange(rendererRef, onHeightChange)
|
||||
const extensions = useMarkdownExtensions(baseUrl, RendererType.SIMPLE, [])
|
||||
|
||||
return (
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue