Conditional next step isn't working properly

[yotamdahan]

Hey, I have tried to validate the step before moving to the next one. It's partially working.

This is my states validation

    const [isValid, setIsValid] = useState(true);
    const [errors, setErrors] = useState(false);
    const [name, setName] = useState("");
    const firstStep = () => {
        if(name === ""){
            setIsValid(false);
        }
        else{
            setIsValid(true);
        }
        console.log(isValid);
        if (!isValid) {
            setErrors(true);
        } else {
            setErrors(false);
        }
    };

And part of the return:

           <ProgressStep nextBtnText={i18n.t('next')} label="הארגון" onNext={firstStep} errors={errors}>
                <View style={[{ flex: 1, justifyContent: 'center', padding: 30 }]}>
                    <Text>שם העסק</Text>
                    <TextInput 
                        style={{ height: 40, borderColor: 'gray', borderWidth: 1, width: 200, textAlign: 'center' }}
                        onChangeText={text => setName(text)}
                        value={name} />
                </View>
            </ProgressStep>

Each time I continue to the next step and name state is empty the screen is moving forward to step 2 (which isn't suppose to happen because isValid suppose to be false), only when I return back to step 1 and try again I'm receiving isValid = false.

How can I solve that?

[yotamdahan]

apparently 2 states confuses the plugin, I solved it by using only error state

    const firstStep = () =>{
        if(name === ""){
            setErrors(true);
        }
        else{
            setErrors(false);
        }
    }