From 3e2de1b626cda927367b3b76424f4ac93be68dd7 Mon Sep 17 00:00:00 2001
From: mydu <dumengying1989@gmail.com>
Date: Tue, 25 Jun 2019 17:21:12 +0200
Subject: [PATCH] sort required field on top and default select to empty #58

---
 importApp/src/components/FieldInput.js           | 16 +++++-----------
 .../src/components/ReferenceResourceForm.js      | 10 ++++------
 importApp/src/utils/formUtils.js                 |  8 +-------
 3 files changed, 10 insertions(+), 24 deletions(-)

diff --git a/importApp/src/components/FieldInput.js b/importApp/src/components/FieldInput.js
index 9306f2e8..b51ceb2d 100644
--- 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
index 05f96d76..8fd0306b 100644
--- 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
index 82cd0505..60f59ef2 100644
--- 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
 }