Fix #85: display array description

Author: bhch

src/components/index.js

@@ -2,7 +2,7 @@ import Button from './buttons';
 import {FormInput, FormCheckInput, FormRadioInput, FormSelectInput, FormFileInput,
     FormTextareaInput, FormDateTimeInput, FormMultiSelectInput} from './form';
 import AutoCompleteInput from './autocomplete';
-import {FormRow, FormGroup, FormRowControls, GroupTitle} from './containers';
+import {FormRow, FormGroup, FormRowControls, GroupTitle, GroupDescription} from './containers';
 import Loader from './loaders';
 import Icon from './icons';
 import FileUploader from './uploader';
@@ -12,7 +12,7 @@ export {
     FormInput, FormCheckInput, FormRadioInput, FormSelectInput, FormFileInput,
     FormTextareaInput, FormDateTimeInput, FormMultiSelectInput,
     AutoCompleteInput,
-    FormRow, FormGroup, FormRowControls, GroupTitle,
+    FormRow, FormGroup, FormRowControls, GroupTitle, GroupDescription,
     Loader,
     Icon,
     FileUploader,

src/ui.js

@@ -2,7 +2,7 @@ import React from 'react';
 import {getBlankData, findMatchingSubschemaIndex, dataObjectMatchesSchema,
     dataArrayMatchesSchema} from './data';
 import {Button, FormInput, FormCheckInput, FormRadioInput, FormSelectInput,
-    FormFileInput, FormRow, FormGroup, GroupTitle, FormRowControls, FormTextareaInput,
+    FormFileInput, FormRow, FormGroup, GroupTitle, GroupDescription, FormRowControls, FormTextareaInput,
     FormDateTimeInput, FormMultiSelectInput, FileUploader, AutoCompleteInput} from './components';
 import {getVerboseName, convertType, getCoordsFromName, getKeyword, normalizeKeyword,
     joinCoords, splitCoords, actualType, getSchemaType, isEqualset, isSubset} from './util';
@@ -326,6 +326,7 @@ export function getArrayFormRow(args) {
             groupError = [groupError];
 
         let groupTitle = schema.title ? <GroupTitle editable={args.editable} onEdit={args.onKeyEdit}>{schema.title}</GroupTitle> : null;
+        let groupDescription = schema.description ? <GroupDescription>{schema.description}</GroupDescription> : null;
 
         groups = (
             <div key={'group_' + name} className="rjf-form-group-wrapper">
@@ -337,6 +338,7 @@ export function getArrayFormRow(args) {
                 <div className="rjf-form-group">
                     <div className={level > 0 ? "rjf-form-group-inner" : ""}>
                         {groupTitle}
+                        {groupDescription}
                         {groupError && groupError.map((error, i) => <div className="rjf-error-text" key={i}>{error}</div>)}
                         {groups.map((i, index) => (
                             <div className="rjf-form-group-wrapper" key={'group_wrapper_' + name + '_' + index}>