@@ -33,7 +33,6 @@ import { CollapseWrapper, DirectoryTreeStyle, Node } from "./styledComponents";
3333import { DataNode , EventDataNode } from "antd/es/tree" ;
3434import { isAggregationApp } from "util/appUtils" ;
3535import Modal from "antd/es/modal/Modal" ;
36- import copyToClipboard from "copy-to-clipboard" ;
3736
3837const CollapseTitleWrapper = styled . div `
3938 display: flex;
@@ -69,8 +68,22 @@ function getLen(config: string | boolean | number) {
6968return 0 ;
7069}
7170
71+ function safeStringify ( obj :any , space = 2 ) {
72+ const cache = new Set ( ) ;
73+ return JSON . stringify ( obj , ( key , value ) => {
74+ if ( typeof value === 'object' && value !== null ) {
75+ if ( cache . has ( value ) ) {
76+ return '[Circular]' ;
77+ }
78+ cache . add ( value ) ;
79+ }
80+ return value ;
81+ } , space ) ;
82+ }
83+
84+
7285function toDataView ( value :any , name :string , desc ?:ReactNode , modal ?:boolean ) {
73- const str = typeof value === "function" ?"Function" :safeJSONStringify ( value ) ;
86+ const str = typeof value === "function" ?"Function" :safeStringify ( value ) ;
7487const descRecord :Record < string , ReactNode > = { } ;
7588const shortenedString = modal === true ?( getLen ( str ) > 42 ?str . slice ( 0 , 42 ) + "..." :str ) :( getLen ( str ) > 20 ?str . slice ( 0 , 20 ) + "..." :str ) ;
7689descRecord [ name ] = desc ;
@@ -205,7 +218,7 @@ const CollapseView = React.memo(
205218</ CollapseTitleWrapper >
206219</ Tooltip >
207220{ Object . keys ( data ) . length > 0 &&
208- < CopyTextButton text = { JSON . stringify ( data ) } style = { { color :"#aaa" , marginRight :"8px" } } />
221+ < CopyTextButton text = { safeStringify ( data ) } style = { { color :"#aaa" , marginRight :"8px" } } />
209222}
210223</ div >
211224) ,
@@ -440,7 +453,7 @@ export const LeftContent = (props: LeftContentProps) => {
440453maskClosable = { true } // Prevent closing on background click
441454>
442455< div
443- style = { { whiteSpace :'pre-wrap ' , wordWrap :'break-word ' , maxHeight :"calc(100vh - 400px)" , overflow :"scroll" } }
456+ style = { { whiteSpace :'nowrap ' , wordWrap :'normal ' , maxHeight :"calc(100vh - 400px)" , overflow :"scroll" } }
444457onClick = { ( e ) => e . stopPropagation ( ) } // Prevent closing on clicking inside the modal
445458>
446459{ prepareData ( data . data , data . dataDesc ) }
