{"size": 1546, "ext": "js", "max_stars_repo_path": "ui-todo-project-context/src/components/AddTodo.js", "max_stars_repo_name": "vasyl-007/ui-react-native", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "ui-todo-project-context/src/components/AddTodo.js", "max_issues_repo_name": "vasyl-007/ui-react-native", "max_issues_repo_issues_event_min_datetime": "2021-10-06T15:37:10.000Z", "max_issues_repo_issues_event_max_datetime": "2022-02-27T11:00:09.000Z", "max_forks_repo_path": "ui-todo-project-context/src/components/AddTodo.js", "max_forks_repo_name": "vasyl-007/ui-react-native", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": null, "max_issues_count": 5, "max_forks_count": null, "avg_line_length": 23.0746268657, "max_line_length": 69, "alphanum_fraction": 0.5834411384}
import React, { useState } from "react";
import {
  View,
  Button,
  TextInput,
  StyleSheet,
  Keyboard,
  Alert,
} from "react-native";
import { AntDesign } from "@expo/vector-icons";
import { THEME } from "../theme";

export const AddTodo = ({ onSubmit }) => {
  const [value, setValue] = useState("");
  const getValue = (text) => {
    setValue(text);
  };

  const pressHandler = () => {
    if (value.trim()) {
      // const datedAt = new Date().toDateString();
      onSubmit(value);
      setValue("");
      Keyboard.dismiss();
    } else {
      Alert.alert("Task can't be empty");
      Keyboard.dismiss();
    }
  };
  return (
    <View style={styles.block}>
      <TextInput
        style={styles.input}
        value={value}
        onChangeText={getValue}
        // onChangeText={(text) => setValue(text)}
        // onChangeText={setValue}
        placeholder="Enter new task..."
        autoCorrect={true}
        autoCapitalize="sentences"
        keyboardType="numbers-and-punctuation"
      />
      <AntDesign.Button onPress={pressHandler} name="plussquare">
        ADD TASK
      </AntDesign.Button>
      {/* <Button title=" Add new task" onPress={pressHandler} /> */}
    </View>
  );
};

const styles = StyleSheet.create({
  block: {
    flexDirection: "row",
    justifyContent: "space-between",
    alignItems: "center",
    marginBottom: 14,
  },
  input: {
    width: "60%",
    padding: 8,
    borderStyle: "solid",
    borderBottomWidth: 1,
    borderBottomColor: THEME.MAIN_COLOR,
    fontSize: 20,
  },
});
