new logout button

triggers /api/logout and updates app loggedIn state

backend/src/main/scala/industries/sunshine/planningpoker/MyHttpService.scala

@@ -28,7 +28,7 @@ object MyHttpService {
               Stream
                 .emits(TestModels.testChangesList)
                 .covary[IO]
-                .metered(1.second)
+                .metered(1.second) ++ Stream.never[IO]
             )
               .map(state => WebSocketFrame.Text(state.asJson.noSpaces))
 
@@ -48,6 +48,9 @@ object MyHttpService {
         case GET -> Root / "new-poll" as (playerId, roomId) => {
           IO(println(s">> got request to start new voting from $playerId in $roomId")) >> Ok()
         }
+        case GET -> Root / "logout" as (playerId, roomId) => {
+          IO(println(s">> got request to logout from $playerId in $roomId")) >> Ok()
+        }
       }
 
     val authMiddleware = AuthMiddleware(auth.authUser)

frontend/src/main/scala/industries/sunshine/planningpoker/FrontendMain.scala

@@ -27,10 +27,7 @@ object Main {
   def appElement(): Element = {
     div(
       className := "w-screen h-screen flex flex-col justify-center items-center",
-      div(
+      Header.render(loggedIn.writer),
-        className := "h-24 w-full flex flex-for justify-center items-center bg-green-200",
-        p(className := "text-2xl", "Here be header")
-      ),
       child <-- loggedIn.signal.map(if (_) emptyNode else JoinRoomComponent.render(loggedIn.writer)),
       child <-- loggedIn.signal.map(
         if (_) RoomView.renderRoom(loggedIn.writer) else emptyNode

frontend/src/main/scala/industries/sunshine/planningpoker/Header.scala

@@ -0,0 +1,29 @@
+package industries.sunshine.planningpoker
+
+import scala.scalajs.js
+import scala.scalajs.js.annotation.*
+import com.raquo.laminar.api.L.{*, given}
+import io.laminext.fetch.Fetch
+import io.laminext.fetch.FetchResponse
+import scala.scalajs.js.Dynamic.{global => g}
+
+import concurrent.ExecutionContext.Implicits.global
+
+object Header {
+  def render(loggedIn: Observer[Boolean]): Element = {
+    val (responsesStream, responseReceived) = EventStream.withCallback[FetchResponse[String]]
+
+    val logoutButton = button(
+      "Logout",
+      onClick.flatMap(_ => Fetch.get("/api/logout").text) --> responseReceived,
+      responsesStream --> Observer(resp => g.console.info(s"${resp.toString()}")),
+      responsesStream.collect { case resp if resp.ok => false } --> loggedIn
+    )
+
+    div(
+      className := "h-24 w-full flex flex-for justify-center items-center bg-green-200",
+      p(className := "text-2xl", "Here be header"),
+      logoutButton
+    )
+  }
+}