return (
    <Modal animationType="slide" visible={false}>
      <View style={stylesDialog.dialogview}>
        <TextInput
          style={stylesDialog.dialogInput}
          placeholder="Name"
          value={inputVal}
          onChange={(event) => {
            state.inputVal = { inputVal: event.target.value.trim() };
          }}
        ></TextInput>
        <View style={{ display: "flex", flexDirection: "row", width: "100%" }}>
          <TouchableHighlight style={{ width: "47%" }}>
            <View style={stylesDialog.dialogDismiss}>
              <Text style={{ textAlign: "center", color: "#4781cc" }}>
                Cancel
              </Text>
            </View>
          </TouchableHighlight>
          <TouchableHighlight style={{ width: "53%" }}>
            <View style={stylesDialog.dialogBtn}>
              <Text style={{ textAlign: "center", color: "#fff" }}>
                Add Habit
              </Text>
            </View>
          </TouchableHighlight>
        </View>
      </View>
    </Modal>
  );
};