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

14
src/components/markdown-renderer/replace-components/abc/abc-frame.tsx
View file

@ -1,19 +1,21 @@
import React, { useEffect, useRef } from 'react'
import { renderAbc } from 'abcjs'
export interface AbcFrameProps {
code: string
}
export const AbcFrame: React.FC<AbcFrameProps> = ({ code }) => {
const container = useRef<HTMLDivElement>(null)
useEffect(() => {
if (container.current) {
renderAbc(container.current, code)
if (!container.current) {
return
}
const actualContainer = container.current
import(/* webpackChunkName: "abc.js" */ 'abcjs').then((imp) => {
imp.renderAbc(actualContainer, code)
}).catch(() => { console.error('error while loading abcjs') })
}, [code])
return (
<div ref={container} className={'bg-white text-center'}/>
)
return <div ref={container} className={'bg-white text-center'}/>
}