import { observer } from "mobx-react" ; import * as React from "react" ; import { lazyInject } from "../../inversify.config" ; import SelectedElementService from "../../services/SelectedElementService" ; @ observer export default class SelectedElementInfo extends React . Component < Record < string , unknown > , any > { @ lazyInject ( "SelectedElementService" ) private readonly selectedElementService ! : SelectedElementService ; public render ( ) { const selectedElement = this . selectedElementService . getSelectedElement ( ) ; if ( selectedElement === null ) { return ( < div className = "selected-element-info" > < span className = "no-info" > Select an object to see the details here < /span> < /div>); } const classes = [ "selected-element-info" , selectedElement . isFile ( ) ? "leaf" : "node" ] ; return ( < div > < div className = { classes . join ( " " ) } > < span className = "element-name" > { selectedElement . name } < /span> { this . renderButtons ( selectedElement . isFile ( ) ) } < /div> < /div>); } private renderButtons ( isFile ) { if ( ! isFile ) { return null ; } return ( < div className = "info-buttons" > < button id = "open-file-button" className = "left" onClick = { ( ) => { this . openSourceCode ( ) ; } } > Open file < /button> < button id = "open-measures-button" className = "right" onClick = { ( ) => { this . openMeasures ( ) ; } } > Open measures < /button> < /div>); } private openSourceCode ( ) { const selectedElement = this . selectedElementService . getSelectedElement ( ) ; if ( selectedElement && selectedElement . key ) { this . open ( "/code" , selectedElement . key ) ; } } private openMeasures ( ) { const selectedElement = this . selectedElementService . getSelectedElement ( ) ; if ( selectedElement && selectedElement . key ) { this . open ( "/component_measures" , selectedElement . key ) ; } } private open ( newLocation , id ) { const baseUrl = ( window as any ) . baseUrl ; let result = "" ; if ( baseUrl ) { result = baseUrl ; } result = result + newLocation + "?id=" + id ; window . open ( result ) ; } }