You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
63 lines
1.8 KiB
63 lines
1.8 KiB
package com.example.playscalajsreact.component
|
|
|
|
import com.example.playscalajsreact.model.MyGlobalState
|
|
import japgolly.scalajs.react.vdom.VdomElement
|
|
import japgolly.scalajs.react.Callback
|
|
import japgolly.scalajs.react._
|
|
import japgolly.scalajs.react.vdom.html_<^._
|
|
import com.example.playscalajsreact.route.AppRouter
|
|
import org.scalajs.dom
|
|
import scala.scalajs.js
|
|
import com.example.playscalajsreact.model.User
|
|
import japgolly.scalajs.react.extra.StateSnapshot
|
|
import com.softwaremill.quicklens._
|
|
import monocle.macros.Lenses
|
|
|
|
object Content {
|
|
|
|
import scala.concurrent.ExecutionContext.Implicits.global
|
|
|
|
final case class State(myGlobalState: MyGlobalState = MyGlobalState())
|
|
|
|
final class Backend($ : BackendScope[_, State]) {
|
|
val modifyState = modify[State](_.myGlobalState)
|
|
val modifyUsername = modifyState andThenModify MyGlobalState.modifyUsername
|
|
var interval: js.UndefOr[js.timers.SetIntervalHandle] =
|
|
js.undefined
|
|
|
|
def render(s: State): VdomElement =
|
|
// MyGlobalState.ctx.provide(s.myGlobalState) {
|
|
// <.div(AppRouter.router(AppRouter.Props(s.myGlobalState)))
|
|
// }
|
|
<.div
|
|
|
|
val updateState = (s: State) => {
|
|
val direct = $.withEffectsImpure
|
|
direct.modState(modifyUsername.using(_ + "C"))
|
|
}
|
|
|
|
val refresh = (s: State) =>
|
|
Callback {
|
|
interval = js.timers.setInterval(1000) {
|
|
updateState(s)
|
|
}
|
|
}
|
|
|
|
val clear = Callback {
|
|
interval foreach js.timers.clearInterval
|
|
interval = js.undefined
|
|
}
|
|
|
|
}
|
|
|
|
private val component = ScalaComponent
|
|
.builder[Unit]("content")
|
|
.initialState(State())
|
|
.renderBackend[Backend]
|
|
.componentDidMount($ => $.backend.refresh($.state))
|
|
.componentWillUnmount(_.backend.clear)
|
|
.build
|
|
|
|
def apply() = component()
|
|
}
|
|
|