Removed calls to old React.createClass method

scommons · Aug 29, 2019 · 164b6a5 · 164b6a5
1 parent b39e9da
commit 164b6a5
Show file tree

Hide file tree

Showing 11 changed files with 1,977 additions and 3,195 deletions.
diff --git a/docs/showcase/assets/scommons-client-showcase-opt-library.js b/docs/showcase/assets/scommons-client-showcase-opt-library.js
diff --git a/docs/showcase/assets/scommons-client-showcase-opt.js b/docs/showcase/assets/scommons-client-showcase-opt.js
diff --git a/showcase/src/main/scala/scommons/client/showcase/demo/ApiDemo.scala b/showcase/src/main/scala/scommons/client/showcase/demo/ApiDemo.scala
@@ -1,10 +1,6 @@
 package scommons.client.showcase.demo
 
-import io.github.shogowada.scalajs.reactjs.React
-import io.github.shogowada.scalajs.reactjs.React.{Props, Self}
-import io.github.shogowada.scalajs.reactjs.VirtualDOM._
-import io.github.shogowada.scalajs.reactjs.classes.ReactClass
-import io.github.shogowada.scalajs.reactjs.redux.ReactRedux
+import io.github.shogowada.scalajs.reactjs.React.Props
 import io.github.shogowada.scalajs.reactjs.redux.Redux.Dispatch
 import play.api.libs.json.Json
 import scommons.client.showcase.ShowcaseState
@@ -13,89 +9,87 @@ import scommons.client.ui._
 import scommons.client.ui.icon.IconCss
 import scommons.client.ui.popup._
 import scommons.client.util.ActionsData
+import scommons.react._
+import scommons.react.hooks._
+import scommons.react.redux.BaseStateController
 
 import scala.concurrent.ExecutionContext.Implicits.global
 import scala.util.Success
 
