Some code improvements

Author: bhch

src/components/buttons.js

@@ -0,0 +1,15 @@
+export default function Button({className, ...props}) {
+    if (!className)
+        className = '';
+
+    className = 'rjf-' + className + '-button';
+    return (
+        <button 
+            className={className}
+            type="button"
+            {...props}
+        >
+            {props.children}
+        </button>
+    );
+}

src/components/containers.js

@@ -0,0 +1,57 @@
+import Button from './buttons';
+
+
+export function GroupTitle(props) {
+    if (!props.children)
+        return null;
+
+    return (
+        <div className="rjf-form-group-title">{props.children}</div>
+    );
+}
+
+
+export function FormRow(props) {
+    return (
+        <div className="rjf-form-row">
+            {props.onRemove &&
+                <Button 
+                    className="remove"
+                    onClick={(e) => props.onRemove(name)}
+                    title="Remove"
+                >
+                    &times;
+                </Button>
+            }
+            <div className="rjf-form-row-inner">
+                {props.children}
+            </div>
+        </div>
+    );
+}
+
+
+export function FormGroup(props) {
+    let innerClassName = props.level === 0 && !React.Children.count(props.children) 
+        ? "" 
+        : "rjf-form-group-inner";
+
+    return (
+        <div className="rjf-form-group">
+            {props.level === 0 && <GroupTitle>{props.schema.title}</GroupTitle>}
+            <div className={innerClassName}>
+                {props.level > 0 && <GroupTitle>{props.schema.title}</GroupTitle>}
+                {props.children}
+                {props.addable && 
+                <Button
+                    className="add"
+                    onClick={(e) => props.onAdd()}
+                    title="Add new"
+                >
+                    Add more
+                </Button>
+                }
+            </div>
+        </div>
+    );
+}

src/components/form.js

@@ -0,0 +1,39 @@
+export function FormInput({label, help_text, error, ...props}) {
+
+    if (props.type === 'string')
+        props.type = 'text'
+
+    return (
+        <div>
+            {label && <label>{label}</label>}
+            <input {...props} />
+        </div>
+    );
+}
+
+
+export function CheckInput({label, help_text, error, value, ...props}) {
+
+    if (!label)
+        label = props.name.toUpperCase();
+
+    if (props.type === 'bool')
+        props.type = 'checkbox';
+
+    if (props.checked === undefined)
+        props.checked = value;
+
+    if (props.checked === '')
+        props.checked = false
+
+    return (
+        <div>
+            <label><input {...props} /> {label}</label>
+        </div>
+    );
+}
+
+
+export function FileInput(props) {
+    return <FormInput {...props} />
+}

src/components/index.js

@@ -0,0 +1,9 @@
+import Button from './buttons';
+import {FormInput, CheckInput, FileInput} from './form';
+import {FormRow, FormGroup} from './containers';
+
+export {
+    Button,
+    FormInput, CheckInput, FileInput,
+    FormRow, FormGroup
+};

src/data.js

@@ -0,0 +1,77 @@
+export function getBlankObject(schema) {
+    let keys = {};
+
+    for (let key in schema.keys) {
+        let value = schema.keys[key];
+        let type = value.type;
+
+        if (type === 'string')
+            keys[key] = ''; 
+        else if (type === 'array')
+            keys[key] = getBlankArray(value);
+        else if (type === 'object')
+            keys[key] = getBlankObject(value);
+    }
+
+    return keys;
+}
+
+
+export function getBlankArray(schema) {
+    let items = [];
+    let type = schema.items.type;
+
+    if (type === 'string')
+        items.push('');
+    else if (type === 'array')
+        items.push(getBlankArray(schema.items))
+    else if (type === 'object')
+        items.push(getBlankObject(schema.items));
+
+    return items;
+}
+
+
+export function getBlankData(schema) {
+    if (schema.type === 'array') {
+        return getBlankArray(schema);
+    }
+    else if (schema.type === 'object') {
+        return getBlankObject(schema);
+    } else if (schema.type === 'string') {
+        return '';
+    }
+}
+
+
+export function getBlankItem(schema) {
+    let dataObject = {};
+
+    for (let key in schema.fields) {
+        if (!schema.fields.hasOwnProperty(key))
+            continue;
+
+        let item = schema.fields[key];
+
+        dataObject[key] = '';
+    }
+
+    return dataObject;
+}
+
+
+export function getSyncedData(data, schema) {
+    // adds those keys to data which are in schema but not in data
+
+    let blankItem = getBlankItem(schema);
+
+    if (schema.type === 'object') {
+        return {...blankItem, ...data};
+    } else if (schema.type === 'array') {
+        for (let i = 0; i < data.length; i++) {
+            data[i] = {...blankItem, ...data[i]};
+        }
+    }
+
+    return data;
+}