React Hook "useCustomHook" is called conditionally. React Hooks must be called in the exact same order in every component render

We can’t call Hooks inside of conditionals, loops, or nested functions in order to ensure that Hooks are called in the same order each time a component renders. The order is important for how React associates Hook calls with components.

Resource: https://www.benmvp.com/blog/conditional-react-hooks/#:~:text=We%20can%27t%20call%20Hooks,associates%20Hook%20calls%20with%20components.

You can check this resource maybe it can be helpful

As per React documentation, you cannot call hooks conditionally.

Here is explained in depth why.

When the need to call a hook conditionally arises, you could opt for two soutions :

1. Either you call useDataForm and then you use contactForm only if dataValid is true

const contactForm = useDataForm(onSubmit, modelToForm(dataValid));
if (dataValid) {
    // do what you need to do with dataValid
}
// or 
return <Child data={dataValid ? contactForm : otherData} />

2. Either you move the hook in a separate component and render said component only if dataValid is true
3. Either, depending on the hook, you can pass the arguments conditionally. e.g. in your exemple:

const contactForm = useDataForm(onSubmit, dataValid   ? modelToForm(dataValid) : fallbackArg);