import * as React from "react" ; import { Observable } from "babylonjs/Misc/observable" ; import { PropertyChangedEvent } from "../../../propertyChangedEvent" ; import { LineContainerComponent } from "../../../../sharedUiComponents/lines/lineContainerComponent" ; import { LockObject } from "../../../../sharedUiComponents/tabs/propertyGrids/lockObject" ; import { GlobalState } from "../../../globalState" ; import { TextLineComponent } from "../../../../sharedUiComponents/lines/textLineComponent" ; import { IndentedTextLineComponent } from "../../../../sharedUiComponents/lines/indentedTextLineComponent" ; interface ICommonPropertyGridComponentProps { globalState : GlobalState ; host : { metadata : any ; } ; lockObject : LockObject ; onPropertyChangedObservable ? : Observable < PropertyChangedEvent > ; } export class CommonPropertyGridComponent extends React . Component < ICommonPropertyGridComponentProps > { constructor ( props ) { super ( props ) ; } renderLevel ( jsonObject ) { let components = [ ] ; for ( var data in jsonObject ) { let value = jsonObject [ data ] ; let type = Object . prototype . toString . call ( value ) ; switch ( type ) { case "[object String]" : components . push ( < TextLineComponent key = { data } label = { data } ignoreValue = { true } / > ) ; components . push ( < IndentedTextLineComponent key = { data + value } value = { value } / > ) ; break ; case "[object Array]" : components . push ( < TextLineComponent key = { data } label = { data } ignoreValue = { true } / > ) ; for ( var entry of value ) { components . push ( < IndentedTextLineComponent key = { data + entry } value = { entry } / > ) ; } break ; case "[object Object]" : components . push ( < TextLineComponent key = { data } label = { data } ignoreValue = { true } / > ) ; for ( var entryKey in value ) { components . push ( < TextLineComponent key = { data + entry } label = { entryKey } value = { value [ entryKey ] } additionalClass = "reduced-opacity" / > ) ; } break ; } } return components ; } render ( ) { if ( ! this . props . host . metadata ) { return null ; } if ( ! this . props . host . metadata . xmp ) { return null ; } return ( < div > < LineContainerComponent title = "XMP METADATA" selection = { this . props . globalState } > { this . renderLevel ( this . props . host . metadata . xmp ) } < /LineContainerComponent> < /div>); } }