fix: [code-421]: addressed tans comment - p2

This commit is contained in:
calvin 2023-06-02 17:11:01 -06:00
parent b1d65bb27a
commit 7a73d096b7

View File

@ -1,5 +1,5 @@
import { useHistory } from 'react-router-dom' import { useHistory } from 'react-router-dom'
import React, { useCallback, useMemo, useState } from 'react' import React, { useCallback, useMemo, useRef, useState } from 'react'
import { Container } from '@harness/uicore' import { Container } from '@harness/uicore'
import cx from 'classnames' import cx from 'classnames'
import MarkdownPreview from '@uiw/react-markdown-preview' import MarkdownPreview from '@uiw/react-markdown-preview'
@ -21,14 +21,17 @@ export function MarkdownViewer({ source, className, maxHeight }: MarkdownViewerP
const [zoomLevel, setZoomLevel] = useState(INITIAL_ZOOM_LEVEL) const [zoomLevel, setZoomLevel] = useState(INITIAL_ZOOM_LEVEL)
const [imgEvent, setImageEvent] = useState<string[]>([]) const [imgEvent, setImageEvent] = useState<string[]>([])
const refRootHref = useMemo(() => document.getElementById('repository-ref-root')?.getAttribute('href'), []) const refRootHref = useMemo(() => document.getElementById('repository-ref-root')?.getAttribute('href'), [])
const ref = useRef<HTMLDivElement>()
const interceptClickEventOnViewerContainer = useCallback( const interceptClickEventOnViewerContainer = useCallback(
event => { event => {
const imgTags = document.querySelectorAll('img'); const imgTags = ref?.current?.querySelectorAll('img');
const { target } = event const { target } = event
const imageArray= Array.from(imgTags) const imageArray= imgTags&&Array.from(imgTags)
const imageStringArray= imageArray.filter(object=>object.src && !object.className).map(img=>img.src) const imageStringArray= imageArray&& imageArray.filter(object=>object.src && !object.className).map(img=>img.src)
setImageEvent(imageStringArray) if (imageStringArray){
setImageEvent(imageStringArray)
}
if (target?.tagName?.toLowerCase() === 'a') { if (target?.tagName?.toLowerCase() === 'a') {
const href = target.getAttribute('href') const href = target.getAttribute('href')
@ -64,7 +67,9 @@ export function MarkdownViewer({ source, className, maxHeight }: MarkdownViewerP
<Container <Container
className={cx(css.main, className, { [css.withMaxHeight]: maxHeight && maxHeight > 0 })} className={cx(css.main, className, { [css.withMaxHeight]: maxHeight && maxHeight > 0 })}
onClick={interceptClickEventOnViewerContainer} onClick={interceptClickEventOnViewerContainer}
style={{ maxHeight: maxHeight }}> style={{ maxHeight: maxHeight }}
ref={ref}
>
<MarkdownPreview <MarkdownPreview
source={source} source={source}
skipHtml={true} skipHtml={true}