import React from 'react' ; import JSONTree from 'react-json-tree' ; import { useAppSelector } from '../../state-management/hooks' ; const Tree = ( ) => { const snapshotHistory = useAppSelector ( state => state . snapshot . snapshotHistory ) ; const renderIndex = useAppSelector ( state => state . snapshot . renderIndex ) ; const filteredCurSnap = snapshotHistory [ renderIndex ] . filteredSnapshot ; return ( < div className = "Tree" > { filteredCurSnap && ( < JSONTree data = { filteredCurSnap } theme = { { tree : ( ) => ( { className : 'json-tree' } ) } } shouldExpandNode = { ( ) => true } labelRenderer = { raw => typeof raw [ 0 ] !== 'number' ? ( < span style = { { fontSize : '14px' } } > { raw [ 0 ] } < /span>) : null}/ > ) } < /div>); } ; export default Tree ;