How can you render html basic element ?

[Izocel]

Invariant Violation: View config getter callback for component input must be a function (received undefined). Make sure to start component names with a capital letter.

[Izocel]

import { APP_NAME } from "@env";
import { Text, View } from "react-native";
import { connect } from "react-redux";
import { setError } from "../reducers/ScreenNotificationReducer";
import { useNavigation } from "@react-navigation/native";
import { theme } from "../styles/theme";
import { Validators, FormGenerator } from "react-reactive-form";

const Login = (props) => {
  const navigation = useNavigation;

  handleReset = () => {
    this.loginForm.reset();
  };
  handleSubmit = (e) => {
    e.preventDefault();
    console.log("Form values", this.loginForm.value);
  };
  setForm = (form) => {
    this.loginForm = form;
    this.loginForm.meta = {
      handleReset: this.handleReset,
    };
  };

  return (
    <View style={styles.centered}>
      <Text>{APP_NAME}: This is the login view</Text>

      {RenderLoginForm()}
    </View>
  );
};

const RenderLoginForm = () => {
  return (
    <form onSubmit={this.handleSubmit}>
      <FormGenerator onMount={this.setForm} fieldConfig={fieldConfig} />
    </form>
  );
};

const TextInput = ({ handler, touched, hasError, meta }) => (
  <div>
    <input placeholder={`Enter ${meta.label}`} {...handler()} />
    <span>
      {touched && hasError("required") && `${meta.label} is required`}
    </span>
  </div>
);
// Checkbox component
const CheckBox = ({ handler }) => (
  <div>
    <input {...handler("checkbox")} />
  </div>
);

// Field config to configure form
const fieldConfig = {
  controls: {
    username: {
      options: {
        validators: Validators.required,
      },
      render: TextInput,
      meta: { label: "Username" },
    },
    password: {
      options: {
        validators: Validators.required,
      },
      render: TextInput,
      meta: { label: "Password" },
    },
    rememberMe: {
      render: CheckBox,
    },
    $field_0: {
      isStatic: false,
      render: ({ invalid, meta: { handleReset } }) => (
        <Vi>
          <button type="button" onClick={handleReset}>
            Reset
          </button>
          <button type="submit" disabled={invalid}>
            Submit
          </button>
        </Vi>
      ),
    },
  },
};

const mapDispatchToProps = {
  setError,
};

const styles = {
  ...theme,
};

export default connect(null, mapDispatchToProps)(Login);