// Lib
import React, {Component} from 'react';
import SchemaField from "./FieldFactory";

class SchemaGroup extends Component {

    state = {
        group: null
    };

    createGroup() {

        const {name, uid, data, schema, t, /** @type {ContentStore} **/ contentStore} = this.props;

        let hasTrans = false;
        if(t) {
            // when no `t` (trans, translate; from i18n) has been passed
            hasTrans = true;
        }

        if(name && schema && uid) {
            /**
             * create context bases creators for nested usage
             * @type {{createGroup, createItem}}
             */
            let cntStor = contentStore.createGroup(uid);

            let Input = [];
            let Group = [];

            let hasSubGroup = false;

            if('object' === schema.type && 'undefined' === typeof schema.object) {
                // when current group is an native JSON-Schema object but doesn't has an `object`s name applied, it is a group and not a final input-group

                // current group will render with subgroups

                if('undefined' === typeof schema.properties) {
                    console.error('SchemaGroup, an schema object needs properties.');
                    return;
                }

                // build group out of `schema` and `data`
                for(let key in schema.properties) {
                    if(schema.properties.hasOwnProperty(key)) {
                        Group.push(<SchemaGroup key={name + '.' + key}
                                                uid={key}
                                                name={name + '.' + key}
                                                data={data[key]}
                                                schema={schema.properties[key]}
                                                t={t}
                                                contentStore={cntStor}
                        />);
                    }
                }

                // for this switch, it doesn't need to have build any valid group (no not-empty check), we need this value for translation
                hasSubGroup = true;
            } else {
                // current group is an input field = create input field group

                // new Field/Input
                if(schema.object) {
                    // when an `object` (string) is applied, overwrite the native JSON-Schema type with the object, contains a string like type
                    schema.type = schema.object;
                }
                delete schema.object;
                // todo: why did i use an array for Input? as it can only be one input per input group, more inputs in one would be handled from the input field handler (e.g. StringList)
                Input.push(<SchemaField key={name}
                                        name={name}
                                        uid={this.props.uid}
                                        schema={schema}
                                        data={data}
                                        contentStore={cntStor}
                />);
            }

            const InputComp = () => Input;
            const GroupComp = () => Group;

            this.setState({
                group: () => (
                    <div className={'schema-edit--group ' + (schema.type ? schema.type : '')}>
                        <p>{(
                            // build lbl, depending if the current one has subgroups OR only a normal group, to be able to use . as seperator/json format etc.
                            hasTrans ?
                                (hasSubGroup ? t('group--' + this.props.name) : t(this.props.name))
                                : this.props.name
                        )}</p>
                        {0 < Input.length ?
                            <div className='schema-edit--input'>
                                <InputComp/>
                            </div>
                            : ''}
                        {0 < Group.length ?
                            <div className='schema-edit--group-list'>
                                <GroupComp/>
                            </div>
                            : ''}
                    </div>
                )
            });
        }
    }

    componentDidUpdate(prevProps) {
        if(
            prevProps.cacheid !== this.props.cacheid ||
            prevProps.schema !== this.props.schema
        ) {
            this.setState({
                group: null
            });
            this.createGroup();
        }
    }

    componentDidMount() {
        this.createGroup();
    }

    render() {
        if(this.state.group) {
            return <this.state.group/>;
        } else {
            return null
        }
    }
}

export default SchemaGroup;