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()
}