Working on the listFor display

get-focus · Nov 7, 2016 · 5396a73 · 5396a73
1 parent e2c6637
commit 5396a73
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 11 deletions.
diff --git a/src/behaviours/field.js b/src/behaviours/field.js
@@ -51,12 +51,13 @@ const fieldForBuilder = (props, textOnly = false, multiple = false, list = false
         if (get(definitions, `${entityPath}.${propertyName}`).validateOnBlur !== false) onInputBlur(propertyName, entityPath, rawInputValue);
         if (userDefinedOnBlur) userDefinedOnBlur();
     };
-    const fieldForLine = list ? fieldForListBuilder(entityPath, propertyName, false, options.textOnly)(props): {};
-    const selectForLine = list ? fieldForListBuilder(entityPath, propertyName, true, options.textOnly)(props): {};
-    const textForLine = list ? fieldForListBuilder(entityPath, propertyName, false, options.textOnly)(props): {};
+    const fieldForLine = list ? fieldForListBuilder(entityPath, propertyName, false, false, options.displayLabel, options.isRaw)(props): {};
+    const selectForLine = list ? fieldForListBuilder(entityPath, propertyName, true, false)(props): {};
+    const textForLine = list ? fieldForListBuilder(entityPath, propertyName, false, true)(props): {};
 
     const finalEditing = options.editing !== undefined ? options.editing : editing;
     return <FieldComponent  {...field}
+              displayLabel={options.displayLabel}
               fieldForLine={fieldForLine}
               textForLine={textForLine}
               selectForLine={selectForLine}
@@ -72,7 +73,7 @@ const fieldForBuilder = (props, textOnly = false, multiple = false, list = false
 }
 
 
-const fieldForListBuilder = (entityPathList, propertyNameList, multiple, textOnly) => {
+const fieldForListBuilder = (entityPathList, propertyNameList, multiple=false, textOnly=false, displayLabel, isRaw) => {
   const fieldForLineBuilder = (connectedComponentProps) => (propertyName, {FieldComponent = DefaultFieldComponent, entityPath, onBlur: userDefinedOnBlur,onChange: userDefinedOnChange,  ...options} = {}, index) => {
       const {fields, definitions, domains, onInputChange, onInputBlur, entityPathArray, editing, onInputBlurList} = connectedComponentProps;
       const {onChange: optionsOnChange, ...otherOptions} = options;
@@ -97,6 +98,8 @@ const fieldForListBuilder = (entityPathList, propertyNameList, multiple, textOnl
       }
       const fieldError = fieldTab.error && fieldTab.error[index] ? fieldTab.error[index][propertyName] : undefined;
       return <FieldComponent {...field}
+                displayLabel={displayLabel}
+                isRaw={isRaw}
                 error={fieldError}
                 textOnly={textOnly}
                 editing={editing}

diff --git a/src/components/field.js b/src/components/field.js
@@ -8,11 +8,13 @@ import DefaultListComponent from './list';
 import DefaultTextComponent from './text';
 import DefaultSelectDisplayComponent from './select-display';
 
-const FieldLabelValueComponent = ({editing, isRequired, label, name, valid, ValueComponent}) => (
+const FieldLabelValueComponent = ({editing, isRequired, label, name, valid, ValueComponent, displayLabel, isRaw}) => (
     <div data-focus='field' className='mdl-grid' data-mode={editing ? 'edit' : 'consult'} data-required={isRequired} data-valid={valid}>
-        <div data-focus='field-label-container' className='mdl-cell mdl-cell--top mdl-cell--4-col'>
-            <Label name={name} text={label} />
-        </div>
+        {(displayLabel || displayLabel === undefined) &&
+            <div data-focus='field-label-container' className='mdl-cell mdl-cell--top mdl-cell--4-col' style={isRaw ? {width: 'initial'} : {}}>
+                <Label name={name} text={label} />
+            </div>
+        }
         <div data-focus='field-value-container' className='mdl-cell mdl-cell--top mdl-cell--8-col'>
             {ValueComponent}
             {editing && valid && <i className="material-icons">check</i>}
@@ -36,13 +38,15 @@ class Field extends PureComponent {
         const renderConsult = () => list ?  <ListComponent fieldForLine={fieldForLine} values={otherProps.formattedInputValue} {...otherProps}/> : (multiple ? <SelectComponentDisplay {...otherProps} /> : <DisplayComponent  {...otherProps} />);
         const renderEdit = () => list ? <ListComponent fieldForLine={fieldForLine} values={otherProps.formattedInputValue} {...otherProps}/> : (multiple ? <SmartSelectComponent SelectComponent={SelectComponent} {...otherProps}/> : <InputComponent {...otherProps}/>);
         const ValueComponent = otherProps.editing ? renderEdit() : renderConsult();
-        return textOnly ? ValueComponent : <FieldLabelValueComponent ValueComponent={ValueComponent} {...otherProps} />
-    }
+        return textOnly ? ValueComponent : <FieldLabelValueComponent ValueComponent={ValueComponent} displayLabel={otherProps.displayLabel} isRaw={otherProps.isRaw} {...otherProps} />
+}
 }
 Field.displayName = 'Field';
 Field.propTypes = {
     error: PropTypes.string,
     name: PropTypes.string.isRequired,
-    multiple: PropTypes.bool
+    multiple: PropTypes.bool,
+    displaLabel: PropTypes.bool,
+    isRaw: PropTypes.bool
 };
 export default Field;