Get rules from an input

[blugnomeXD]

Is there a way to obtain the rules validations that an input has? I need to know within the input if I am passing a maxLength validation and the number. But I don't see a way of how to do it. I'll provide a small piece of example code."

If you provide the small piece of example code, I'd be happy to assist further! Im using React-Admin also.

Rendering component...

  <TextInput
        fullWidth
        label="Title"
        source="title"
        validate={[required(),maxLength(250)}
      />

Input code

import { TextInput as RaTextInput } from "react-admin";

function TextInput(props) {
  const {
    InputProps = {},
    ...rest
  } =props;

  return (
    <RaTextInput
        ...InputProps,
      }
      {...rest}
    />
  );
}

export default TextInput;

[sujinleeme]

You can provide validation functions or array of functions. The usage is described well in this doc.

You can find the live code here.

import React from "react";
import Card from "@material-ui/core/Card";
import { SimpleForm, TextInput } from "react-admin";

const required =
  (message = "Required") =>
  (value) =>
    value ? undefined : message;
const minLength =
  (min, message = "Too short") =>
  (value) =>
    value && value.length < min ? message : undefined;
const maxLength =
  (max, message = "Too big") =>
  (value) =>
    value && value.length > max ? message : undefined;
const number =
  (message = "Must be a number") =>
  (value) =>
    value && isNaN(Number(value)) ? message : undefined;

const validateAmount = [required(), number(), minLength(3), maxLength(5)];

export default () => (
  <SimpleForm>
    <TextInput label="Amount" source="amount" validate={validateAmount} />
  </SimpleForm>
);

[blugnomeXD]

Perhaps I have explained myself incorrectly. What I need to know are the validations that the input has, but I need to know it from the TextInput component that I previously placed, so that I can paint another component depending on whether it has that validation or not.
I'm not sure if that could be done with react hook form.

[Moshyfawn]

Would you mind creating a minimal sandbox to show what you're after?

[sujinleeme]

@blugnomeXD
You can access any field of errors using useFormContext or useFormState if you provide the FormContext from react-admin.

Case: The amount field is disabled when the name field is invalid.
Codesandbox

import { useFormState } from "react-hook-form";

const AmountInput = () => {
  const { errors } = useFormState();
  const hasNameError = !!errors?.name?.message;
  return (
    <TextInput
      disabled={hasNameError}
      label="Amount"
      source="amount"
      validate={validateAmount}
    />
  );
};
...

export const Dashboard = () => (
    <SimpleForm>
      <NameInput />
      <AmountInput />
    </SimpleForm>
);