-object ApiDemoController {
+object ApiDemoController extends BaseStateController[ShowcaseState, ApiDemoProps] {
 
-  def apply(): ReactClass = reactClass
+  lazy val uiComponent: UiComponent[ApiDemoProps] = ApiDemo
 
-  private lazy val reactClass = ReactRedux.connectAdvanced(
-    (dispatch: Dispatch) => {
-      (_: ShowcaseState, _: Props[Unit]) => {
-        ApiDemoProps(dispatch)
-      }
-    }
-  )(ApiDemo())
+  def mapStateToProps(dispatch: Dispatch, state: ShowcaseState, props: Props[Unit]): ApiDemoProps = {
+    ApiDemoProps(dispatch)
+  }
 }
 
 case class ApiDemoProps(dispatch: Dispatch)
 
-object ApiDemo {
+object ApiDemo extends FunctionComponent[ApiDemoProps] {
 
   private case class ApiDemoState(showOk: Boolean = false,
                                   okMessage: String = "")
 
-  def apply(): ReactClass = reactClass
-
-  private lazy val reactClass = React.createClass[ApiDemoProps, ApiDemoState](
-    getInitialState = { _ => ApiDemoState() },
-    render = { self =>
-      <.div()(
-        <.h2()("API Calls"),
-        <.hr()(),
-        <.p()(
-          <(ButtonsPanel())(^.wrapped := ButtonsPanelProps(
-            List(
-              SimpleButtonData("successful", "Successful", primary = true),
-              SimpleButtonData("timedout", "Timedout", primary = true),
-              SimpleButtonData("failed", "Failed", primary = true)
-            ),
-            ActionsData(Set("successful", "timedout", "failed"), _ => {
-              case "successful" => callSuccessful(self)
-              case "timedout" => callTimedout(self)
-              case "failed" => callFailed(self)
-            }),
-            self.props.wrapped.dispatch
-          ))()
-        ),
-
-        if (self.state.showOk) Some(
-          <(OkPopup())(^.wrapped := OkPopupProps(
-            message = self.state.okMessage,
-            image = Some(IconCss.dialogInformation),
-            onClose = { () =>
-              self.setState(_.copy(showOk = false))
-            }
-          ))()
-        ) else None
-      )
-    }
-  )
+  protected def render(compProps: Props): ReactElement = {
+    val (state, setState) = useStateUpdater(() => ApiDemoState())
+
+    val props = compProps.wrapped
+
+    def callSuccessful(): Unit = {
+      val action = ApiActions.successfulAction(props.dispatch)
+      action.task.future.andThen {
+        case Success(resp) =>
+          val json = Json.prettyPrint(Json.toJson(resp))
+          val msg = s"Received successful response:\n\n$json"
 
-  private def callSuccessful(self: Self[ApiDemoProps, ApiDemoState]): Unit = {
-    val action = ApiActions.successfulAction(self.props.wrapped.dispatch)
-    action.task.future.andThen {
-      case Success(resp) =>
-        val json = Json.prettyPrint(Json.toJson(resp))
-        val msg = s"Received successful response:\n\n$json"
+          setState(_.copy(okMessage = msg, showOk = true))
+      }
 
-        self.setState(_.copy(okMessage = msg, showOk = true))
+      props.dispatch(action)
     }
 
-    self.props.wrapped.dispatch(action)
+    <.div()(
+      <.h2()("API Calls"),
+      <.hr()(),
+      <.p()(
+        <(ButtonsPanel())(^.wrapped := ButtonsPanelProps(
+          List(
+            SimpleButtonData("successful", "Successful", primary = true),
+            SimpleButtonData("timedout", "Timedout", primary = true),
+            SimpleButtonData("failed", "Failed", primary = true)
+          ),
+          ActionsData(Set("successful", "timedout", "failed"), _ => {
+            case "successful" => callSuccessful()
+            case "timedout" => callTimedout(props)
+            case "failed" => callFailed(props)
+          }),
+          props.dispatch
+        ))()
+      ),
+
+      if (state.showOk) Some(
+        <(OkPopup())(^.wrapped := OkPopupProps(
+          message = state.okMessage,
+          image = Some(IconCss.dialogInformation),
+          onClose = { () =>
+            setState(_.copy(showOk = false))
+          }
+        ))()
+      ) else None
+    )
   }
 
-  private def callTimedout(self: Self[ApiDemoProps, ApiDemoState]): Unit = {
+  private def callTimedout(props: ApiDemoProps): Unit = {
     val action = ApiActions.timedoutAction()
 
-    self.props.wrapped.dispatch(action)
+    props.dispatch(action)
   }
 
-  private def callFailed(self: Self[ApiDemoProps, ApiDemoState]): Unit = {
+  private def callFailed(props: ApiDemoProps): Unit = {
     val action = ApiActions.failedAction()
 
-    self.props.wrapped.dispatch(action)
+    props.dispatch(action)
   }
 }
diff --git a/showcase/src/main/scala/scommons/client/showcase/demo/ButtonsDemo.scala b/showcase/src/main/scala/scommons/client/showcase/demo/ButtonsDemo.scala
@@ -1,17 +1,13 @@
 package scommons.client.showcase.demo
 
-import io.github.shogowada.scalajs.reactjs.React
-import io.github.shogowada.scalajs.reactjs.VirtualDOM._
-import io.github.shogowada.scalajs.reactjs.classes.ReactClass
 import scommons.client.ui.ButtonImagesCss._
 import scommons.client.ui._
 import scommons.client.util.ActionsData
+import scommons.react._
 
-object ButtonsDemo {
+object ButtonsDemo extends FunctionComponent[Unit] {
 
-  def apply(): ReactClass = reactClass
-
-  private lazy val reactClass = React.createClass[Unit, Unit] { _ =>
+  protected def render(props: Props): ReactElement = {
     val imageButtons = List(
       Buttons.ADD,
       Buttons.REMOVE,
@@ -32,8 +28,7 @@ object ButtonsDemo {
       <.p()(
         <(ButtonsPanel())(^.wrapped := ButtonsPanelProps(
           imageButtons,
-          ActionsData.empty.copy(enabledCommands = Set(Buttons.ADD.command, "primary")),
-          group = false
+          ActionsData.empty.copy(enabledCommands = Set(Buttons.ADD.command, "primary"))
         ))()
       ),
       <.h3()("Group"),

diff --git a/showcase/src/main/scala/scommons/client/showcase/demo/HTMLDemo.scala b/showcase/src/main/scala/scommons/client/showcase/demo/HTMLDemo.scala
@@ -1,15 +1,11 @@
 package scommons.client.showcase.demo
 
-import io.github.shogowada.scalajs.reactjs.React
-import io.github.shogowada.scalajs.reactjs.VirtualDOM._
-import io.github.shogowada.scalajs.reactjs.classes.ReactClass
 import scommons.client.ui.{HTML, HTMLProps}
+import scommons.react._
 
-object HTMLDemo {
+object HTMLDemo extends FunctionComponent[Unit] {
 
-  def apply(): ReactClass = reactClass
-
-  private lazy val reactClass = React.createClass[Unit, Unit] { _ =>
+  protected def render(props: Props): ReactElement = {
     <.div(^.style := Map(
       "position" -> "relative",
       "overflow" -> "auto"

diff --git a/showcase/src/main/scala/scommons/client/showcase/demo/ListDemo.scala b/showcase/src/main/scala/scommons/client/showcase/demo/ListDemo.scala
@@ -1,17 +1,12 @@
 package scommons.client.showcase.demo
 
-import io.github.shogowada.scalajs.reactjs.React
-import io.github.shogowada.scalajs.reactjs.VirtualDOM._
-import io.github.shogowada.scalajs.reactjs.classes.ReactClass
 import scommons.client.ui.ButtonImagesCss
 import scommons.client.ui.list._
+import scommons.react._
 
-object ListDemo {
-
-  def apply(): ReactClass = reactClass
-  private lazy val reactClass = createComp
-
-  private def createComp = React.createClass[Unit, Unit] { _ =>
+object ListDemo extends FunctionComponent[Unit] {
+
+  protected def render(props: Props): ReactElement = {
     <.div()(
       <.h2()("ListBox"),
       <.p()("Demonstrates list box functionality."),

diff --git a/showcase/src/main/scala/scommons/client/showcase/demo/PaginationPanelDemo.scala b/showcase/src/main/scala/scommons/client/showcase/demo/PaginationPanelDemo.scala
@@ -1,15 +1,11 @@
 package scommons.client.showcase.demo
 
-import io.github.shogowada.scalajs.reactjs.React
-import io.github.shogowada.scalajs.reactjs.VirtualDOM._
-import io.github.shogowada.scalajs.reactjs.classes.ReactClass
 import scommons.client.ui.page._
+import scommons.react._
 
-object PaginationPanelDemo {
+object PaginationPanelDemo extends FunctionComponent[Unit] {
 
-  def apply(): ReactClass = reactClass
-
-  private lazy val reactClass = React.createClass[Unit, Unit] { _ =>
+  protected def render(props: Props): ReactElement = {
     <.div()(
       <.h2()("PaginationPanel"),
       <.p()("Demonstrates pagination functionality."),