Asynchronous validation

[ngw]

Hello, sorry for opening an issue but there's no other support/community link.
Apparently I can't perform async validations, for example through a Task. Example at hand, I'm in need to validate an email with a graphql query on the backend to ensure it's not present in the DB.

Some example code to check on the email can be:

checkEmailAddress : Maybe Email -> String -> Task String String
checkEmailAddress emailMaybe emailAddress =
  case emailMaybe of
    Just { email } ->
      Task.fail "Email is taken"
    Nothing ->
      Task.succeed emailAddress

isTaken : String -> Task String String
isTaken email =
  query email
    |> Graphql.Http.queryRequest "/graphql"
    |> Graphql.Http.toTask
    |> Task.mapError(\_ -> "GraphQL error")
    |> Task.andThen(\result -> (checkEmailAddress result.user email))

It actually doesn't return a Validator (obviously) and must run as a Cmd.
I'm really struggling to find a solution here, I want to shoow the Command once the field is Valid, this is some quite ugly and badly deisgned code to do that inside InputEmail

InputEmail e ->
  ( { model
      | email =
          model.email
          |> validate (OnChange e) emailValidation
    }
  , case validity (model.email |> validate (OnChange e) emailValidation) of
      Valid f -> Task.attempt ValidateEmailUniqueness (isTaken f)
      _ -> Cmd.none
  )

which has the problem that then I don't really have a way to build my own Field as Validator doesn't export Field(..) for example:

ValidateEmailUniqueness emailCheck ->
    ( { model
        | email = case emailCheck of
            Ok email -> Field email Valid
            Err err -> errorhandling
    }
  , Cmd.none)

(last snippet is made up)
Did you guys attempt to do anything like this and came up with something better than what I'm doing? Any suggestion?

[ondrej-tucek]

Hi @ngw

it's ok. I think, this is right place to ask :-)

So for simplicity lets write an email in to the Model this way

type alias Model =
    { email : Field String String
    -- we have to make a request to db if email is exist or not 
    -- and during requesting we will be await on an answer...
    , statusEmail : SubmissionStatus
    , ...
    }

But consider if these variables wouldn't be better in record, e.g.

type alias Email =
    { email : Field String String
    , status : SubmissionStatus
    , ...
    }

I suppose that you are using the package: dillonkearns/elm-graphql.
I'm thinking that for our purposes will be better function Graphql.Http.send than Graphql.Http.toTask.

Next add CheckIfEmailExist msg to the Msg:
| CheckIfEmailExist (Result Graphql.Http.Error Bool)

where type boolean is saying if the email is already in database or not. Then the update function must be updated by

CheckIfEmailExist (Ok isExist) ->
    let
        newEmail =
            if isExist then
                invalidate "Email is used!" model.email

            else
                model.email
    in
    ( { model
        | statusEmail = Succeeded
        , email = newEmail
      }
    , Cmd.none
    )

CheckIfEmailExist (Err _) ->
    ( { model
        | statusEmail = Failed
      }
    , Cmd.none
    )

And somewhere in your view will be called function

viewStatusEmail : SubmissionStatus -> Html msg
viewStatusEmail statusEmail =
    case statusEmail of
        NotSubmitted ->
            div [] []

        InProcess ->
            -- or you can here use any loading bar animations...
            div [ class ... ] [ text "Verifying existence of email in our database..." ]

        Succeeded ->
            div [] []

        Failed ->
            div [ class ... ] [ text "Connection to database failed! We cannot verify existence of email." ]

Now lets focus on requesting command.

checkIfEmailExistRequest : Field String String -> Cmd Msg
checkIfEmailExistRequest email =
    let
        email_ =
            validate OnSubmit emailValidation email

        request =
            query (rawValue email_)
                |> Graphql.Http.queryRequest "/graphql"
                |> Graphql.Http.send CheckIfEmailExist

        submissionResult =
            Valid request
                |> applyValidity (validity email_)

    in
    case submissionResult of
        Valid cmd ->
            ( { model | statusEmail = InProcess }
            , cmd
            )

        _ ->
            ( model, Cmd.none )

And finally put this function to InputEmail update:

InputEmail e ->
    ( { model
        | email =
            model.email
                |> validate (OnChange e) emailValidation
        }
    , checkIfEmailExistRequest model.email
    )

We've just now updated elm-validate package. There are a couple of changes and also the Validation is now exporting Field(..). I hope it was helpful for you.

[ngw]

Basically this validation can't be written as a Validator but must be implemented "outside" the library, which is quite a shame, the Field type would be perfectly enough but I must now validate "on 2 levels" if you know what I mean.
This problem keeps coming back for all these libraries, I guess it would be very nice to have a solution that at least tries to unify all validations into one package. This would probably add quite a lot of complexity (in this case you'd probably need a separate Validations.update function) but at least would answer to 99% of needs.
Any chance to see anything like this?

[ondrej-tucek]

I understand that. Yes it would be, but I'm afraid this a functionality won't be in the near future.