Clojurians Log v2

maybe because expects a component/element as a child not a string, have you tried ($ App {} "some string") ?

what does the first one render?

I´m trying to figure out how it works about refresh. Is it controlled by defnc as component?

is it possible to use react-hook-form with helix ?

you can use any hooks with helix yes

I took a look at its code. Its a ton of code. In cljs side we have schema, malli. I'm interested on the dirty field code, without it every field would appear invalid before having received the focus.

I've tried naivelly using useForm hook without success. Have you used it before ?

I have not but i'm reading their docs. should be straight forward if you're familiar with CLJS interop

what was unsuccessful about your attempt?

I create a useForm object succesfully , I'm failling to use the register method that appears to register the input with useForm

okay

https://gist.github.com/geraldodev/e4a44c4f41c30245107e583639581646

I'm not seeing errors or data on handleSubmit

^:js {:keys [register
                       handleSubmit
                       watch
                       errors] :as obj} (rhf/useForm)

useForm will return a JS object, which can't be destructured

oh, sorry, thats working. I'm using [applied-science.js-interop :as j] to interop

ah I didn't see the j/let

I've printed the object on console and its there.

No problem, I've discovered this today 🙂 nice one

It appears by the docs that register is a invocation , so I've called it, on the 1st createElement input that does not depend on helix, and on the second via helix macro

it looks pretty much correct to me

do you see a difference between using .createElement vs. helix.dom/input?

no the createElement was me doubting you 🙂 but your code does not pick attributes , it handles all of them equally .

are the inputs not registered at all?

if I dont see data or errors I suppose no

by the way, how do you handle this kind of form behaviour with helix ?

helix isn't special, so using something like react-hook-form seems like the best approach

I haven't done a lot of complex forms with helix yet

I guess I would check to ensure that the register function is real, I'm not sure how to dig into this since I don't have a project setup

As far I understand the snippet I've sent you is not helix dependant

if you want to push a minimal repro I could try and look at it later

from the example alone in their readme I wouldn't even consider react-hook-form

seems fine to me

If I could mix malli with react-hook-form or have the machinery of dirty fields to trigger validation it would be usefull. trying to use react-hook-form first.

I'm not super familiar with malli, but my guess is if you want to integrate the two, you'll want to transform your malli schema into something react-hook-form understands

I've done lots of form validation and these simple conditionals are straight road to spaghetti-town 🙂

just a hunch, haven't played with either one

https://github.com/react-hook-form/react-hook-form/blob/master/examples/validationSchema.tsx see how they just dump the errors instead of actually showing the appropriate error for the appropriate field?

it's very hard

to do proper validation, I am not bashing on them, just know what you subscribe for, check all the examples, make sure you know if you have edge cases. For example, collection of fields having to be validated at once, or conditional requirements, or nested collections with requireds...

@lilactown you can pass a function to validate on the register call. that would open the possilibity to invoke cljs

<input
  name="test"
  ref={
    register({
      validate: value => value === '1'
    })
  }
/>

Now imagine a form where you specify names of people and their salaries and the form is valid of their average salary is above a certain limit.

sure I bet you can dispatch based on what errors are occurring and their relative priority

@geraldodev if you push an example project I can try and look at it later today or tmorrow. I have to leave for a bit :sheepy:

@lilactown thank you for the help