const SigninForm = ({ loading }) => { const { errors, touched } = useFormikContext(); return ( <FormWrapper> <InputWrapper error={errors.email && touched.email}> <label htmlFor="email">Email</label> <Field name="email" id="email" disabled={loading} /> {errors.email && touched.email ? ( <span className="">{errors.email}</span> ) : null} </InputWrapper> <InputWrapper error={errors.password && touched.password}> <label htmlFor="password">Password</label> <Field name="password" id="password" type="password" disabled={loading} /> {errors.password && touched.password ? ( <span>{errors.password}</span> ) : null} </InputWrapper> <SubmitButton loading={loading} /> </FormWrapper> ); }
{Object.keys(errors).length > 0 && ( <Alert message={errors.email || errors.password || errors.auth} type="error" showIcon
<input type="email" name="email" onChange={handleChange} onBlur={handleBlur} value={values.email} /> {errors.email && touched.email && errors.email} <input type="password" name="password" onChange={handleChange} onBlur={handleBlur} value={values.password} /> {errors.password && touched.password && errors.password} <button type="submit" disabled={isSubmitting}>Submit</button> </form>
onBlur={handleBlur('username')} /> {touched.password && errors.password && ( <Text style={styles.errorMessage}>{errors.password}</Text> )} <TextInput style={[ styles.textInput, touched.password && errors.password && { borderColor: colors.red }, { color: colors.text } ]} placeholder="Password" placeholderTextColor={colors.text} value={values.password} onChangeText={handleChange('password')} onBlur={handleBlur('password')}
{Object.keys(errors).length > 0 && ( <Alert message={errors.email || errors.password || errors.auth} type="error" showIcon