package com.example.playscalajsreact import org.scalajs.dom import japgolly.scalajs.react._ import japgolly.scalajs.react.vdom.html_<^._ import japgolly.scalajs.react.extra._ import com.example.playscalajsreact.component.HelloWorldSJSRComponent import japgolly.scalajs.react.extra.router._ import japgolly.scalajs.react.extra.router.StaticDsl.Route import com.example.playscalajsreact.route.AppRouter import com.example.playscalajsreact.component.Content import com.example.playscalajsreact.component.Top2 import com.typesafe.config.ConfigFactory import scala.scalajs.js.JSON import scala.concurrent.ExecutionContext.Implicits._ import scala.util.Success import play.api.libs.json.Json import com.example.playscalajsreact.model.User import typings.std.stdStrings.auth case class Response(status: Int, response: String) case class UserForm(name: String) object UserForm { implicit val userFormFormat = Json.format[UserForm] } object ScalaJSExample { def main(args: Array[String]): Unit = { val conf = ConfigFactory.load() val backendBaseUrl = conf.getString("app.backendUrl") val userRoute = s"$backendBaseUrl/user" val authorRoute = (id: Int) => s"$backendBaseUrl/authors/$id" println(backendBaseUrl) val x = Ajax .get(s"https://jsonplaceholder.typicode.com/todos/1") .send .validateStatusIs(200)(Callback.throwException) .asAsyncCallback .map(xhr => xhr.responseText) .logResult val y = Ajax .get(userRoute) .send .validateStatusIs(200)(Callback.throwException) .asAsyncCallback .map(xhr => Json .fromJson[UserForm](Json.parse(xhr.responseText)) .getOrElse(UserForm("empty1")) ) .logResult // CallbackTo. val getAuthors = Ajax .get(authorRoute(1)) .send .asAsyncCallback .map(xhr => xhr.responseText) .logResult (x >> y >> getAuthors).unsafeToFuture() // x.>>= val domCallback = for { user <- y authors <- getAuthors } yield { <.div(user.name + authors) } val div = dom.document.createElement("div") dom.document.body.appendChild(div) Top2().renderIntoDOM(div) val div2 = dom.document.createElement("div") dom.document.body.appendChild(div2) def myDom(user: UserForm): VdomElement = <.div(user.name) val z = y.map(myDom) val Main = React.Suspense( fallback = <.div( ^.color := "#33c", ^.fontSize := "150%", "AJAXer in progress. Loading..." ), asyncBody = domCallback ) <.div(Main) Main.renderIntoDOM(div2) } }