# Form

export const useLoginAction = action$(() => {
  if (password !== validPassword) {
   return {
     username: username,
     password: ''
   }    
  }
  else 
    throw redirect(...);
});

export const useFormData = loader$(({getData}) => {
  return getData(useLoginAction) || {
    username: '',
    password: ''
  }
});

export default component$(() => {
  const loginAction = useLoginAction();
  const formData = useFormData();
  
  const Form = useForm(formData, {
    action: loginAction,
    uses: [featA, featB,....]
    fieldFactor: () => <input/>
  });
  return(
    <div>
      <Form>
        <Form.username />
        <Form.password />
      </Form>
    </div>
  );
});