import * as Q from 'q' ; import * as React from 'react' ; import ReactDOM = require ( 'react-dom' ) ; import WidgetHelpers = require ( 'TFS/Dashboards/WidgetHelpers' ) ; import WidgetContracts = require ( 'TFS/Dashboards/WidgetContracts' ) ; import { AnalyticsWidgetSettings , WidgetSettingsHelper , areSettingsValid } from '../common/WidgetSettings' ; import { AnalyticsConfigComponent } from "./AnalyticsConfigComponent" ; /** Demonstrates a widget configuration which:
 * 1-Deserializes existing settings
 * 2-Renders config UI with those settings
 * 3-Notifies widget contract of changes in configuration
 */ class WidgetConfiguration { private widgetConfigurationContext : WidgetContracts . IWidgetConfigurationContext ; private settings : AnalyticsWidgetSettings ; public load ( widgetSettings , widgetConfigurationContext ) { this . widgetConfigurationContext = widgetConfigurationContext ; this . settings = WidgetSettingsHelper . Parse < AnalyticsWidgetSettings > ( widgetSettings . customSettings . data ) ; var $reactContainer = $ ( ".react-container" ) ; let container = $reactContainer . eq ( 0 ) . get ( ) [ 0 ] ; try { ReactDOM . render ( < AnalyticsConfigComponent initialConfiguration = { this . settings } onChange = { ( settings ) => { this . onChange ( settings ) ; } } />, container) as React.Component<any, any>; } catch ( e ) { return WidgetHelpers . WidgetStatusHelper . Failure ( e ) ; } VSS . resize ( ) ; return WidgetHelpers . WidgetStatusHelper . Success ( ) ; } public onSave ( ) { return WidgetHelpers . WidgetConfigurationSave . Valid ( this . getCustomSettings ( ) ) ; } public getCustomSettings ( ) { return { data : WidgetSettingsHelper . Serialize < AnalyticsWidgetSettings > ( this . settings ) } ; } private onChange ( settings ) { if ( this . settings && ( this . settings . fields . length != settings . fields . length ) ) { VSS . resize ( ) ; } this . settings = settings ; if ( areSettingsValid ( this . settings ) ) { var eventName = WidgetHelpers . WidgetEvent . ConfigurationChange ; var eventArgs = WidgetHelpers . WidgetEvent . Args ( this . getCustomSettings ( ) ) ; this . widgetConfigurationContext . notify ( eventName , eventArgs ) ; } } } VSS . register ( "AnalyticsExampleWidget.Configuration" , function ( ) { let widgetConfiguration = new WidgetConfiguration ( ) ; return widgetConfiguration ; } ) ;