V for Lens with Async DB retrieval

WebSharperLens2DB.fs

// online snippet: https://try.websharper.com/snippet/user3383/0000Oy 
// gitter ref: https://gitter.im/intellifactory/websharper?at=5d650521f2821072aa20f412
// intellifactory blog: https://www.intellifactory.com/blog/5508/clear-and-simple-reactive-code-with-websharper-ui-s-v
namespace Samples

open WebSharper
open WebSharper.JavaScript
open WebSharper.UI
open WebSharper.UI.Html
open WebSharper.UI.Client

[<JavaScript>]
module HelloWorld =

    type FullName =
        {
            First: string
            Last: string
        }
    
    type ServerLoginResponse = LoginFound of string | LoginError of string
    let findLogin (name: string) (surname: string) : Async<ServerLoginResponse> =
        async {
            try
                do! Async.Sleep 1000
                return LoginFound <| "usr001 found from " + name + " " + surname
            with | exc ->
                return LoginError exc.Message
        }     
    
    
            
    let promptName (name: Var<FullName>) =
        let response = 
            name.View.MapAsync( fun n -> async {
                let! useridMaybe = findLogin n.First n.Last
                match useridMaybe with 
                |  LoginFound userid -> 
                    return sprintf "Hello, %s!" userid
                | LoginError error ->
                    return sprintf "Sorry, %s!" error
                        } 
                    )
        form [] [
            Doc.Input [] (Lens name.V.First)
            Doc.Input [] (Lens name.V.Last)

            response
            |> View.WithInitOption
            |> Doc.BindView (function
                | None -> text "Please wait, db retrieval is running..."
                | Some response -> text response)
        ]

    
    let Main =
        Var.Create { First = "John"; Last = "Doe" }
        |> promptName
        |> Doc.RunById "main"