sort required field on top and default select to empty #58

medialab · Jun 25, 2019 · 3e2de1b · 3e2de1b
1 parent cddcac5
commit 3e2de1b
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 24 deletions.
diff --git a/importApp/src/components/FieldInput.js b/importApp/src/components/FieldInput.js
@@ -12,7 +12,6 @@ import {
   Control,
   Input,
   Help,
-  Select as SimpleSelect
 } from 'design-workshop'
 
 
@@ -37,7 +36,7 @@ class FieldInput extends React.Component {
 
     let options;
     if (fieldSchema.constraints && fieldSchema.constraints.enum) {
-      options = getEnumOptions(fieldSchema.constraints.enum, fieldSchema.constraints.required)
+      options = getEnumOptions(fieldSchema.constraints.enum)
     }
     return {
       fieldSchema,
@@ -165,15 +164,10 @@ class FieldInput extends React.Component {
     }
     else if (fieldSchema.constraints && fieldSchema.constraints.enum) {
       return (
-        <SimpleSelect value={value} onChange={this.handleChange}>
-          {
-            this.state.options.map((item, index) => {
-              return (
-                <option key={index} value={item.value}>{item.label}</option>
-              )
-            })
-          }
-        </SimpleSelect>
+        <Select isClearable={true}
+        value= {generateValue(value)}
+        options={this.state.options}
+        onChange={this.handleChange} />
       )
     }
     else {

diff --git a/importApp/src/components/ReferenceResourceForm.js b/importApp/src/components/ReferenceResourceForm.js
@@ -1,7 +1,7 @@
 import React from 'react';
 import {Table} from 'tableschema';
 
-import {keys, values, mapValues, capitalize, pick} from 'lodash';
+import {keys, values, mapValues, capitalize, trim, pick, sortBy} from 'lodash';
 
 import {
   Button,
@@ -31,10 +31,7 @@ class ReferenceResourceForm extends React.Component {
     const newResource = schema.fields.reduce((res, field) => {
       let value = '';
       let valid = true;
-      if (field.constraints && field.constraints.enum) {
-        const enumList = field.constraints.enum
-        value = enumList[0]
-      }
+
       if (field.constraints && field.constraints.required && !field.constraints.enum ) {
         valid = false
       }
@@ -248,7 +245,8 @@ class ReferenceResourceForm extends React.Component {
           <Column style={{height: '50vh', overflow:'auto'}}>
             <h3>New row to "{resourceDescriptor.name}" table</h3>
             {
-              schema.fields.map((field, index) => {
+              sortBy(schema.fields, (field) => field.constraints && field.constraints.required)
+              .map((field, index) => {
                 return (
                   <FieldInput 
                     key={index}

diff --git a/importApp/src/utils/formUtils.js b/importApp/src/utils/formUtils.js
@@ -1,18 +1,12 @@
 import {uniq} from 'lodash';
 
-export const getEnumOptions = (enumList, required=false) => {
+export const getEnumOptions = (enumList) => {
   const options = enumList.map((e) => {
     return {
       label: e,
       value: e
     }
   })
-  if (!required) {
-    options.unshift({
-      value: '',
-      label: 'none'
-    })
-  }
   return options
 }