src/components/Form/field-deditor.jsx

@@ -1,163 +0,0 @@
-import React, {useEffect, useRef, useState} from 'react';
-import TextField from 'react-native-material-textfield/src/components/field';
-import {StyleSheet} from 'react-native';
-import {Picker, Text, View} from 'native-base';
-import IconedButton from '../view/iconed-button.jsx';
-import {POS_PICKER} from '../../constants/component-types';
-
-const FieldEditor = props => {
-  const [data, setData] = useState(props.data);
-  const [values, setValues] = useState(props.data.values);
-  const [editing, setEditing] = useState(false);
-  const [selectedValue, setSelectedValue] = useState(
-    props.data.values[props.id] || props.data.values[0],
-  );
-  const [userText, setUserText] = useState(
-    props.data.values[props.id] || props.data.values[0],
-  );
-  const [valuesUpdated, setValuesUpdated] = useState(false);
-  const input = useRef();
-  useEffect(() => {
-    // console.log(userText)
-    //   console.log("SELECTED", selectedValue)
-    if (props.hasChanged) {
-      // console.log("HAS CHANGED")
-      props.hasChanged(selectedValue);
-    }
-    if (props.type === POS_PICKER) {
-      console.log(userText);
-    }
-  });
-  useEffect(() => {
-    if (props.data.values.length === values.length) {
-      setData(props.data);
-      setValues(props.data.values);
-    }
-  }, [props.data.values]);
-
-  const selectValue = selected => {
-    setSelectedValue(selected);
-    if (props.type === POS_PICKER) {
-      values.forEach((value, id) => {
-        if (value === selected) {
-          console.warn(id);
-          props.onSelect(id);
-        }
-      });
-    }
-  };
-  const typing = text => {
-    setUserText(text);
-  };
-  const select = value => {
-    setUserText(value);
-    selectValue(value);
-  };
-  const confirmTyped = () => {
-    let newValues = new Set(values);
-    const valuesArray = Array.from(newValues.add(userText));
-    setValues(valuesArray);
-    setData({...data, values: valuesArray});
-    setEditing(!editing);
-    if (valuesArray.length !== values.length) {
-      setValuesUpdated(true);
-    }
-  };
-
-  useEffect(() => {
-    if (valuesUpdated) {
-      setSelectedValue(values[values.length - 1]);
-      setUserText(values[values.length - 1]);
-      setValuesUpdated(false);
-    }
-    setValuesUpdated(false);
-  }, [valuesUpdated]);
-  const styles = StyleSheet.create({
-    wrapper: {},
-    inner: {
-      display: 'flex',
-      justifyContent: 'space-between',
-      flexDirection: 'row',
-      alignItems: 'center',
-      alignContent: 'center',
-    },
-    row: {
-      display: 'flex',
-      flexDirection: 'row',
-      justifyContent: 'space-between',
-      width: 90,
-    },
-    button: {
-      width: 40,
-      height: 40,
-      display: 'flex',
-      justifyContent: 'center',
-      alignItems: 'center',
-    },
-    tfWrapper: {
-      width: editing ? '75%' : '84%',
-    },
-    pickerLabel: {
-      color: '#00000050',
-      fontSize: 12,
-      marginLeft: 2,
-    },
-    hr: {
-      height: 1,
-      width: '100%',
-      backgroundColor: '#00000070',
-    },
-  });
-
-  return (
-    <View style={styles.wrapper}>
-      <View style={styles.inner}>
-        <View style={styles.tfWrapper}>
-          {editing ? (
-            <TextField
-              lineType={'none'}
-              multiline={true}
-              label={props.data.label}
-              value={userText}
-              editable={true}
-              ref={input}
-              onChangeText={text => typing(text)}
-            />
-          ) : (
-            <View>
-              <Text style={styles.pickerLabel}>{props.data.label}</Text>
-              <Picker
-                selectedValue={selectedValue}
-                onValueChange={value => select(value)}>
-                {values.map((value, id) => {
-                  return <Picker.Item value={value} label={value} key={id} />;
-                })}
-              </Picker>
-            </View>
-          )}
-        </View>
-        {editing ? (
-          <View style={styles.row}>
-            <IconedButton
-              icon="caret-down"
-              onPress={() => {
-                setEditing(!editing);
-                setUserText(selectedValue);
-              }}
-            />
-            <IconedButton icon="check" onPress={confirmTyped} />
-          </View>
-        ) : (
-          <IconedButton
-            icon="pen"
-            onPress={() => {
-              setEditing(!editing);
-            }}
-          />
-        )}
-      </View>
-      <View style={styles.hr} />
-    </View>
-  );
-};
-export default FieldEditor;