application/components/content/content-meta-properties.js

import React from 'react';
import PropTypes from 'prop-types';
import MetaProperties from './../../metaproperties/meta-properties';
import BaseView from './../base-view';

class ContentMetaProperties extends BaseView {

    constructor(props) {
        super(props);
        this.displayName = 'ContentMetaProperties';

        this.state = {
            content: this.props.content,
            disabled: this.props.disabled,
            onChange: this.props.onChange
        }
    }

    componentWillReceiveProps(nextProps) {
        this.setState(nextProps);
    }

    onChange(prop, e) {
        var field = e.target.getAttribute('for');
        if (field) {
            this.state.onChange({
                value: e.target.value,
                field: field,
                name: field,
                type: prop.type
            });
        }

        return false;
    }


    render() {
        const forGroup = this.props.group ? this.props.group : 'content';
        let properties = [];
        MetaProperties.propertiesForGroup(forGroup).map((prop, i) => {

            /*
                properties have the following keys:
                type -> Component Type,
                field -> Meta field (e.g. 'subhead'),
                label -> Label field (e.g. 'Subhead')
             */
            let value = '';
            if (this.state.content.get('meta') && this.state.content.get('meta').get(prop.field)) {
                value = this.state.content.get('meta').get(prop.field).get('value');
            }
            properties.push(
                MetaProperties.componentForType(
                    prop.type,
                    {
                        key: i,
                        fullWidth: true,
                        disabled: this.state.disabled ? false : true,
                        onChange: this.onChange.bind(this, prop),
                        value: value,
                        htmlFor: prop.field,
                        name: prop.field,
                        floatingLabelText: prop.label
                    }
                )
            );


        });

        return <div>{properties}</div>;
    }
}

ContentMetaProperties.propTypes = {
    disabled: PropTypes.bool,
    onChange: PropTypes.func,
    content: PropTypes.object
};

export default ContentMetaProperties;