Use UseElmish for Login page

RicoSaupe · Mar 1, 2024 · 046cc03 · 046cc03
1 parent 53c2274
commit 046cc03
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 21 deletions.
diff --git a/src/Client/Index.fs b/src/Client/Index.fs
@@ -11,7 +11,7 @@ open Shared
 
 type PageTab =
     | Home
-    | Login of Login.Model
+    | Login
     | Wishlist of WishList.Model
     | NotFound
 
@@ -22,7 +22,6 @@ type User =
 type Model = { Page: PageTab; User: User }
 
 type Msg =
-    | LoginPageMsg of Login.Msg
     | WishlistMsg of WishList.Msg
     | UrlChanged of string list
     | OnSessionChange
@@ -47,15 +46,8 @@ let initFromUrl model url =
         let model = { Page = Home; User = model.User }
         model, Cmd.none
     | [ "login" ] ->
-        let loginModel, loginMsg = Login.init ()
-
-        let model = {
-            Page = Login loginModel
-            User = model.User
-        }
-
-        let cmd = loginMsg |> Cmd.map LoginPageMsg
-        model, cmd
+        let model = { Page = Login; User = model.User }
+        model, Cmd.none
     | [ "wishlist" ] ->
         match model.User with
         | User user ->
@@ -79,14 +71,6 @@ let init () =
 
 let update msg model =
     match model.Page, msg with
-    | Login loginModel, LoginPageMsg loginMsg ->
-        let user =
-            match loginMsg with
-            | Login.LoggedIn user -> User user
-            | _ -> model.User
-
-        let newModel, cmd = Login.update guestApi loginMsg loginModel
-        { Page = Login newModel; User = user }, cmd |> Cmd.map LoginPageMsg
     | Wishlist wishlistModel, WishlistMsg wishlistMsg ->
         let token =
             match model.User with
@@ -161,7 +145,7 @@ let view model dispatch =
                         prop.children [
                             match model.Page with
                             | Home -> Home.View guestApi
-                            | Login loginModel -> Login.view loginModel (LoginPageMsg >> dispatch)
+                            | Login -> Login.View guestApi
                             | Wishlist wishlistModel -> WishList.view wishlistModel (WishlistMsg >> dispatch)
                             | NotFound -> Html.div [ prop.text "Not Found" ]
                         ]

diff --git a/src/Client/pages/Login.fs b/src/Client/pages/Login.fs
@@ -4,6 +4,7 @@ open System
 open Elmish
 open Feliz.DaisyUI
 open Feliz.Router
+open Feliz.UseElmish
 open FsToolkit.ErrorHandling
 open Shared
 open SAFE
@@ -68,7 +69,10 @@ let update (guestApi: IGuestApi) msg model =
 
 open Feliz
 
-let view model dispatch =
+[<ReactComponent>]
+let View guestApi =
+    let model, dispatch = React.useElmish (init, (update guestApi), [||])
+
     Html.div [
         prop.className "grid justify-center"
         prop.children [