import { Version } from '@microsoft/sp-core-library';
import { IPropertyPaneConfiguration, PropertyPaneDynamicField } from '@microsoft/sp-property-pane';
import { BaseClientSideWebPart, IWebPartPropertiesMetadata } from '@microsoft/sp-webpart-base';
import { escape } from '@microsoft/sp-lodash-subset';
import * as strings from 'DdTestWebPartStrings';
import { DynamicProperty } from '@microsoft/sp-component-base';

export interface IDdTestWebPartProps {
    foo: DynamicProperty<string>;
}

export default class DdTestWebPart extends BaseClientSideWebPart<IDdTestWebPartProps> {
    public render(): void {

        let value = "";
        if (this.properties && this.properties.foo) {
            value = this.properties.foo.tryGetValue();
        }

        this.domElement.innerHTML = `
      <div>
        ${escape(value)}
      </div>`;
    }

    protected get propertiesMetadata(): IWebPartPropertiesMetadata {
        return {
            'foo': {
                dynamicPropertyType: 'string'
            }
        };
    }

    protected get dataVersion(): Version {
        return Version.parse('1.0');
    }

    protected getPropertyPaneConfiguration(): IPropertyPaneConfiguration {
        return {
            pages: [
                {
                    header: { description: strings.PropertyPaneDescription },
                    groups: [{
                        groupName: strings.BasicGroupName,
                        groupFields: [PropertyPaneDynamicField('foo', { label: strings.DescriptionFieldLabel })
                        ]
                    }]
                }
            ]
        };
    }
}