fix(Schema): bug where i deleted schemaItem.row too soon

When fixing a previous bug that passed back the given `schemaItem.row`, i intro'd a bug where we actually deleted the row too soon. this commit fixes
qri-io · Feb 27, 2020 · d7f5dce · d7f5dce
1 parent c98b395
commit d7f5dce
Show file tree

Hide file tree

Showing 4 changed files with 12 additions and 9 deletions.
diff --git a/app/components/form/DynamicEditField.tsx b/app/components/form/DynamicEditField.tsx
@@ -37,6 +37,10 @@ const DynamicEditField: React.FunctionComponent<DynamicEditFieldProps> = ({
   const [ newValue, setNewValue ] = React.useState(value)
   const [ isValid, setIsValid ] = React.useState(true)
 
+  React.useEffect(() => {
+    if (value !== newValue) setNewValue(value)
+  }, [value])
+
   const commitEdit = (e: React.SyntheticEvent) => {
     // TODO (ramfox): for some reason, the only way I can get the actual updated
     // state value is by hacking into the `setNewValue` function, which passes
@@ -111,6 +115,7 @@ const DynamicEditField: React.FunctionComponent<DynamicEditFieldProps> = ({
   }, [focused])
 
   const handleChange = async (e: any) => {
+    if (!editable) return
     let value = e.target.innerHTML
     if (maxLength && value.length > maxLength) {
       return

diff --git a/app/components/item/SchemaItem.tsx b/app/components/item/SchemaItem.tsx
@@ -49,8 +49,6 @@ const SchemaItemProps: React.FunctionComponent<SchemaItemProps> = ({
         break
     }
 
-    delete d.row
-
     if (onChange) onChange(d, e)
   }
 
@@ -72,7 +70,7 @@ const SchemaItemProps: React.FunctionComponent<SchemaItemProps> = ({
           name='title'
           placeholder='title'
           value={data.title || ''}
-          onChange={onChange && editable ? handleDynamicEditChange : undefined}
+          onChange={handleDynamicEditChange}
           allowEmpty={false}
           large
           minWidth={100}
@@ -83,7 +81,7 @@ const SchemaItemProps: React.FunctionComponent<SchemaItemProps> = ({
       <td className='type-picker-cell'>
         <TypePicker
           name={data.row}
-          onPickType={onChange && editable ? handleTypePickerChange : undefined}
+          onPickType={handleTypePickerChange}
           type={data.type}
           expanded={expanded}
           editable={editable}
@@ -95,7 +93,7 @@ const SchemaItemProps: React.FunctionComponent<SchemaItemProps> = ({
           name='description'
           placeholder='description'
           value={data.description || ''}
-          onChange={onChange && editable ? handleDynamicEditChange : undefined}
+          onChange={handleDynamicEditChange}
           allowEmpty expanded={expanded}
           minWidth={100}
           editable={editable}
@@ -107,7 +105,7 @@ const SchemaItemProps: React.FunctionComponent<SchemaItemProps> = ({
           name='validation'
           placeholder='validation'
           value={data.validation || ''}
-          onChange={onChange && editable ? handleDynamicEditChange : undefined}
+          onChange={handleDynamicEditChange}
           allowEmpty expanded={expanded}
           minWidth={100}
           editable={editable}

diff --git a/app/components/structure/Schema.tsx b/app/components/structure/Schema.tsx
@@ -28,7 +28,9 @@ const Schema: React.FunctionComponent<SchemaProps> = ({
   const onChangeHandler = (schemaItem: SchemaItemType, e: React.ChangeEvent) => {
     const s = cloneDeep(data)
     // don't pass back 'row'
-    s.items.items[schemaItem.row] = { ...schemaItem }
+    const row = schemaItem.row
+    delete schemaItem.row
+    s.items.items[row] = { ...schemaItem }
     if (onChange) onChange(s, e)
   }
 

diff --git a/app/components/workbench/Workbench.tsx b/app/components/workbench/Workbench.tsx
@@ -227,8 +227,6 @@ class Workbench extends React.Component<WorkbenchProps, Status> {
     delete d[component]
     delete s[component]
 
-    console.log(d)
-    console.log(s)
     this.props.setMutationsDataset(d)
     this.props.setMutationsStatus(s)
   }