mirrors/hedgedoc
1
0
Fork 0
mirror of https://github.com/hedgedoc/hedgedoc.git synced 2025-05-14 15:14:56 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

Feature/lazy load components (#590)

Browse source
This commit is contained in:
mrdrogdrog 2020-09-26 09:54:17 +02:00 • committed by GitHub
parent 9c38655a92
commit 101292da92
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
46 changed files with 261 additions and 248 deletions
Download patch file Download diff file Expand all files Collapse all files

18
src/components/markdown-renderer/replace-components/markmap/markmap-frame.tsx
View file

@ -1,5 +1,3 @@
import { transform } from 'markmap-lib/dist/transform'
import { Markmap } from 'markmap-lib/dist/view'
import React, { useEffect, useRef } from 'react'
export interface MarkmapFrameProps {
@ -13,12 +11,16 @@ export const MarkmapFrame: React.FC<MarkmapFrameProps> = ({ code }) => {
if (!diagramContainer.current) {
return
}
const svg: SVGSVGElement = document.createElementNS('http://www.w3.org/2000/svg', 'svg')
svg.setAttribute('width', '100%')
diagramContainer.current.querySelectorAll('svg').forEach(child => child.remove())
diagramContainer.current.appendChild(svg)
const data = transform(code)
Markmap.create(svg, {}, data)
const actualContainer = diagramContainer.current
Promise.all([import(/* webpackChunkName: "markmap" */ 'markmap-lib/dist/transform'), import(/* webpackChunkName: "markmap" */ 'markmap-lib/dist/view')])
.then(([transform, view]) => {
const svg: SVGSVGElement = document.createElementNS('http://www.w3.org/2000/svg', 'svg')
svg.setAttribute('width', '100%')
actualContainer.querySelectorAll('svg').forEach(child => child.remove())
actualContainer.appendChild(svg)
const data = transform.transform(code)
view.Markmap.create(svg, {}, data)
}).catch(() => { console.error('error while loading markmap') })
}, [code])
return <div className={'text-center'} ref={diagramContainer}/>