|
@@ -10,11 +10,9 @@ import { debounce } from 'throttle-debounce';
|
|
|
import NotAvailableForGuest from './NotAvailableForGuest';
|
|
import NotAvailableForGuest from './NotAvailableForGuest';
|
|
|
|
|
|
|
|
|
|
|
|
|
-declare let window: {
|
|
|
|
|
- globalEmitter: EventEmitter,
|
|
|
|
|
- GraphViewer: {
|
|
|
|
|
- createViewerForElement: (Element) => void,
|
|
|
|
|
- };
|
|
|
|
|
|
|
+declare const globalEmitter: EventEmitter;
|
|
|
|
|
+declare const GraphViewer: {
|
|
|
|
|
+ createViewerForElement: (Element) => void,
|
|
|
};
|
|
};
|
|
|
|
|
|
|
|
type Props = {
|
|
type Props = {
|
|
@@ -35,7 +33,7 @@ const Drawio = (props: Props): JSX.Element => {
|
|
|
|
|
|
|
|
const editButtonClickHandler = useCallback(() => {
|
|
const editButtonClickHandler = useCallback(() => {
|
|
|
const { beginLineNumber, endLineNumber } = rangeLineNumberOfMarkdown;
|
|
const { beginLineNumber, endLineNumber } = rangeLineNumberOfMarkdown;
|
|
|
- window.globalEmitter.emit('launchDrawioModal', beginLineNumber, endLineNumber);
|
|
|
|
|
|
|
+ globalEmitter.emit('launchDrawioModal', beginLineNumber, endLineNumber);
|
|
|
}, [rangeLineNumberOfMarkdown]);
|
|
}, [rangeLineNumberOfMarkdown]);
|
|
|
|
|
|
|
|
const renderDrawio = useCallback(() => {
|
|
const renderDrawio = useCallback(() => {
|
|
@@ -50,21 +48,20 @@ const Drawio = (props: Props): JSX.Element => {
|
|
|
|
|
|
|
|
if (div != null) {
|
|
if (div != null) {
|
|
|
div.innerHTML = '';
|
|
div.innerHTML = '';
|
|
|
- window.GraphViewer.createViewerForElement(div);
|
|
|
|
|
|
|
+ GraphViewer.createViewerForElement(div);
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
}, []);
|
|
}, []);
|
|
|
|
|
|
|
|
const renderDrawioWithDebounce = useMemo(() => debounce(200, renderDrawio), [renderDrawio]);
|
|
const renderDrawioWithDebounce = useMemo(() => debounce(200, renderDrawio), [renderDrawio]);
|
|
|
|
|
|
|
|
- const { GraphViewer } = window;
|
|
|
|
|
useEffect(() => {
|
|
useEffect(() => {
|
|
|
if (GraphViewer == null) {
|
|
if (GraphViewer == null) {
|
|
|
return;
|
|
return;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
renderDrawioWithDebounce();
|
|
renderDrawioWithDebounce();
|
|
|
- }, [GraphViewer, renderDrawioWithDebounce]);
|
|
|
|
|
|
|
+ }, [renderDrawioWithDebounce]);
|
|
|
|
|
|
|
|
return (
|
|
return (
|
|
|
<div className="editable-with-drawio position-relative">
|
|
<div className="editable-with-drawio position-relative">
|